/* ================================================================= */
/* BRAND TOKENS (tokens.css)                                         */
/* The brand palette and type scale, stored as CSS variables.        */
/* Every other stylesheet uses these by name (e.g. var(--rsn-signal)) */
/* instead of raw hex codes. inc/enqueue.php loads this file first on */
/* the website, in wp-admin AND on the login screen, so all three    */
/* share one palette: change a color here and it changes everywhere. */
/* ================================================================= */

/* Root-level custom properties (CSS variables) holding the official brand palette. */
/* Defining them once here means every color is referenced by name, not a raw */
/* hex code — if a color ever changes, it only needs to be updated in this one place. */
:root {
    --rsn-signal: #25ABE2; /* Primary brand color: logo, links, live indicators, active states, key UI accents */
    --rsn-deep:   #0A1A24; /* Primary background: nav, hero, page base, all dark surfaces */
    --rsn-depth:  #0F2535; /* Secondary surface: cards, score tiles, side panels, podcast art backgrounds */
    --rsn-drive:  #1A8CBF; /* Signal's pressed/hover state, used for interactive feedback on Signal elements */
    --rsn-alert:  #F43F5E; /* Breaking news tags, urgent tickers, critical alerts only — use sparingly */
    --rsn-live:   #4ADE80; /* Live game dot indicators and live score status only — never used decoratively */
    --rsn-ice:    #FFFFFF; /* Primary text color on dark surfaces: headlines, body copy, nav items */
    --rsn-carbon: #060F15; /* Footer background, the deepest surface, used only at the base of the page */

    /* Typography tokens below follow the "02 — Roles & Hierarchy" font spec: */
    /* each role defines a font-family, font-weight, and a font-size chosen from */
    /* the middle of that role's specified px range, so real designs land in-range. */

    --rsn-font-rajdhani: 'Rajdhani', sans-serif; /* Display/H1/H2 typeface, loaded via Google Fonts in inc/enqueue.php */
    --rsn-font-dm-sans: 'DM Sans', sans-serif; /* H3/Body/Caption typeface, loaded via Google Fonts in inc/enqueue.php */
    --rsn-font-dm-mono: 'DM Mono', monospace; /* Data/Label typeface, loaded via Google Fonts in inc/enqueue.php */

    --rsn-type-display-weight: 700; /* Display: hero banners, video thumbnails, breaking news (e.g. "CHIEFS WIN") */
    --rsn-type-display-size: 56px; /* Display size chosen from the middle of the 48–72px spec range */

    --rsn-type-h1-weight: 700; /* H1: article headlines, section heroes (e.g. "DRAFT NIGHT RECAP") */
    --rsn-type-h1-size: 40px; /* H1 size chosen from the middle of the 36–48px spec range */

    --rsn-type-h2-weight: 600; /* H2: section headers, card headlines (e.g. "Top Stories") */
    --rsn-type-h2-size: 32px; /* H2 size chosen from the middle of the 28–36px spec range */

    --rsn-type-h3-weight: 600; /* H3: subheadings, sidebar titles, podcast titles (e.g. "This Week in the NFL") */
    --rsn-type-h3-size: 22px; /* H3 size chosen from the middle of the 20–24px spec range */

    --rsn-type-body-weight: 400; /* Body: article body, descriptions, navigation */
    --rsn-type-body-size: 15px; /* Body size chosen from the middle of the 14–16px spec range */

    --rsn-type-caption-weight: 300; /* Caption: image captions, footnotes, bylines (e.g. "Photo: Getty Images") */
    --rsn-type-caption-size: 12px; /* Caption size chosen from the middle of the 11–13px spec range */

    --rsn-type-data-weight: 500; /* Data: scores, stats, timestamps, tags, tickers (e.g. "NFL · Q4 2:34") */
    --rsn-type-data-size: 12px; /* Data size chosen from the middle of the 11–14px spec range */

    --rsn-type-label-weight: 400; /* Label: UI labels, metadata, breadcrumbs (e.g. "May 21, 2026 · 4 min read") */
    --rsn-type-label-size: 10px; /* Label size chosen from the middle of the 9–11px spec range */
}