/* =====================================================================
   2026-09-26: MODO OSCURO de PortalLogistica (html.modo-oscuro).
   MudBlazor usa su PaletteDark (Shared/TemaHcc.cs); este archivo cubre los estilos propios
   (pl-custom.css). La parte "generado" se armo recorriendo esas hojas y cambiando
   fondos claros -> #1E293B, textos oscuros -> #E2E8F0 y bordes claros -> #334155.
   Si se agregan estilos nuevos con colores claros, agregar aqui su version oscura.
   ===================================================================== */
html.modo-oscuro {
    color-scheme: dark;
    --pl-bg: #0F172A;
    --pl-gradient-page: linear-gradient(160deg, #0B1220 0%, #0F172A 60%, #111C33 100%);
    --pl-border: #334155;
    --pl-dark: #E2E8F0;
    --pl-gray: #94A3B8;
    --pl-primary-light: #172033;
    --pl-primary-soft: #1E3A8A;
}
html.modo-oscuro, html.modo-oscuro body { background: #0F172A !important; color: #E2E8F0; }
html.modo-oscuro .mud-main-content { background: var(--pl-gradient-page) !important; }
html.modo-oscuro .mud-main-content .mud-paper { background: #1E293B !important; color: #E2E8F0; }
html.modo-oscuro h1, html.modo-oscuro h2, html.modo-oscuro h3, html.modo-oscuro h4, html.modo-oscuro h5, html.modo-oscuro h6 { color: #E2E8F0; }
html.modo-oscuro .mud-text-secondary { color: #94A3B8 !important; }
html.modo-oscuro a:not(.dsec-btn):not(.pl-bn-item):not(.mud-button-root) { color: #93C5FD; }
html.modo-oscuro .form-control, html.modo-oscuro .form-select, html.modo-oscuro input, html.modo-oscuro select, html.modo-oscuro textarea { color: #E2E8F0; }

/* ---- generado desde pl-custom.css ---- */
html.modo-oscuro .pl-card { background: #1E293B !important; }
html.modo-oscuro .form-control, html.modo-oscuro .pl-field input, html.modo-oscuro .pl-field select { background: #1E293B !important; }
html.modo-oscuro .form-control:focus, html.modo-oscuro .pl-field input:focus { background: #1E293B !important; }
html.modo-oscuro .pl-btn-secondary { background: #1E293B !important; }
html.modo-oscuro .exito { border: 1px solid #334155 !important; }
html.modo-oscuro .pl-aviso-rotulado { border: 1px solid #334155 !important; }
html.modo-oscuro .error { background: #1E293B !important; border: 1px solid #334155 !important; }
html.modo-oscuro .pl-table { background: #1E293B !important; }
html.modo-oscuro .pl-table tbody tr:hover { background: #1E293B !important; }
html.modo-oscuro .pl-auth-card { background: #1E293B !important; }
html.modo-oscuro .pl-stat-box { background: #1E293B !important; }
html.modo-oscuro .pl-info-item .icono.whatsapp { background: #1E293B !important; }
html.modo-oscuro .pl-info-item .icono.redes { background: #1E293B !important; }
html.modo-oscuro .pl-agencia-card { background: #1E293B !important; }
html.modo-oscuro .pl-agencia-azul { border-color: #334155 !important; }
html.modo-oscuro .pl-estado-pill.entregado { background: #1E293B !important; }
html.modo-oscuro .pl-estado-pill.cancelado { background: #1E293B !important; }
html.modo-oscuro .pl-timeline-dot { background: #1E293B !important; }
html.modo-oscuro .pl-accion-foto:hover { background: #1E293B !important; }
html.modo-oscuro .dash-top h2 { color: #E2E8F0 !important; }
html.modo-oscuro .dash-top-sub { color: #94A3B8 !important; }
html.modo-oscuro .dash-mes-nav { background: #1E293B !important; border: 1px solid #334155 !important; }
html.modo-oscuro .dash-mes-nav span { color: #E2E8F0 !important; }
html.modo-oscuro .dash-mes-nav button:hover:not(:disabled) { background: #1E293B !important; }
html.modo-oscuro .dash-kpi { background: #1E293B !important; border: 1px solid #334155 !important; }
html.modo-oscuro .dash-kpi-label { color: #94A3B8 !important; }
html.modo-oscuro .dash-kpi-num { color: #E2E8F0 !important; }
html.modo-oscuro .dash-ring::before { background: #1E293B !important; }
html.modo-oscuro .dash-ring span { color: #E2E8F0 !important; }
html.modo-oscuro .dash-panel { background: #1E293B !important; border: 1px solid #334155 !important; }
html.modo-oscuro .dash-panel-head h4 { color: #E2E8F0 !important; }
html.modo-oscuro .dash-panel-desc { color: #94A3B8 !important; }
html.modo-oscuro .dash-bar-label { color: #E2E8F0 !important; }
html.modo-oscuro .dash-bar-track { background: #1E293B !important; }
html.modo-oscuro .dash-bar-val { color: #E2E8F0 !important; }
html.modo-oscuro .dash-cols { border-bottom: 2px solid #334155 !important; }
html.modo-oscuro .dash-col-val { color: #E2E8F0 !important; }
html.modo-oscuro .dash-col-labels span { color: #94A3B8 !important; }
html.modo-oscuro .dash-chart-legend { color: #94A3B8 !important; }
html.modo-oscuro .dash-donut-hole { background: #1E293B !important; }
html.modo-oscuro .dash-donut-hole strong { color: #E2E8F0 !important; }
html.modo-oscuro .dash-donut-hole span { color: #94A3B8 !important; }
html.modo-oscuro .dash-legend-name { color: #E2E8F0 !important; }
html.modo-oscuro .dash-legend-pct { color: #94A3B8 !important; }
html.modo-oscuro .dash-table td { border-bottom: 1px solid #334155 !important; }
html.modo-oscuro .dash-table tbody tr:nth-child(even) { background: #1E293B !important; }
html.modo-oscuro .dash-table tfoot td { background: #1E293B !important; }
html.modo-oscuro .dash-tabla-scroll { border: 1px solid #334155 !important; }
html.modo-oscuro .dash-mini { background: #1E293B !important; }
html.modo-oscuro .dash-pill.azul { background: #1E293B !important; }
html.modo-oscuro .dash-pill.naranja { background: #1E293B !important; }
html.modo-oscuro .pl-estado-rec { background: #1E293B !important; color: #E2E8F0 !important; }
html.modo-oscuro .pl-estado-rec.e1 { background: #1E293B !important; }
html.modo-oscuro .pl-estado-rec.e2 { background: #1E293B !important; }
html.modo-oscuro .pl-estado-rec.e3 { background: #1E293B !important; }
html.modo-oscuro .pl-estado-rec.e4 { background: #1E293B !important; }
html.modo-oscuro .pl-estado-rec.e5 { background: #1E293B !important; }
html.modo-oscuro .pl-timeline-item::before { border: 2px solid #334155 !important; }
html.modo-oscuro .pl-timeline-fecha { color: #94A3B8 !important; }
html.modo-oscuro .pl-timeline-coment { color: #E2E8F0 !important; }


/* 2026-09-26: bloques de color del dashboard (dsec / tema-hcc) y anillos de porcentaje */
html.modo-oscuro .dsec, html.modo-oscuro .tema-hcc { --tinte: #111C33 !important; --borde: #243352 !important; }
html.modo-oscuro .dsec-ent, html.modo-oscuro .tema-hcc.tema-ent, html.modo-oscuro .tema-ent { --tinte: #1F150F !important; --borde: #4A2A16 !important; }
html.modo-oscuro .dsec { background: var(--tinte) !important; border-color: var(--borde) !important; }
html.modo-oscuro .dsec-avance-txt, html.modo-oscuro .dsec-avance-txt b { color: #E6EBF5 !important; }
html.modo-oscuro .dsec-avance-pct { color: #93C5FD !important; }
html.modo-oscuro .dsec-ent .dsec-avance-pct { color: #FDBA74 !important; }
html.modo-oscuro .dsec-barra { background: rgba(255,255,255,.08) !important; }
html.modo-oscuro .dsec .dash-kpi, html.modo-oscuro .dsec-kpi { background: #16213A !important; border-color: #26334F !important; }
html.modo-oscuro .dash-ring { background: conic-gradient(var(--c) calc(var(--p) * 1%), #26334F 0) !important; }
html.modo-oscuro .dash-ring::before { background: #16213A !important; }
html.modo-oscuro .dash-ring span { color: #E6EBF5 !important; }
html.modo-oscuro .dash-kpi-sub { color: #FDBA74 !important; }
html.modo-oscuro .tema-hcc .dash-panel, html.modo-oscuro .dash-panel { background: #16213A !important; border-color: #26334F !important; }
html.modo-oscuro .dash-panel-body, html.modo-oscuro .dash-table td { color: #E6EBF5 !important; }
html.modo-oscuro .dash-table th { color: #9AA8C7 !important; }
html.modo-oscuro .dash-table td, html.modo-oscuro .dash-table th { border-color: #26334F !important; }
html.modo-oscuro .dash-mes-nav { background: #16213A !important; border-color: #26334F !important; }