/**
 * Mileage Riot — Design Tokens (sursa unică de adevăr)
 * Încărcat primul în toate layout-urile (app, auth, public, recap).
 * Orice culoare de brand se schimbă DOAR aici.
 */
:root {
    --mr-primary: #00CBCD;
    --mr-primary-rgb: 0, 203, 205;
    --mr-primary-dark: #00a8aa;
    --mr-success: #28c76f;
    --mr-success-rgb: 40, 199, 111;
    --mr-danger: #ea5455;
    --mr-danger-rgb: 234, 84, 85;
    --mr-warning: #ff9f43;
    --mr-warning-rgb: 255, 159, 67;
    --mr-info: #00cfe8;
    --mr-info-rgb: 0, 207, 232;
    --mr-purple: #7c3aed;
    --mr-purple-rgb: 124, 58, 237;
    --mr-gold: #ffd700;
    --mr-bg-dark: #161d31;
    --mr-card-bg: #283046;
    /* Legacy MR pages use this spelling; keep it bound to the account theme. */
    --mr-bg-card: var(--mr-card-bg);
    --mr-card-border: rgba(0, 203, 205, 0.15);
    --mr-card-header-border: rgba(255, 255, 255, 0.1);
    --mr-text: #fff;
    --mr-text-muted: #b4b7bd;
}

/* Appearance contract: account light/dark preference, independent of seasonal accent.
   Seasonal classes may change accent; they must not force dark surfaces for light accounts. */
html.dark-layout {
    --mr-hero-bg: linear-gradient(135deg, #283046 0%, #1a2332 50%, #283046 100%);
    --mr-stat-bg: rgba(255, 255, 255, .03);
    --mr-stat-bg-hover: rgba(255, 255, 255, .06);
    --mr-list-bg: rgba(255, 255, 255, .03);
    --mr-list-bg-hover: rgba(255, 255, 255, .06);
    --mr-button-text: #161d31;
    /* Share of a DB-chosen text colour (roles, ranks, divisions) kept when mixed with --mr-text: legible on both themes. */
    --mr-db-text-mix: 85%;
    /* Feedback (toasts: mr-toast.css, dialogs: mr-sweetalert.css). Colours come from the brand/status tokens;
       a theme may also set --mr-feedback-surface/-border/-text/-muted/-accent/-accent-2. */
    --mr-feedback-radius: 20px;
    --mr-feedback-radius-sm: 14px;
    --mr-feedback-shadow: 0 30px 80px rgba(0, 0, 0, .48);
    --mr-feedback-shadow-sm: 0 18px 46px rgba(0, 0, 0, .38);
    --mr-feedback-backdrop: rgba(5, 10, 20, .72);
    --mr-feedback-gloss: rgba(255, 255, 255, .035);
}
html.light-layout {
    color-scheme: light;
    --mr-card-bg: #ffffff;
    --mr-card-border: #d9e3ea;
    --mr-card-header-border: #e4eaf0;
    --mr-text: #202b3a;
    --mr-text-muted: #566576;
    --mr-hero-bg: linear-gradient(135deg, #ffffff 0%, #f2f7fa 52%, #ffffff 100%);
    --mr-stat-bg: #f3f7fa;
    --mr-stat-bg-hover: #e9f2f5;
    --mr-list-bg: #f3f7fa;
    --mr-list-bg-hover: #e9f2f5;
    /* Light accent: darker teal keeps links/labels readable on white (4.7:1); dark keeps #00CBCD. */
    --mr-primary: #007f81;
    --mr-primary-rgb: 0, 127, 129;
    --mr-primary-dark: #006668;
    --mr-button-text: #ffffff;
    --mr-db-text-mix: 50%;
    --mr-feedback-shadow: 0 24px 60px rgba(34, 41, 47, .2);
    --mr-feedback-shadow-sm: 0 14px 36px rgba(34, 41, 47, .16);
    --mr-feedback-backdrop: rgba(34, 41, 47, .42);
    --mr-feedback-gloss: rgba(255, 255, 255, .7);
    --bs-primary: var(--mr-primary);
    --bs-primary-rgb: var(--mr-primary-rgb);
    /* Status hues, darkened for text on white (4.5-5:1); dark theme keeps the Vuexy originals. */
    --mr-success: #17804a;
    --mr-success-rgb: 23, 128, 74;
    --mr-warning: #b45f0c;
    --mr-warning-rgb: 180, 95, 12;
    --mr-info: #007f94;
    --mr-info-rgb: 0, 127, 148;
    --mr-danger: #d63b3c;
    --mr-danger-rgb: 214, 59, 60;
}
