/**
 * QGDS section palettes + "last updated" date line.
 *
 * Thin, ADDITIVE helpers that let a node/page template "band" long stretches of
 * content using the Queensland Government Design System palettes. They do NOT
 * restyle QGDS component internals (accordions, buttons, cards, etc.): every
 * variant only paints the band container and re-points the handful of QGDS
 * design tokens that plain prose reads (--qld-body-color, --qld-headings-color,
 * --qld-link-color). Nested QGDS components inherit those tokens automatically
 * — exactly the mechanism QGDS' own .light / .alt / .dark-alt palette classes
 * and [data-bs-theme] use — so a component dropped inside a dark band adapts
 * without any component-specific override here.
 *
 * Token sources (qld.bootstrap.css):
 *   --qld-light-alt-background  #e3e7ea  (subtle grey)
 *   --qld-light-text-text       #353535
 *   --qld-dark-background       #005eb8  (Queensland / QRIDA blue)
 *   --qld-dark-alt-background   #001d74  (deep navy)
 *   --qld-dark-text-text        #ffffff
 *
 * Markup pattern (full-bleed band, content stays in the grid):
 *   <section class="qld-section qld-section--alt">
 *     <div class="container">…content…</div>
 *   </section>
 *
 * The band element is the full-width wrapper; the inner .container keeps the
 * content aligned to the page grid. Pair with [data-bs-theme] only if you also
 * need form controls / icons to flip — the palette classes below already set
 * the prose tokens.
 */

/* ---------------------------------------------------------------------------
 * 1. Band base — vertical rhythm only (matches QGDS mt-40 / mt-lg-64).
 *    No background/colour here so an un-suffixed .qld-section is a transparent
 *    spacing band on the default white page.
 * ------------------------------------------------------------------------- */
.qld-section {
  display: block;
  padding-block: 2.5rem;
}

@media (min-width: 992px) {
  .qld-section {
    padding-block: 4rem;
  }
}

/* ---------------------------------------------------------------------------
 * 2. Light-alt band — subtle grey on a near-default palette.
 *    Headings (#000053) and links (#005eb8) already read correctly on grey,
 *    so only the surface + body text token are re-pointed.
 * ------------------------------------------------------------------------- */
.qld-section--alt {
  --qld-body-bg: var(--qld-light-alt-background);
  --qld-body-color: var(--qld-light-text-text);
  background-color: var(--qld-body-bg);
  color: var(--qld-body-color);
}

/* ---------------------------------------------------------------------------
 * 3. Dark band — Queensland/QRIDA blue surface, white prose.
 *    Mirrors the QGDS [data-bs-theme=dark] / .dark-alt token bundle so plain
 *    prose, headings and links all flip to the dark-on-blue treatment.
 * ------------------------------------------------------------------------- */
.qld-section--dark {
  --qld-body-bg: var(--qld-dark-background);
  --qld-body-color: var(--qld-dark-text-text);
  --qld-headings-color: #ffffff;
  --qld-heading-color: #ffffff;
  --qld-abstract-color: #ffffff;
  --qld-quote-color: #ffffff;
  --qld-caption-color: #deebf9;
  --qld-link-color: #ffffff;
  --qld-link-color-rgb: 255, 255, 255;
  --qld-link-hover-color: #ffffff;
  --qld-link-hover-color-rgb: 255, 255, 255;
  --qld-link-underline: #b5cce2;
  --qld-link-underline-hover: #ffffff;
  --qld-border-color: var(--qld-dark-border);
  background-color: var(--qld-body-bg);
  color: var(--qld-body-color);
}

/* ---------------------------------------------------------------------------
 * 4. Dark-alt band — deep navy, same dark prose tokens as above.
 * ------------------------------------------------------------------------- */
.qld-section--dark-alt {
  --qld-body-bg: var(--qld-dark-alt-background);
  --qld-body-color: var(--qld-dark-text-text);
  --qld-headings-color: #ffffff;
  --qld-heading-color: #ffffff;
  --qld-abstract-color: #ffffff;
  --qld-quote-color: #ffffff;
  --qld-caption-color: #deebf9;
  --qld-link-color: #ffffff;
  --qld-link-color-rgb: 255, 255, 255;
  --qld-link-hover-color: #ffffff;
  --qld-link-hover-color-rgb: 255, 255, 255;
  --qld-link-underline: #b5cce2;
  --qld-link-underline-hover: #ffffff;
  --qld-border-color: var(--qld-dark-alt-border);
  background-color: var(--qld-body-bg);
  color: var(--qld-body-color);
}

/* ---------------------------------------------------------------------------
 * 5. "Last updated" line (.qld-content-dates).
 *
 *    QGDS already styles dl.qld-content-dates as a flex row (gap:4px) with a
 *    bold <dt> label; this is only a defensive nudge so the line wraps instead
 *    of overflowing in the narrow main column and the label/value share a
 *    baseline. Colour is inherited, so the line flips automatically inside the
 *    dark bands above. No font/size/colour overrides — QGDS owns those.
 *
 *    Expected markup (node template, node.changed):
 *      <dl class="qld-content-dates">
 *        <dt>Last updated:</dt>
 *        <dd>{{ node.changed|date('j F Y') }}</dd>
 *      </dl>
 * ------------------------------------------------------------------------- */
.qld-content-dates {
  flex-wrap: wrap;
  align-items: baseline;
}