/* ==========================================================
   TEMA CORPORATIVO BOMBEO SOLAR (LIGHT/DARK VARIABLES)
   ========================================================== */
:root {
    --bg-body-bombeo: #08090a; /* Fondo ultra oscuro tipo Dashboard */
    --nav-bg-bombeo: rgba(10, 12, 13, 0.95);
    --bg-card-bombeo: #161b22; /* Tarjetas grises oscuras */
    --text-main-bombeo: #f8f9fa;
    --text-muted-bombeo: #8b949e;
    --border-bombeo: rgba(255, 255, 255, 0.08);
    --jk-green: #00A651;
    --jk-green-hover: #008a43;
}

[data-theme="light"] {
    --bg-body-bombeo: #f4f6f9; /* Fondo gris claro corporativo */
    --nav-bg-bombeo: rgba(255, 255, 255, 0.95);
    --bg-card-bombeo: #ffffff; /* Tarjetas blancas */
    --text-main-bombeo: #1a1d20; /* Texto casi negro */
    --text-muted-bombeo: #6c757d;
    --border-bombeo: rgba(0, 0, 0, 0.08);
}

/* Aplicación de Variables al Body */
.bombeo-body { 
    background-color: var(--bg-body-bombeo); 
    color: var(--text-main-bombeo);
    font-family: 'Inter', sans-serif;
    transition: background-color 0.3s ease, color 0.3s ease;
    min-height: 100vh;
}

/* Navbar */
.navbar-bombeo { 
    background: var(--nav-bg-bombeo) !important; 
    backdrop-filter: blur(15px); 
    transition: all 0.3s ease;
}

/* Textos adaptativos */
.text-main-bombeo { color: var(--text-main-bombeo) !important; }
.text-muted-bombeo { color: var(--text-muted-bombeo) !important; }
.border-bombeo { border-color: var(--border-bombeo) !important; }
.bg-card-bombeo { background-color: var(--bg-card-bombeo) !important; }

/* Sidebar Laterial */
.sidebar { 
    background-color: var(--nav-bg-bombeo); 
    min-height: calc(100vh - 70px); 
    transition: all 0.3s ease;
}

.sidebar-link {
    color: var(--text-muted-bombeo);
    padding: 12px 20px;
    margin-bottom: 5px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.2s ease;
}

.sidebar-link i { width: 30px; text-align: center; font-size: 1.2rem; }
.sidebar-link:hover { color: var(--jk-green); background-color: rgba(0, 166, 81, 0.05); }
.sidebar-link.active { 
    background-color: var(--jk-green); 
    color: white !important; 
    box-shadow: 0 4px 10px rgba(0, 166, 81, 0.3);
}

/* Componentes Comunes */
.card-jk { 
    background-color: var(--bg-card-bombeo); 
    border: 1px solid var(--border-bombeo); 
    border-radius: 12px; 
    transition: transform 0.2s, box-shadow 0.2s;
}

.card-jk:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Efectos UI */
.transition-hover { transition: transform 0.2s; }
.transition-hover:hover { transform: scale(1.1); }
.cursor-pointer { cursor: pointer; }
.dropdown-hover:hover { background-color: rgba(0, 166, 81, 0.05) !important; color: var(--jk-green) !important; }

/* Botones Principales Neón/Verde */
.btn-jk-green {
    background-color: var(--jk-green);
    color: white;
    font-weight: 700;
    border: none;
    box-shadow: 0 4px 10px rgba(0, 166, 81, 0.2);
    transition: all 0.2s ease;
}
.btn-jk-green:hover {
    background-color: var(--jk-green-hover);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 166, 81, 0.4);
}