/*
 * Shared design tokens.
 *
 * Previously five separate stylesheets (auth.css, public-layout.css,
 * pages/welcome.css, pages/sharing.css, layouts/app-layout.css) each
 * redeclared their own :root color block. Since :root is document-global,
 * any page that ever loaded more than one of them got whichever set of
 * values happened to cascade last — and --gradient-start/--gradient-end
 * had directly contradictory values across files (light mint in auth.css
 * vs. dark navy in public-layout.css/welcome.css) despite sharing the same
 * name. This file is the single source of truth for brand colors and the
 * radius scale; page-specific gradients now use disambiguated names
 * (--gradient-auth-*, --gradient-hero-*) instead of the generic, collision-
 * prone --gradient-start/--gradient-end.
 *
 * Load this before any other stylesheet that references these variables.
 */

:root {
    /* Brand colors — matches the naming already used across 8+ CSS files
       and 10+ Blade inline styles (public/css/{auth,public-layout,
       layouts/app-layout,pages/map,pages/flights,pages/sharing,
       pages/welcome,pages/statistics}.css, plus flights/wizard/*.blade.php
       and others) — kept as-is rather than renamed, so every existing
       var(--primary-color) reference keeps working unchanged. */
    --primary-color: #2ECC71;
    --primary-dark: #27AE60;
    --primary-light: #58D68D;
    --dark-color: #1a1a2e;

    /* Semantic colors (from layouts/app-layout.css, the most complete set) */
    --secondary-color: #3498DB;
    --danger-color: #E74C3C;
    --warning-color: #F39C12;
    --success-color: #2ECC71;
    --info-color: #3498DB;

    /* Radius scale, derived from the most common literal values already
       in use (border-radius: 8px appears 18x, 12px 12x, 10px 11x, 25px 8x,
       20px 5x, 15px 5x, 4px 3x, across public/css/**/*.css). Existing
       literals are not all replaced in this pass — this establishes the
       scale so future and touched files can consume it. */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --radius-xl: 15px;
    --radius-2xl: 20px;
    --radius-pill: 25px;
    --radius-full: 50%;

    /* Auth pages (login/register/forgot-password): light mint gradient */
    --gradient-auth-start: #E8F8F0;
    --gradient-auth-end: #D4EFED;

    /* Public/marketing pages (homepage, hero sections): dark navy gradient */
    --gradient-hero-start: #1a1a2e;
    --gradient-hero-mid: #16213e;
    --gradient-hero-end: #0f3460;
}
