/* ================================================================
   WARRIORS FIGHT ACADEMY — BRAND
   ================================================================
   The club's entire visual identity. Loaded straight after the shared
   assets/css/style.css, which it overrides; everything else — layout,
   components, both themes — comes from that shared file and is not
   copied or edited per client.

   This is also the file that goes to AMM, so the dynamic pages and
   this index page are guaranteed to be the same brand.

   THE BRAND IS MONOCHROME, AND THAT BREAKS ONE TEMPLATE ASSUMPTION
   ------------------------------------------------------------------
   Luke's brief: "dark theme, black with white accents". The club's own
   gym matches it — white WFA wall art, white lettering on black kit,
   a black-and-white logo. There is no third colour anywhere.

   style.css says of --on-brand: "Fixed in both themes, because --brand
   doesn't invert." That holds for a club with a coloured accent — a
   red button is a red button on either ground. It does NOT hold here.
   --brand IS the accent, and the accent is white, so in the light
   build every .btn-primary would be a white button on a near-white
   page: invisible. Measured before writing this: white on the light
   theme's --panel (#ffffff) is 1.00:1.

   So this file does the one thing the template does not expect and
   FLIPS THE FILL WITH THE THEME. Dark build: white fill, near-black
   text on it. Light build: near-black fill, white text on it. The
   [data-theme="light"] block below has the same specificity (0,1,0)
   as style.css's own light block and is declared later, so it wins.

   Everything stays within the same six tokens — nothing new is
   invented — so AMM's dynamic pages get the same treatment for free
   as long as they load this file.

       DARK   ratio(#0a0a0a, #ffffff)  = 19.80  text on the fill   AAA
              ratio(#ffffff, #0a0a0a)  = 19.80  accent on the page AAA
              ratio(#ffffff, #141414)  = 18.42  accent on panels   AAA
       LIGHT  ratio(#ffffff, #141414)  = 18.42  text on the fill   AAA
              ratio(#141414, #f1efea)  = 16.03  accent on panels   AAA
              ratio(#141414, #ffffff)  = 18.42  accent, white band AAA

   KNOWN CONSEQUENCE, NOT A BUG. --brand-rgb drives every low-alpha
   tint in style.css (hover washes, .line-brand borders, the class-card
   back-face glow). With a monochrome brand those tints are white on
   dark and near-black on light, so they read as a lift or a shade
   rather than as colour. Checked on the built page at 1440, 1000 and
   390 in both themes: every one of them still reads, so custom.css
   leaves the alphas alone.

   Do not add --brand-bright: it is derived in style.css from
   --brand-on-dark and --brand-on-light.
   ================================================================ */

:root{
  --brand:          #ffffff;       /* the fill: buttons, ticker, badges, calendar days */
  --brand-deep:     #141414;       /* nav dropdown ground — stays dark in BOTH themes */
  --brand-rgb:      255,255,255;   /* --brand as r,g,b — every low-alpha brand tint tracks this */
  --on-brand:       #0a0a0a;       /* text ON a --brand fill */
  --brand-on-dark:  #ffffff;       /* accent text on the always-dark hero / CTA / dropdown */
  --brand-on-light: #141414;       /* accent text on light mode and the white affiliate band */
}

/* THE FLIP. See the note above — without this the light build's
   primary buttons, ticker and badges are white on near-white.
   --brand-deep and --brand-on-dark are deliberately NOT flipped:
   the dropdown panel and the hero/CTA bands are always dark in this
   template, so their ground does not change with the theme. */
[data-theme="light"]{
  --brand:     #141414;
  --brand-rgb: 20,20,20;
  --on-brand:  #ffffff;
}
