/* Dark theme (Oct 2026, from the mock-up): html[data-theme="dark"], set by the header switch (inc/theme-mode.php).
   The light theme stays the default. The palette variables double as text and background colours across the
   original pages, so the text colours are remapped here and every dark background is restored explicitly. */

html[data-theme="dark"]{
  color-scheme:dark;
  --paper:#0b1322; --paper-2:#0f192b; --line:#26334c; --surface:#131e33;
  --ink:#e3e7ef; --muted:#a6b0c3; --ink-soft:#b7c0d0;
  --navy:#bccbe8; --navy-ink:#eef1f7; --navy-deep:#0e2747;
  --gold:#c9a66b; --gold-soft:#d9bf8f;
  --bg-ink:#07152b; --bg-navy:#0b1f3a;
}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink)}

/* Header and logo */
html[data-theme="dark"] header.nav{background:rgba(11,19,34,.92);border-bottom-color:var(--line)}
html[data-theme="dark"] .brand img{filter:invert(1) brightness(1.05)}
html[data-theme="dark"] .menu.open{background:var(--paper)}
html[data-theme="dark"] .nav-dd-menu,html[data-theme="dark"] .lang-dd-menu{background:var(--surface)}
html[data-theme="dark"] .menu a.cta,html[data-theme="dark"] .menu a.cta:hover{background:var(--gold);color:#16100a}

/* Dark bands keep their dark backgrounds (they were drawn with the navy variables) */
html[data-theme="dark"] footer{background:#050d1b}
html[data-theme="dark"] .bigcta,html[data-theme="dark"] .art-cta{background:radial-gradient(120% 120% at 85% -10%,rgba(201,166,107,.16),transparent 55%),linear-gradient(160deg,var(--bg-ink),var(--navy-deep))}
html[data-theme="dark"] .art-media,html[data-theme="dark"] .art-fallback{background:linear-gradient(160deg,var(--bg-ink),var(--navy-deep))}
html[data-theme="dark"] [style*="background:var(--navy-ink)"],
html[data-theme="dark"] [style*="background:linear-gradient(150deg,var(--navy-ink)"],
html[data-theme="dark"] [style*="background:linear-gradient(160deg,var(--navy-ink)"]{background:linear-gradient(155deg,var(--bg-ink),var(--navy-deep))!important}
html[data-theme="dark"] [style*="background:var(--navy)"]{background:var(--bg-navy)!important}
html[data-theme="dark"] [style*="color:var(--navy)"][style*="background:#fff"],
html[data-theme="dark"] [style*="background:var(--gold)"]{color:#16100a}

/* Light surfaces become dark surfaces */
html[data-theme="dark"] :is(.contact-card,.bk-card,.art-card,.ins2,.guide-src li,.prac-card,.team-card,.forum-list li,.hub-toc a,.hub-guide,.hub-entry,
  .sec-meta div,.sit,.card-grid .cg,.faq details,.cal li,.gp-side,.gp-main){background:var(--surface)}
html[data-theme="dark"] [style*="background:#fff"],html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#ffffff"]{background:var(--surface)!important}
html[data-theme="dark"] :is([style*="background:#f7f4ee"],[style*="background:#f9f6ef"],[style*="background:#faf7f1"],[style*="background:#f8f5ee"],
  [style*="background:#fff8de"],[style*="background:#fff3e0"],[style*="background:#fdf3e7"],[style*="background:#fff7e8"]){background:var(--paper-2)!important}

/* Text colours written into the page markup */
html[data-theme="dark"] :is([style*="color:#364055"],[style*="color:#36405a"],[style*="color:#3a4256"],[style*="color:#666"],[style*="color: #666"],
  [style*="color:#5e6470"],[style*="color:#475569"]){color:var(--ink-soft)!important}
html[data-theme="dark"] :is([style*="color:#0a3a1f"]){color:#8fd19e!important}
html[data-theme="dark"] :is([style*="color:#6b1b1b"],[style*="color:#8b1c1c"],[style*="color:#7c2d12"],[style*="color:#8b3a3a"],[style*="color:#7a1a1a"]){color:#f2a7a0!important}
html[data-theme="dark"] :is([style*="color:#5d4a1a"],[style*="color:#5a4a22"]){color:#e7cf9a!important}

/* Forms, chips, buttons */
html[data-theme="dark"] :is(input,select,textarea){background:#0f192b;color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .chip{background:transparent;color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] :is(.chip.active,.opt.sel,.art-pages span[aria-current]){background:var(--gold);color:#16100a;border-color:var(--gold)}
html[data-theme="dark"] .head-cell:hover{background:var(--bg-navy);color:#fff}

/* Status labels and notes added in 2026 */
html[data-theme="dark"] .st-in-force{background:#16341d;color:#9fdcaa}
html[data-theme="dark"] .st-published{background:#17284a;color:#b9cdf3}
html[data-theme="dark"] :is(.st-consultation,.st-proposed){background:#3a2a0c;color:#f0cf8f}
html[data-theme="dark"] :is(.st-announcement,.st-market){background:#262d3a;color:#c9d0dc}
html[data-theme="dark"] .cform .cf-warn{background:#2a2312;color:#ecd9ae}
html[data-theme="dark"] .bnj-staged-bar{box-shadow:0 8px 24px rgba(0,0,0,.5)}

/* The switch itself */
.theme-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:34px;padding:0;background:transparent;
  border:1px solid var(--line);border-radius:2px;color:var(--ink);cursor:pointer;transition:border-color .2s,color .2s}
.theme-btn:hover{border-color:var(--navy);color:var(--navy)}
.theme-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-btn .i-sun{display:none}
html[data-theme="dark"] .theme-btn .i-sun{display:block}
html[data-theme="dark"] .theme-btn .i-moon{display:none}
@media(max-width:900px){.menu .theme-btn{margin-top:6px}}
html[data-theme="dark"] [style*="color:#8a5a12"]{color:#f0cf8f!important}
html[data-theme="dark"] .gp-sec a[aria-current]{background:var(--gold);color:#16100a}
