/*
 * Consumer design tokens — white/neutral palette for the parent/athlete pages only:
 * landing, /check, processing_athlete, unlock, results, course_plan.
 *
 * Deliberately NOT linked from base.html (logged-in legacy pages). Since the
 * Oct 2026 compliance restyle the compliance templates link it too (before
 * compliance.css, whose tokens now point here) -- reversing the earlier
 * "compliance.css stays standalone" decision.
 * design-tokens.css is left untouched because base.html still uses it.
 *
 * Status colors (--green/--amber/--red and their -bg/-line tints) are NOT
 * defined here and must never be built from these tokens. The accent is
 * for small eyebrow labels / step numbers only — never buttons, never status.
 *
 * Contrast (WCAG AA, 4.5:1 for small text), all on white (--ec-bg):
 *   --ec-text #111111 18.88:1, --ec-text-2 #5f5f5f 6.39:1,
 *   --ec-text-muted #757575 4.61:1 (passes on white only: 4.23:1 on
 *   --ec-btn-2-hover-bg, 4.01:1 on --ec-track — keep it off those fills),
 *   --ec-accent #b4492a 5.35:1, --ec-accent-text #8a3f24 7.45:1.
 */

:root {
    /* Surfaces */
    --ec-bg:            #ffffff;  /* page background */
    --ec-surface:       #ffffff;  /* card surface */
    --ec-border:        #e5e5e5;
    --ec-border-strong: #d4d4d4;  /* hover borders (1.48:1 on white: decorative only) */
    --ec-input-border:  #8a8a8a;  /* borders that identify a control: 3.45:1 on white (3:1 needed) */
    --ec-track:         #efefef;  /* track, divider, subtle fill */

    /* Text */
    --ec-text:          #111111;
    --ec-text-2:        #5f5f5f;
    --ec-text-muted:    #757575;  /* 4.61:1 on white; still prefer --ec-text-2 for small text */

    /* Accent — small touches only */
    --ec-accent:        #b4492a;  /* on white surfaces */
    --ec-accent-text:   #8a3f24;  /* stronger accent text */

    /* Buttons */
    --ec-btn-bg:        #111111;
    --ec-btn-text:      #ffffff;
    --ec-btn-hover:     #333333;
    --ec-btn-radius:    8px;
    /* Secondary (outlined) button hover */
    --ec-btn-2-hover-bg:     #f5f5f5;
    --ec-btn-2-hover-border: var(--ec-text-muted);  /* non-text stroke */

    /* Shape */
    --ec-card-radius:   12px;

    /* Overlays / shadows tinted with the primary text ink */
    --ec-ink-70:        rgba(17, 17, 17, 0.7);
    --ec-ink-20:        rgba(17, 17, 17, 0.2);
    --ec-ink-08:        rgba(17, 17, 17, 0.08);

    /* Type */
    --ec-font-serif:    Georgia, 'Times New Roman', serif;

    /* Legacy neutral names the consumer templates already use, re-pointed at
       the consumer palette so existing rules (and the tests that pin them, e.g.
       results.html's `color: var(--gray-600)`) keep working. */
    --gray-0:   var(--ec-bg);
    --gray-50:  var(--ec-track);
    --gray-100: var(--ec-border);
    --gray-200: var(--ec-border-strong);
    --gray-400: var(--ec-text-muted);
    --gray-600: var(--ec-text-2);
    --gray-800: var(--ec-btn-hover);
    --gray-950: var(--ec-text);
}