/* Prototype B: "Specimen Room".
   Dark botanical gallery. Deep forest and near-black grounds; the bloom glows
   as the jewel. Same green and bloom accents, the soft shadow replaced by a
   low bloom glow. Palette layer plus the dark-ground overrides base.css
   cannot express; structure lives in base.css. */
:root{
  /* native widgets (selects, checkboxes, scrollbars) render for dark */
  color-scheme:dark;

  --bg:#0C1A14;
  --surface:#12241C;
  --surface-2:#172C22;
  --tile:#0E1F17;

  --ink:#EFEBDD;
  --ink-soft:#B7C2B7;
  --ink-mute:#93A296;        /* lifted: >= 5.5:1 on every dark surface */

  --forest:#3E7A57;          /* fills only: white button text clears 5:1 */
  --forest-ink:#FFFFFF;
  --bloom:#F0742F;
  --leaf:#6FC492;            /* forest-as-text on dark: ~8.5:1 on --bg */

  --line:#2E4237;            /* hairlines that actually read on the ground */
  --line-2:#46604F;          /* control borders: ~2.6:1 against --bg */
  --hairline:var(--line-2);  /* cart-line frames: the base fallback #E4E0D8
                                is a light-page value that glares here */

  --shadow:0 18px 60px rgba(0,0,0,.5), 0 0 60px rgba(240,116,47,.06);
  --shadow-sm:0 2px 16px rgba(0,0,0,.4);

  /* status colours lifted for the dark grounds. The light hues (base.css)
     drop below WCAG AA on --surface #12241C / --bg #0C1A14; these clear
     4.5:1 on the subtle tinted status surfaces (computed: danger ~6.6:1,
     ok ~5.9:1, warn ~7.4:1). The -bg bases feed the 8-10% tints only. */
  --danger:#F0937A; --danger-bg:#E0552B;
  --ok:#5FB98A;
  --warn:#E8B457; --warn-bg:#D8922E;
}

/* a faint canopy glow gives the ground depth; screen only so the print
   stylesheet in base.css keeps its white page */
@media screen{
  body{ background:var(--bg) radial-gradient(120rem 60rem at 85% -20%, #142719 0%, var(--bg) 60%) fixed; }
}
::selection{ background:#2E5C41; color:var(--ink); }
::placeholder{ color:var(--ink-mute); opacity:1; }

/* on dark, the header glass and footer read differently */
.site-header{ background:color-mix(in srgb, var(--bg) 82%, transparent); }
.brand .brand-name{ color:var(--ink); }
.site-footer{ background:#0A150F; }
.footer-brand img{ filter:brightness(0) invert(1); opacity:.9; }

/* deep-forest text accents go luminous on the dark ground (the fill colour
   --forest stays for buttons, where white text carries the contrast) */
.nav .nav-cart{ color:var(--leaf); }
.hero-title em{ color:var(--leaf); }
.card-title a:hover{ color:var(--leaf); }
.prose a{ color:var(--leaf); border-bottom-color:color-mix(in srgb,var(--leaf) 40%,transparent); }
:focus-visible{ outline-color:var(--leaf); }

/* form fields must read as fields: a lifted well plus a visible border */
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],select,textarea{
  background:#16291F; border-color:var(--line-2);
}
input:focus,select:focus,textarea:focus{ border-color:var(--leaf); box-shadow:0 0 0 3px color-mix(in srgb,var(--leaf) 22%, transparent); }
.choice input{ accent-color:var(--leaf); }
.choice:has(input:checked){ border-color:var(--leaf); box-shadow:0 0 0 3px color-mix(in srgb,var(--leaf) 18%, transparent); }
.thumbs button.tile[aria-current="true"]{ border-color:var(--leaf); box-shadow:0 0 0 2px color-mix(in srgb,var(--leaf) 40%, transparent); }

/* image tiles: a firmer frame so bright photographs sit in the dark room.
   Covers the journal card tiles (photo and video heroes) and the cart line
   thumbnails; 2.1:1 against --bg, deliberately quiet, never a glow. */
.hero-media,.card .tile,.dossier-media .tile,.cart-line .tile{ border-color:#3A5245; }

/* journal figcaption: base.css hardcodes a light-ground grey */
.journal-media figcaption{ color:var(--ink-mute); }

/* the show notice band is inline-styled for the light theme; re-ground it
   (the band is the only [role=status] that is a direct child of body) */
body > [role="status"]{
  background:#1E4630 !important; color:#F4F1E4 !important;
  border-bottom:1px solid #2E5C41;
}

/* gallery arrows: base.css builds white glass, which erases the cream glyph
   here (1.2:1). Dark glass instead: at .72 the glyph keeps >= 6:1 even over
   a pure-white photograph; hover firms the circle rather than lightening it */
.gallery-nav{
  background:rgba(10,21,15,.72);
  border-color:rgba(239,235,221,.25);
  color:var(--ink);
}
.gallery-nav:hover{ background:rgba(10,21,15,.92); box-shadow:0 2px 16px rgba(0,0,0,.5); }
.gallery-nav:focus-visible{ outline-color:var(--leaf); }

/* cart summary: the subtotal rule is a meaningful separator, so it clears
   the 3:1 non-text mark on --bg (base's --line-2 sits at 2.6:1 here) */
.cart-summary{ border-top-color:#54705C; }

/* sold cards: desaturation alone barely registers against the dark room;
   a small step back in brightness restores the archival read */
.card--sold .tile img{ filter:saturate(.5) brightness(.85); }
