/* THEME SYSTEM */
/* Base Variables are in style.css (Light Theme by default) */

/* THEME: ELECTRIC DARK (Minimalist & Elegant) */
[data-theme="dark-neon"] {
    /* -- PALETA DE COLORES "ELECTRIC" -- */

    /* Acentos Principales: Cian / Turquesa Eléctrico */
    --primary-green: #00f2ea;
    /* Cian vibrante */
    --secondary-green: #00bcd4;
    /* Azul cian un poco más profundo */
    --light-green: rgba(0, 242, 234, 0.1);
    /* Fondo sutil para elementos activos */

    /* Fondos y Estructura */
    --tech-dark: #000000;
    /* Fondo Body: Negro puro */
    --pure-white: #121212;
    /* Fondo Cards: Gris muy oscuro (Casi negro) */
    --gray-light: #0d0d0d;
    /* Fondo secundario */

    /* Texto */
    --text-main: #ffffff;
    /* Texto principal: Blanco puro */
    --text-muted: #b0bec5;
    /* Texto secundario: Gris azulado claro */
    --text-dark: #000000;
    /* Texto sobre fondos claros */

    /* Bordes y Separadores */
    --border-color: #333333;

    /* Sombras (Glow Effect) */
    --shadow-soft: 0 0 15px rgba(0, 242, 234, 0.1);
    --shadow-hover: 0 0 20px rgba(0, 242, 234, 0.25);

    --border-radius: 12px;
}

/* --- OVERRIDES ESPECÍFICOS PARA EL MODO OSCURO --- */

/* 1. Global Structure */
[data-theme="dark-neon"] body,
[data-theme="dark-neon"].dashboard-body {
    background-color: var(--tech-dark);
    color: var(--text-main);
}

[data-theme="dark-neon"] .main-content .action-bar {
    background: var(--tech-dark);
    /* Sticky header match bg */
}

/* 2. Cards & Containers (CRITICAL FIX FOR WHITE BACKGROUNDS) */
/* Targeted all card-like elements specifically */
[data-theme="dark-neon"] .card,
[data-theme="dark-neon"] .product-card,
[data-theme="dark-neon"] .product-list-card,
[data-theme="dark-neon"] .login-container,
[data-theme="dark-neon"] .modal-content,
[data-theme="dark-neon"] .navbar,
[data-theme="dark-neon"] .pos-cart,
[data-theme="dark-neon"] .cart-item,
[data-theme="dark-neon"] .view-toggles,
[data-theme="dark-neon"] .cart-header,
[data-theme="dark-neon"] .cart-footer,
[data-theme="dark-neon"] .pos-market .action-bar,
[data-theme="dark-neon"] .report-card,
/* Fixed Report Cards */
[data-theme="dark-neon"] .report-table,
/* Fixed Report Tables */
[data-theme="dark-neon"] .view-toggles,
/* Fixed View Toggles */
[data-theme="dark-neon"] .dashboard-card,
/* Generic Dashboard Card if exists */
[data-theme="dark-neon"] div[style*="background:white"],
/* Brute force override for inline styled white divs in dashboard */
[data-theme="dark-neon"] div[style*="background: white"] {
    background-color: var(--pure-white) !important;
    border: 1px solid var(--border-color);
    color: var(--text-main);
    box-shadow: none;
    /* Cleaner look */
}

/* 3. Inputs, Selects, Search */
[data-theme="dark-neon"] input,
[data-theme="dark-neon"] select,
[data-theme="dark-neon"] textarea,
[data-theme="dark-neon"] .form-control,
[data-theme="dark-neon"] .search-box input {
    background-color: #1e1e1e;
    border: 1px solid #444;
    color: #fff;
}

[data-theme="dark-neon"] input:focus,
[data-theme="dark-neon"] .search-box input:focus {
    border-color: var(--primary-green);
    box-shadow: 0 0 8px rgba(0, 242, 234, 0.4);
}

/* 4. POS Specifics */
[data-theme="dark-neon"] .pos-market,
[data-theme="dark-neon"] .pos-sticky-header {
    background-color: var(--gray-light);
    /* Slightly distinct from black body */
    border-right: 1px solid #333;
}

/* 5. Low Stock Overrides (Fix Pink Card) */
[data-theme="dark-neon"] .low-stock-card {
    background-color: rgba(60, 10, 10, 0.6) !important;
    /* Dark red transparent */
    border: 1px solid #ef5350 !important;
}

[data-theme="dark-neon"] .low-stock-list-item {
    background-color: rgba(60, 10, 10, 0.6) !important;
}

/* Ensure "Falta: ..." text matches */
[data-theme="dark-neon"] .stock-low {
    background: rgba(198, 40, 40, 0.3);
    color: #ffcdd2;
}

/* 6. Typography Overrides */
[data-theme="dark-neon"] .product-name,
[data-theme="dark-neon"] h1,
[data-theme="dark-neon"] h2,
[data-theme="dark-neon"] h3,
[data-theme="dark-neon"] h4,
[data-theme="dark-neon"] h5,
[data-theme="dark-neon"] blockquote {
    color: #ffffff !important;
}

[data-theme="dark-neon"] .product-code {
    background-color: #333;
    color: #ccc;
}

[data-theme="dark-neon"] .text-muted,
[data-theme="dark-neon"] .list-meta {
    color: var(--text-muted) !important;
}

/* 7. Tables (Reports) */
[data-theme="dark-neon"] table {
    color: #e0e0e0;
    background-color: var(--pure-white);
}

[data-theme="dark-neon"] tr {
    border-bottom: 1px solid #333;
    background-color: var(--pure-white);
}

[data-theme="dark-neon"] th {
    color: var(--primary-green);
    border-bottom: 1px solid var(--primary-green);
    background-color: #1a1a1a !important;
    /* Header slightly darker */
}

[data-theme="dark-neon"] td {
    border-bottom: 1px solid #333;
    color: #ddd;
}

[data-theme="dark-neon"] tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    /* Subtle highlight */
}

/* 8. Buttons */
[data-theme="dark-neon"] .btn-primary {
    background-color: var(--primary-green);
    color: #000;
    /* Contrast black text on cyan */
    font-weight: 800;
}

[data-theme="dark-neon"] .btn-secondary,
[data-theme="dark-neon"] .btn-action {
    background-color: #333;
    color: #fff;
    border: 1px solid #444;
}

/* 9. Images placeholders */
[data-theme="dark-neon"] .list-img,
[data-theme="dark-neon"] i.fa-image {
    background: #333;
    color: #555;
}

/* 10. Dashboard specific overrides for inline styles */
[data-theme="dark-neon"] div[style*="background: white"],
[data-theme="dark-neon"] div[style*="background:white"] {
    background: var(--pure-white) !important;
    color: var(--text-main) !important;
}

[data-theme="dark-neon"] div[style*="background: white"] h3,
[data-theme="dark-neon"] div[style*="background:white"] h3 {
    color: #fff !important;
}

[data-theme="dark-neon"] div[style*="background: white"] p,
[data-theme="dark-neon"] div[style*="background:white"] p {
    color: #aaa !important;
}

/* UTILS */
.no-select {
    user-select: none;
}