/*
 * Design tokens — RaceResults.Web
 *
 * The single source of truth for the brand palette, surface/border tints,
 * radii, shadows, and typography scale documented in CLAUDE.md.
 *
 * Loaded in _Layout.cshtml immediately BEFORE site.css, so both site.css and
 * every per-page @section Styles stylesheet can consume these `var(--*)` tokens.
 *
 * All names are namespaced (--color-*, --surface-*, --border-*, --radius-*,
 * --shadow-*, --text-*, --fw-*) so they never collide with Metronic's --kt-*
 * or Bootstrap's --bs-* variables. Values here are literal aliases of the
 * constants previously hardcoded across the CSS — defining them is a no-op
 * visually; feature CSS adopts them incrementally.
 */
:root {
    /* Palette */
    --color-navy: #181c32;   /* primary text / ink — never gray */
    --color-blue: #0069b4;   /* brand blue */
    --color-bronze: #b8860b; /* podium gold / bronze */
    --color-black: #000000;  /* emphasis borders, number plates */
    --color-white: #ffffff;

    /* Surfaces & borders */
    --surface-tint: #f5f8fa;   /* chips, neutral pills, soft backgrounds */
    --border-subtle: #e7edf3;
    --border-emphasis: #000000;

    /* Radii */
    --radius-card: 1.5rem;    /* .results-surface */
    --radius-plate: 0.475rem; /* number plate */
    --radius-pill: 999px;

    /* Shadows */
    --shadow-card: 0 22px 48px rgba(15, 23, 42, 0.07);
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.08);

    /* Typography (Poppins only; floors enforced) */
    --text-body: 1rem;         /* body floor */
    --text-label: 0.9rem;      /* label floor */
    --text-label-caps: 0.85rem; /* only for uppercase + letter-spaced labels */
    --fw-body: 500;
    --fw-medium: 600;
    --fw-bold: 700;
    --fw-heavy: 800;
}