/* ==========================================================================
   THEME VARIABLES — Персональный сервис
   Dark theme (default, Remnawave-style) + Light theme
   All colors are defined here. Templates use only var(--...) references.
   ========================================================================== */

/* ===== DARK THEME (default) — Remnawave style ===== */
:root {
    /* Backgrounds */
    --bg-body: #0d1117;
    --bg-sidebar: #0c1018;
    --bg-card: #161b22;
    --bg-card-hover: #1c2333;
    --bg-input: #161b22;
    --bg-input-focus: #1c2333;
    --bg-overlay: rgba(13,17,23,0.9);
    --bg-dropdown: #1c2333;
    --bg-table-head: #131920;
    --bg-code: rgba(255,255,255,0.06);
    --bg-hover: rgba(255,255,255,0.04);
    --bg-navbar: rgba(12,16,24,0.92);
    --bg-footer: rgba(255,255,255,0.02);
    --bg-active-nav: linear-gradient(135deg, rgba(45,212,191,0.12), rgba(167,139,250,0.08));

    /* Borders */
    --border-glow: rgba(45,212,191,0.2);
    --border-dim: rgba(255,255,255,0.06);
    --border-subtle: rgba(255,255,255,0.08);
    --border-input: rgba(255,255,255,0.12);
    --border-hover: rgba(255,255,255,0.14);
    --border-outline-btn: rgba(255,255,255,0.15);

    /* Accent */
    --accent-cyan: #2dd4bf;
    --accent-purple: #a78bfa;
    --gradient-primary: linear-gradient(135deg, #2dd4bf, #a78bfa);
    --accent-cyan-rgb: 45,212,191;
    --accent-purple-rgb: 167,139,250;

    /* Text */
    --text-main: #e6edf3;
    --text-muted: #7d8590;
    --text-heading: #f0f6fc;
    --text-on-accent: #ffffff;
    --text-link: #2dd4bf;
    --text-white: #ffffff;
    --text-placeholder: #4a5568;
    --text-section: #4a5568;

    /* Status colors */
    --color-success: #34d399;
    --color-success-rgb: 52,211,153;
    --color-danger: #f87171;
    --color-danger-rgb: 248,113,113;
    --color-warning: #fbbf24;
    --color-warning-rgb: 251,191,36;
    --color-info: #38bdf8;
    --color-info-rgb: 56,189,248;
    --color-pink: #f472b6;
    --color-pink-rgb: 244,114,182;

    /* Shadows */
    --shadow-card: 0 2px 8px rgba(0,0,0,0.3);
    --shadow-sidebar: 1px 0 6px rgba(0,0,0,0.4);
    --shadow-glow: 0 0 15px rgba(45,212,191,0.1);
    --shadow-btn-hover: 0 8px 25px rgba(45,212,191,0.25);
    --shadow-nav-hover: 0 6px 20px rgba(45,212,191,0.3);

    /* Scrollbar */
    --scrollbar-track: rgba(255,255,255,0.03);
    --scrollbar-thumb: rgba(45,212,191,0.18);
    --scrollbar-thumb-hover: rgba(45,212,191,0.35);

    /* Layout */
    --sidebar-w: 260px;
    --sidebar-w-admin: 250px;

    /* Special */
    --btn-close-filter: invert(1) grayscale(100%) brightness(200%);
    --accordion-arrow-filter: invert(1) brightness(0.7);
    --checkbox-bg: rgba(255,255,255,0.1);
    --checkbox-border: rgba(255,255,255,0.2);
    --progress-bg: rgba(255,255,255,0.06);

    /* Auth pages */
    --bg-auth-card: rgba(22,27,34,0.85);
    --bg-auth-social: rgba(255,255,255,0.92);
    --text-auth-social: #1a202c;
    --shadow-auth-social-hover: 0 4px 20px rgba(255,255,255,0.15);
}


/* ===== LIGHT THEME ===== */
[data-theme="light"] {
    /* Backgrounds */
    --bg-body: #f8fafc;
    --bg-sidebar: #ffffff;
    --bg-card: #ffffff;
    --bg-card-hover: #f1f5f9;
    --bg-input: #ffffff;
    --bg-input-focus: #ffffff;
    --bg-overlay: rgba(248,250,252,0.92);
    --bg-dropdown: #ffffff;
    --bg-table-head: #f1f5f9;
    --bg-code: rgba(0,0,0,0.04);
    --bg-hover: rgba(0,0,0,0.03);
    --bg-navbar: rgba(255,255,255,0.95);
    --bg-footer: rgba(0,0,0,0.02);
    --bg-active-nav: linear-gradient(135deg, rgba(8,145,178,0.1), rgba(124,58,237,0.06));

    /* Borders */
    --border-glow: rgba(8,145,178,0.25);
    --border-dim: #e2e8f0;
    --border-subtle: #e2e8f0;
    --border-input: #cbd5e1;
    --border-hover: #cbd5e1;
    --border-outline-btn: #cbd5e1;

    /* Accent */
    --accent-cyan: #0891b2;
    --accent-purple: #7c3aed;
    --gradient-primary: linear-gradient(135deg, #0891b2, #7c3aed);
    --accent-cyan-rgb: 8,145,178;
    --accent-purple-rgb: 124,58,237;

    /* Text */
    --text-main: #1e293b;
    --text-muted: #64748b;
    --text-heading: #0f172a;
    --text-on-accent: #ffffff;
    --text-link: #0891b2;
    --text-white: #ffffff;
    --text-placeholder: #94a3b8;
    --text-section: #94a3b8;

    /* Status colors */
    --color-success: #059669;
    --color-success-rgb: 5,150,105;
    --color-danger: #dc2626;
    --color-danger-rgb: 220,38,38;
    --color-warning: #d97706;
    --color-warning-rgb: 217,119,6;
    --color-info: #0284c7;
    --color-info-rgb: 2,132,199;
    --color-pink: #db2777;
    --color-pink-rgb: 219,39,119;

    /* Shadows */
    --shadow-card: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-sidebar: 1px 0 3px rgba(0,0,0,0.06);
    --shadow-glow: 0 0 10px rgba(8,145,178,0.08);
    --shadow-btn-hover: 0 6px 20px rgba(8,145,178,0.2);
    --shadow-nav-hover: 0 4px 12px rgba(8,145,178,0.15);

    /* Scrollbar */
    --scrollbar-track: rgba(0,0,0,0.03);
    --scrollbar-thumb: rgba(0,0,0,0.12);
    --scrollbar-thumb-hover: rgba(0,0,0,0.22);

    /* Special */
    --btn-close-filter: none;
    --accordion-arrow-filter: none;
    --checkbox-bg: #ffffff;
    --checkbox-border: #cbd5e1;
    --progress-bg: #e2e8f0;

    /* Auth pages */
    --bg-auth-card: rgba(255,255,255,0.95);
    --bg-auth-social: #f1f5f9;
    --text-auth-social: #1e293b;
    --shadow-auth-social-hover: 0 4px 20px rgba(0,0,0,0.1);
}