/* Woods theme — colours from the V1 storefront theme */
:root {
  --primary: #d0ac76;
  /* White, not the near-black this shipped with (Mike, 2026-09-14). Covers the
     Add buttons for free: --add-button/-foreground both default to the
     --primary pair, so there is no second token to set.

     FLAGGED, NOT SILENT: white on this gold is 2.13:1, which fails AA for text
     (4.5:1) and the 3:1 non-text minimum as well — the near-black it replaces
     was 7.99:1. Nothing here can fix that at this gold, because the fix has to
     move the SURFACE: white clears AA only from #8b734f down, which is a muddy
     olive rather than the brand gold. The brand's own ink is already in the
     file below (#142e4d, 13.75:1 with white) and is what a white-text button on
     this palette wants — that is the savona treatment, where the ink is
     --primary and the gold lives on --add-button as a surface only. Raised with
     Mike; deliberately not applied here, because it recolours every button, CTA
     and badge on the storefront and is his call, not a side effect of this. */
  --primary-foreground: oklch(0.985 0 0);
  --ring: #d0ac76;
  /* V1 ink/secondary colour. */
  --brand-accent: #142e4d;

  /* White utility strip instead of the default --muted grey — the dunstersfarm
     shape, not the KitWave one. No seam rule (--top-bar-rule-height stays 0px),
     so the strip and the header band below it are one continuous field of white
     distinguished by their contents alone.

     Deliberately no rule here even though the tokens are available: the rule
     defaults to var(--primary), which on this tenant is the #d0ac76 gold at
     2.13:1 against white — a 4px line of it would read as a smudge rather than
     a brand device, and --brand-accent navy at 13.75:1 would read as a border.
     Neither is the KitWave effect, so the division stays implicit. */
  --top-bar: var(--background);

  /* Search pill — the dunstersfarm treatment (fully rounded, no resting
     outline) at the platform's own 2.5rem/40px height rather than Dunsters'
     3rem (Mike, 2026-09-14). The height is restated explicitly, not left to
     default: --search-field-inset-x below is DERIVED from it, so a future move
     of the platform default would silently mis-inset this pill.

     The fill stays var(--muted) — the platform grey at FULL strength, not the
     default's 50% over white, which is too faint to read as a field once the
     outline is gone. It is the same 0.97 the header chips (header-chips.ts)
     and the sidebar nav items (--sidebar-accent) already use, so the pill sits
     on the grey the rest of the chrome is built from. The token rather than
     its value, so it tracks light/dark and follows the neutral ramp.

     The border goes at REST only. InputGroup sets its focus border through a
     `has-[…:focus-visible]:border-ring` variant, which compiles to a `:has()`
     selector and outranks the plain class, so the field still announces focus. */
  --search-field: var(--muted);
  --search-field-height-desktop: 2.5rem;
  --search-field-radius: 9999px;
  /* DERIVED from the 2.5rem above: the pill is 40px tall, so its radius is 20px
     and the flat edge starts 20px in, while the leading addon's `pl-3` sits the
     magnifier at 12px — a geometric +8px. 4px by eye instead, the ratio
     dunstersfarm ships at 48px (12px geometric, 8px shipped): the magnifier is
     a round glyph, not a square, so aligning its bounding box to the
     intersection pushes it visually past it. This is THEMING.md's 2.5rem row. */
  --search-field-inset-x: 0.25rem;
  --search-field-border: transparent;

  /* Was on the 1.25rem/20px platform default, which rendered this lockup 41px
     wide. The mark is a gold frond device beside a two-line type block —
     "WOODS" over a widely-tracked "SUSTAINABLE FOODSERVICE" strapline — and the
     device, not the type, is what sets the height: measured on the trimmed
     artwork (sharp().trim(), 99.3% x 98.8% fill, so there is no padding to
     compensate for), the WOODS wordmark is 31.5% of the mark's height and the
     strapline just 6.2%. At the default that put the strapline at 1.2px.

     4rem/64px is where it resolves: 64x131px, wordmark ~20px, strapline ~4px.
     3rem/48px was tried first — the size dunstersfarm runs at almost exactly
     this aspect ratio (2.05:1 here, 2.09:1 there) — and the strapline was still
     a smudge at 3px, because Dunsters' second line is set at the same weight as
     its first while this one is a tracked-out caption a fifth the size. */
  --store-logo-height: 4rem;

  /* Row raised from the 4.5rem/72px default to carry the 4rem lockup. At 72px a
     64px mark leaves 4px above and below, which is westcountry's documented
     floor; 5rem/80px gives 8px either side, and 20px either side of the 40px
     search pill. Raising the row over shrinking the mark is the call
     --checkout-header-height-desktop documents, applied to the storefront
     header — and here the mark cannot shrink without losing the strapline that
     is the whole reason for the change. --heading-height derives from this
     token, so the sidebar offset follows without a second edit. */
  --store-header-height-desktop: 5rem;

  /* The checkout row defaults to 4rem/64px, which a 4rem lockup exactly fills —
     it would touch both edges at the funnel boundary. 5rem gives it the same
     8px either side it gets in the storefront header, without changing the
     logo's size as the customer crosses from browse into checkout (FO-3563). */
  --checkout-header-height-desktop: 5rem;

  /* The 4rem desktop height is too dominant on a phone, where the row holds a
     44px toggle and a 36px action cluster rather than a search field. 3rem is
     the size the strapline was already failing to resolve at, so this is a
     frank trade: on mobile the lockup reads as the frond plus "WOODS", which is
     what fits. Applies below `lg` on both the storefront and checkout headers. */
  --store-logo-height-mobile: 3rem;

  /* PINNED, not inherited — 4rem is what --auth-logo-height already resolves to
     (`max(2rem, var(--store-logo-height))`), so this changes nothing today and
     exists to stop the auth screens tracking a header decision they do not
     share. Raising --store-logo-height above silently took the sign-in, invite
     and handover lockups from 32px to 64px; that turned out to be right — the
     auth column is its own centred space, and at 390px the 64x131 lockup sits
     comfortably with the strapline resolving — but it was a side effect rather
     than a choice, and the next change to the header row would move it again.
     The same pin westcountry.css carries, for the same reason.

     Note these surfaces read no mobile variant: --store-logo-height-mobile
     above does NOT apply here, so this one value is the phone size too. */
  --auth-logo-height: 4rem;
}

.dark {
  --primary: oklch(from #d0ac76 0.72 c h);
  /* Kept near-black here, NOT mirrored to white: the dark-mode primary is
     lightened to L 0.72, so white on it is worse than on the light-mode gold
     while near-black is comfortable. The storefront forces light mode today, so
     this is parity housekeeping rather than a live surface. */
  --primary-foreground: oklch(0.204 0 0);
  --ring: oklch(from #d0ac76 0.72 c h);
}
