/* ============================================================ DARK.CSS — Modo oscuro Fondo SIEMPRE negro (#0a0a0f) independiente del tema Se activa con la clase .dark en ============================================================ */ html.dark { color-scheme: dark; } html.dark body { background: #0a0a0f; color: #e2e8f0; } /* Cards */ html.dark .card { background: #13131f; border-color: rgba(255,255,255,.08); box-shadow: 0 2px 12px rgba(0,0,0,.4); color: #e2e8f0; } html.dark .card:hover { border-color: rgba(var(--color-primary-rgb), .35); box-shadow: 0 4px 24px rgba(0,0,0,.5); } html.dark .card-title { color: #f1f5f9; } html.dark .card-subtitle { color: #94a3b8; } html.dark .card-primary { background: linear-gradient(135deg, var(--color-primary), var(--color-secondary)); } /* Stat cards */ html.dark .stat-card { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .stat-value { color: #f1f5f9; } /* Formularios */ html.dark .form-control { background: #1e1e2e; border-color: rgba(255,255,255,.12); color: #e2e8f0; } html.dark .form-control:focus { border-color: var(--color-primary); background: #1e1e2e; } html.dark .form-control::placeholder { color: #475569; } html.dark .form-label { color: #cbd5e1; } html.dark select.form-control { background-color: #1e1e2e; } /* Navbar */ html.dark .navbar { background: #0d0d1a; border-bottom-color: rgba(255,255,255,.06); } html.dark .navbar-brand { color: #f1f5f9; } html.dark .nav-link { color: #94a3b8; } html.dark .nav-link:hover, html.dark .nav-link.active { color: #f1f5f9; } /* Sidebar */ html.dark .sidebar { background: #0d0d1a; border-right-color: rgba(255,255,255,.06); } html.dark .sidebar-brand { color: #f1f5f9; border-bottom-color: rgba(255,255,255,.06); } html.dark .sidebar-label { color: #475569; } html.dark .sidebar-link { color: #94a3b8; } html.dark .sidebar-link:hover { background: rgba(255,255,255,.05); color: #f1f5f9; } html.dark .sidebar-link.active { background: rgba(var(--color-primary-rgb), .18); color: var(--color-primary); } html.dark .sidebar-overlay { background: rgba(0,0,0,.75); } /* Tablas */ html.dark .table th { background: #13131f; color: #94a3b8; border-bottom-color: rgba(255,255,255,.08); } html.dark .table td { color: #cbd5e1; border-bottom-color: rgba(255,255,255,.05); } html.dark .table tbody tr:hover { background: rgba(255,255,255,.03); } html.dark .table-wrapper { background: #13131f; border-radius: var(--radius-md); } /* Botones */ html.dark .btn-ghost { color: #94a3b8; border-color: rgba(255,255,255,.1); } html.dark .btn-ghost:hover { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.15); color: #f1f5f9; } html.dark .btn-secondary { color: var(--color-primary); border-color: var(--color-primary); } html.dark .btn-secondary:hover { background: var(--color-primary); color: #fff; } /* Page inner */ html.dark .page-title { color: #f1f5f9; } html.dark .page-subtitle { color: #64748b; } html.dark .main-content { background: #0a0a0f; } html.dark .layout-admin, html.dark .layout-dashboard { background: #0a0a0f; } /* Badges */ html.dark .badge-primary { background: rgba(var(--color-primary-rgb),.2); color: #a5b4fc; } html.dark .badge-success { background: rgba(16,185,129,.15); color: #6ee7b7; } html.dark .badge-danger { background: rgba(239,68,68,.15); color: #fca5a5; } html.dark .badge-warning { background: rgba(245,158,11,.15); color: #fcd34d; } html.dark .badge-gray { background: rgba(255,255,255,.07); color: #94a3b8; } /* Alerts */ html.dark .alert-success { background: rgba(16,185,129,.1); color: #6ee7b7; border-color: rgba(16,185,129,.25); } html.dark .alert-error { background: rgba(239,68,68,.1); color: #fca5a5; border-color: rgba(239,68,68,.25); } html.dark .alert-warning { background: rgba(245,158,11,.1); color: #fcd34d; border-color: rgba(245,158,11,.25); } html.dark .alert-info { background: rgba(var(--color-accent-rgb),.1); color: #67e8f9; border-color: rgba(var(--color-accent-rgb),.25); } /* Divider */ html.dark .divider { background: rgba(255,255,255,.06); } /* Landing */ html.dark .landing-hero { background: #0d0d1a; } html.dark .landing-hero .hero-title { color: #f1f5f9; } html.dark .landing-hero .hero-sub { color: #94a3b8; } html.dark .features-section { background: #0a0a0f; } html.dark .feature-card { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .feature-card .card-title { color: #f1f5f9; } html.dark .feature-card p { color: #94a3b8; } html.dark .landing-footer { background: #0d0d1a; color: #64748b; border-top-color: rgba(255,255,255,.06); } /* Toggle switch */ html.dark .toggle-slider { background: #374151; } html.dark .toggle-slider::before { background: #9ca3af; } html.dark .toggle input:checked + .toggle-slider { background: var(--color-primary); } html.dark .toggle input:checked + .toggle-slider::before { background: #fff; } /* Scrollbar */ html.dark ::-webkit-scrollbar-thumb { background: #374151; } html.dark ::-webkit-scrollbar-thumb:hover { background: #4b5563; } /* Color picker */ html.dark .color-picker { border-color: rgba(255,255,255,.15); } /* Auth layout */ html.dark .auth-wrapper { background: #0a0a0f; } html.dark .auth-card { background: #13131f; border-color: rgba(255,255,255,.08); } html.dark .auth-title { color: #f1f5f9; } html.dark .auth-sub { color: #64748b; } html.dark .auth-footer a { color: var(--color-primary); } /* ── Auth layout inline overrides ────────────────────────────── */ html.dark .auth-bg { background: #0a0a0f !important; } html.dark .auth-orb-1 { background: radial-gradient(circle, rgba(var(--color-primary-rgb),.18), transparent 70%) !important; } html.dark .auth-card-box { background: #13131f !important; border-color: rgba(255,255,255,.08) !important; box-shadow: 0 12px 48px rgba(0,0,0,.5) !important; } html.dark .auth-title-text { color: #f1f5f9 !important; } html.dark .auth-sub-text { color: #64748b !important; } html.dark .auth-brand-name { color: var(--color-primary) !important; } /* Textos internos del form en dark */ html.dark .auth-card-box label, html.dark .auth-card-box .form-label { color: #cbd5e1 !important; } html.dark .auth-card-box a { color: var(--color-primary) !important; } html.dark .auth-card-box .text-muted, html.dark .auth-card-box [style*="color:#9ca3af"] { color: #475569 !important; } html.dark .auth-card-box [style*="color:#6b7280"] { color: #64748b !important; } html.dark .auth-card-box [style*="color:#1a1a2e"], html.dark .auth-card-box [style*="color:#0f0e17"] { color: #f1f5f9 !important; } html.dark .auth-card-box [style*="background:#f1f5f9"] { background: rgba(255,255,255,.06) !important; } /* Demo credentials box */ html.dark .auth-demo-box { background: rgba(var(--color-primary-rgb),.08) !important; border-color: rgba(var(--color-primary-rgb),.25) !important; } html.dark .auth-demo-box [style*="color:#6b7280"] { color: #94a3b8 !important; } /* Dropdown usuario */ html.dark #user-dropdown { background: #1e1e2e !important; border-color: rgba(255,255,255,.08) !important; } html.dark .dropdown-item { color: #cbd5e1 !important; } html.dark .dropdown-item:hover { background: rgba(255,255,255,.05) !important; } html.dark #user-dropdown [style*="border-bottom"] { border-bottom-color: rgba(255,255,255,.06) !important; } html.dark #user-dropdown [style*="border-top"] { border-top-color: rgba(255,255,255,.06) !important; } html.dark #user-dropdown [style*="color:#1a1a2e"] { color: #f1f5f9 !important; } html.dark #user-dropdown [style*="color:#9ca3af"] { color: #64748b !important; } /* Sidebar user info en dark */ html.dark .sidebar-user { background: rgba(255,255,255,.04) !important; } html.dark .sidebar-user-name { color: #f1f5f9 !important; } /* Cards blancas internas que escapan */ html.dark [style*="background:#fff"]:not(.btn):not(input):not(select) { background: #13131f !important; } html.dark [style*="background: #fff"]:not(.btn):not(input):not(select) { background: #13131f !important; } html.dark [style*="background:#f8f9ff"] { background: #0d0d1a !important; } html.dark [style*="background: #f8f9ff"] { background: #0d0d1a !important; } html.dark [style*="color:#1a1a2e"] { color: #f1f5f9 !important; } html.dark [style*="color:#0f0e17"] { color: #f1f5f9 !important; } html.dark [style*="color:#374151"] { color: #cbd5e1 !important; } html.dark [style*="color:#6b7280"] { color: #94a3b8 !important; } html.dark [style*="color:#9ca3af"] { color: #94a3b8 !important; } html.dark [style*="border-bottom:1px solid #f1f5f9"] { border-bottom-color: rgba(255,255,255,.06) !important; } html.dark [style*="border-top:1px solid #f1f5f9"] { border-top-color: rgba(255,255,255,.06) !important; } html.dark [style*="border:1px solid #f1f5f9"] { border-color: rgba(255,255,255,.06) !important; } /* Sidebar en mobile dark */ html.dark .sidebar { background: #0d0d1a !important; } html.dark .sidebar.open { box-shadow: 4px 0 32px rgba(0,0,0,.5) !important; }