/* ════════════════════════════════════════════════════════
   JidBizoPro.Web — app.css
   6 themes via CSS custom properties on [data-theme]
   ════════════════════════════════════════════════════════ */

/* ── Default: Midnight Pro ─────────────────────────────── */
:root, [data-theme="midnight"] {
  --bg-primary:    #0f0f1a; --bg-secondary: #1a1a2e; --bg-tertiary: #242442;
  --bg-card:       #1e1e35; --bg-hover:     #2a2a48;
  --border-color:  #3a3a60; --border-subtle:#2e2e52;
  --text-primary:  #f0f0ff; --text-secondary:#b8b8e0; --text-muted:  #7070a0;
  --accent:        #7c6fff; --accent-hover: #9088ff;
  --accent-light:  #7c6fff25; --accent-text: #b8b0ff;
  --success:#2ecc71; --success-light:#2ecc7120;
  --warning:#f5a623; --warning-light:#f5a62320;
  --danger: #ff5b5b; --danger-light: #ff5b5b20;
  --info:   #4a9eff; --info-light:   #4a9eff20;
  --sidebar-bg:    #0a0a16; --sidebar-border:#242442;
  --topbar-bg:     #0a0a16;
  --surface:       #1a1a2e; --surface-raised:#242442;
  --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow-md:0 4px 16px rgba(0,0,0,.6);
  --shadow-lg:0 8px 32px rgba(0,0,0,.7);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --font-display:"Inter","DM Serif Display",sans-serif;
  --font-body:"Inter","DM Sans",system-ui,sans-serif;
  --font-mono:"JetBrains Mono","Fira Code",monospace;
  --sidebar-width:240px; --topbar-height:60px;
  --transition:all 0.18s cubic-bezier(0.4,0,0.2,1);
}

/* ── Midnight Blue ─────────────────────────────────── */
[data-theme="midnightblue"] {
  --bg-primary:    #0f0f1a; --bg-secondary: #1a1a2e; --bg-tertiary: #242442;
  --bg-card:       #1e1e35; --bg-hover:     #2a2a48;
  --border-color:  #3a3a60; --border-subtle:#2e2e52;
  --text-primary:  #f0f0ff; --text-secondary:#b8b8e0; --text-muted:  #7070a0;
  --accent:        #4a9eff; --accent-hover: #6db3ff;
  --accent-light:  #4a9eff25; --accent-text: #93c5fd;
  --success:#2ecc71; --success-light:#2ecc7120;
  --warning:#f5a623; --warning-light:#f5a62320;
  --danger: #ff5b5b; --danger-light: #ff5b5b20;
  --info:   #4a9eff; --info-light:   #4a9eff20;
  --sidebar-bg:    #0a0a16; --sidebar-border:#242442;
  --topbar-bg:     #0a0a16;
  --surface:       #1a1a2e; --surface-raised:#242442;
  --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow-md:0 4px 16px rgba(0,0,0,.6);
  --shadow-lg:0 8px 32px rgba(0,0,0,.7);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --font-display:"Inter","DM Serif Display",sans-serif;
  --font-body:"Inter","DM Sans",system-ui,sans-serif;
  --font-mono:"JetBrains Mono","Fira Code",monospace;
  --sidebar-width:240px; --topbar-height:60px;
  --transition:all 0.18s cubic-bezier(0.4,0,0.2,1);
}

/* ── Blue Sky ─────────────────────────────────────────── */
[data-theme="bluesky"] {
  --bg-primary:    #1a6eff; --bg-secondary: #1560e8; --bg-tertiary: #1254cc;
  --bg-card:       #1d72ff; --bg-hover:     #2280ff;
  --border-color:  #4a9eff; --border-subtle:#2d7fff;
  --text-primary:  #ffffff; --text-secondary:#c8e0ff; --text-muted:  #90bbff;
  --accent:        #ffffff; --accent-hover: #e0eeff;
  --accent-light:  rgba(255,255,255,.15); --accent-text: #ffffff;
  --success:#2ecc71; --success-light:rgba(46,204,113,.25);
  --warning:#ffd166; --warning-light:rgba(255,209,102,.25);
  --danger: #ff6b6b; --danger-light: rgba(255,107,107,.25);
  --info:   #4a9eff; --info-light:   rgba(74,158,255,.25);
  --sidebar-bg:    #0f52cc; --sidebar-border:#1a6eff;
  --topbar-bg:     #1560e8;
  --surface:       #1d72ff; --surface-raised:#2280ff;
  --shadow-sm:0 1px 3px rgba(0,0,80,.3);
  --shadow-md:0 4px 16px rgba(0,0,80,.4);
  --shadow-lg:0 8px 32px rgba(0,0,80,.5);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
  --font-display:"Inter","DM Serif Display",sans-serif;
  --font-body:"Inter","DM Sans",system-ui,sans-serif;
  --font-mono:"JetBrains Mono","Fira Code",monospace;
  --sidebar-width:240px; --topbar-height:60px;
  --transition:all 0.18s cubic-bezier(0.4,0,0.2,1);
}

/* Blue Sky sidebar — deeper blue */
[data-theme="bluesky"] .sidebar {
  background: #0f52cc;
  border-color: #1a6eff;
}
[data-theme="bluesky"] .nav-item { color: #c8e0ff; }
[data-theme="bluesky"] .nav-item:hover { background: rgba(255,255,255,.12); color: #ffffff; }
[data-theme="bluesky"] .nav-item.active { background: rgba(255,255,255,.2); color: #ffffff; font-weight: 600; }
[data-theme="bluesky"] .nav-item.active .nav-icon { color: #ffffff; }
[data-theme="bluesky"] .nav-section-label { color: #90bbff; }
[data-theme="bluesky"] .logo-brand { color: #ffffff; }
[data-theme="bluesky"] .logo-sub { color: #90bbff; }
[data-theme="bluesky"] .sidebar-username { color: #ffffff; }
[data-theme="bluesky"] .sidebar-org { color: #90bbff; }
[data-theme="bluesky"] .sidebar-footer { border-color: #1a6eff; }
[data-theme="bluesky"] .nav-group-header { color: #c8e0ff; }
[data-theme="bluesky"] .nav-group-header:hover { background: rgba(255,255,255,.12); color: #ffffff; }
[data-theme="bluesky"] .nav-sub-item { color: #c8e0ff; }
[data-theme="bluesky"] .nav-sub-item:hover { background: rgba(255,255,255,.1); color: #ffffff; }
[data-theme="bluesky"] .nav-sub-item.active { background: rgba(255,255,255,.2); color: #ffffff; border-left-color: #ffffff; }

/* Blue Sky topbar */
[data-theme="bluesky"] .topbar { background: #1560e8; border-color: #2d7fff; }
[data-theme="bluesky"] .topbar-title { color: #ffffff; }

/* Blue Sky cards */
[data-theme="bluesky"] .card,
[data-theme="bluesky"] .metric-card {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.2);
}
[data-theme="bluesky"] .card:hover { border-color: rgba(255,255,255,.4); }
[data-theme="bluesky"] .metric-card:hover { border-color: rgba(255,255,255,.4); }
[data-theme="bluesky"] .metric-value { color: #ffffff; }
[data-theme="bluesky"] .metric-label { color: #c8e0ff; }

/* Blue Sky tables */
[data-theme="bluesky"] thead tr { background: rgba(0,0,0,.2); }
[data-theme="bluesky"] thead th { color: #ffffff; font-weight: 700; letter-spacing:.08em; }
[data-theme="bluesky"] tbody tr { border-bottom: 1px solid rgba(255,255,255,.2); }
[data-theme="bluesky"] tbody tr:hover { background: rgba(255,255,255,.12); }
[data-theme="bluesky"] tbody td { color: #ffffff; font-weight: 500; font-size: .92rem; }
[data-theme="bluesky"] tbody td a { color: #ffffff; text-decoration: underline; text-underline-offset: 2px; }

/* Blue Sky buttons */
[data-theme="bluesky"] .btn-primary { background: #ffffff; color: #1a6eff; }
[data-theme="bluesky"] .btn-primary:hover { background: #e0eeff; }
[data-theme="bluesky"] .btn-secondary { background: rgba(255,255,255,.15); color: #ffffff; border-color: rgba(255,255,255,.3); }
[data-theme="bluesky"] .btn-ghost { color: #c8e0ff; }
[data-theme="bluesky"] .btn-ghost:hover { background: rgba(255,255,255,.12); color: #ffffff; }

/* Blue Sky badges */
[data-theme="bluesky"] .badge-default { background: rgba(255,255,255,.15); color: #ffffff; }
[data-theme="bluesky"] .badge-success { background: rgba(46,204,113,.25); color: #a0ffcc; }
[data-theme="bluesky"] .badge-warning { background: rgba(255,209,102,.25); color: #ffd166; }
[data-theme="bluesky"] .badge-danger  { background: rgba(255,107,107,.25); color: #ffb3b3; }
[data-theme="bluesky"] .badge-info    { background: rgba(255,255,255,.2); color: #ffffff; }

/* Blue Sky forms */
[data-theme="bluesky"] .form-input {
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.3) !important;
  color: #ffffff !important;
}
[data-theme="bluesky"] .form-input::placeholder { color: #90bbff !important; }
[data-theme="bluesky"] .search-bar { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.25); }

/* Blue Sky tabs */
[data-theme="bluesky"] .tabs { background: rgba(0,0,0,.15); }
[data-theme="bluesky"] .tab { color: #c8e0ff; }
[data-theme="bluesky"] .tab.active { background: rgba(255,255,255,.2); color: #ffffff; }

/* Blue Sky dropdown */
[data-theme="bluesky"] .dropdown { background: #1254cc; border-color: #4a9eff; }
[data-theme="bluesky"] .dropdown-item { color: #c8e0ff; }
[data-theme="bluesky"] .dropdown-item:hover { background: rgba(255,255,255,.1); color: #ffffff; }

[data-theme="slate"] {
  --bg-primary:#f8fafc; --bg-secondary:#f1f5f9; --bg-tertiary:#e2e8f0;
  --bg-card:#ffffff; --bg-hover:#f1f5f9;
  --border-color:#e2e8f0; --border-subtle:#f1f5f9;
  --text-primary:#0f172a; --text-secondary:#475569; --text-muted:#94a3b8;
  --accent:#3b82f6; --accent-hover:#2563eb;
  --accent-light:#3b82f614; --accent-text:#1d4ed8;
  --success:#16a34a; --success-light:#16a34a12;
  --warning:#d97706; --warning-light:#d9770612;
  --danger:#dc2626; --danger-light:#dc262612;
  --info:#0891b2; --info-light:#0891b212;
  --sidebar-bg:#0f172a; --sidebar-border:#1e293b; --topbar-bg:#ffffff;
  --surface:#f1f5f9; --surface-raised:#e2e8f0;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow-md:0 4px 16px rgba(0,0,0,.1);
  --shadow-lg:0 8px 32px rgba(0,0,0,.12);
}

[data-theme="forest"] {
  --bg-primary:#111a11; --bg-secondary:#182018; --bg-tertiary:#1e2a1e;
  --bg-card:#1a2a1a; --bg-hover:#223222;
  --border-color:#2a3d2a; --border-subtle:#1e2e1e;
  --text-primary:#e4f0e4; --text-secondary:#88a888; --text-muted:#4a644a;
  --accent:#4ade80; --accent-hover:#22c55e;
  --accent-light:#4ade8020; --accent-text:#86efac;
  --success:#4ade80; --success-light:#4ade8018;
  --warning:#facc15; --warning-light:#facc1518;
  --danger:#f87171; --danger-light:#f8717118;
  --info:#60a5fa; --info-light:#60a5fa18;
  --sidebar-bg:#0d150d; --sidebar-border:#1a2a1a; --topbar-bg:#0d150d;
  --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow-md:0 4px 16px rgba(0,0,0,.6);
  --shadow-lg:0 8px 32px rgba(0,0,0,.7);
}

[data-theme="ember"] {
  --bg-primary:#120c04; --bg-secondary:#1c1208; --bg-tertiary:#261a0c;
  --bg-card:#1e1408; --bg-hover:#2c1e0e;
  --border-color:#3a2410; --border-subtle:#281a0a;
  --text-primary:#fdf0e0; --text-secondary:#c4925a; --text-muted:#6a4a28;
  --accent:#f97316; --accent-hover:#ea6c0a;
  --accent-light:#f9731620; --accent-text:#fdba74;
  --success:#65a30d; --success-light:#65a30d18;
  --warning:#eab308; --warning-light:#eab30818;
  --danger:#dc2626; --danger-light:#dc262618;
  --info:#0ea5e9; --info-light:#0ea5e918;
  --sidebar-bg:#0c0804; --sidebar-border:#1e1408; --topbar-bg:#0c0804;
  --shadow-sm:0 1px 3px rgba(0,0,0,.5);
  --shadow-md:0 4px 16px rgba(249,115,22,.15);
  --shadow-lg:0 8px 32px rgba(0,0,0,.7);
}

[data-theme="arctic"] {
  --bg-primary:#f0f8ff; --bg-secondary:#e8f4fd; --bg-tertiary:#d6ecfb;
  --bg-card:#ffffff; --bg-hover:#e8f4fd;
  --border-color:#bde0f9; --border-subtle:#d6ecfb;
  --text-primary:#0a192f; --text-secondary:#2d6a9f; --text-muted:#7db8d8;
  --accent:#0284c7; --accent-hover:#0369a1;
  --accent-light:#0284c714; --accent-text:#0369a1;
  --success:#059669; --success-light:#05966912;
  --warning:#b45309; --warning-light:#b4530912;
  --danger:#b91c1c; --danger-light:#b91c1c12;
  --info:#0284c7; --info-light:#0284c712;
  --sidebar-bg:#0a192f; --sidebar-border:#112240; --topbar-bg:#ffffff;
  --shadow-sm:0 1px 3px rgba(2,132,199,.1);
  --shadow-md:0 4px 16px rgba(2,132,199,.12);
  --shadow-lg:0 8px 32px rgba(2,132,199,.15);
  --radius-sm:6px; --radius-md:12px; --radius-lg:20px;
}

[data-theme="graphite"] {
  --bg-primary:#111; --bg-secondary:#1a1a1a; --bg-tertiary:#222;
  --bg-card:#1c1c1c; --bg-hover:#262626;
  --border-color:#2e2e2e; --border-subtle:#222;
  --text-primary:#e8e8e8; --text-secondary:#888; --text-muted:#444;
  --accent:#e8e8e8; --accent-hover:#fff;
  --accent-light:#e8e8e814; --accent-text:#ccc;
  --success:#22c55e; --success-light:#22c55e18;
  --warning:#eab308; --warning-light:#eab30818;
  --danger:#ef4444; --danger-light:#ef444418;
  --info:#60a5fa; --info-light:#60a5fa18;
  --sidebar-bg:#0a0a0a; --sidebar-border:#1c1c1c; --topbar-bg:#0a0a0a;
  --shadow-sm:0 1px 3px rgba(0,0,0,.6);
  --shadow-md:0 4px 16px rgba(0,0,0,.7);
  --shadow-lg:0 8px 32px rgba(0,0,0,.8);
  --radius-sm:2px; --radius-md:4px; --radius-lg:8px;
}

/* ── Slate Glass ────────────────────────────────────────── */
[data-theme="glass"] {
  --bg-primary:    #0f172a;
  --bg-secondary:  rgba(15,23,42,.85);
  --bg-tertiary:   rgba(30,41,59,.7);
  --bg-card:       rgba(30,41,59,.6);
  --bg-hover:      rgba(51,65,85,.5);
  --border-color:  rgba(148,163,184,.12);
  --border-subtle: rgba(148,163,184,.07);
  --text-primary:  #f1f5f9;
  --text-secondary:#94a3b8;
  --text-muted:    #475569;
  --accent:        #38bdf8;
  --accent-hover:  #7dd3fc;
  --accent-light:  rgba(56,189,248,.12);
  --accent-text:   #7dd3fc;
  --success:#34d399; --success-light:rgba(52,211,153,.12);
  --warning:#fbbf24; --warning-light:rgba(251,191,36,.12);
  --danger: #f87171; --danger-light: rgba(248,113,113,.12);
  --info:   #38bdf8; --info-light:   rgba(56,189,248,.12);
  --sidebar-bg:    rgba(7,14,26,.92);
  --sidebar-border:rgba(148,163,184,.1);
  --topbar-bg:     rgba(15,23,42,.8);
  --surface:       rgba(30,41,59,.6);
  --surface-raised:rgba(51,65,85,.5);
  --shadow-sm:0 1px 3px rgba(0,0,0,.4);
  --shadow-md:0 4px 24px rgba(0,0,0,.5);
  --shadow-lg:0 8px 40px rgba(0,0,0,.6);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
}

/* Glassmorphism card effect for Slate Glass theme */
[data-theme="glass"] .card,
[data-theme="glass"] .metric-card,
[data-theme="glass"] .sidebar,
[data-theme="glass"] .topbar,
[data-theme="glass"] .dropdown {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

[data-theme="glass"] .sidebar {
  background: rgba(7,14,26,.9);
  border-right: 1px solid rgba(148,163,184,.1);
}

[data-theme="glass"] .topbar {
  background: rgba(15,23,42,.75);
  border-bottom: 1px solid rgba(148,163,184,.1);
}

[data-theme="glass"] .card {
  background: rgba(30,41,59,.55);
  border: 1px solid rgba(148,163,184,.1);
}

[data-theme="glass"] .metric-card {
  background: rgba(30,41,59,.55);
  border: 1px solid rgba(148,163,184,.1);
}

[data-theme="glass"] .nav-item.active {
  background: rgba(56,189,248,.12);
  border: 1px solid rgba(56,189,248,.2);
}

[data-theme="glass"] .logo-mark {
  filter: drop-shadow(0 0 10px rgba(56,189,248,.6));
}

/* ── Ocean Deep ─────────────────────────────────────────── */
[data-theme="ocean"] {
  --bg-primary:    #071323;
  --bg-secondary:  #0d1f3c;
  --bg-tertiary:   #102449;
  --bg-card:       #0d1f3c;
  --bg-hover:      #132c55;
  --border-color:  #1a3a6e;
  --border-subtle: #0f2040;
  --text-primary:  #e0f0ff;
  --text-secondary:#7eb8e8;
  --text-muted:    #3a6a9a;
  --accent:        #3b82f6;
  --accent-hover:  #60a5fa;
  --accent-light:  rgba(59,130,246,.15);
  --accent-text:   #93c5fd;
  --success:#34d399; --success-light:rgba(52,211,153,.12);
  --warning:#fbbf24; --warning-light:rgba(251,191,36,.12);
  --danger: #f87171; --danger-light: rgba(248,113,113,.12);
  --info:   #38bdf8; --info-light:   rgba(56,189,248,.12);
  --sidebar-bg:    #040e1c;
  --sidebar-border:#0d1f3c;
  --topbar-bg:     #040e1c;
  --surface:       #0d1f3c;
  --surface-raised:#102449;
  --shadow-sm:0 1px 4px rgba(0,0,0,.5);
  --shadow-md:0 4px 20px rgba(0,8,30,.6);
  --shadow-lg:0 8px 40px rgba(0,8,30,.7);
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px;
}

[data-theme="ocean"] .logo-mark {
  filter: drop-shadow(0 0 10px rgba(59,130,246,.7));
}

[data-theme="ocean"] .nav-item.active {
  background: rgba(59,130,246,.15);
  border-left: 2px solid var(--accent);
}

/* ── Reset ─────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.6}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:var(--bg-primary)}
::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;line-height:1.2}
h1{font-size:1.9rem}h2{font-size:1.5rem}h3{font-size:1.2rem}
p{color:var(--text-secondary)}
a{color:var(--accent-text);text-decoration:none}
a:hover{color:var(--accent-hover)}

/* ── Layout ────────────────────────────────────────────── */
.app-layout{display:flex;min-height:100vh}
.main-content{flex:1;margin-left:var(--sidebar-width);padding-top:var(--topbar-height);min-height:100vh;background:var(--bg-primary)}
.page-content{padding:28px 32px;max-width:1400px}
@media(max-width:768px){.main-content{margin-left:0}.page-content{padding:16px}}

/* ── Sidebar ───────────────────────────────────────────── */
.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);display:flex;flex-direction:column;z-index:100;overflow:hidden;transition:transform .25s cubic-bezier(.4,0,.2,1)}
.sidebar-logo{display:flex;align-items:center;gap:12px;padding:20px 20px 16px;border-bottom:1px solid var(--sidebar-border);flex-shrink:0}
.logo-mark{font-size:1.6rem;color:var(--accent);line-height:1;filter:drop-shadow(0 0 8px var(--accent))}
.logo-text{display:flex;flex-direction:column}
.logo-brand{font-family:var(--font-display);font-size:1.05rem;color:var(--text-primary);line-height:1.2;letter-spacing:-.02em}
.logo-sub{font-size:.68rem;color:var(--text-muted);letter-spacing:.04em}
.sidebar-nav{flex:1;overflow-y:auto;padding:12px 10px}
.nav-section-label{font-size:.65rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.12em;padding:6px 10px 4px}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-md);color:var(--text-secondary);font-size:.92rem;font-weight:400;transition:var(--transition);text-decoration:none;margin-bottom:2px}
.nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}
.nav-item.active{background:var(--accent-light);color:var(--accent-text);font-weight:500}
.nav-icon{font-size:1rem;width:20px;text-align:center;flex-shrink:0;opacity:.7}
.nav-item.active .nav-icon{opacity:1;color:var(--accent)}
.sidebar-footer{display:flex;align-items:center;gap:10px;padding:14px 16px;border-top:1px solid var(--sidebar-border);flex-shrink:0}
.sidebar-user{display:flex;flex-direction:column;overflow:hidden}
.sidebar-username{font-size:.85rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-org{font-size:.72rem;color:var(--text-muted)}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(2px);z-index:99}
@media(max-width:768px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay{display:block}
  .sidebar-overlay.hidden{display:none}
}

/* ── Topbar ────────────────────────────────────────────── */
.topbar{position:fixed;top:0;left:var(--sidebar-width);right:0;height:var(--topbar-height);background:var(--topbar-bg);border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 24px;z-index:80;transition:left .25s}
.topbar-left{display:flex;align-items:center;gap:14px}
.topbar-right{display:flex;align-items:center;gap:6px}
.topbar-title{font-size:.95rem;font-weight:500;color:var(--text-primary);font-family:var(--font-display)}
.topbar-dropdown-wrap{position:relative}
.topbar-user-btn{display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;padding:6px 10px;border-radius:var(--radius-md);transition:var(--transition)}
.topbar-user-btn:hover{background:var(--bg-hover)}
.topbar-username{font-size:.85rem;font-weight:500;color:var(--text-primary)}
@media(max-width:768px){.topbar{left:0;padding:0 16px}.topbar-username{display:none}}

/* ── Dropdown ──────────────────────────────────────────── */
.dropdown{position:absolute;top:calc(100% + 8px);right:0;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:200;min-width:160px;overflow:hidden}
.dropdown-header{padding:12px 16px 8px;font-size:.78rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border-subtle)}
.dropdown-item{display:block;width:100%;text-align:left;padding:10px 16px;font-size:.88rem;color:var(--text-secondary);background:none;border:none;cursor:pointer;transition:var(--transition);text-decoration:none;font-family:var(--font-body)}
.dropdown-item:hover{background:var(--bg-hover);color:var(--text-primary)}
.dropdown-item.danger:hover{background:var(--danger-light);color:var(--danger)}
.dropdown-divider{height:1px;background:var(--border-subtle);margin:4px 0}

/* ── Theme picker ──────────────────────────────────────── */
.theme-swatch{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--radius-sm);border:1px solid transparent;background:none;cursor:pointer;transition:var(--transition);width:100%;text-align:left;font-family:var(--font-body)}
.theme-swatch:hover{background:var(--bg-hover)}
.theme-swatch.active{border-color:var(--accent);background:var(--accent-light)}
.swatch-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;border:1px solid rgba(255,255,255,.2)}
.swatch-name{flex:1;font-size:.85rem;color:var(--text-primary)}
.swatch-desc{font-size:.72rem;color:var(--text-muted)}
.swatch-check{font-size:.75rem;color:var(--accent);font-weight:700}
.notif-dot{position:absolute;top:4px;right:4px;width:7px;height:7px;background:var(--danger);border-radius:50%;border:2px solid var(--topbar-bg)}

/* ── Buttons ───────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:.9rem;font-weight:500;cursor:pointer;border:none;transition:var(--transition);text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color)}
.btn-secondary:hover{background:var(--bg-hover);border-color:var(--accent)}
.btn-ghost{background:transparent;color:var(--text-secondary);border:1px solid transparent}
.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}
.btn-danger{background:var(--danger);color:#fff}
.btn-sm{padding:5px 12px;font-size:.82rem;border-radius:var(--radius-sm)}
.btn-lg{padding:12px 28px;font-size:1rem}
.btn-icon{padding:8px;border-radius:var(--radius-md)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}
.w-full{width:100%}

/* ── Cards ─────────────────────────────────────────────── */
.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px 24px;transition:var(--transition)}
.card:hover{border-color:color-mix(in srgb,var(--accent) 30%,var(--border-color))}
.card-sm{padding:14px 18px;border-radius:var(--radius-md)}

/* ── Forms ─────────────────────────────────────────────── */
.form-group{display:flex;flex-direction:column;gap:6px}
.form-label{font-size:.82rem;font-weight:500;color:var(--text-secondary);letter-spacing:.03em;text-transform:uppercase}
.form-input{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:9px 14px;color:var(--text-primary);font-family:var(--font-body);font-size:.9rem;transition:var(--transition);width:100%}
.form-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.form-input::placeholder{color:var(--text-muted)}

/* ── Tables ────────────────────────────────────────────── */
.table-wrapper{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--border-color)}
table{width:100%;border-collapse:collapse}
thead tr{background:var(--bg-tertiary)}
thead th{padding:13px 18px;text-align:left;font-size:.8rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
body tr{border-top:1px solid var(--border-subtle);transition:var(--transition)}
tbody tr:hover{background:var(--bg-hover)}
tbody td{padding:14px 18px;font-size:.92rem;color:var(--text-primary)}

/* ── Badges ────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:.75rem;font-weight:500}
.badge-success{background:var(--success-light);color:var(--success)}
.badge-warning{background:var(--warning-light);color:var(--warning)}
.badge-danger{background:var(--danger-light);color:var(--danger)}
.badge-info{background:var(--info-light);color:var(--info)}
.badge-default{background:var(--bg-tertiary);color:var(--text-secondary)}
.badge-accent{background:var(--accent-light);color:var(--accent-text)}

/* ── Metric cards ──────────────────────────────────────── */
.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}
.metric-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px 24px;transition:var(--transition);cursor:default}
.metric-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.metric-label{font-size:.78rem;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.metric-value{font-size:1.8rem;font-weight:600;color:var(--text-primary);line-height:1;font-family:var(--font-mono)}
.metric-change{font-size:.78rem;font-family:var(--font-mono);font-weight:500;display:flex;align-items:center;gap:3px}
.metric-change.up{color:var(--success)}.metric-change.down{color:var(--danger)}

/* ── Page headers ──────────────────────────────────────── */
.page-header{margin-bottom:28px}
.page-header h1{font-size:1.8rem;margin-bottom:4px}
.page-header p{font-size:.9rem;color:var(--text-muted)}
.page-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;flex-wrap:wrap;gap:12px}

/* ── Tabs ──────────────────────────────────────────────── */
.tabs{display:flex;gap:2px;background:var(--bg-secondary);border-radius:var(--radius-md);padding:4px;margin-bottom:24px;width:fit-content}
.tab{padding:7px 16px;border-radius:var(--radius-sm);font-size:.88rem;font-weight:500;cursor:pointer;color:var(--text-secondary);transition:var(--transition);border:none;background:transparent;text-decoration:none;font-family:var(--font-body)}
.tab.active{background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm)}
.tab:hover:not(.active){color:var(--text-primary)}

/* ── Search ────────────────────────────────────────────── */
.search-bar{display:flex;align-items:center;gap:10px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:8px 14px}
.search-bar input{background:none;border:none;outline:none;color:var(--text-primary);font-family:var(--font-body);font-size:.9rem;width:100%}
.search-bar input::placeholder{color:var(--text-muted)}

/* ── Grids ─────────────────────────────────────────────── */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:1024px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

/* ── Avatar ────────────────────────────────────────────── */
.avatar{width:36px;height:36px;border-radius:50%;background:var(--accent-light);border:1px solid var(--accent);display:flex;align-items:center;justify-content:center;font-size:.82rem;font-weight:600;color:var(--accent-text);flex-shrink:0}
.avatar-sm{width:28px;height:28px;font-size:.72rem}
.avatar-lg{width:48px;height:48px;font-size:1rem}

/* ── Alerts ────────────────────────────────────────────── */
.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;border-radius:var(--radius-md);font-size:.88rem;margin-bottom:16px;border:1px solid}
.alert-success{background:var(--success-light);border-color:var(--success);color:var(--success)}
.alert-warning{background:var(--warning-light);border-color:var(--warning);color:var(--warning)}
.alert-danger{background:var(--danger-light);border-color:var(--danger);color:var(--danger)}
.alert-info{background:var(--info-light);border-color:var(--info);color:var(--info)}

/* ── Spinner ───────────────────────────────────────────── */
.spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}
.spinner-lg{width:36px;height:36px;border-width:3px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-overlay{display:flex;align-items:center;justify-content:center;min-height:200px}

/* ── Empty state ───────────────────────────────────────── */
.empty-state{text-align:center;padding:60px 24px;color:var(--text-muted)}
.empty-state-icon{font-size:3rem;margin-bottom:16px;opacity:.4}
.empty-state h3{font-size:1.1rem;margin-bottom:8px;color:var(--text-secondary);font-family:var(--font-body);font-weight:500}
.empty-state p{font-size:.88rem;margin-bottom:20px}

/* ── Animations ────────────────────────────────────────── */
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.animate-in{animation:fadeIn .3s ease forwards}
.animate-scale{animation:scaleIn .2s ease forwards}

/* ── Task rows ─────────────────────────────────────────── */
.task-row-item,.task-list-row{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--border-subtle);transition:var(--transition);cursor:pointer}
.task-row-item:hover,.task-list-row:hover{background:var(--bg-hover)}
.task-name-text{font-size:.92rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.task-name-text.line-through{text-decoration:line-through;color:var(--text-muted)}
.completed-task .task-name-text{color:var(--text-muted);text-decoration:line-through}
.priority-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.priority-dot.high{background:var(--danger);box-shadow:0 0 5px var(--danger)}
.priority-dot.medium{background:var(--warning)}
.priority-dot.low{background:var(--text-muted)}
.task-check{width:20px;height:20px;border:2px solid var(--border-color);border-radius:4px;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:var(--transition);font-size:.7rem;color:#fff}
.task-check.checked{background:var(--success);border-color:var(--success)}
.task-check:hover{border-color:var(--accent)}

/* ── Kanban ────────────────────────────────────────────── */
.kanban-board{display:flex;gap:14px;overflow-x:auto;padding-bottom:20px;min-height:500px}
.kanban-col{flex:0 0 240px;display:flex;flex-direction:column;gap:8px}
.kanban-col-header{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border-color)}
.kanban-stage-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.kanban-stage-label{flex:1;font-size:.82rem;font-weight:500;color:var(--text-primary)}
.kanban-count{font-size:.75rem;color:var(--text-muted);background:var(--bg-tertiary);padding:1px 7px;border-radius:10px;font-family:var(--font-mono)}
.kanban-cards{display:flex;flex-direction:column;gap:8px;flex:1}
.lead-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:12px;cursor:pointer;transition:var(--transition)}
.lead-card:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.lead-card-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.lead-card-info{display:flex;flex-direction:column;overflow:hidden}
.lead-name{font-size:.85rem;font-weight:500;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lead-company{font-size:.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lead-value{font-size:.95rem;font-family:var(--font-mono);font-weight:600;color:var(--success);margin-bottom:8px}
.lead-card-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border-subtle);padding-top:8px;margin-top:4px}
.lead-email{font-size:.72rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.kanban-add-btn{width:100%;padding:8px;background:none;border:1px dashed var(--border-color);border-radius:var(--radius-md);color:var(--text-muted);font-size:.82rem;cursor:pointer;transition:var(--transition);font-family:var(--font-body)}
.kanban-add-btn:hover{border-color:var(--accent);color:var(--accent-text);background:var(--accent-light)}

/* ── Admin nav ─────────────────────────────────────────── */
.admin-nav-item{display:block;padding:10px 16px;font-size:.88rem;color:var(--text-secondary);transition:var(--transition);text-decoration:none;background:none;border:none;width:100%;text-align:left;cursor:pointer;font-family:var(--font-body)}
.admin-nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}
.admin-nav-item.active{background:var(--accent-light);color:var(--accent-text);font-weight:500}

/* ── Toggle switch ─────────────────────────────────────── */
.toggle-switch{width:44px;height:24px;border-radius:12px;background:var(--border-color);cursor:pointer;position:relative;transition:var(--transition);flex-shrink:0;border:none}
.toggle-switch.on{background:var(--success)}
.toggle-knob{position:absolute;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:var(--transition)}
.toggle-switch.on .toggle-knob{left:23px}
.toggle-switch.off .toggle-knob{left:3px}

/* ── Login page ────────────────────────────────────────── */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);padding:24px;position:relative;overflow:hidden}
.login-bg{position:absolute;inset:0;pointer-events:none}
.login-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.15}
.orb-1{width:400px;height:400px;background:var(--accent);top:-100px;left:-100px}
.orb-2{width:300px;height:300px;background:var(--info);bottom:-80px;right:-80px}
.login-grid{position:absolute;inset:0;background-image:linear-gradient(var(--border-subtle) 1px,transparent 1px),linear-gradient(90deg,var(--border-subtle) 1px,transparent 1px);background-size:40px 40px;opacity:.3}
.login-card{position:relative;z-index:1;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:36px;width:100%;max-width:420px;box-shadow:var(--shadow-lg)}
.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:28px}
.login-logo .logo-mark{font-size:2rem;color:var(--accent);filter:drop-shadow(0 0 12px var(--accent))}
.login-brand{font-family:var(--font-display);font-size:1.3rem;color:var(--text-primary);line-height:1.2}
.login-sub{font-size:.72rem;color:var(--text-muted)}
.login-title{font-size:1.4rem;margin-bottom:6px}
.login-desc{font-size:.88rem;color:var(--text-muted);margin-bottom:24px}
.login-form{display:flex;flex-direction:column;gap:16px}
.login-options{display:flex;justify-content:flex-end;margin-top:-8px}
.login-link{font-size:.82rem;color:var(--accent-text)}
.login-footer{margin-top:24px;text-align:center;padding-top:20px;border-top:1px solid var(--border-subtle)}

/* ── Utilities ─────────────────────────────────────────── */
.text-muted{color:var(--text-muted)}
.text-sm{font-size:.82rem}
.text-xs{font-size:.75rem}
.font-mono{font-family:var(--font-mono)}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.divider{height:1px;background:var(--border-color);margin:20px 0}
.mt-4{margin-top:16px}
.mb-4{margin-bottom:16px}
.flex{display:flex}
.items-center{align-items:center}
.gap-2{gap:8px}
.gap-3{gap:12px}

/* ── Nav Groups (Books-style collapsible) ────────────────── */
.nav-group { margin-bottom: 1px; }

.nav-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 9px 12px;
    border-radius: var(--radius-md);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-secondary);
    font-size: .88rem;
    font-weight: 400;
    font-family: var(--font-body);
    transition: var(--transition);
    text-align: left;
}
.nav-group-header:hover { background: var(--bg-hover); color: var(--text-primary); }
.nav-group-header.group-active { color: var(--text-primary); font-weight: 500; }

.group-arrow {
    font-size: .8rem;
    color: var(--text-muted);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.nav-group-items {
    display: none;
    flex-direction: column;
    gap: 1px;
    padding: 2px 0 4px 28px;
}

.nav-sub-item {
    display: block;
    padding: 7px 12px;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: .84rem;
    text-decoration: none;
    transition: var(--transition);
    border-left: 2px solid transparent;
}
.nav-sub-item:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
    border-left-color: var(--border-color);
}
.nav-sub-item.active {
    background: var(--accent-light);
    color: var(--accent-text);
    font-weight: 500;
    border-left-color: var(--accent);
}

/* ── Version badge in sidebar footer ────────────────────── */
.sidebar-version {
    font-size: .65rem;
    color: var(--text-muted);
    font-family: var(--font-mono);
    opacity: 0.6;
    margin-top: 2px;
}
/* ── Global Select / Dropdown Dark Theme ────────────────── */
select {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    color-scheme: dark;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    font-family: var(--font-body);
    font-size: 0.88rem;
    padding: 8px 32px 8px 10px;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%23aaaacc' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    transition: border-color 0.15s ease;
    min-height: 38px;
    width: 100%;
    display: block;
    cursor: pointer;
}
select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent-light);
    outline: none;
}
select option {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
    padding: 8px 10px;
    font-size: 0.88rem;
}
select option:checked {
    background-color: var(--accent) !important;
    color: #fff !important;
}
select:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
/* Ensure selects inside .field-input class are also styled */
select.field-input {
    padding: 8px 32px 8px 10px;
    background-color: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color);
}

/* ── Global Date Input Dark Theme ───────────────────────── */
input[type='date'],
input[type='datetime-local'],
input[type='time'] {
    color-scheme: dark;
    color: var(--text-primary) !important;
    background-color: var(--bg-secondary) !important;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 0.88rem;
    font-family: var(--font-body);
    outline: none;
    transition: border-color 0.15s ease;
}
input[type='date']:focus,
input[type='datetime-local']:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent-light);
}
input[type='date']::-webkit-calendar-picker-indicator,
input[type='datetime-local']::-webkit-calendar-picker-indicator {
    filter: invert(0.6) brightness(1.2);
    cursor: pointer;
    opacity: 0.7;
}
input[type='date']::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

/* ── Native select option color fix ──────────────────────────────── */
/* Browser native <option> elements don't inherit CSS color.
   Explicitly set background + color on the <select> so the
   dropdown list is always readable regardless of theme.     */
select, select.form-input, select.form-select, select.form-control {
    color-scheme: dark;         /* tells browser this is a dark-mode select */
    background-color: var(--surface, #1e293b) !important;
    color:            var(--text-primary, #f1f5f9) !important;
    border-color:     var(--border-color, #334155) !important;
}
select option {
    background-color: var(--surface, #1e293b) !important;
    color:            var(--text-primary, #f1f5f9) !important;
}
/* Placeholder / first disabled option */
select option[value=""],
select option[value="0"] {
    color: var(--text-muted, #64748b) !important;
}

/* ── Corporate Light theme ─────────────────────────────────────── */
[data-theme="corporate"] {
  --bg-primary:    #f8fafc;
  --bg-secondary:  #f1f5f9;
  --bg-tertiary:   #e2e8f0;
  --bg-card:       #ffffff;
  --bg-hover:      #f1f5f9;
  --border-color:  #e2e8f0;
  --border-subtle: #f1f5f9;
  --text-primary:  #0f172a;
  --text-secondary:#475569;
  --text-muted:    #94a3b8;
  --accent:        #2563eb;
  --accent-hover:  #1d4ed8;
  --accent-light:  #eff6ff;
  --accent-text:   #1d4ed8;
  --success:       #16a34a;
  --success-light: #f0fdf4;
  --warning:       #d97706;
  --warning-light: #fffbeb;
  --danger:        #dc2626;
  --danger-light:  #fef2f2;
  --info:          #0284c7;
  --info-light:    #f0f9ff;
  --sidebar-bg:    #1e293b;
  --sidebar-border:#334155;
  --topbar-bg:     #ffffff;
  --surface:       #ffffff;
  --surface-raised:#f1f5f9;
  --shadow-sm:     0 1px 3px rgba(0,0,0,.08);
  --shadow-md:     0 4px 12px rgba(0,0,0,.08);
  --shadow-lg:     0 10px 25px rgba(0,0,0,.1);
}

/* Corporate light sidebar — keeps dark navy like admin portal */
[data-theme="corporate"] .sidebar {
  background: #1e293b;
  border-color: #334155;
}
[data-theme="corporate"] .logo-brand,
[data-theme="corporate"] .sidebar-username { color: #f1f5f9; font-size: .95rem; }
[data-theme="corporate"] .logo-sub,
[data-theme="corporate"] .sidebar-org,
[data-theme="corporate"] .nav-section-label,
[data-theme="corporate"] .sidebar-version { color: #64748b; }
[data-theme="corporate"] .logo-mark { color: #60a5fa; filter: none; font-size: 1.8rem; }
[data-theme="corporate"] .sidebar-footer { border-color: #334155; }
[data-theme="corporate"] .nav-item { color: #cbd5e1; font-size: .92rem; padding: 10px 14px; }
[data-theme="corporate"] .nav-item:hover { background: rgba(255,255,255,.08); color: #f1f5f9; }
[data-theme="corporate"] .nav-item.active { background: rgba(37,99,235,.25); color: #93c5fd; font-weight: 600; }
[data-theme="corporate"] .nav-item.active .nav-icon { color: #60a5fa; }
[data-theme="corporate"] .nav-group-header { color: #94a3b8; font-size: .92rem; }
[data-theme="corporate"] .nav-group-header:hover { background: rgba(255,255,255,.08); color: #f1f5f9; }
[data-theme="corporate"] .nav-sub-item { color: #94a3b8; font-size: .88rem; }
[data-theme="corporate"] .nav-sub-item:hover { background: rgba(255,255,255,.08); color: #f1f5f9; border-left-color: #475569; }
[data-theme="corporate"] .nav-sub-item.active { background: rgba(37,99,235,.2); color: #93c5fd; border-left-color: #3b82f6; }

/* White topbar */
[data-theme="corporate"] .topbar {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
[data-theme="corporate"] .topbar-title { color: #0f172a; }
[data-theme="corporate"] .topbar-user-btn:hover { background: #f1f5f9; }
[data-theme="corporate"] .dropdown {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 10px 25px rgba(0,0,0,.1);
}
[data-theme="corporate"] .dropdown-item:hover { background: #f1f5f9; color: #0f172a; }

/* Cards with shadows instead of just borders */
[data-theme="corporate"] .card,
[data-theme="corporate"] .metric-card {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 1px 3px rgba(0,0,0,.07);
}
[data-theme="corporate"] .card:hover { border-color: #bfdbfe; box-shadow: 0 4px 12px rgba(37,99,235,.1); }
[data-theme="corporate"] .metric-card:hover { border-color: #bfdbfe; box-shadow: 0 4px 12px rgba(37,99,235,.1); }

/* Table light headers */
[data-theme="corporate"] thead tr { background: #f8fafc; }
[data-theme="corporate"] thead th { color: #64748b; border-bottom: 1px solid #e2e8f0; }
[data-theme="corporate"] tbody tr { border-color: #f1f5f9; }
[data-theme="corporate"] tbody tr:hover { background: #f8fafc; }
[data-theme="corporate"] tbody td { color: #1e293b; }

/* Forms light */
[data-theme="corporate"] .form-input,
[data-theme="corporate"] select {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
  color-scheme: light;
}
[data-theme="corporate"] .form-input:focus,
[data-theme="corporate"] select:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.1) !important;
}
[data-theme="corporate"] select option {
  background-color: #ffffff !important;
  color: #0f172a !important;
}
[data-theme="corporate"] input[type='date'],
[data-theme="corporate"] input[type='datetime-local'] {
  background-color: #ffffff !important;
  color: #0f172a !important;
  color-scheme: light;
  border-color: #e2e8f0;
}
[data-theme="corporate"] input[type='date']::-webkit-calendar-picker-indicator,
[data-theme="corporate"] input[type='datetime-local']::-webkit-calendar-picker-indicator {
  filter: none;
  opacity: .6;
}

/* Buttons */
[data-theme="corporate"] .btn-primary { background: #2563eb; }
[data-theme="corporate"] .btn-primary:hover { background: #1d4ed8; box-shadow: 0 4px 12px rgba(37,99,235,.3); }
[data-theme="corporate"] .btn-secondary { background: #f1f5f9; color: #334155; border-color: #e2e8f0; }
[data-theme="corporate"] .btn-secondary:hover { background: #e2e8f0; }
[data-theme="corporate"] .btn-ghost:hover { background: #f1f5f9; color: #0f172a; }

/* Bordered badges */
[data-theme="corporate"] .badge-success { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }
[data-theme="corporate"] .badge-warning { background: #fffbeb; color: #d97706; border: 1px solid #fde68a; }
[data-theme="corporate"] .badge-danger  { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
[data-theme="corporate"] .badge-info    { background: #f0f9ff; color: #0284c7; border: 1px solid #bae6fd; }
[data-theme="corporate"] .badge-default { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }
[data-theme="corporate"] .badge-accent  { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }

/* Tabs light */
[data-theme="corporate"] .tabs { background: #f1f5f9; }
[data-theme="corporate"] .tab.active { background: #ffffff; color: #0f172a; box-shadow: 0 1px 3px rgba(0,0,0,.1); }
[data-theme="corporate"] .tab:hover:not(.active) { color: #0f172a; }

/* Search bar */
[data-theme="corporate"] .search-bar { background: #ffffff; border-color: #e2e8f0; }

/* Kanban */
[data-theme="corporate"] .kanban-col-header { background: #f1f5f9; border-color: #e2e8f0; }
[data-theme="corporate"] .lead-card { background: #ffffff; border-color: #e2e8f0; }
[data-theme="corporate"] .lead-card:hover { border-color: #bfdbfe; box-shadow: 0 4px 12px rgba(37,99,235,.1); }

/* Login page */
[data-theme="corporate"] .login-page { background: #f8fafc; }
[data-theme="corporate"] .orb-1 { background: #2563eb; opacity: .05; }
[data-theme="corporate"] .orb-2 { background: #0284c7; opacity: .04; }
[data-theme="corporate"] .login-grid { opacity: .15; }