/*
 * Light Theme Override - FEAT Financial Application
 * Este archivo asegura que la aplicación siempre use el tema claro
 * independientemente de las preferencias del sistema operativo
 */

/* Forzar tema claro - Sobrescribir cualquier configuración dark */
:root {
    /* Colores base - Tema claro forzado */
    --color-bg: #fafafa !important;
    --color-surface: #ffffff !important;
    --color-surface-elevated: #ffffff !important;
    --color-border: #e5e5e5 !important;
    --color-border-subtle: #f5f5f5 !important;
    --color-text: #171717 !important;
    --color-text-secondary: #525252 !important;
    --color-text-muted: #737373 !important;

    /* Colores de marca - Tema claro */
    --color-brand-primary: #171717 !important;
    --color-brand-primary-hover: #262626 !important;
    --color-brand-primary-light: #f5f5f5 !important;
    
    /* Colores de acento */
    --color-indigo: #6366f1 !important;
    --color-indigo-hover: #3f38c1 !important;
    --color-indigo-light: #eef2ff !important;
}

/* Asegurar que el body siempre use el tema claro */
body {
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}

/* Sobrescribir cualquier configuración dark en cards */
.card {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

.card-header {
    background: var(--color-surface) !important;
    border-bottom-color: var(--color-border-subtle) !important;
    color: var(--color-text) !important;
}

/* Asegurar que las tablas usen el tema claro */
.table {
    color: var(--color-text) !important;
}

.table thead th {
    background: var(--color-surface-elevated) !important;
    border-bottom-color: var(--color-border) !important;
    color: var(--color-text-secondary) !important;
}

.table tbody td {
    border-bottom-color: var(--color-border-subtle) !important;
}

.table-hover tbody tr:hover {
    background-color: var(--color-surface-elevated) !important;
}

/* Asegurar que los formularios usen el tema claro */
.form-control,
.form-select {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--bs-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25) !important;
}

/* Asegurar que los dropdowns usen el tema claro */
.dropdown-menu {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.dropdown-item {
    color: var(--color-text) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--color-surface-elevated) !important;
    color: var(--color-text) !important;
}

/* Asegurar que los modales usen el tema claro */
.modal-content {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.modal-header {
    border-bottom-color: var(--color-border-subtle) !important;
}

.modal-footer {
    border-top-color: var(--color-border-subtle) !important;
}

/* Asegurar que las alertas usen los colores correctos */
.alert-primary {
    background-color: #cfe2ff !important;
    border-color: #b6d4fe !important;
    color: #084298 !important;
}

.alert-success {
    background-color: #d1e7dd !important;
    border-color: #badbcc !important;
    color: #0f5132 !important;
}

.alert-danger {
    background-color: #f8d7da !important;
    border-color: #f5c2c7 !important;
    color: #842029 !important;
}

.alert-warning {
    background-color: #fff3cd !important;
    border-color: #ffecb5 !important;
    color: #664d03 !important;
}

.alert-info {
    background-color: #d1ecf1 !important;
    border-color: #b6effb !important;
    color: #055160 !important;
}

/* Asegurar que los badges usen los colores correctos */
.badge {
    color: white !important;
}

.badge.bg-primary {
    background-color: var(--bs-primary) !important;
}

.badge.bg-success {
    background-color: var(--bs-success) !important;
}

.badge.bg-danger {
    background-color: var(--bs-danger) !important;
}

.badge.bg-warning {
    background-color: var(--bs-warning) !important;
    color: #000 !important;
}

.badge.bg-info {
    background-color: var(--bs-info) !important;
}

/* Asegurar que los tooltips usen el tema claro */
.tooltip .tooltip-inner {
    background-color: var(--color-text) !important;
    color: var(--color-surface) !important;
}

/* Asegurar que los popovers usen el tema claro */
.popover {
    background-color: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.popover-header {
    background-color: var(--color-surface-elevated) !important;
    border-bottom-color: var(--color-border-subtle) !important;
}

/* Scrollbar para tema claro */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--color-bg) !important;
}

::-webkit-scrollbar-thumb {
    background: var(--color-border) !important;
    border-radius: var(--radius-sm);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-text-muted) !important;
}

/* Asegurar que los elementos personalizados usen el tema claro */
.financial-navbar {
    background: var(--color-surface) !important;
    border-bottom-color: var(--color-border) !important;
}

.metric-card {
    background: var(--color-surface) !important;
    border-color: var(--color-border-subtle) !important;
}

.financial-table {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.account-card {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.filter-card {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

.chart-container {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
}

/* Asegurar que los estados de hover funcionen correctamente */
.btn:hover {
    transform: translateY(-1px);
}

.card:hover {
    box-shadow: var(--shadow-md);
}

/* Media query para sobrescribir cualquier configuración dark del sistema */
@media (prefers-color-scheme: dark) {
    :root {
        --color-bg: #fafafa !important;
        --color-surface: #ffffff !important;
        --color-surface-elevated: #ffffff !important;
        --color-border: #e5e5e5 !important;
        --color-border-subtle: #f5f5f5 !important;
        --color-text: #171717 !important;
        --color-text-secondary: #525252 !important;
        --color-text-muted: #737373 !important;
        --color-brand-primary: #171717 !important;
        --color-brand-primary-hover: #262626 !important;
        --color-brand-primary-light: #f5f5f5 !important;
    }
    
    body {
        background-color: #fafafa !important;
        color: #171717 !important;
    }
}