/*!
 * Light Theme Override — Tablero de Control
 *
 * Fuerza texto más oscuro en el tema light para mejor legibilidad.
 *
 * Notas técnicas:
 * - Cargado DESPUÉS de hope-ui.css en el layout.
 * - Iter 2 limpio (2026-06-03): de 17 a 7 !important. Los restantes son
 *   donde el bump de specificity no fue suficiente (body, p, .text-body,
 *   .text-muted, small, headings, strong/b — todos overrideados por
 *   reglas específicas de hope-ui).
 * - Para .nav-link y .sidebar-link se usa bump explicito de specificity
 *   con .sidebar-base .navbar-nav .nav-link para igualar a hope-ui.
 */

/* ============================================================
   1. Tokens & variables propias (tema light)
   ============================================================ */
[data-bs-theme="light"],
:root:not([data-bs-theme="dark"]) {
    /* Textos principales más oscuros */
    --bs-body-color: #1e2027;
    --bs-heading-color: #050911;

    /* Links más oscuros */
    --bs-link-color: #3a57e8;
    --bs-link-hover-color: #2845c7;

    /* Texto muted más oscuro pero aún diferenciable */
    --bs-secondary-color: #4a5568;
    --bs-tertiary-color: #6b7280;
}

/* ============================================================
   2. Tipografía base: body, párrafos, headings, strong, small
   ============================================================ */
[data-bs-theme="light"] body,
:root:not([data-bs-theme="dark"]) body {
    color: #1e2027 !important;
}

[data-bs-theme="light"] p,
:root:not([data-bs-theme="dark"]) p {
    color: #1e2027 !important;
}

[data-bs-theme="light"] .text-body,
:root:not([data-bs-theme="dark"]) .text-body {
    color: #1e2027 !important;
}

[data-bs-theme="light"] .text-muted,
:root:not([data-bs-theme="dark"]) .text-muted {
    color: #4a5568 !important;
}

[data-bs-theme="light"] small,
[data-bs-theme="light"] .small,
:root:not([data-bs-theme="dark"]) small,
:root:not([data-bs-theme="dark"]) .small {
    color: #4a5568 !important;
}

[data-bs-theme="light"] h1,
[data-bs-theme="light"] h2,
[data-bs-theme="light"] h3,
[data-bs-theme="light"] h4,
[data-bs-theme="light"] h5,
[data-bs-theme="light"] h6,
[data-bs-theme="light"] .h1,
[data-bs-theme="light"] .h2,
[data-bs-theme="light"] .h3,
[data-bs-theme="light"] .h4,
[data-bs-theme="light"] .h5,
[data-bs-theme="light"] .h6,
:root:not([data-bs-theme="dark"]) h1,
:root:not([data-bs-theme="dark"]) h2,
:root:not([data-bs-theme="dark"]) h3,
:root:not([data-bs-theme="dark"]) h4,
:root:not([data-bs-theme="dark"]) h5,
:root:not([data-bs-theme="dark"]) h6,
:root:not([data-bs-theme="dark"]) .h1,
:root:not([data-bs-theme="dark"]) .h2,
:root:not([data-bs-theme="dark"]) .h3,
:root:not([data-bs-theme="dark"]) .h4,
:root:not([data-bs-theme="dark"]) .h5,
:root:not([data-bs-theme="dark"]) .h6 {
    color: #050911 !important;
}

[data-bs-theme="light"] strong,
[data-bs-theme="light"] b,
:root:not([data-bs-theme="dark"]) strong,
:root:not([data-bs-theme="dark"]) b {
    color: #050911 !important;
}

/* ============================================================
   3. Navegación: sidebar, nav, breadcrumb, dropdown
   ============================================================ */
/* Bump de specificity: hope-ui usa .sidebar-base .navbar-nav .nav-link
   con specificity (0,3,1) > (0,1,1) del selector base. Igualamos. */
[data-bs-theme="light"] .sidebar-base .navbar-nav .nav-link,
[data-bs-theme="light"] .navbar-nav .nav-link,
[data-bs-theme="light"] .sidebar-link,
:root:not([data-bs-theme="dark"]) .sidebar-base .navbar-nav .nav-link,
:root:not([data-bs-theme="dark"]) .navbar-nav .nav-link,
:root:not([data-bs-theme="dark"]) .sidebar-link {
    color: #1e2027;
}

[data-bs-theme="light"] .breadcrumb-item,
:root:not([data-bs-theme="dark"]) .breadcrumb-item {
    color: #4a5568;
}

[data-bs-theme="light"] .breadcrumb-item.active,
:root:not([data-bs-theme="dark"]) .breadcrumb-item.active {
    color: #1e2027;
}

[data-bs-theme="light"] .dropdown-item,
:root:not([data-bs-theme="dark"]) .dropdown-item {
    color: #1e2027;
}

/* ============================================================
   4. Componentes: cards, alertas, listas
   ============================================================ */
[data-bs-theme="light"] .card-title,
:root:not([data-bs-theme="dark"]) .card-title {
    color: #050911;
}

[data-bs-theme="light"] .alert,
:root:not([data-bs-theme="dark"]) .alert {
    color: #1e2027;
}

[data-bs-theme="light"] .list-group-item,
:root:not([data-bs-theme="dark"]) .list-group-item {
    color: #1e2027;
}

/* ============================================================
   5. Tablas
   ============================================================ */
[data-bs-theme="light"] .table,
:root:not([data-bs-theme="dark"]) .table {
    color: #1e2027;
}

/* ============================================================
   6. Formularios: labels y placeholders
   ============================================================ */
[data-bs-theme="light"] .form-label,
[data-bs-theme="light"] label,
:root:not([data-bs-theme="dark"]) .form-label,
:root:not([data-bs-theme="dark"]) label {
    color: #1e2027;
}

[data-bs-theme="light"] ::placeholder,
:root:not([data-bs-theme="dark"]) ::placeholder {
    color: #6b7280;
    opacity: 0.7;
}