/*
 * ACAD1 Review Center — design tokens
 * "1b Charcoal Academic"
 *
 * The :root block below is child-theme-guide.md §1, verbatim.
 * Do not add new tokens inside it — append new tokens in the
 * "pre-flight conflict resolution" block that follows instead, so the
 * guide's block stays a clean, diffable copy of the source of truth.
 */
:root {
  /* ── colour ───────────────────────────────────────────── */
  --a1-primary:    #22201F; /* charcoal   15.42:1  AAA */
  --a1-secondary:  #55504D; /* stone       7.56:1  AAA */
  --a1-text:       #171614; /* near-black 17.19:1  AAA */
  --a1-bg:         #FAF9F7; /* paper — page ground        */
  --a1-surface:    #F0EEEB; /* cards, table stripes       */
  --a1-contrast:   #FFFFFF; /* reversed panels, 16.22:1 on primary */
  --a1-accent:     #8C2B22; /* oxblood     8.04:1  AAA — passes at body size */
  --a1-accent-lt:  #B3453A; /* hover / on-dark  5.21:1  AA */

  --a1-border:      #E0DCD7; /* default 1px rules          */
  --a1-border-strong:#C9C4BE; /* form field borders        */
  --a1-rule:        #EAE6E1; /* table row rules            */
  --a1-disabled-bg: #D8D3CD;
  --a1-disabled-fg: #8A857F;

  /* on-dark alphas (never invent new greys for dark panels) */
  --a1-on-dark:      rgba(250,249,247,1);
  --a1-on-dark-80:   rgba(250,249,247,0.78);
  --a1-on-dark-70:   rgba(250,249,247,0.70);
  --a1-on-dark-50:   rgba(250,249,247,0.50);
  --a1-on-dark-rule: rgba(250,249,247,0.18);

  /* ── type ─────────────────────────────────────────────── */
  --a1-font: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
  /* single family, weights 400 / 500 / 600 / 700 / 800 */

  --a1-h1: clamp(30px, 4.4vw, 60px);
  --a1-h2: clamp(24px, 3vw,   40px);
  --a1-h3: clamp(20px, 2.3vw, 30px);
  --a1-h4: clamp(17px, 1.7vw, 22px);
  --a1-body:      clamp(15.5px, 1.1vw, 17px);
  --a1-body-sm:   14.5px;
  --a1-meta:      13.5px;
  --a1-caption:   12.5px;
  --a1-kicker:    10.5px;  /* uppercase, 0.12em tracking */

  --a1-lh-display: 1.05;
  --a1-lh-heading: 1.15;
  --a1-lh-body:    1.70;
  --a1-ls-display: -0.035em;
  --a1-ls-heading: -0.025em;
  --a1-ls-kicker:   0.12em;

  /* ── space (8 / 20 / 40 spine) ────────────────────────── */
  --a1-s-1: 4px;
  --a1-s-2: 8px;
  --a1-s-3: 12px;
  --a1-s-4: 16px;
  --a1-s-5: 20px;   /* spine */
  --a1-s-6: 26px;
  --a1-s-7: 32px;
  --a1-s-8: 40px;   /* spine */
  --a1-s-9: 56px;
  --a1-s-10: 64px;
  --a1-s-11: 80px;
  --a1-section-y: clamp(44px, 6vw, 80px);   /* every <section> vertical pad */
  --a1-gutter:    clamp(16px, 4vw, 20px);   /* every container side pad */
  --a1-measure:   1200px;                    /* content width */

  /* ── radius ───────────────────────────────────────────── */
  --a1-r-btn:   6px;
  --a1-r-card:  8px;
  --a1-r-input: 6px;
  --a1-r-img:   8px;
  --a1-r-tag:   6px;

  /* ── elevation ────────────────────────────────────────── */
  --a1-sh-sm: 0 1px 2px rgba(23,22,20,0.07);
  --a1-sh-md: 0 4px 12px rgba(23,22,20,0.09);
  --a1-sh-lg: 0 14px 36px rgba(23,22,20,0.13);

  /* ── z-index ──────────────────────────────────────────── */
  --a1-z-sticky-bar: 50;
  --a1-z-mobile-nav: 60;
}

/*
 * Pre-flight conflict resolution (docs/plans/acad1-child-theme-plan.md,
 * "Pre-flight conflict resolution" table).
 *
 * The guide's own sample CSS in §4 and §8 inlines five literals that
 * violate Global Constraint 1 (no hard-coded colour outside this file).
 * The shadow literals are already tokenised above as --a1-sh-*. The
 * remaining four get tokens here so every later task can reference them
 * instead of repeating the literal:
 *
 *   #75231C                 -> --a1-accent-dk        (.a1-btn--primary:active, §4)
 *   rgba(255,255,255,0.55)  -> --a1-on-accent-border  (.a1-btn--ondark, §4)
 *   #FDF6F5                 -> --a1-invalid-bg        (.a1-input[aria-invalid], §4; .woocommerce-error, §8)
 *   rgba(140,43,34,0.20)    -> --a1-selection         (::selection, §4)
 *
 * Only --a1-selection is consumed in this task (10-base.css). The other
 * three are consumed by later component/WooCommerce tasks.
 */
:root {
  --a1-accent-dk:        #75231C;
  --a1-on-accent-border: rgba(255,255,255,0.55);
  --a1-invalid-bg:       #FDF6F5;
  --a1-selection:        rgba(140,43,34,0.20);
}

/*
 * Task 3 additions (50-responsive.css / 99-print.css).
 *
 * §6's breakpoint table gives three compression values in prose that have
 * no exact existing token: the section-padding floor, and the fluid image
 * sizing rule under 820px. Tokenised here per the task's ambiguity
 * resolution ("map to the nearest existing token; if none is close, add
 * one and say so").
 *
 *   --a1-section-y-sm  44px  the floor already baked into --a1-section-y's
 *                            own clamp() minimum — reused verbatim rather
 *                            than inventing a new number, so the explicit
 *                            ≤820px override and the fluid clamp can never
 *                            disagree.
 *   --a1-img-cap       420px  §6: "Images ... capped 420px" at ≤820px. The
 *                            58vw half of that rule (--a1-img-fluid) was
 *                            removed by the review-fix pass: sizing an
 *                            image against the *viewport* ignores the
 *                            width of its actual grid column and overflows
 *                            it between 620–820px (`.a1-split img` /
 *                            `.a1-card img` now use `width: 100%` instead,
 *                            which tracks the container and still respects
 *                            this cap).
 *
 * The other two compression pairs in §6's prose ("56→32", "40→26") land
 * exactly on existing tokens (--a1-s-9→--a1-s-7, --a1-s-8→--a1-s-6) and
 * need no new token — see 50-responsive.css's file header for the mapping
 * table. The middle pair ("48→30") does not correspond to any gap value
 * used by a selector that exists in 20-layout.css/30-components.css, so
 * no token or rule was added for it (see task-3-report.md).
 */
:root {
  --a1-section-y-sm: 44px;
  --a1-img-cap: 420px;
}

/*
 * Final-review fix pass addition.
 *
 *   --a1-target-min  48px  The minimum interactive hit target. §7 states it
 *                          as a site-wide rule ("48px minimum hit target
 *                          site-wide, not just mobile") and §12 as a
 *                          definition-of-done item, which makes it a stated
 *                          Global Constraint rather than a spacing choice —
 *                          so it belongs here, not repeated as a literal in
 *                          every file that enforces it. Every `min-height`,
 *                          `min-width` and the sticky bar's `height` that
 *                          previously hard-coded 48px now reads this token,
 *                          across 30-components.css, 40-woocommerce.css,
 *                          45-woocommerce-blocks.css and 50-responsive.css.
 *
 * The ~40 other literal px spacing/font-size values copied verbatim from
 * §4/§8 are deliberately NOT tokenised here — see docs/OPEN-QUESTIONS.md
 * for that decision and its reasoning. This token is the one exception,
 * because 48px is a constraint, not a measurement.
 */
:root {
  --a1-target-min: 48px;
}