/* Light islands.

   A few Trellis surfaces are drawn on paper and stay that way in the dark
   theme: the help hub (.hh) and the illustrated help guides (.hg) are white
   sheets inside the dark chrome, because darkening a guide whose every
   screenshot is a light-mode picture would be a full repaint for no gain.
   The Trellis document sheets (transcript, plan print, evidence pack, audit
   report, state letters) are the same idea and set their own tokens back in
   css/print_theme.css, beside the printed credit line they share.

   The rule this file exists to hold: an island has to restate EVERY token
   its contents read, not only the two or three the page itself uses. A
   half-restated island is worse than none -- the ground goes white and the
   ink stays night-colored, which is exactly how the guides ended up with a
   sage eyebrow at 1.94:1 and Bootstrap's dark link blue at 2.25:1 on their
   own white cards. Bootstrap's `a` reads --bs-link-color-RGB, not
   --bs-link-color, so setting only the latter looks correct and changes
   nothing; that one is the trap worth naming.

   base.html links this after a page's own head assets, so a page stylesheet
   cannot re-darken its island at equal specificity. */
[data-bs-theme="dark"] .hh,
[data-bs-theme="dark"] .hg {
  /* Bootstrap's surfaces and ink. Same list base.html's @media print block
     reverts, for the same reason: this is paper. */
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-body-color: #212529;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-emphasis-color: #000;
  --bs-secondary-color: rgba(33, 37, 41, .75);
  --bs-secondary-bg: #e9ecef;
  --bs-tertiary-color: rgba(33, 37, 41, .5);
  --bs-tertiary-bg: #f8f9fa;
  --bs-border-color: #dee2e6;
  --bs-heading-color: inherit;
  /* The app's own accessible link blue, not Bootstrap's #0d6efd: on the
     guide's #f4f8f5 strips #0d6efd is 4.46:1 and #0a58ca is 6.0:1. */
  --bs-link-color: #0a58ca;
  --bs-link-color-rgb: 10, 88, 202;
  --bs-link-hover-color: #084298;
  --bs-code-color: #a61e62;
  /* Trellis tokens: the brand sage and the action blue both have a night
     value that only works on a dark ground. */
  --tr-brand: #2f5d3f;
  --tr-brand-strong: #2e6b4f;
  --tr-brand-ink: #2f5d3f;
  --tr-brand-surface: #eef4f0;
  --tr-brand-surface-soft: #f4f8f5;
  --tr-brand-border: #cfe0d5;
  --tr-rule: #cbd5cf;
  --tr-action: #0a58ca;
  --tr-action-rgb: 10, 88, 202;
  --tr-action-hover: #084298;
  --tr-action-active: #073b87;
  --tr-action-contrast: #fff;
  --tr-card-link: #0a58ca;
  color-scheme: light;
  background: #f6f8f6;
  color: #212529;
  border-radius: 12px;
  padding: 1.25rem;
}

/* Outline-secondary carries its palette in class-scoped variables rather
   than inherited ones, so the island's token block cannot reach it: the
   dark theme's #a7acb1 stayed on the guides' own "Back to Home" and
   "Send feedback" buttons at 2.14:1 on white. The light palette (the same
   one base.html gives every other page) is 7.7:1. */
[data-bs-theme="dark"] .hh .btn-outline-secondary,
[data-bs-theme="dark"] .hg .btn-outline-secondary {
  --bs-btn-color: #495057;
  --bs-btn-border-color: #495057;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #495057;
  --bs-btn-hover-border-color: #495057;
  --bs-btn-focus-shadow-rgb: 73, 80, 87;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #495057;
  --bs-btn-active-border-color: #495057;
  --bs-btn-disabled-color: #495057;
  --bs-btn-disabled-border-color: #495057;
}
