/* 3 thèmes dashboard — structure & ambiance (data-dashboard-theme) */

html[data-dashboard-theme] {
    --dash-font: 'Inter', system-ui, sans-serif;
    --dash-mono: 'JetBrains Mono', monospace;
    --dash-radius: 8px;
    --dash-sidebar-width: 260px;
}

/* —— Thème Classique —— */
html[data-dashboard-theme="classic"] {
    --primary: #2563eb;
    --accent: #06b6d4;
    --bg-surface: #07070a;
    --dash-font: 'Inter', sans-serif;
    --dash-radius: 6px;
}

html[data-dashboard-theme="classic"] body {
    background-color: #000;
}

/* —— Thème Moderne —— */
html[data-dashboard-theme="modern"] {
    --primary: #6366f1;
    --accent: #a78bfa;
    --bg-surface: #0f0f18;
    --bg-surface-hover: #161622;
    --dash-font: 'Inter', system-ui, sans-serif;
    --dash-radius: 16px;
    --dash-sidebar-width: 280px;
}

html[data-dashboard-theme="modern"] body {
    background:
        radial-gradient(ellipse 80% 50% at 20% -10%, rgba(99, 102, 241, 0.18), transparent 55%),
        radial-gradient(ellipse 60% 40% at 90% 10%, rgba(167, 139, 250, 0.12), transparent 50%),
        #08080f;
}

html[data-dashboard-theme="modern"] .app-sidebar {
    background: rgba(15, 15, 24, 0.75);
    backdrop-filter: blur(20px);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}

html[data-dashboard-theme="modern"] .glass-panel,
html[data-dashboard-theme="modern"] .glass-card,
html[data-dashboard-theme="modern"] .bot-card-premium {
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

html[data-dashboard-theme="modern"] .btn-primary {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(99, 102, 241, 0.25);
}

/* —— Thème Discord (défaut) —— */
html[data-dashboard-theme="discord"],
html:not([data-dashboard-theme]) {
    --primary: #5865f2;
    --accent: #5865f2;
    --bg-base: #313338;
    --bg-surface: #2b2d31;
    --bg-surface-hover: #35373c;
    --bg-surface-active: #404249;
    --text-primary: #f2f3f5;
    --text-secondary: #b5bac1;
    --text-tertiary: #80848e;
    --border-subtle: #1e1f22;
    --border-medium: #1e1f22;
    --dash-font: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --dash-radius: 8px;
    --dash-sidebar-width: 240px;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 8px;
}

html[data-dashboard-theme="discord"] body,
html:not([data-dashboard-theme]) body {
    background-color: #313338;
}

html[data-dashboard-theme="discord"] .app-sidebar,
html:not([data-dashboard-theme]) .app-sidebar {
    background: #2b2d31;
    border-right: none;
}

html[data-dashboard-theme="discord"] .app-main,
html[data-dashboard-theme="discord"] .main-content {
    background: #313338;
}

html[data-dashboard-theme="discord"] .glass-panel,
html[data-dashboard-theme="discord"] .glass-card,
html[data-dashboard-theme="discord"] .bot-card-premium,
html[data-dashboard-theme="discord"] .pricing-card {
    background: #2b2d31;
    border: none;
    border-radius: 8px;
    box-shadow: none;
}

html[data-dashboard-theme="discord"] .nav-item {
    border-radius: 4px;
    margin: 2px 8px;
}

html[data-dashboard-theme="discord"] .nav-item:hover,
html[data-dashboard-theme="discord"] .nav-item.active {
    background: #404249;
}

html[data-dashboard-theme="discord"] .btn-primary {
    background: #5865f2;
    border-radius: 4px;
    font-weight: 500;
}

html[data-dashboard-theme="discord"] .btn-primary:hover {
    background: #4752c4;
}

html[data-dashboard-theme="discord"] .btn-secondary {
    background: #4e5058;
    border: none;
    color: #fff;
}

html[data-dashboard-theme="discord"] .sidebar-brand,
html[data-dashboard-theme="discord"] .section-title {
    color: #f2f3f5;
}

body.dashboard-app,
body:has(.app-sidebar) {
    font-family: var(--dash-font);
}

.app-sidebar {
    width: var(--dash-sidebar-width);
}

.glass-card,
.pricing-card,
.bot-card-premium,
.glass-panel {
    border-radius: var(--dash-radius);
}