/* ============================================================
   THEME VARIABLES — 5 themes
   Set via <html data-theme="...">
   ============================================================ */

/* ======================= NAVY LIGHT ======================= */
:root,
html[data-theme="navy_light"] {
    --sidebar-bg:          #16233f;
    --sidebar-text:        #c9d4e8;
    --sidebar-text-muted:  #7d8fb0;
    --sidebar-hover-bg:    #1f3255;
    --sidebar-active-bg:   #2f6bd8;
    --sidebar-active-text: #ffffff;
    --sidebar-border:      #24365a;

    --page-bg:             #f4f7fb;
    --header-bg:           #ffffff;
    --card-bg:             #ffffff;
    --panel-bg:            #ffffff;
    --panel-border:        #e4ebf5;

    --text-primary:        #1b2540;
    --text-secondary:      #5a6b8c;
    --text-muted:          #8896ad;

    --border-color:        #dbe3ef;
    --primary-color:       #2f6bd8;
    --primary-hover:       #2559b8;
    --primary-contrast:    #ffffff;

    --input-bg:            #ffffff;
    --input-border:        #cfd9e8;
    --table-header-bg:     #eef3fb;
    --modal-bg:            #ffffff;

    --badge-success-bg:    #d9f2e3;
    --badge-warning-bg:    #fdf0cf;
    --badge-danger-bg:     #fadcdc;
    --badge-neutral-bg:    #eef1f6;

    --focus-ring:          rgba(47, 107, 216, 0.30);
    --live-pulse-rgb:      47, 107, 216;

    --shadow-sm:           0 2px 8px rgba(15, 28, 51, 0.05);
    --shadow-md:           0 6px 18px rgba(15, 28, 51, 0.08);
    --shadow-lg:           0 14px 32px rgba(15, 28, 51, 0.12);
}

/* ======================= PURPLE GAMING ======================= */
html[data-theme="purple_gaming"] {
    --sidebar-bg:          #2b1a4a;
    --sidebar-text:        #d6c9ef;
    --sidebar-text-muted:  #9c8ec0;
    --sidebar-hover-bg:    #3a2560;
    --sidebar-active-bg:   #7c3aed;
    --sidebar-active-text: #ffffff;
    --sidebar-border:      #3c2a63;

    --page-bg:             #f7f4fd;
    --header-bg:           #ffffff;
    --card-bg:             #ffffff;
    --panel-bg:            #ffffff;
    --panel-border:        #ece3f8;

    --text-primary:        #241a3a;
    --text-secondary:      #6b5d85;
    --text-muted:          #9488ab;

    --border-color:        #e6ddf5;
    --primary-color:       #7c3aed;
    --primary-hover:       #6a2fd0;
    --primary-contrast:    #ffffff;

    --input-bg:            #ffffff;
    --input-border:        #d9cdf0;
    --table-header-bg:     #f1ebfb;
    --modal-bg:            #ffffff;

    --badge-success-bg:    #dcf5e6;
    --badge-warning-bg:    #fdeecb;
    --badge-danger-bg:     #f9d9e3;
    --badge-neutral-bg:    #efe9f8;

    --focus-ring:          rgba(124, 58, 237, 0.30);
    --live-pulse-rgb:      124, 58, 237;

    --shadow-sm:           0 2px 8px rgba(43, 26, 74, 0.06);
    --shadow-md:           0 6px 18px rgba(43, 26, 74, 0.09);
    --shadow-lg:           0 14px 32px rgba(43, 26, 74, 0.14);
}

/* ======================= DARK TEAL ======================= */
html[data-theme="dark_teal"] {
    --sidebar-bg:          #0d2b28;
    --sidebar-text:        #bfe3dc;
    --sidebar-text-muted:  #7ba49d;
    --sidebar-hover-bg:    #143b37;
    --sidebar-active-bg:   #14b8a6;
    --sidebar-active-text: #04211d;
    --sidebar-border:      #1a403c;

    --page-bg:             #0b1f1d;
    --header-bg:           #10322e;
    --card-bg:             #123330;
    --panel-bg:            #123330;
    --panel-border:        #1e4741;

    --text-primary:        #eafaf6;
    --text-secondary:      #8fb8b0;
    --text-muted:          #6a938c;

    --border-color:        #1e4741;
    --primary-color:       #14b8a6;
    --primary-hover:       #0f9488;
    --primary-contrast:    #04211d;

    --input-bg:            #0f2a27;
    --input-border:        #245049;
    --table-header-bg:     #143a35;
    --modal-bg:            #123330;

    --badge-success-bg:    #14503f;
    --badge-warning-bg:    #5a4716;
    --badge-danger-bg:     #5c2230;
    --badge-neutral-bg:    #173b37;

    --focus-ring:          rgba(20, 184, 166, 0.35);
    --live-pulse-rgb:      20, 184, 166;

    --shadow-sm:           0 2px 8px rgba(0, 0, 0, 0.35);
    --shadow-md:           0 6px 18px rgba(0, 0, 0, 0.45);
    --shadow-lg:           0 14px 32px rgba(0, 0, 0, 0.55);
}

/* ======================= ORANGE BLACK ======================= */
html[data-theme="orange_black"] {
    --sidebar-bg:          #121212;
    --sidebar-text:        #d4d4d4;
    --sidebar-text-muted:  #8a8a8a;
    --sidebar-hover-bg:    #1f1f1f;
    --sidebar-active-bg:   #f97316;
    --sidebar-active-text: #1a0f04;
    --sidebar-border:      #242424;

    --page-bg:             #faf7f2;
    --header-bg:           #ffffff;
    --card-bg:             #ffffff;
    --panel-bg:            #ffffff;
    --panel-border:        #efe7da;

    --text-primary:        #1f1c19;
    --text-secondary:      #6e6a63;
    --text-muted:          #96908a;

    --border-color:        #e8e1d6;
    --primary-color:       #f97316;
    --primary-hover:       #e0620a;
    --primary-contrast:    #ffffff;

    --input-bg:            #ffffff;
    --input-border:        #ddd5c8;
    --table-header-bg:     #fdf0e3;
    --modal-bg:            #ffffff;

    --badge-success-bg:    #dcf5e6;
    --badge-warning-bg:    #fdeac2;
    --badge-danger-bg:     #fad8d8;
    --badge-neutral-bg:    #f3eee5;

    --focus-ring:          rgba(249, 115, 22, 0.30);
    --live-pulse-rgb:      249, 115, 22;

    --shadow-sm:           0 2px 8px rgba(31, 28, 25, 0.06);
    --shadow-md:           0 6px 18px rgba(31, 28, 25, 0.09);
    --shadow-lg:           0 14px 32px rgba(31, 28, 25, 0.14);
}

/* ======================= LIGHT TEAL ======================= */
html[data-theme="light_teal"] {
    --sidebar-bg:          #ffffff;
    --sidebar-text:        #2f5f5a;
    --sidebar-text-muted:  #6a9390;
    --sidebar-hover-bg:    #eef7f5;
    --sidebar-active-bg:   #d4f3ee;
    --sidebar-active-text: #0f5e55;
    --sidebar-border:      #dfecea;

    --page-bg:             #f2f7f8;
    --header-bg:           #ffffff;
    --card-bg:             #ffffff;
    --panel-bg:            #ffffff;
    --panel-border:        #dcebe9;

    --text-primary:        #1c3a3a;
    --text-secondary:      #5f7d7b;
    --text-muted:          #8aa4a1;

    --border-color:        #d6e7e5;
    --primary-color:       #14b8a6;
    --primary-hover:       #0f9488;
    --primary-contrast:    #ffffff;

    --input-bg:            #ffffff;
    --input-border:        #cadfdd;
    --table-header-bg:     #e9f5f3;
    --modal-bg:            #ffffff;

    --badge-success-bg:    #d6f2e6;
    --badge-warning-bg:    #fbeecb;
    --badge-danger-bg:     #f9dada;
    --badge-neutral-bg:    #eaf3f2;

    --focus-ring:          rgba(20, 184, 166, 0.25);
    --live-pulse-rgb:      20, 184, 166;

    --shadow-sm:           0 2px 8px rgba(28, 58, 58, 0.05);
    --shadow-md:           0 6px 18px rgba(28, 58, 58, 0.08);
    --shadow-lg:           0 14px 32px rgba(28, 58, 58, 0.12);
}