/* Paleta común basada en Ubigeo. No cambia colores de marca ni documentos independientes. */
:root {
    --ui-font:"Times New Roman", Times, serif;
    --ui-surface:#ffffff; --ui-surface-soft:#f8fafc; --ui-surface-muted:#f1f5f9; --ui-surface-deep:#eef2f7;
    --ui-text:#0f172a; --ui-text-soft:#334155; --ui-muted:#5b6b82;
    --ui-border:#e2e8f0; --ui-border-strong:#cbd5e1;
    --ui-info:#1d4ed8; --ui-info-soft:#eff6ff; --ui-info-border:#bfdbfe;
    --ui-success:#047857; --ui-success-soft:#ecfdf5; --ui-success-border:#a7f3d0;
    --ui-warning:#92400e; --ui-warning-soft:#fffbeb; --ui-warning-border:#fde68a;
    --ui-danger:#b91c1c; --ui-danger-soft:#fef2f2; --ui-danger-border:#fecaca;
    --ui-purple:#6d28d9; --ui-purple-soft:#f5f3ff; --ui-purple-border:#ddd6fe;
    --ui-radius:16px; --ui-radius-sm:10px;
    --ui-shadow:0 10px 30px rgba(15,23,42,.07);
}
html[data-theme="dark"] {
    --ui-surface:#111827; --ui-surface-soft:#172033; --ui-surface-muted:#202b3d; --ui-surface-deep:#0f1a2c;
    --ui-text:#e8edf5; --ui-text-soft:#cbd5e1; --ui-muted:#a5b4c8;
    --ui-border:#2a3547; --ui-border-strong:#475569;
    --ui-info:#93c5fd; --ui-info-soft:#172b49; --ui-info-border:#315a8a;
    --ui-success:#6ee7b7; --ui-success-soft:#12382e; --ui-success-border:#28634c;
    --ui-warning:#fcd34d; --ui-warning-soft:#3a2b16; --ui-warning-border:#78551e;
    --ui-danger:#fca5a5; --ui-danger-soft:#3b202a; --ui-danger-border:#793847;
    --ui-purple:#c4b5fd; --ui-purple-soft:#2c2445; --ui-purple-border:#594078;
    --ui-shadow:0 10px 30px rgba(0,0,0,.2);
}
.app-shell {font-family:var(--ui-font)}
.app-shell :is(input,select,textarea,button){font-family:var(--ui-font, inherit)}
.app-shell :is(button,a,input,select,textarea):focus-visible{outline:2px solid var(--ui-info);outline-offset:3px}
.app-shell .sidebar :is(button,a):focus-visible{outline-color:#f2c96f}
.app-shell [hidden]{display:none!important}
.app-shell :is(.field-label,.form-label,.lc-view-label,.kpi-header,.confirm-msg){color:var(--ui-text-soft)}
.app-shell :is(.field-input,.form-input,.form-control,.form-select){color:var(--ui-text);background-color:var(--ui-surface);border-color:var(--ui-border-strong)}
.app-shell :is(.loc-title,.confirm-title,.lc-table-count,.lc-view-name){color:var(--ui-text)}
.app-shell :is(.lc-edit-modal,.lc-view-modal,.loc-modal,.loc-modal-content,.modal-container,.form-card,.form-card-body,.ub-body,.ub-panel){background-color:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border)}
.app-shell :is(.modal-container,.lc-edit-modal,.lc-view-modal,.loc-modal){max-height:calc(100dvh - 1.5rem);border-radius:var(--ui-radius)}
.app-shell :is(.modal-container,.lc-edit-modal,.lc-view-modal) :is(.modal-body,.lc-edit-body,.lc-view-body){min-height:0;overflow-y:auto;overscroll-behavior:contain}
.app-shell :is(.btn-form--cancel,.confirm-btn--cancel){background:var(--ui-surface-soft);border-color:var(--ui-border-strong);color:var(--ui-text-soft)}
.app-shell :is(.ub-table,.loc-table) td{color:var(--ui-text-soft);border-color:var(--ui-border)}
.app-shell :is(.ub-table,.loc-table) th{color:var(--ui-text-soft);background:var(--ui-surface-soft)}
.app-shell :is(.ub-table,.loc-table,.field-label,.form-card,.kpi-card){font-family:var(--ui-font, inherit)}
.app-shell .modal-container>form{display:flex;flex-direction:column;min-height:0;overflow:hidden;flex:1}
.app-shell :is(.btn-success,.ubg-btn--success){background:#047857;border-color:#047857;color:#fff}
.app-shell .btn-warning{background:#fbbf24;border-color:#fbbf24;color:#172033}
.app-shell .btn-warning:hover{background:#f59e0b;color:#172033}
.app-shell :is(.lc-table-wrap,.ub-table-wrap,.loc-table-wrap,.table-responsive){min-width:0;overscroll-behavior-x:contain}
.app-shell :is(.main-content,.content-area){min-width:0}
.app-shell input:disabled,.app-shell select:disabled{opacity:.65;cursor:not-allowed}
.app-shell input::placeholder,.app-shell textarea::placeholder{color:var(--ui-muted)}
/* El autocompletado del navegador no debe crear campos blancos en modo oscuro. */
html[data-theme="dark"] input:is(:autofill,:-webkit-autofill){
    -webkit-text-fill-color:var(--ui-text)!important;
    caret-color:var(--ui-text);
    box-shadow:0 0 0 1000px var(--ui-surface) inset!important;
}

/* Los indicadores mantienen un fondo y un texto del mismo par semántico. */
.app-shell .badge-green{background:var(--ui-success-soft);color:var(--ui-success)}
.app-shell :is(.badge-red,.badge-pink){background:var(--ui-danger-soft);color:var(--ui-danger)}
.app-shell .badge-yellow{background:var(--ui-warning-soft);color:var(--ui-warning)}
.app-shell .badge-blue{background:var(--ui-info-soft);color:var(--ui-info)}
.app-shell .badge-purple{background:var(--ui-purple-soft);color:var(--ui-purple)}
.app-shell .badge-gray{background:var(--ui-surface-muted);color:var(--ui-muted)}

@media(max-width:768px){
    .app-shell .content-area{padding:.75rem}
    .app-shell :is(.modal-overlay,.loc-modal-overlay,.ubg-modal-overlay){padding:.65rem}
    .app-shell :is(.modal-footer,.lc-edit-footer,.ubg-modal-footer){flex-wrap:wrap;gap:.5rem}
    .app-shell :is(.modal-footer,.lc-edit-footer) button{white-space:normal}
}
@media(prefers-reduced-motion:reduce){.app-shell *{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Una impresión desde oscuro nunca hereda texto claro sobre papel blanco. */
@media print {
    :root,html[data-theme="dark"]{
        --ui-surface:#fff;--ui-surface-soft:#f8fafc;--ui-surface-muted:#f1f5f9;
        --ui-text:#111;--ui-text-soft:#222;--ui-muted:#555;--ui-border:#ccc;--ui-border-strong:#aaa;
        --ui-info:#1d4ed8;--ui-info-soft:#eff6ff;--ui-success:#047857;--ui-success-soft:#ecfdf5;
        --ui-warning:#92400e;--ui-warning-soft:#fffbeb;--ui-danger:#b91c1c;--ui-danger-soft:#fef2f2;
        --ui-purple:#6d28d9;--ui-purple-soft:#f5f3ff;
    }
    .app-shell :is(.sidebar,.sidebar-overlay,.btn-hamburger,.topbar,.confirm-overlay,.modal-overlay,.loc-modal-overlay){display:none!important}
    html[data-theme] body.app-shell{background:#fff!important;color:#111!important;color-scheme:light}
    html[data-theme] .app-shell .main-content{margin:0!important;width:100%!important}
    html[data-theme] .app-shell .main-content,html[data-theme] .app-shell .main-content *{color:#111!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important}
    .app-shell :is(.lc-table-wrap,.ub-table-wrap,.loc-table-wrap,.table-responsive){overflow:visible!important;max-height:none!important}
}
