﻿/* ============================================
   Ausweblabs Scheme Manager — Dashboard Themes
   8 themes via body class switching
   ============================================ */

/* --- Page load animations --- */
@keyframes fadeInUp { from { opacity:0; transform:translateY(24px) scale(.98); } to { opacity:1; transform:none; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes slideInLeft { from { opacity:0; transform:translateX(-24px); } to { opacity:1; transform:translateX(0); } }

.sidebar nav a { transition: background .15s, color .15s, padding-left .15s; }
.sidebar nav a:hover { padding-left: 4px; }
.content { animation: fadeInUp .45s ease forwards; }

/* --- Base theme variables --- */
body.theme-emerald, body.theme-navy, body.theme-sunset, body.theme-midnight,
body.theme-forest, body.theme-rose, body.theme-graph, body.theme-teal {
  --sidebar-header-bg: var(--primary-dark);
  --sidebar-header-text: #fff;
}

/* --- Emerald / Green (default) --- */
body.theme-emerald { --primary: #10b981; --primary-dark: #059669; --primary-soft: #ecfdf5; --bg: #f5f7f6; }
body.theme-emerald .sidebar { background: #ecfdf5; }
body.theme-emerald .sidebar .side-label { color: #047857; }
body.theme-emerald .sidebar nav a:hover { background: rgba(16,185,129,.12); color: #047857; }
body.theme-emerald .sidebar nav a.active { background: #10b981; color: #fff; }

/* --- Navy / Blue --- */
body.theme-navy { --primary: #3b82f6; --primary-dark: #1d4ed8; --primary-soft: #eff6ff; --bg: #f5f7f6; }
body.theme-navy .sidebar { background: #eff6ff; }
body.theme-navy .sidebar .side-label { color: #1e40af; }
body.theme-navy .sidebar nav a:hover { background: rgba(59,130,246,.12); color: #1d4ed8; }
body.theme-navy .sidebar nav a.active { background: #3b82f6; color: #fff; }

/* --- Sunset / Orange --- */
body.theme-sunset { --primary: #f97316; --primary-dark: #c2410c; --primary-soft: #fff7ed; --bg: #fff7ed; }
body.theme-sunset .sidebar { background: #fff7ed; }
body.theme-sunset .sidebar .side-label { color: #c2410c; }
body.theme-sunset .sidebar nav a:hover { background: rgba(249,115,22,.12); color: #c2410c; }
body.theme-sunset .sidebar nav a.active { background: #f97316; color: #fff; }

/* --- Midnight / Dark --- */
body.theme-midnight { --primary: #6366f1; --primary-dark: #4f46e5; --primary-soft: #1e1b4b; --bg: #0f0d1a; --text: #e2e8f0; --border: #312e81; color:#e2e8f0; }
body.theme-midnight .sidebar { background: #1a1a2e; color: #cbd5e1; }
body.theme-midnight .sidebar .side-label { color: #818cf8; }
body.theme-midnight .sidebar nav a { color: #94a3b8; }
body.theme-midnight .sidebar nav a:hover { background: #312e81; color: #e0e7ff; }
body.theme-midnight .sidebar nav a.active { background: #6366f1; color: #fff; }
body.theme-midnight .topbar { background: rgba(15,13,26,.95); border-bottom-color: #312e81; }
body.theme-midnight .card { background: #1e1b4b; border-color: #312e81; color:#e2e8f0; }
body.theme-midnight .stat { background: #1e1b4b; border-color: #312e81; }
body.theme-midnight table.data td { border-color:#312e81; }
body.theme-midnight table.data th { color:#94a3b8; }
body.theme-midnight .topbar .brand span { color:#e2e8f0; }

/* --- Forest / Dark Green --- */
body.theme-forest { --primary: #16a34a; --primary-dark: #15803d; --primary-soft: #f0fdf4; --bg: #f5f7f6; }
body.theme-forest .sidebar { background: #f0fdf4; }
body.theme-forest .sidebar .side-label { color: #15803d; }
body.theme-forest .sidebar nav a:hover { background: rgba(22,163,74,.12); color: #15803d; }
body.theme-forest .sidebar nav a.active { background: #16a34a; color: #fff; }

/* --- Rose / Pink --- */
body.theme-rose { --primary: #e11d48; --primary-dark: #be123c; --primary-soft: #fff1f2; --bg: #fcfcfc; }
body.theme-rose .sidebar { background: #fff1f2; }
body.theme-rose .sidebar .side-label { color: #be123c; }
body.theme-rose .sidebar nav a:hover { background: rgba(225,29,72,.12); color: #be123c; }
body.theme-rose .sidebar nav a.active { background: #e11d48; color: #fff; }

/* --- Graph / Purple --- */
body.theme-graph { --primary: #6F61C0; --primary-dark: #5a4fad; --primary-soft: #f3f0ff; --bg: #f5f7f6; }
body.theme-graph .sidebar { background: #f3f0ff; }
body.theme-graph .sidebar .side-label { color: #5a4fad; }
body.theme-graph .sidebar nav a:hover { background: rgba(111,97,192,.12); color: #5a4fad; }
body.theme-graph .sidebar nav a.active { background: #6F61C0; color: #fff; }

/* --- Teal / Mint --- */
body.theme-teal { --primary: #14b8a6; --primary-dark: #0d9488; --primary-soft: #f0fdfa; --bg: #f5f7f6; }
body.theme-teal .sidebar { background: #f0fdfa; }
body.theme-teal .sidebar .side-label { color: #0d9488; }
body.theme-teal .sidebar nav a:hover { background: rgba(20,184,166,.12); color: #0d9488; }
body.theme-teal .sidebar nav a.active { background: #14b8a6; color: #fff; }

/* Theme dropdown — color swatches */
.theme-dropdown {
  display:none; position:absolute; top:calc(100% + 8px); right:0;
  background:var(--surface); border:1px solid var(--border);
  border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,.12);
  min-width:160px; padding:4px 0; z-index:1000;
  animation: fadeIn .2s ease;
}
.theme-dropdown.open { display:block; }
.theme-option {
  display:flex; align-items:center; gap:10px; padding:8px 14px;
  cursor:pointer; transition:.15s; font-size:13px; color:var(--text);
}
.theme-option:hover { background:var(--primary-soft); padding-left:18px; }
.theme-option.active { background:var(--primary-soft); color:var(--primary-dark); font-weight:600; }
.theme-option.active::after { content:'\2713'; margin-left:auto; color:var(--primary); font-weight:700; }
.theme-color {
  width:20px; height:20px; border-radius:50%; border:2px solid var(--border);
  flex-shrink:0; transition:.15s;
}
.theme-option:hover .theme-color { border-color:var(--primary); transform:scale(1.15); }
