/* ========================================================================
   App color themes — set on <html data-app-theme="turf|ocean|slate|ember|rose|roma">
   All accent UI should use variables here (or Bootstrap vars below), not raw hex.
   ======================================================================== */

:root {
    --warning-color: #ffc107;
    --danger-color: #b91c1c;
    --light-bg: #f3f2f1;
    --lighter-bg: #faf9f8;
    --border-color: #d2d0ce;
    --text-primary: #323130;
    --text-secondary: #605e5c;
}

/* Left nav rail background — a shade darker than each theme's primary-dark. */
:root:not([data-app-theme]),
:root[data-app-theme="turf"] { --app-rail-bg: #0c2818; }
:root[data-app-theme="ocean"] { --app-rail-bg: #051e2c; }
:root[data-app-theme="slate"] { --app-rail-bg: #0b1220; }
:root[data-app-theme="ember"] { --app-rail-bg: #431407; }
:root[data-app-theme="rose"] { --app-rail-bg: #2d0710; }
:root[data-app-theme="roma"] { --app-rail-bg: #401017; }

/* Default when no data-app-theme (e.g. before JS runs): same as Turf */
:root:not([data-app-theme]),
:root[data-app-theme="turf"] {
    --primary-color: #166534;
    --primary-dark: #14532d;
    --secondary-color: #4ade80;
    --success-color: #15803d;
    --bs-primary: #15803d;
    --bs-primary-rgb: 21, 128, 61;
    --bs-link-color: #166534;
    --bs-link-hover-color: #14532d;
    --bs-success: #16a34a;
    --bs-success-rgb: 22, 163, 74;
    --header-gradient: linear-gradient(135deg, #14532d 0%, #15803d 45%, #22c55e 100%);
}

:root[data-app-theme="ocean"] {
    --primary-color: #0c4a6e;
    --primary-dark: #082f49;
    --secondary-color: #38bdf8;
    --success-color: #0d9488;
    --bs-primary: #0369a1;
    --bs-primary-rgb: 3, 105, 161;
    --bs-link-color: #075985;
    --bs-link-hover-color: #0c4a6e;
    --bs-success: #0d9488;
    --bs-success-rgb: 13, 148, 136;
    --header-gradient: linear-gradient(135deg, #082f49 0%, #0369a1 50%, #0ea5e9 100%);
}

:root[data-app-theme="slate"] {
    --primary-color: #334155;
    --primary-dark: #1e293b;
    --secondary-color: #94a3b8;
    --success-color: #475569;
    --bs-primary: #475569;
    --bs-primary-rgb: 71, 85, 105;
    --bs-link-color: #334155;
    --bs-link-hover-color: #1e293b;
    --bs-success: #64748b;
    --bs-success-rgb: 100, 116, 139;
    --header-gradient: linear-gradient(135deg, #0f172a 0%, #334155 45%, #64748b 100%);
}

    :root[data-app-theme="ember"] {
        --primary-color: #9e2718;
        --primary-dark: #7c2d12;
        --secondary-color: #fb923c;
        --success-color: #b45309;
        --bs-primary: #c2410c;
        --bs-primary-rgb: 194, 65, 12;
        --bs-link-color: #9a3412;
        --bs-link-hover-color: #7c2d12;
        --bs-success: #ca8a04;
        --bs-success-rgb: 202, 138, 4;
        --header-gradient: linear-gradient(135deg, #7c2d12 0%, #c2410c 45%, #ea580c 100%);
    }

/* Rose — dark blood-red / deep wine (heavier than bright rose) */
:root[data-app-theme="rose"] {
    --primary-color: #6b1428;
    --primary-dark: #4a0e1c;
    --secondary-color: #c73d5c;
    --success-color: #0d9488;
    --bs-primary: #7f1d3b;
    --bs-primary-rgb: 127, 29, 59;
    --bs-link-color: #6b1428;
    --bs-link-hover-color: #4a0e1c;
    --bs-success: #0d9488;
    --bs-success-rgb: 13, 148, 136;
    --header-gradient: linear-gradient(135deg, #3d0a16 0%, #7f1d3b 42%, #9f1f3d 100%);
}

/* Roma — AS Roma "giallorossi": Roman porpora red primary with gold accents. */
:root[data-app-theme="roma"] {
    --primary-color: #8e1f2f;
    --primary-dark: #5a1320;
    --secondary-color: #f0bc42;
    --success-color: #15803d;
    --bs-primary: #8e1f2f;
    --bs-primary-rgb: 142, 31, 47;
    --bs-link-color: #8e1f2f;
    --bs-link-hover-color: #5a1320;
    --bs-success: #15803d;
    --bs-success-rgb: 21, 128, 61;
    --header-gradient: linear-gradient(135deg, #5a1320 0%, #8e1f2f 50%, #f0bc42 100%);
}