/* ============================================================
   丽人梦想秀® · 暗夜模式 v1.0
   Dark Mode — Purple Fire Era Night Edition
   Body class: body.dark-mode 或自动检测
   ============================================================ */

/* ── CSS Variables Override ── */
body.dark-mode {
  --fire-deep:    #E8A87C;
  --fire-purple:  #C9A25B;
  --fire-amethyst:#B88AC0;
  --fire-lavender:#D4C5E2;
  --jade-ivory:   #0D0018;
  --jade-cream:   #120022;
  --jade-silk:    #1A0A2E;
  --jade-warm:    #1E0E36;
  --ink-deep:     #E8D5A3;
  --ink-rich:     #D4C5E2;
  --ink-gray:     #B8B0C8;
  --ink-light:    #8A7E9E;
  --gold-accent:  #E8A87C;
  --gold-light:   #F0C8B0;
  --shadow-sm:    0 2px 12px rgba(232,168,124,0.08);
  --shadow-md:    0 4px 20px rgba(232,168,124,0.12);
  --shadow-lg:    0 8px 40px rgba(232,168,124,0.18);
  --shadow-glow:  0 0 30px rgba(201,162,91,0.25);
}

/* ── Body Background ── */
body.dark-mode {
  background: linear-gradient(150deg, #050010 0%, #0A0018 15%, #0D0020 30%, #120028 50%, #0A0018 75%, #080015 100%) !important;
  background-attachment: fixed !important;
  color: #D4C5E2 !important;
}

body.dark-mode::before {
  background:
    radial-gradient(ellipse at 15% 40%, rgba(123,45,142,0.08) 0%, transparent 55%),
    radial-gradient(ellipse at 75% 25%, rgba(201,162,91,0.05) 0%, transparent 55%),
    radial-gradient(ellipse at 50% 85%, rgba(232,168,124,0.04) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 70%, rgba(196,149,138,0.03) 0%, transparent 55%);
}

/* ── Sidebar Dark ── */
body.dark-mode .sidebar {
  background: linear-gradient(180deg, #060012 0%, #0A0018 40%, #0D0020 100%) !important;
  border-right: 1px solid rgba(201,162,91,0.08) !important;
}

body.dark-mode .sidebar .nav-section {
  color: rgba(232,168,124,0.5) !important;
}

body.dark-mode .sidebar .nav-link {
  color: rgba(212,197,226,0.7) !important;
}

body.dark-mode .sidebar .nav-link:hover {
  background: rgba(201,162,91,0.06) !important;
  color: #E8A87C !important;
}

body.dark-mode .sidebar .nav-link.active {
  background: linear-gradient(90deg, rgba(123,45,142,0.15), rgba(201,162,91,0.08)) !important;
  color: #E8A87C !important;
  border-left: 3px solid #C9A25B !important;
}

body.dark-mode .sidebar .logo h2 {
  color: #E8A87C !important;
}

body.dark-mode .sidebar .logo small {
  color: rgba(255,255,255,0.2) !important;
}

body.dark-mode .sidebar-footer {
  background: rgba(10,0,24,0.6) !important;
  border-top: 1px solid rgba(201,162,91,0.06) !important;
}

/* ── Cards Dark ── */
body.dark-mode .card-stat,
body.dark-mode .card-glass,
body.dark-mode .card {
  background: rgba(20,8,40,0.8) !important;
  border: 1px solid rgba(201,162,91,0.08) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.3), 0 8px 32px rgba(123,45,142,0.06) !important;
}

body.dark-mode .card-stat:hover,
body.dark-mode .card-glass:hover {
  border-color: rgba(232,168,124,0.2) !important;
  box-shadow: 0 4px 20px rgba(201,162,91,0.08), 0 16px 48px rgba(123,45,142,0.12) !important;
}

body.dark-mode .card-stat::before {
  background: linear-gradient(90deg, transparent, #E8A87C, #C9A25B, transparent);
}

/* ── Typography ── */
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3,
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 {
  color: #E8A87C !important;
}

body.dark-mode p, body.dark-mode li, body.dark-mode td, body.dark-mode th {
  color: #B8B0C8 !important;
}

body.dark-mode .card-stat strong,
body.dark-mode .card-glass strong {
  color: #E8A87C !important;
}

body.dark-mode small, body.dark-mode .text-muted {
  color: #8A7E9E !important;
}

/* ── Inputs Dark ── */
body.dark-mode .form-control,
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
  background: rgba(20,8,40,0.8) !important;
  border: 1px solid rgba(201,162,91,0.12) !important;
  color: #D4C5E2 !important;
}

body.dark-mode .form-control:focus,
body.dark-mode input:focus {
  border-color: #C9A25B !important;
  box-shadow: 0 0 12px rgba(201,162,91,0.15) !important;
}

body.dark-mode .form-control::placeholder {
  color: rgba(212,197,226,0.3) !important;
}

/* ── Tables Dark ── */
body.dark-mode table {
  background: rgba(20,8,40,0.4) !important;
}

body.dark-mode table th {
  background: rgba(123,45,142,0.08) !important;
  color: #E8A87C !important;
}

body.dark-mode table td {
  border-color: rgba(201,162,91,0.05) !important;
  color: #B8B0C8 !important;
}

body.dark-mode table tr:hover td {
  background: rgba(201,162,91,0.03) !important;
}

/* ── Buttons Dark ── */
body.dark-mode .btn {
  box-shadow: 0 4px 16px rgba(123,45,142,0.25) !important;
}

/* ── Breadcrumb ── */
body.dark-mode #breadcrumb {
  color: #8A7E9E !important;
}

/* ── Mobile Tab Bar ── */
body.dark-mode .mobile-tab-bar {
  background: linear-gradient(0deg, #0A0018 0%, #0D0020 100%) !important;
  border-top: 1px solid rgba(201,162,91,0.08) !important;
}

body.dark-mode .mobile-tab-item {
  color: rgba(212,197,226,0.5) !important;
}

body.dark-mode .mobile-tab-item.active {
  color: #E8A87C !important;
}

/* ── Premium Override ── */
body.dark-mode body {
  color: #2D2D44 !important;
}

body.dark-mode .badge {
  background: rgba(201,162,91,0.1) !important;
  color: #E8A87C !important;
}

/* ── Sidebar v2 Collapsible ── */
body.dark-mode .nav-section-toggle {
  color: rgba(232,168,124,0.35) !important;
}

body.dark-mode .nav-section-toggle:hover {
  color: rgba(232,168,124,0.6) !important;
}

/* ── Search Box Dark ── */
body.dark-mode .sidebar-search input {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(201,162,91,0.1) !important;
  color: rgba(212,197,226,0.7) !important;
}

body.dark-mode .sidebar-search input:focus {
  border-color: rgba(201,162,91,0.35) !important;
  background: rgba(255,255,255,0.06) !important;
}

body.dark-mode .sidebar-search input::placeholder {
  color: rgba(212,197,226,0.25) !important;
}

/* ── Company Selector Dark ── */
body.dark-mode .sidebar-company-select {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(201,162,91,0.1) !important;
  color: rgba(212,197,226,0.7) !important;
}

body.dark-mode .sidebar-company-select:focus {
  border-color: rgba(201,162,91,0.35) !important;
}

/* ── Dark Mode Toggle Button ── */
body.dark-mode .dark-mode-toggle {
  color: #E8A87C !important;
}