/* ============================================================ 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); } 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 .navbar-brand-text { 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); } html.dark .sidebar-user-name { color: #f1f5f9; } html.dark .sidebar-logout { color: #f87171; } html.dark .sidebar-logout:hover { background: rgba(239,68,68,.12); } /* 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: #64748b !important; } html.dark [style*="color:#9ca3af"] { color: #475569 !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; } /* ══════════════════════════════════════════════════════════════ POS — Modo oscuro ══════════════════════════════════════════════════════════════ */ /* Header */ html.dark .pos-page-title { color: #f1f5f9; } html.dark .pos-page-subtitle { color: #64748b; } html.dark .pos-page-icon { background: rgba(99,102,241,.18); color: #a5b4fc; } html.dark .pos-header-badge--warn { background: rgba(245,158,11,.15); color: #fcd34d; border-color: rgba(245,158,11,.25); } html.dark .pos-header-badge--info { background: rgba(59,130,246,.15); color: #93c5fd; border-color: rgba(59,130,246,.25); } html.dark .pos-header-badge--success { background: rgba(16,185,129,.15); color: #6ee7b7; border-color: rgba(16,185,129,.25); } /* Tabs */ html.dark .pos-tabs { border-bottom-color: rgba(255,255,255,.08); } html.dark .pos-tab { color: #64748b; } html.dark .pos-tab:hover { color: #cbd5e1; background: rgba(255,255,255,.04); } html.dark .pos-tab.active { color: #a5b4fc; border-bottom-color: #6366f1; } html.dark .pos-tab-badge { background: #6366f1; color: #fff; } /* Barra de búsqueda */ html.dark .pos-search-bar { background: #13131f; border-color: rgba(255,255,255,.1); } html.dark .pos-search-input { color: #e2e8f0; } html.dark .pos-search-input::placeholder { color: #475569; } html.dark .pos-search-icon { color: #475569; } html.dark .pos-search-clear { color: #475569; } html.dark .pos-search-clear:hover { color: #cbd5e1; } /* Category pills */ html.dark .pos-cat-pill { border-color: rgba(255,255,255,.1); color: #64748b; background: transparent; } html.dark .pos-cat-pill:hover { background: rgba(255,255,255,.06); color: #cbd5e1; } html.dark .pos-cat-pill.active { background: #6366f1; border-color: #6366f1; color: #fff; } html.dark .pos-cat-chip { background: rgba(255,255,255,.07); color: #64748b; } /* Tarjetas de producto */ html.dark .pos-product-card { background: #13131f; border-color: rgba(255,255,255,.08); box-shadow: 0 2px 8px rgba(0,0,0,.35); } html.dark .pos-product-card:hover { border-color: rgba(99,102,241,.4); box-shadow: 0 4px 20px rgba(0,0,0,.45); } html.dark .ppc-name { color: #e2e8f0; } html.dark .ppc-cat { color: #475569; } html.dark .ppc-price { color: #a5b4fc; } html.dark .ppc-bottom { border-top-color: rgba(255,255,255,.06); } /* Ticket / carrito */ html.dark .pos-ticket { background: #0d0d1a; border-left-color: rgba(255,255,255,.07); } html.dark .pos-ticket-header { border-bottom-color: rgba(255,255,255,.07); } html.dark .pos-ticket-title { color: #f1f5f9; } html.dark .pos-ticket-empty { color: #475569; } html.dark .pos-ticket-empty svg { color: #2d2d45; } html.dark .pos-cart-item { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .pos-cart-item-name { color: #e2e8f0; } html.dark .pos-cart-item-price { color: #94a3b8; } html.dark .pos-cart-item-sub { color: #a5b4fc; font-weight: 700; } html.dark .pos-cart-qty-btn { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.1); color: #cbd5e1; } html.dark .pos-cart-qty-btn:hover { background: rgba(255,255,255,.1); } html.dark .pos-cart-qty-val { color: #e2e8f0; } html.dark .pos-cart-item-del { color: #475569; } html.dark .pos-cart-item-del:hover { color: #f87171; } /* Totales */ html.dark .pos-totals { border-top-color: rgba(255,255,255,.07); } html.dark .pos-totals-label { color: #94a3b8; } html.dark .pos-totals-val { color: #e2e8f0; } html.dark .pos-total-row { border-top-color: rgba(255,255,255,.08); } html.dark .pos-total-val { color: #a5b4fc; } /* Descuento */ html.dark .pos-discount-wrap { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.07); } html.dark .pos-discount-wrap input { background: #1e1e2e; border-color: rgba(255,255,255,.1); color: #e2e8f0; } html.dark .pos-disc-type { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.1); color: #94a3b8; } html.dark .pos-disc-type.active, html.dark .pos-disc-type:hover { background: #6366f1; color: #fff; } /* Bloque impuestos */ html.dark .pos-tax-block { background: rgba(99,102,241,.07); border-color: rgba(99,102,241,.2); } html.dark .pos-tax-toggle-label { color: #94a3b8; } html.dark .pos-tax-block-hint { color: #475569; } html.dark .pos-tax-label { color: #94a3b8; } html.dark .pos-tax-rate { background: rgba(99,102,241,.2); color: #a5b4fc; } html.dark .pos-tax-amount { color: #fbbf24; } /* Forma de pago */ html.dark .pos-payment-form label { color: #94a3b8; } html.dark .pos-pago-btn { background: #1e1e2e; border-color: rgba(255,255,255,.1); color: #94a3b8; } html.dark .pos-pago-btn:hover { border-color: rgba(99,102,241,.4); color: #a5b4fc; } html.dark .pos-pago-btn.active { background: rgba(99,102,241,.18); border-color: #6366f1; color: #a5b4fc; } html.dark .pos-pago-label { color: #64748b; font-size: .72rem; } /* Paciente */ html.dark .pos-patient-search { background: #13131f; border-color: rgba(255,255,255,.1); color: #e2e8f0; } html.dark .pos-patient-search::placeholder { color: #475569; } html.dark .pos-patient-results { background: #1e1e2e; border-color: rgba(255,255,255,.1); box-shadow: 0 8px 24px rgba(0,0,0,.5); } html.dark .pos-patient-result-item { color: #cbd5e1; } html.dark .pos-patient-result-item:hover { background: rgba(255,255,255,.06); } html.dark .pos-patient-chip { background: rgba(99,102,241,.18); border-color: rgba(99,102,241,.3); color: #a5b4fc; } html.dark .pos-patient-chip-clear { color: #6366f1; } html.dark .pos-patient-chip-clear:hover { color: #f87171; } /* Ventas del día */ html.dark .pos-venta-item { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .pos-venta-item:hover { border-color: rgba(99,102,241,.35); background: #1a1a2e; } html.dark .pos-venta-icon { background: rgba(255,255,255,.06); } html.dark .pos-venta-patient { color: #e2e8f0; } html.dark .pos-venta-meta { color: #475569; } html.dark .pos-venta-total { color: #a5b4fc; } html.dark .pos-venta-pf-badge { background: rgba(16,185,129,.18); color: #6ee7b7; border-color: rgba(16,185,129,.3); } /* Prefacturas */ html.dark .pf-card { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .pf-card:hover { border-color: rgba(99,102,241,.35); background: #1a1a2e; } html.dark .pf-card-folio { color: #e2e8f0; } html.dark .pf-card-patient { color: #94a3b8; } html.dark .pf-card-date { color: #475569; } html.dark .pf-card-total { color: #a5b4fc; } html.dark .pf-card-badge { background: rgba(245,158,11,.15); color: #fcd34d; } html.dark .pf-card-badge--pagada { background: rgba(16,185,129,.15); color: #6ee7b7; } html.dark .pf-card-badge--cancelada { background: rgba(239,68,68,.15); color: #fca5a5; } html.dark .pf-card--done { opacity: .65; } html.dark .pf-filter-pill { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.1); color: #64748b; } html.dark .pf-filter-pill:hover { color: #cbd5e1; background: rgba(255,255,255,.08); } html.dark .pf-filter-pill.active { background: rgba(99,102,241,.2); border-color: #6366f1; color: #a5b4fc; } /* Stats */ html.dark .pos-stat-card { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .pos-stat-label { color: #64748b; } html.dark .pos-stat-value { color: #f1f5f9; } html.dark .pos-stat-sub { color: #475569; } /* Inventario */ html.dark .pos-inv-item { background: #13131f; border-color: rgba(255,255,255,.07); } html.dark .pos-inv-item:hover { border-color: rgba(99,102,241,.3); } html.dark .pos-inv-name { color: #e2e8f0; } html.dark .pos-inv-cat { color: #475569; } html.dark .pos-inv-price { color: #a5b4fc; } html.dark .pos-inv-stock { color: #64748b; } html.dark .pos-inv-badge--low { background: rgba(239,68,68,.15); color: #fca5a5; } html.dark .pos-inv-badge--ok { background: rgba(16,185,129,.15); color: #6ee7b7; } /* Modales POS */ html.dark .pos-modal { background: #13131f; border-color: rgba(255,255,255,.08); box-shadow: 0 24px 64px rgba(0,0,0,.7); } html.dark .pos-modal-header { border-bottom-color: rgba(255,255,255,.07); } html.dark .pos-modal-title { color: #f1f5f9; } html.dark .pos-modal-close { color: #475569; } html.dark .pos-modal-close:hover { color: #f87171; background: rgba(239,68,68,.1); } /* Detalle venta (vd-*) */ html.dark .vd-modal { background: #13131f; } html.dark .vd-subtitle { color: #64748b; } html.dark .vd-chip { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.08); } html.dark .vd-chip-icon { background: rgba(255,255,255,.08); } html.dark .vd-chip-label { color: #cbd5e1; } html.dark .vd-badge--ok { background: rgba(16,185,129,.15); color: #6ee7b7; } html.dark .vd-badge--cancel { background: rgba(239,68,68,.15); color: #fca5a5; } html.dark .vd-badge--pending { background: rgba(245,158,11,.15); color: #fcd34d; } html.dark .vd-totals { border-top-color: rgba(255,255,255,.07); } html.dark .vd-total-row { color: #94a3b8; } html.dark .vd-discount span:last-child { color: #f87171; } html.dark .vd-tax-row span:last-child { color: #fbbf24; } html.dark .vd-total-final { border-top-color: rgba(255,255,255,.1); color: #a5b4fc; } html.dark .vd-total-final span:last-child { color: #a5b4fc; } html.dark .vd-notes { color: #64748b; } html.dark .vd-pf-done { color: #6ee7b7; } html.dark .vd-footer { border-top-color: rgba(255,255,255,.07); } /* Tablas POS */ html.dark .pos-table thead th { background: rgba(255,255,255,.04); color: #64748b; border-bottom-color: rgba(255,255,255,.08); } html.dark .pos-table td { color: #cbd5e1; border-bottom-color: rgba(255,255,255,.05); } html.dark .pos-table tbody tr:hover { background: rgba(255,255,255,.03); } html.dark .pos-table-wrap { background: #1a1a2e; border-color: rgba(255,255,255,.07); } /* Factura fiscal (fi-*) */ html.dark .pos-modal-overlay .fi-header { background: rgba(99,102,241,.12); border-bottom-color: rgba(255,255,255,.07); } html.dark .fi-emisor-name { color: #e2e8f0; } html.dark .fi-emisor-meta { color: #64748b; } html.dark .fi-section-title { color: #94a3b8; border-bottom-color: rgba(255,255,255,.07); } html.dark .fi-row { color: #cbd5e1; border-bottom-color: rgba(255,255,255,.05); } html.dark .fi-totals { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.07); } html.dark .fi-total { color: #a5b4fc; border-top-color: rgba(255,255,255,.1); } html.dark .fi-moneda { color: #475569; } html.dark .fi-footer { border-top-color: rgba(255,255,255,.07); background: rgba(255,255,255,.03); } html.dark .fi-cadena { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08); color: #64748b; } /* Estados vacíos */ html.dark .pos-empty-state p { color: #475569; } /* Toast */ html.dark .pos-toast { box-shadow: 0 4px 20px rgba(0,0,0,.6); }