/* Creed Foodservice theme */
:root {
  /* Creed's brand orange, on --primary itself. ONE orange for the whole
     storefront: the Add CTA, the Sign in button, checkout, and every other
     `variant="default"` Button now all read this.

     THIS DELIBERATELY REVERSES FO-3774 — do not "fix" it back. That ticket
     put the orange on --add-button and kept --primary a near-neutral ink
     (#1d1d1b), on the reasoning that --primary is "consumed as a text colour
     about as often as a surface (~101 `text-primary` vs ~96 `bg-primary`)".
     Those figures are wrong: a `text-primary\b` match also matches
     `text-primary-foreground`, which is a colour ON primary, not primary
     used as text. Excluding it, apps/web/src + packages/ui carry 65
     `text-primary` against 119 `bg-primary` and 23 `border-primary` — the
     token is a SURFACE roughly 1.8x more often than it is text, so the
     premise the original split rested on does not hold.

     FO-3774 also ran two oranges on purpose — #EE7400 in the logo and
     favicon artwork, #DD7B2E on the CTA, the deeper shade sampled from the
     live "Sign in for price" control on creedfoodservice.co.uk. Both choices
     are superseded: Creed want their one brand orange everywhere, and the
     black Sign in button sitting beside an orange Add button was the
     specific complaint.

     KNOWN AND ACCEPTED CONTRAST COST. #ef7400 is a sound button surface and
     a poor text colour:
       - white-ish text ON the orange (buttons)  2.81:1
       - the orange AS text on white (text-primary) ~2.9:1
     Both are under the 4.5:1 AA floor at the text-sm/14px these render at
     (the 3:1 large-text allowance does not apply). The button case was
     already accepted by FO-3774 for brand continuity; the text case is new
     with this change and affects the 65 `text-primary` usages plus the
     `link` Button variant. Accepted by decision — brand fidelity over the
     contrast floor. Reaching AA with white would need a burnt orange around
     #B65C16 that stops reading as Creed's.

     If that text case ever needs undoing WITHOUT losing the orange buttons,
     the fix is a global --primary-surface token (defaulting to var(--primary),
     defined in both apps/web and apps/admin globals.css) wired to Button's
     default variant — NOT flipping --primary back, which would return the
     black Sign in button this change exists to remove.

     Note --add-button carries no override here any more: it defaults to
     var(--primary) in globals.css, so it follows this orange automatically.
     Two tokens pinned to the same hex would just be two things to keep in
     step. (tenants.primary_colour stays unset/NULL for Creed on staging and
     prod — this file is the only source.) */
  --primary: #ef7400;
  --primary-foreground: oklch(0.985 0 0);
  --ring: #ef7400;

  /* Not about the overall 2.62:1 aspect ratio (that alone isn't squat — it's
     close to Savona's 2.73:1, which keeps the 1.75rem default). What differs
     is how much of the viewBox the "CREED" letters actually occupy: the
     wordmark spans only y 0–86 of the 430×164 box, with a strapline and two
     rules filling the rest. At the 1.25rem/20px default that puts the
     letters themselves under 11px tall — illegible.

     Sized at 2.75rem/44px, which puts the letters at ~23px (44 x 86/164).
     Down 4px from the 3rem/48px this first shipped at — a deliberate notch
     on the 4px grid rather than an odd value, and still comfortably above
     the legibility floor the default fell through. Anything at or below
     ~2rem/32px drops the letters under 17px and starts to crowd the
     strapline again. */
  --store-logo-height: 2.75rem;

  /* Header seam. Creed's own site runs a white utility strip over a thick
     brand-orange rule, then the white logo/search band — the rule, not a
     change of surface, is what separates the two. Ours defaulted the strip to
     --muted (grey), which read as a third band and left the orange nothing to
     do, so the strip goes white and the rule carries the division.
     --top-bar-foreground/-strong keep the platform muted/foreground pair:
     0.556 grey on white is 4.8:1, so the links clear AA at rest and go to full
     ink on hover. */
  --top-bar: var(--background);
  /* No --top-bar-rule here: it defaults to var(--primary), which is already
     this orange. Pinning the hex would just be a second copy to keep in step. */
  --top-bar-rule-height: 4px;

  /* Row raised from the 4.5rem/72px default (Mike, 2026-09-08). The 2.75rem
     lockup sat with 14px of white either side, which read short once the strip
     above went white and the two bands merged into one field of white broken
     only by the rule — at 72px the header looked like the smaller half of a
     block it now visually shares. 5rem/80px puts 18px either side. */
  --store-header-height-desktop: 5rem;

  /* Search pill fill. White, not the platform's `--muted` at 50%, so the field
     matches the white header band around it — the KitWave storefronts run a
     white-on-white field bounded by its `border-input` outline rather than a
     grey trough. */
  --search-field: var(--background);
}

.dark {
  /* Storefront currently forces light mode; kept for parity with the other
     tenant themes. Same `oklch(from … 0.72 c h)` derivation the other themes
     use — now applied to the orange rather than the old near-neutral ink, so
     dark mode tracks the brand colour if it ever ships. */
  --primary: oklch(from #ef7400 0.72 c h);
  --primary-foreground: oklch(0.2 0 0);
  --ring: oklch(from #ef7400 0.72 c h);
}