/* ===========================================
   Dashboard Inteligente - FASE C
   =========================================== */

/* --- Saludo --- */
.saludo-dashboard {
    background: var(--hero-gradiente);
    color: var(--hero-texto);
    border-radius: var(--radio-borde);
    padding: 1.75rem 2rem;
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    box-shadow: 0 24px 50px -30px rgba(49, 46, 129, 0.8);
    position: relative;
    overflow: hidden;
}
.saludo-dashboard::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 88% 10%, rgba(255, 255, 255, 0.16), transparent 45%);
    pointer-events: none;
}
.saludo-dashboard > * {
    position: relative;
    z-index: 1;
}
.saludo-dashboard h2 {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
}
.saludo-dashboard p {
    font-size: 0.95rem;
    opacity: 0.92;
    margin: 0.15rem 0 0;
}

/* --- Barra de alertas --- */
.barra-alertas {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}
.alerta-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 1rem;
    border-radius: var(--radio-borde-sm);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid transparent;
    transition: transform 0.15s, box-shadow 0.15s;
}
.alerta-item:hover {
    transform: translateX(4px);
    box-shadow: var(--sombra);
}
.alerta-item.alerta-exito {
    background: var(--alerta-exito-bg);
    color: var(--alerta-exito-texto);
    border-color: var(--alerta-exito-texto);
    border-left: 4px solid var(--color-exito);
}
.alerta-item.alerta-alerta {
    background: var(--alerta-media-bg);
    color: var(--alerta-media-texto);
    border-color: var(--alerta-media-texto);
    border-left: 4px solid var(--color-advertencia);
}
.alerta-item.alerta-error {
    background: var(--alerta-error-bg);
    color: var(--alerta-error-texto);
    border-color: var(--alerta-error-texto);
    border-left: 4px solid var(--color-peligro);
}
.alerta-item .alerta-icono {
    font-size: 1.2rem;
    flex-shrink: 0;
}

/* --- KPIs --- */
.dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}
.kpi-card {
    background: var(--superficie);
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 18px 40px -32px rgba(15, 23, 42, 0.65);
    padding: 1.15rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    border-top: 3px solid var(--color-borde);
    position: relative;
    overflow: hidden;
}
.kpi-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.35), transparent 55%);
    opacity: 0;
    transition: opacity 0.2s;
    pointer-events: none;
}
[data-theme="dark"] .kpi-card::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 55%);
}
.kpi-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--sombra);
    border-color: var(--color-acento);
}
.kpi-card:hover::after {
    opacity: 1;
}
.kpi-icono {
    font-size: 1.55rem;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: var(--hover-suave);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.kpi-contenido {
    min-width: 0;
}
.kpi-valor {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--color-texto);
    line-height: 1.15;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}
.kpi-valor.monto {
    font-size: 1.4rem;
}
.kpi-label {
    font-size: 0.78rem;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 2px;
}

/* --- Colores de borde por card --- */
.kpi-card.kpi-ventas-mes { border-top-color: #28a745; }
.kpi-card.kpi-ventas-hoy { border-top-color: #17a2b8; }
.kpi-card.kpi-ordenes-activas { border-top-color: #007bff; }
.kpi-card.kpi-pendientes { border-top-color: #ffc107; }
.kpi-card.kpi-listos { border-top-color: #28a745; }
.kpi-card.kpi-clientes-nuevos { border-top-color: #6f42c1; }
.kpi-card.kpi-ticket-prom { border-top-color: #fd7e14; }
.kpi-card.kpi-ingresos { border-top-color: #e94560; }

/* --- Accesos rápidos --- */
.accesos-rapidos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.75rem;
    margin-bottom: 2rem;
}
.acceso-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1rem 0.75rem;
    background: var(--superficie);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio-borde);
    text-decoration: none;
    color: var(--color-texto);
    font-size: 0.82rem;
    font-weight: 600;
    transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    text-align: center;
}
.acceso-btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--sombra);
    border-color: var(--color-acento);
    color: var(--color-acento);
}
.acceso-btn .acceso-icono {
    font-size: 1.6rem;
}
.acceso-btn.acceso-primario {
    background: var(--color-acento);
    color: var(--color-blanco);
    border-color: var(--color-acento);
}
.acceso-btn.acceso-primario:hover {
    background: var(--color-primario);
    border-color: var(--color-primario);
}

/* --- Secciones --- */
.seccion-dashboard {
    background: var(--superficie);
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde);
    box-shadow: var(--sombra);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}
.seccion-dashboard h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primario);
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.seccion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.seccion-header h3 {
    margin-bottom: 0;
}

/* --- Órdenes por estado --- */
.estados-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.75rem;
}
.estado-card {
    background: var(--superficie-alt);
    border-radius: var(--radio-borde);
    padding: 1rem;
    text-align: center;
    border-left: 4px solid var(--color-borde);
    transition: transform 0.2s;
}
.estado-card:hover {
    transform: translateY(-2px);
}
.estado-card .estado-cantidad {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primario);
}
.estado-card .estado-nombre {
    font-size: 0.78rem;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 4px;
    word-break: break-word;
}
.estado-card.estado-recibida { border-left-color: #17a2b8; }
.estado-card.estado-diagnostico { border-left-color: #ffc107; }
.estado-card.estado-esperando_aprobacion,
.estado-card.estado-presupuesto { border-left-color: #fd7e14; }
.estado-card.estado-reparacion { border-left-color: #007bff; }
.estado-card.estado-terminada,
.estado-card.estado-terminado { border-left-color: #28a745; }
.estado-card.estado-entregada,
.estado-card.estado-entregado { border-left-color: #6f42c1; }
.estado-card.estado-cancelada { border-left-color: #dc3545; }

/* --- Alertas del negocio (cards) --- */
.alertas-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0.75rem;
}
.alerta-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: var(--radio-borde);
    border: 1px solid var(--color-borde);
    transition: transform 0.2s, box-shadow 0.2s;
}
.alerta-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--sombra);
}
.alerta-card .alerta-icono {
    font-size: 1.5rem;
    flex-shrink: 0;
}
.alerta-card .alerta-texto {
    font-size: 0.88rem;
    font-weight: 500;
    flex: 1;
}
.alerta-card.alerta-exito { border-left: 4px solid var(--color-exito); }
.alerta-card.alerta-alerta { border-left: 4px solid var(--color-advertencia); }
.alerta-card.alerta-error { border-left: 4px solid var(--color-peligro); }

/* --- Resumen financiero --- */
.resumen-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.75rem;
}
.resumen-card {
    padding: 1rem;
    border-radius: var(--radio-borde-sm);
    background: var(--superficie-alt);
    text-align: center;
}
.resumen-card .resumen-valor {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-primario);
}
.resumen-card .resumen-label {
    font-size: 0.75rem;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 4px;
}
.resumen-card.resumen-positivo { border-left: 4px solid var(--color-exito); }
.resumen-card.resumen-negativo { border-left: 4px solid var(--color-peligro); }
.resumen-card.resumen-info { border-left: 4px solid var(--color-info); }

/* --- Modales de informe financiero --- */
#modal-ingresos::backdrop, #modal-egresos::backdrop {
    background: rgba(0,0,0,0.5);
}
#modal-ingresos, #modal-egresos {
    border: none;
    border-radius: 12px;
    padding: 24px;
    max-width: 600px;
    width: 90%;
    max-height: 80vh;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,0.2);
}
#modal-ingresos[open], #modal-egresos[open] {
    display: block;
}
#modal-ingresos .modal-header, #modal-egresos .modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}
#modal-ingresos .modal-cuerpo, #modal-egresos .modal-cuerpo {
    max-height: calc(80vh - 80px);
    overflow-y: auto;
    overflow-x: auto;
}
@media (max-width: 480px) {
    #modal-ingresos, #modal-egresos {
        width: 95%;
        padding: 16px;
        border-radius: 8px;
    }
}

/* --- Inventario --- */
.inventario-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
@media (max-width: 640px) {
    .inventario-grid {
        grid-template-columns: 1fr;
    }
}
.inventario-stats {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}
.inventario-stat {
    flex: 1;
    min-width: 100px;
    padding: 0.75rem;
    background: var(--superficie-alt);
    border-radius: var(--radio-borde);
    text-align: center;
}
.inventario-stat .stat-numero {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--color-primario);
}
.inventario-stat .stat-label {
    font-size: 0.72rem;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 2px;
}
.inventario-stat.stat-peligro .stat-numero { color: var(--color-peligro); }

/* --- Clientes frecuentes --- */
.clientes-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
@media (max-width: 640px) {
    .clientes-grid {
        grid-template-columns: 1fr;
    }
}
.clientes-stats {
    display: flex;
    gap: 1rem;
}
.cliente-stat {
    flex: 1;
    padding: 0.75rem;
    background: var(--superficie-alt);
    border-radius: var(--radio-borde);
    text-align: center;
}
.cliente-stat .stat-numero {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--color-primario);
}
.cliente-stat .stat-label {
    font-size: 0.72rem;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-top: 2px;
}
.lista-frecuentes {
    list-style: none;
    padding: 0;
    margin: 0;
}
.lista-frecuentes li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--color-borde);
    font-size: 0.88rem;
}
.lista-frecuentes li:last-child {
    border-bottom: none;
}
.lista-frecuentes .frecuente-nombre {
    font-weight: 500;
}
.lista-frecuentes .frecuente-ordenes {
    color: var(--color-texto-claro);
    font-size: 0.82rem;
}

/* --- Tabla de más vendidos --- */
.tabla-mas-vendidos {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}
.tabla-mas-vendidos th {
    text-align: left;
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    color: var(--color-texto-claro);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    border-bottom: 2px solid var(--color-borde);
}
.tabla-mas-vendidos td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--borde-suave);
}
.tabla-mas-vendidos tr:last-child td {
    border-bottom: none;
}

/* --- Timeline de actividad --- */
.actividad-timeline {
    max-height: 400px;
    overflow-y: auto;
}
.actividad-item {
    display: flex;
    gap: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid var(--borde-suave);
    font-size: 0.85rem;
}
.actividad-item:last-child {
    border-bottom: none;
}
.actividad-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--color-acento);
    flex-shrink: 0;
    margin-top: 5px;
}
.actividad-contenido {
    flex: 1;
    min-width: 0;
}
.actividad-accion {
    font-weight: 600;
    color: var(--color-texto);
    text-transform: capitalize;
}
.actividad-detalle {
    color: var(--color-texto-claro);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}
.actividad-fecha {
    font-size: 0.72rem;
    color: var(--color-texto-claro);
    margin-top: 2px;
    white-space: nowrap;
}

/* --- Sin datos --- */
.sin-datos {
    text-align: center;
    padding: 2rem;
    color: var(--color-texto-claro);
    font-size: 0.9rem;
}

/* --- Responsive --- */
@media (max-width: 768px) {
    .dashboard-kpis {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 0.75rem;
    }
    .kpi-card {
        padding: 0.9rem;
    }
    .kpi-valor {
        font-size: 1.4rem;
    }
    .kpi-valor.monto {
        font-size: 1.2rem;
    }
    .kpi-icono {
        font-size: 1.5rem;
        width: 36px;
        height: 36px;
    }
    .accesos-rapidos {
        grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    }
    .saludo-dashboard {
        padding: 1rem 1.25rem;
    }
    .saludo-dashboard h2 {
        font-size: 1.15rem;
    }
    .estados-grid {
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    }
    .seccion-dashboard {
        padding: 1rem;
    }
    .dashboard-main-grid {
        grid-template-columns: 1fr !important;
    }
}

/* --- Mi Día Widget --- */
.mi-dia-group {
    margin-bottom: 8px;
    border: 1px solid var(--color-borde);
    border-radius: var(--radio-borde);
    overflow: hidden;
}
.mi-dia-group[open] {
    box-shadow: var(--sombra);
}
.mi-dia-header {
    padding: 10px 14px;
    background: var(--superficie-alt);
    cursor: pointer;
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--color-texto);
    list-style: none;
    user-select: none;
    transition: background 0.15s;
}
.mi-dia-header::-webkit-details-marker { display: none; }
.mi-dia-header::marker { display: none; content: ""; }
.mi-dia-header:hover {
    background: var(--hover-suave);
}
.mi-dia-count {
    font-weight: 400;
    color: var(--color-texto-claro);
    font-size: 0.8rem;
}
.mi-dia-items {
    padding: 8px 14px;
    background: var(--superficie);
}
.mi-dia-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--borde-suave);
    font-size: 0.85rem;
    gap: 8px;
}
.mi-dia-item:last-child {
    border-bottom: none;
}
.mi-dia-item-info {
    flex: 1;
    min-width: 0;
}
.mi-dia-item-numero {
    font-weight: 600;
    color: var(--color-primario);
}
.mi-dia-item-cliente {
    color: var(--color-texto-claro);
    font-size: 0.8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mi-dia-item-action {
    flex-shrink: 0;
}
.mi-dia-item-action .boton-chico {
    font-size: 0.75rem;
    padding: 3px 10px;
}
.mi-dia-sin-datos {
    padding: 8px 0;
    color: var(--color-texto-claro);
    font-size: 0.82rem;
    font-style: italic;
}

/* --- Tabs del dashboard (Hoy / Análisis) --- */
.tabs-dashboard {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid var(--color-borde);
    padding-bottom: 0;
    flex-wrap: wrap;
}
.tab-btn {
    background: var(--superficie);
    border: 1px solid var(--color-borde);
    border-bottom: none;
    border-radius: var(--radio-borde) var(--radio-borde) 0 0;
    padding: 0.65rem 1.5rem;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--color-texto-claro);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.tab-btn:hover {
    color: var(--color-primario);
    border-color: var(--color-acento);
}
.tab-btn.activo {
    color: var(--color-blanco);
    background: var(--color-primario);
    border-color: var(--color-primario);
}
.tab-panel {
    display: none;
}
.tab-panel.activo {
    display: block;
}

/* --- Filtro de fechas (tab Análisis) --- */
.filtro-fechas {
    display: flex;
    gap: 0.9rem;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}
.filtro-fechas label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-texto-claro);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 4px;
}
.filtro-fecha-input {
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde-sm);
    font-size: 0.88rem;
    color: var(--color-texto);
    background: var(--superficie);
    color-scheme: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.filtro-fecha-input:focus {
    outline: none;
    border-color: var(--color-acento);
    box-shadow: 0 0 0 3px var(--hover-suave);
}

/* --- Gráficos (tab Análisis) --- */
.charts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.chart-card {
    background: var(--superficie);
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde);
    box-shadow: var(--sombra);
    padding: 1rem 1.25rem;
}
.chart-card h3 {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--color-primario);
    margin: 0 0 0.75rem 0;
}
.chart-canvas-wrap {
    position: relative;
    height: 280px;
}
.chart-canvas-wrap canvas {
    max-height: 280px;
}

/* --- Acciones de exportación --- */
.export-acciones {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.export-acciones .boton {
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 600;
    text-align: center;
}

@media (max-width: 768px) {
    .charts-grid {
        grid-template-columns: 1fr;
    }
    .tab-btn {
        padding: 0.55rem 1rem;
        font-size: 0.85rem;
    }
}

/* ===========================================
   Capa visual moderna (2026) — tokens claro/oscuro
   =========================================== */

/* --- Tabs tipo pills, más livianos y con foco visible --- */
.tabs-dashboard {
    gap: 0.4rem;
    padding: 0.35rem;
    background: var(--superficie-alt);
    border: 1px solid var(--borde-suave);
    border-bottom: 1px solid var(--borde-suave);
    border-radius: 999px;
    width: fit-content;
    max-width: 100%;
    overflow-x: auto;
}
.tab-btn {
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 0.5rem 1.1rem;
    background: transparent;
    line-height: 1.2;
    white-space: nowrap;
}
.tab-btn:hover {
    color: var(--color-acento);
    border-color: transparent;
    background: var(--hover-suave);
}
.tab-btn.activo,
.tab-btn.activo:hover {
    color: #fff;
    background: var(--color-acento);
    border-color: var(--color-acento);
    box-shadow: 0 10px 24px -14px var(--color-acento);
}
.tab-btn:focus-visible,
.acceso-btn:focus-visible,
.alerta-item:focus-visible,
.kpi-card:focus-visible {
    outline: 2px solid var(--color-acento);
    outline-offset: 2px;
}

/* --- Tarjetas de gráfico --- */
.chart-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 20px 44px -34px rgba(15, 23, 42, 0.6);
    transition: box-shadow 0.2s, border-color 0.2s, transform 0.2s;
}
.chart-card:hover {
    border-color: var(--color-acento);
    box-shadow: var(--sombra);
}
.chart-card h3 {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--borde-suave);
    margin-bottom: 0.9rem;
}

/* --- Secciones: borde y foco --- */
.seccion-dashboard {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 20px 44px -34px rgba(15, 23, 42, 0.6);
}

/* --- Resumen financiero: números más protagonistas --- */
.resumen-card .resumen-valor {
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* --- Modales con superficie del tema --- */
#modal-ingresos, #modal-egresos, .modal-dashboard {
    background: var(--superficie);
    color: var(--color-texto);
    border: 1px solid var(--borde-suave);
    box-shadow: 0 30px 80px -40px rgba(0, 0, 0, 0.65);
}
#modal-ingresos::backdrop, #modal-egresos::backdrop, .modal-dashboard::backdrop {
    background: rgba(2, 6, 23, 0.55);
    backdrop-filter: blur(2px);
}
#modal-ingresos input, #modal-ingresos select,
#modal-egresos input, #modal-egresos select,
.modal-dashboard input, .modal-dashboard select {
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde-sm);
    background: var(--superficie);
    color: var(--color-texto);
    padding: 0.55rem 0.75rem;
}

/* --- Empty states más claros --- */
.sin-datos {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    background: var(--superficie-alt);
    border: 1px dashed var(--borde-suave);
    border-radius: var(--radio-borde-sm);
    color: var(--color-texto-claro);
}

/* --- Mi Día: indicador de colapso propio --- */
.mi-dia-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}
.mi-dia-header::before {
    content: "▸";
    display: inline-block;
    margin-right: 0.45rem;
    transition: transform 0.15s;
    color: var(--color-texto-claro);
}
.mi-dia-group[open] > .mi-dia-header::before {
    transform: rotate(90deg);
}
.mi-dia-count {
    margin-left: auto;
}

/* --- Grillas inline del template, responsive real --- */
.dashboard-main-grid {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 1.5rem;
    align-items: start;
}
@media (max-width: 1024px) {
    .dashboard-main-grid {
        grid-template-columns: 1fr;
    }
}

/* --- Accesibilidad: respetar movimiento reducido --- */
@media (prefers-reduced-motion: reduce) {
    .kpi-card,
    .acceso-btn,
    .alerta-item,
    .chart-card,
    .estado-card,
    .mi-dia-header::before {
        transition: none !important;
    }
    .kpi-card:hover,
    .acceso-btn:hover,
    .alerta-item:hover,
    .estado-card:hover {
        transform: none !important;
    }
}

.dashboard-main-grid {
    margin-bottom: 1.5rem;
}

/* --- Inputs de modales del dashboard --- */
.input-modal {
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--borde-suave);
    border-radius: var(--radio-borde-sm);
    background: var(--superficie);
    color: var(--color-texto);
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.input-modal:focus {
    outline: none;
    border-color: var(--color-acento);
    box-shadow: 0 0 0 3px var(--hover-suave);
}

/* --- Mi Día: meta por ítem (estado, fecha, monto) --- */
.mi-dia-item-meta {
    margin-top: 3px;
    font-size: 0.74rem;
    color: var(--color-texto-claro);
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}
.mi-dia-item-estado {
    text-transform: capitalize;
    background: var(--superficie-alt);
    border: 1px solid var(--borde-suave);
    border-radius: 999px;
    padding: 0 0.5rem;
    line-height: 1.5;
}
.mi-dia-item-monto {
    font-variant-numeric: tabular-nums;
    color: var(--color-acento);
    font-weight: 700;
}