/* ==========================================================================
   dbim-palette.css  (load right after s3waas-gigw.css / s3waas-footer.css)
   - DBIM v3 2.2 functional palette tokens (taken from the audit report)
   - DBIM 5.4 sticky header menu (desktop)
   - GIGW 5.4.4 external-link marker
   High-contrast mode is untouched: its tokens use :root[data-theme="contrast"] / :root.hc,
   which are more specific than the plain :root below.
   ========================================================================== */
:root {
  /* DBIM v3 2.1: ONE colour group = Blue (key colour + 4 variants) */
  --dbim-key: #162F6A;  /* key (darkest): footer (5.6), menu, icons, primary buttons, links */
  --dbim-1: #214AAB;
  --dbim-2: #5279D7;
  --dbim-3: #A3BBF3;
  --dbim-4: #D2DFFF;    /* lightest tint: hover chips, top bar */

  /* DBIM v3 2.2 functional palette */
  --text: #150202;      /* Deep Earthy Brown */
  --muted: #606060;     /* Grey 03 */
  --line: #C6C6C6;      /* Grey 01 */
  --surface: #FFFFFF;   /* Inclusive White */
  --bg: #FFFFFF;        /* primary page background is Inclusive White (Linen #EBEAEA is for highlight boxes/outlines) */
  --linen: #EBEAEA;
  --success: #198754;
  --gold: #FFC107;      /* warning */
  --danger: #DC3545;    /* error */

  /* map the older theme tokens onto the Blue group (high-contrast mode overrides these with a more specific selector) */
  --navy: var(--dbim-key);
  --navy-d: var(--dbim-key);
  --blue: var(--dbim-1);
  --orange: var(--dbim-3);    /* menu underline */
  --topbar: var(--dbim-4);
  --chip: var(--dbim-4);
  --link: var(--dbim-key);    /* 2.2: hyperlink colour may be the group key colour; #162F6A on white is about 13:1 */
}

/* DBIM 5.6 / F.1 #4: footer background = key colour, text inclusive white (#FFFFFF) */
.s3-footer { background: var(--dbim-key); color: #FFFFFF; }
:root[data-theme="contrast"] .s3-footer, :root.hc .s3-footer { background: #000a24; }

/* DBIM 5.4: sticky menu. Desktop only, because on phones the menu wraps to several rows. */
@media (min-width: 992px) {
  html body .s3-nav { position: sticky; top: 0; z-index: 50; }
}
.s3-main, [id] { scroll-margin-top: 4rem; }   /* skip link / anchors are not hidden under the sticky menu */

/* GIGW 5.4.4: external links get a small "arrow out of box" marker (class added by js/ctd-external.js) */
a.ext-link::after {
  content: ""; display: inline-block; width: .8em; height: .8em; margin-inline-start: .3em; vertical-align: -.05em;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v6H4V6h6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.f-social a.ext-link::after { content: none; }   /* icon-only buttons: no extra marker */

/* exit-notice dialog */
.ext-dialog { max-width: 32rem; padding: 0; border: 0; border-radius: var(--radius, 10px); color: var(--text); background: var(--surface); }
.ext-dialog::backdrop { background: rgba(0, 0, 0, .55); }
.ext-dialog__body { padding: 1.25rem 1.5rem; }
.ext-dialog__body h2 { margin: 0 0 .5rem; }
.ext-dialog__url { overflow-wrap: anywhere; font-weight: 600; }
.ext-dialog__actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; padding: 0 1.5rem 1.25rem; }
.ext-dialog__actions button { min-height: 44px; padding: .5rem 1rem; font-weight: 600; border-radius: 6px; cursor: pointer; border: 2px solid #162F6A; }
.ext-dialog__go { color: #fff; background: #162F6A; }
.ext-dialog__no { color: #162F6A; background: #fff; }
:root[data-theme="contrast"] .ext-dialog__go, :root.hc .ext-dialog__go { color: #000; background: var(--gold); border-color: var(--gold); }
:root[data-theme="contrast"] .ext-dialog__no, :root.hc .ext-dialog__no { color: var(--gold); background: transparent; border-color: var(--gold); }