/* ════════════════════════════════════════════════════════════════
   SIGER — Manual de Marca del Gobierno de Honduras 2026-2030
   Dirección de Gestión por Resultados (DIGER)

   Paleta oficial DIGER (Manual de Marca, pag. 09):
     Azul marino    #02395e   (principal · estabilidad)
     Azul medio     #1a65a3   (corporativo · enfoque analítico)
     Azul claro     #7acbdd   (celeste · cercanía e innovación)
     Dorado         #ad8411   (acento institucional)
     Negro          #231f20

   Tipografía oficial DIGER (Manual de Marca, pag. 08):
     Poppins ExtraBold (800) para titulares
     Poppins Medium    (500) para cuerpo de texto
   Se declaran aquí los pesos intermedios (Regular 400, Medium 500,
   SemiBold 600, Bold 700, ExtraBold 800) para que cualquier vista
   del sistema —no solo el módulo ODS— pueda usar la familia
   "Poppins" sin tener que redeclarar los @font-face.
   ════════════════════════════════════════════════════════════════ */

@font-face {
    font-family: 'Poppins';
    src: url('/fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('/fonts/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('/fonts/Poppins-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('/fonts/Poppins-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('/fonts/Poppins-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --azul:         #02395e;   /* DIGER · azul marino — principal */
    --azul-d:       #022a47;   /* derivado oscuro — gradientes y fondos profundos */
    --azul-l:       #1a65a3;   /* DIGER · azul medio — corporativo */
    --celeste:      #7acbdd;   /* DIGER · azul claro — innovación/cercanía */
    --dorado:       #ad8411;
    --dorado-l:     #c9a227;
    --dorado-bg:    #faf5e8;
    --negro:        #231f20;
    --texto:        #3a3633;
    --texto-sec:    #706a63;
    --fondo:        #f5f4f1;
    --blanco:       #ffffff;
    --borde:        #ddd8d0;
    --borde-l:      #eae6df;
    --radio:        10px;
    --radio-s:      6px;
    --ease:         .25s cubic-bezier(.4,0,.2,1);
    --sombra-1:     0 1px 3px rgba(0,0,0,.05), 0 2px 12px rgba(0,0,0,.04);
    --sombra-2:     0 4px 12px rgba(0,0,0,.06), 0 8px 28px rgba(0,0,0,.05);
    --sombra-3:     0 12px 28px rgba(0,0,0,.08), 0 24px 56px rgba(0,0,0,.06);
}

/* ─── TIPOGRAFÍA GLOBAL ─── (Manual de Marca DIGER, pág. 08)
   Poppins como familia oficial del sistema. Mantengo el !important
   porque el sistema arrastra muchísimos overrides legacy con la
   misma prioridad y necesita esta capa para ganar consistentemente.
   `code, pre` se trataron por separado más abajo con monospace. */
body, html, p, label, span, a, li, td, th,
input, select, textarea, button,
.form-control, .form-horizontal .control-label,
h1, h2, h3, h4, h5, h6,
.nav.ttr_menu_items li .ttr_menu_items_parent_link,
.nav.ttr_menu_items li a.ttr_menu_items_parent_link_arrow,
.badge, .breadcrumb, .breadcrumb a,
.tituloAvance, .porcentajeAvance, .itemHeaderPrincipal,
.modal-title, .card-title,
.dataTables_wrapper, .select2-container, .swal2-popup,
.jqx-widget, .dropdown-menu, .tooltip, .popover,
.alert, .btn, .nav-tabs>li>a, .nav-pills>li>a,
legend {
    font-family: 'Poppins', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}

/* Código siempre en fuente monoespaciada para que sea legible
   (la regla original lo metía con todo lo demás en serif). */
code, pre, kbd, samp, .oa-mono, .cp-mono {
    font-family: 'JetBrains Mono', SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace !important;
}

/* Pesos del manual: 800 ExtraBold para titulares y 500 Medium para
   cuerpo. Heredados desde aquí y respetados por los selectores
   específicos que ya definen su propio font-weight. */
body {
    font-weight: 500;
}
h1, h2, h3 {
    font-weight: 800;
}
h4, h5, h6 {
    font-weight: 700;
}

/* ─── BASE ─── */
body {
    background: var(--fondo) !important;
    color: var(--texto) !important;
    -webkit-font-smoothing: antialiased;
    line-height: 1.5;
}

a { color: var(--azul); transition: color var(--ease); }
a:hover, a:focus { color: var(--dorado) !important; text-decoration: none; }

h1, h2, h3, h4, h5, h6 { color: var(--azul); font-weight: 700; letter-spacing: -.01em; }

/* ════════════════════════════════════════════════════════════
   NAVBAR — Barra principal de gobierno
   ════════════════════════════════════════════════════════════ */

/* Franja dorada superior */
#ttr_menu::before {
    content: ''; display: block; height: 3px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l) 50%, var(--dorado));
}

.navbar-default, #ttr_menu .navbar, #ttr_menu nav.navbar-default {
    background: linear-gradient(180deg, #004588 0%, var(--azul) 60%, var(--azul-d) 100%) !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(0,42,86,.4) !important;
    min-height: 64px !important;
}

.ttr_images_container, .ttr_menu_logo { background: transparent !important; }
#logoSig { filter: drop-shadow(0 1px 4px rgba(0,0,0,.25)); transition: opacity var(--ease); }
#logoSig:hover { opacity: .9; }

/* Links del navbar — SOLO nivel top (sobre fondo azul) */
.nav.ttr_menu_items > li > .ttr_menu_items_parent_link,
.nav.ttr_menu_items > li > a.ttr_menu_items_parent_link_arrow,
#ttr_menu .nav.ttr_menu_items > li > a,
.menu-center ul.navbar-nav > li > a {
    color: rgba(255,255,255,.9) !important;
    font-weight: 600; font-size: 18px; letter-spacing: .4px;
    padding: 38px 24px !important; transition: all var(--ease);
    position: relative;
}

/* Efecto underline dorado */
.nav.ttr_menu_items > li > a::after,
.menu-center ul.navbar-nav > li > a::after {
    content: ''; position: absolute;
    bottom: 8px; left: 50%; width: 0; height: 2px;
    background: var(--dorado-l);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transform: translateX(-50%);
}
.nav.ttr_menu_items > li:hover > a::after,
.menu-center ul.navbar-nav > li:hover > a::after { width: 50%; }

#ttr_menu ul.nav.ttr_menu_items > li:hover > a,
#ttr_menu ul.nav.ttr_menu_items > li:hover > a.ttr_menu_items_parent_link,
.nav.ttr_menu_items > li:hover > span.separator,
#ttr_menu .nav.ttr_menu_items > li:hover > a.ttr_menu_items_parent_link_arrow,
.menu-center ul.navbar-nav > li:hover > a { color: var(--dorado-l) !important; }

/* Dropdowns del navbar */
.menu-center ul.navbar-nav .dropdown-menu,
.nav.ttr_menu_items .dropdown-menu {
    border: none !important; border-top: 2px solid var(--dorado) !important;
    background: var(--blanco) !important;
    box-shadow: var(--sombra-3) !important;
    border-radius: 0 0 var(--radio) var(--radio) !important;
    padding: 4px 0 !important; margin-top: 0 !important;
    animation: ddSlide .2s ease;
    min-width: 320px;
}
/* Navbar dropdown items — permitir wrap de texto largo */
.nav.ttr_menu_items .dropdown-menu > li > a,
.nav.ttr_menu_items .dropdown-menu li a.ttr_menu_items_parent_link {
    white-space: normal !important;
    word-wrap: break-word !important;
    line-height: 1.4 !important;
}
@keyframes ddSlide { from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none} }

/* Items dentro de dropdowns — texto oscuro sobre fondo blanco */
.dropdown-menu > li > a,
.dropdown-menu li a.ttr_menu_items_parent_link,
.dropdown-menu li a.ttr_menu_items_parent_link.dropdown-toggle,
.dropdown-menu .ttr_menu_items_parent.dropdown > a,
.nav.ttr_menu_items .dropdown-menu li .ttr_menu_items_parent_link,
.nav.ttr_menu_items .dropdown-menu li a.ttr_menu_items_parent_link.dropdown-toggle {
    color: var(--texto) !important; padding: 10px 20px !important;
    font-size: 13.5px !important; transition: all .15s !important;
    border-left: 3px solid transparent;
    background: var(--blanco) !important;
}

/* Hover en items de dropdown — incluye sub-dropdown parents */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu li a.ttr_menu_items_parent_link:hover,
.dropdown-menu li a.ttr_menu_items_parent_link.dropdown-toggle:hover,
.dropdown-menu .ttr_menu_items_parent.dropdown > a:hover,
.nav.ttr_menu_items .dropdown-menu li .ttr_menu_items_parent_link:hover,
.nav.ttr_menu_items .dropdown-menu li a.dropdown-toggle:hover {
    background: rgba(0,61,123,.06) !important; color: var(--azul) !important;
}

/* Sub-dropdown parents que están abiertos */
.dropdown-menu .ttr_menu_items_parent.dropdown.open > a,
.dropdown-menu .ttr_menu_items_parent.dropdown.open > a.dropdown-toggle,
.nav.ttr_menu_items .dropdown-menu li.open > a.ttr_menu_items_parent_link {
    color: var(--azul) !important;
    background: rgba(0,61,123,.08) !important;
    font-weight: 700 !important;
}

/* Sub-sub-dropdown menus (nivel 3) */
.dropdown-menu .dropdown-menu {
    border: 1px solid #e8e6e1 !important;
    background: var(--blanco) !important;
    box-shadow: var(--sombra-2) !important;
    border-radius: var(--radio-s) !important;
    overflow: hidden !important;
    padding: 0 !important;
}

.dropdown-menu .dropdown-menu > li > a,
.dropdown-menu .dropdown-menu li a.ttr_menu_items_parent_link,
.dropdown-menu .dropdown-menu li a.dropdown-toggle {
    color: var(--texto) !important;
    background: var(--blanco) !important;
    font-size: 13px !important;
    padding: 8px 18px !important;
}

.dropdown-menu .dropdown-menu > li > a:hover,
.dropdown-menu .dropdown-menu li a:hover {
    color: var(--azul) !important;
    background: rgba(0,61,123,.06) !important;
}

hr.horiz_separator { border-color: rgba(255,255,255,.12) !important; }
hr.separator { border-color: var(--borde) !important; }

/* Toggle móvil */
.navbar-toggle, .navbar-toggler, #nav-expander { border-color: var(--dorado) !important; }
.navbar-toggle .icon-bar, .navbar-toggler-icon { background: #fff !important; }
.ttr_menu_button_text { color: #fff !important; }

/* ════════════════════════════════════════════════════════════
   MENÚ LATERAL / SIDEBAR (ttr_vmenu)
   ════════════════════════════════════════════════════════════ */

/* Items del menú lateral — texto normal */
.ttr_vmenu_items li ul.child li a,
.ttr_vmenu_items li ul.child li.open a,
ul.ttr_vmenu_items.nav li.dropdown ul.dropdown-menu li.unstyled ul li a,
.navbar-default .ttr_vmenu_items.nav li ul.child li a.subchild,
.ttr_verticalmenu nav.navbar .ttr_vmenu_items.nav li ul.child li > a.subchild {
    color: var(--texto) !important;
    background: var(--blanco) !important;
    font-family: 'Poppins', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important;
    transition: all .15s ease !important;
    border-left: 3px solid transparent !important;
    padding: 8px 12px !important;
    margin: 2px 5px !important;
    border-radius: 4px !important;
}

/* Hover en items del menú lateral */
.ttr_vmenu_items.nav li:hover ul.child li a:hover,
.ttr_vmenu_items.nav li:hover ul.child li.dropdown a.subchild:hover,
.ttr_vmenu_items li ul.child li a:hover,
.ttr_vmenu_items li ul.child li.open a:hover,
.ttr_verticalmenu .ttr_vmenu_items.nav li:hover ul.child li a:hover {
    color: var(--azul) !important;
    background: var(--dorado-bg) !important;
    border-left-color: var(--dorado) !important;
    text-decoration: none !important;
}

/* Links padre del menú lateral */
.nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link,
.nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link_active,
.ttr_verticalmenu .ttr_verticalmenu_content ul.nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link,
.ttr_verticalmenu .ttr_verticalmenu_content ul.nav.ttr_vmenu_items li:hover a:hover.ttr_vmenu_items_parent_link,
.ttr_vmenu_items li:hover a:hover.ttr_vmenu_items_parent_link {
    color: var(--dorado) !important;
    background: rgba(0,61,123,.06) !important;
}

/* Link padre activo */
.ttr_verticalmenu .nav.ttr_vmenu_items li.active a.ttr_vmenu_items_parent_link_active,
.nav.ttr_vmenu_items li.active a.ttr_vmenu_items_parent_link_active,
.ttr_verticalmenu .nav.ttr_vmenu_items li.active:hover a.ttr_vmenu_items_parent_link_active {
    color: var(--azul) !important;
    font-weight: bold !important;
}

/* Flechas del menú lateral */
.nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link_arrow,
.nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link_active_arrow,
.ttr_verticalmenu .ttr_verticalmenu_content .ttr_vmenu_items li.open a.ttr_vmenu_items_parent_link_arrow,
.ttr_verticalmenu .ttr_verticalmenu_content .nav.ttr_vmenu_items li:hover a.ttr_vmenu_items_parent_link_arrow {
    color: var(--dorado) !important;
}

/* Separadores del menú lateral */
.nav.ttr_vmenu_items li:hover span.separator,
.nav.ttr_vmenu_items li ul.child ul li .separator {
    border-color: var(--borde) !important;
}

/* Dropdown dentro del menú lateral */
.ttr_vmenu_items.nav .dropdown-menu > li > a,
.ttr_vmenu_items .collapse > li > a,
ul.ttr_vmenu_items.nav-pills .dropdown-menu > li > a {
    color: var(--texto) !important;
    transition: all .15s ease !important;
}

.ttr_vmenu_items .dropdown-menu > li:hover > a,
.ttr_vmenu_items .collapse > li:hover > a,
ul.ttr_vmenu_items.nav-pills .dropdown-menu > li:hover > a {
    color: var(--azul) !important;
    background: var(--dorado-bg) !important;
}

/* Menú secundario (ContainerMenuSecundario) — sub-items hover */
#ContainerMenuSecundario a,
#ContainerMenuSecundario .letrasDinamic,
#ContainerMenuSecundario .letrasDinamic3 {
    transition: all .15s ease !important;
}

#ContainerMenuSecundario a:hover,
#ContainerMenuSecundario a:hover .letrasDinamic,
#ContainerMenuSecundario a:hover .letrasDinamic3 {
    color: var(--azul) !important;
    background: var(--dorado-bg) !important;
}

/* Sub-menus genéricos — asegurar visibilidad */
.sub-menu > li > a,
ul.child > li > a {
    color: var(--texto) !important;
}

.sub-menu > li > a:hover,
.sub-menu > li > a:focus,
ul.child > li > a:hover,
ul.child > li > a:focus {
    color: var(--azul) !important;
    background: var(--dorado-bg) !important;
}

/* ════════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════════ */
#footerPrincipal {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    border-top: 4px solid var(--dorado) !important;
    padding: 28px 24px !important; border-radius: 0 !important;
}
#footerPrincipal footer { color: #fff !important; }
#footerPrincipal label, #footerPrincipal p,
#footerPrincipal span, #footerPrincipal a { color: rgba(255,255,255,.88) !important; }
#footerPrincipal .col-xs-12 { border-bottom-color: rgba(173,132,17,.4) !important; }

/* ════════════════════════════════════════════════════════════
   BOTONES — Modernos con profundidad
   ════════════════════════════════════════════════════════════ */
.btn {
    border-radius: var(--radio-s) !important; font-weight: 600 !important;
    padding: 9px 22px !important; transition: all var(--ease) !important;
    letter-spacing: .2px; text-transform: none !important;
}

.btn-primary {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%) !important;
    border: none !important; color: #fff !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25) !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
    background: linear-gradient(135deg, var(--azul-d) 0%, var(--azul) 100%) !important;
    box-shadow: 0 4px 18px rgba(0,61,123,.35) !important;
    transform: translateY(-1px); color: #fff !important;
}

.btn-default {
    border: 2px solid var(--borde) !important; color: var(--texto) !important;
    background: var(--blanco) !important;
}
.btn-default:hover { border-color: var(--dorado) !important; color: var(--dorado) !important; background: var(--dorado-bg) !important; }

.btn-success { background: linear-gradient(135deg,#2e7d32,#43a047) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(46,125,50,.25) !important; }
.btn-success:hover { box-shadow:0 4px 16px rgba(46,125,50,.35) !important; transform:translateY(-1px); }
.btn-danger { background: linear-gradient(135deg,#c62828,#e53935) !important; border:none !important; color:#fff !important; }
.btn-info { background: linear-gradient(135deg,var(--dorado),var(--dorado-l)) !important; border:none !important; color:#fff !important; box-shadow:0 2px 8px rgba(173,132,17,.25) !important; }
.btn-info:hover { box-shadow:0 4px 16px rgba(173,132,17,.35) !important; transform:translateY(-1px); }
.btn-warning { background: linear-gradient(135deg,#e65100,#f57c00) !important; border:none !important; color:#fff !important; }

.btn-lg { padding: 12px 30px !important; font-size: 15px !important; border-radius: var(--radio) !important; }
.btn-sm { padding: 5px 14px !important; font-size: 12px !important; }
.btn-xs { padding: 4px 10px !important; font-size: 12px !important; line-height: 1.4 !important; }

/* ════════════════════════════════════════════════════════════
   FORMULARIOS — Inputs modernos premium
   ════════════════════════════════════════════════════════════ */
.form-control {
    border: 2px solid var(--borde) !important;
    border-radius: var(--radio-s) !important;
    color: var(--negro) !important;
    background: var(--blanco) !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    height: auto !important;
    transition: all var(--ease) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.03) !important;
    -webkit-appearance: none;
}
.form-control:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1), 0 1px 2px rgba(0,0,0,.03) !important;
    outline: none !important;
}
.form-control:hover:not(:focus) {
    border-color: #c0bbb3 !important;
}
.form-control::placeholder { color: #b0a898 !important; }

/* Inputs deshabilitados */
.form-control[disabled], .form-control[readonly] {
    background: #f5f3ef !important;
    opacity: .7;
}

/* Select nativo mejorado */
select.form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23706a63' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    padding-right: 36px !important;
    cursor: pointer;
}

/* Labels */
.control-label {
    color: var(--negro) !important; font-weight: 700 !important;
    font-size: 13px !important; letter-spacing: .3px; margin-bottom: 6px !important;
}

/* Textarea */
textarea.form-control {
    min-height: 100px !important; resize: vertical;
}

/* Input groups */
.input-group-addon {
    background: var(--fondo) !important; border: 2px solid var(--borde) !important;
    color: var(--texto-sec) !important; border-radius: var(--radio-s) !important;
    font-weight: 600;
}

/* Checkbox y radio */
input[type="checkbox"], input[type="radio"] {
    accent-color: var(--azul);
}

/* Form horizontal spacing */
.form-group { margin-bottom: 18px; }
.form-horizontal .form-group { margin-bottom: 18px; }

/* ════════════════════════════════════════════════════════════
   TABLAS — Limpias, legibles, profesionales
   ════════════════════════════════════════════════════════════ */
.table {
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio) !important;
    overflow: hidden; border-collapse: separate !important;
    border-spacing: 0 !important;
    box-shadow: var(--sombra-1);
}
/* Global BS5 table cell reset — disable the inset box-shadow overlay
   that BS5 uses for striping/hover (paints over text and backgrounds).
   We handle striping and hover via explicit background rules instead. */
.table > :not(caption) > * > * {
    box-shadow: none !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg-state: transparent !important;
    --bs-table-bg-type: transparent !important;
    --bs-table-color-state: initial !important;
    --bs-table-color-type: initial !important;
}

/* ── Header cells — SOLO tablas de primer nivel, NO anidadas ── */
/* Tablas con clase .table (Bootstrap) */
.table > thead > tr > th,
table.dataTable > thead > tr > th,
table.dataTable > thead > tr > td {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important; font-weight: 700 !important;
    font-size: 12px !important; text-transform: uppercase; letter-spacing: .6px;
    padding: 13px 16px !important; border-color: rgba(255,255,255,.08) !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg: transparent !important;
    --bs-table-striped-bg: transparent !important;
    box-shadow: none !important;
}
/* Tablas sin clase .table pero con clase presupuesto (thTablaPrimera/thTablaCentro/thTabla) —
   Solo el thead directo del table raíz (no anidadas dentro de tbody) */
.table-responsive > table > thead > tr > th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important; font-weight: 700 !important;
    font-size: 12px !important; text-transform: uppercase; letter-spacing: .6px;
    padding: 13px 16px !important; border-color: rgba(255,255,255,.08) !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg: transparent !important;
    box-shadow: none !important;
}

/* ── Body cells — td Y th en tbody ── */
.table > tbody > tr > td,
.table > tbody > tr > th {
    background: transparent !important;
    color: var(--texto) !important;
    border-color: var(--borde-l) !important;
    padding: 11px 16px !important; font-size: 13.5px;
    vertical-align: middle !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* .Celda class — data cells that use <th> in thead (TablaProgramasInstitucionales) */
.table > thead > tr > th.Celda,
.table > thead > tr > td.Celda,
.table > tbody > tr > th.Celda,
.table > tbody > tr > td.Celda,
th.Celda, td.Celda {
    background: transparent !important;
    color: var(--texto) !important;
    border-color: var(--borde-l) !important;
    padding: 11px 16px !important; font-size: 13.5px !important;
    vertical-align: middle !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* CeldaHeader — headers en la tabla de programas institucionales */
.CeldaHeader {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
    padding: 13px 16px !important;
    border-color: rgba(255,255,255,.08) !important;
}

/* ── Zebra striping ── */
.table-striped > tbody > tr:nth-of-type(odd) { background: #fcfbf9 !important; }
.table-striped > tbody > tr:nth-of-type(even) { background: var(--blanco) !important; }
.table-hover > tbody > tr:hover { background: var(--dorado-bg) !important; }

/* Tablas .table sin table-striped: zebra automático */
.table > tbody > tr:nth-child(odd) > td,
.table > tbody > tr:nth-child(odd) > th.Celda { background: #fcfbf9 !important; }
.table > tbody > tr:nth-child(even) > td,
.table > tbody > tr:nth-child(even) > th.Celda { background: var(--blanco) !important; }
.table > tbody > tr:hover > td,
.table > tbody > tr:hover > th.Celda { background: var(--dorado-bg) !important; }

/* ── Filas de datos en thead (patrón legacy: TablaProgramasInstitucionales) ── */
thead > tr.placeholderTabla > th,
thead > tr.placeholderTabla > td {
    background: transparent !important;
    color: var(--texto) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-size: 13.5px !important;
    border-bottom: 1px solid var(--borde-l) !important;
    border-color: var(--borde-l) !important;
}
thead > tr.placeholderTabla:nth-child(odd) > th,
thead > tr.placeholderTabla:nth-child(odd) > td { background: #fcfbf9 !important; }
thead > tr.placeholderTabla:nth-child(even) > th,
thead > tr.placeholderTabla:nth-child(even) > td { background: var(--blanco) !important; }
thead > tr.placeholderTabla:hover > th,
thead > tr.placeholderTabla:hover > td { background: var(--dorado-bg) !important; cursor: pointer; }

/* ── Tablas anidadas de presupuesto (collapsible groups) ── */
/* Nivel 1 — Programa (dimgray inline → azul gobierno) */
th[style*="background-color:dimgray"],
td[style*="background-color:dimgray"] {
    background: var(--azul) !important;
    color: #fff !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-size: 13px !important;
    padding: 10px 12px !important;
    cursor: pointer;
}
/* Nivel 2 — Actividad Obra (slategray → azul claro) */
th[style*="background-color:slategray"],
td[style*="background-color:slategray"] {
    background: var(--azul-l) !important;
    color: #fff !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-size: 13px !important;
    padding: 9px 12px !important;
    cursor: pointer;
}
/* Nivel 3 — Grupo Gasto (lightgray) */
th[style*="background-color:lightgray"],
td[style*="background-color:lightgray"] {
    background: var(--dorado-bg) !important;
    color: var(--texto) !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
    border-left: 3px solid var(--dorado) !important;
    cursor: pointer;
}
/* Nivel 4 — Objeto Gasto (white leaf rows) */
td[style*="background-color:white"] {
    background: var(--blanco) !important;
    color: var(--texto) !important;
    font-size: 12.5px !important;
    padding: 7px 12px !important;
}

/* Clases de presupuesto */
.thTablaPrimera, .thTablaCentro, .thTabla {
    padding: 8px 12px !important;
    vertical-align: middle !important;
}

/* Fila Total de presupuesto */
.table-responsive > table > tbody > tr:last-child > td {
    border-top: 2px solid var(--azul) !important;
}

/* ══ CATCH-ALL: Cualquier thead con background inline → gradiente gobierno ══
   Cubre: #02395e, #29ABE2, steelblue, #0277bd, #2f75b5, #ad8411, #8b8b8b, etc.
   NO afecta theads anidados en presupuesto (esos no tienen style en el thead) */
thead[style*="background"] {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
}
thead[style*="background"] > tr > th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important; font-weight: 700 !important;
    font-size: 12px !important; text-transform: uppercase; letter-spacing: .6px;
    padding: 13px 16px !important; border-color: rgba(255,255,255,.08) !important;
}

/* ── Override colores inline en filas (tr) del sistema ── */

/* tr con fondos oscuros de colores legacy → gobierno brand */
tr[style*="background-color:#02395e"],
tr[style*="background-color: #02395e"] {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
}
tr[style*="#02395e"] > td,
tr[style*="#02395e"] > th { color: #fff !important; }

tr[style*="background-color:#0053a5"],
tr[style*="background-color:cornflowerblue"],
tr[style*="background-color: cornflowerblue"] {
    background: var(--azul) !important;
}
tr[style*="#0053a5"] > td, tr[style*="#0053a5"] > th,
tr[style*="cornflowerblue"] > td, tr[style*="cornflowerblue"] > th {
    color: #fff !important; background: var(--azul) !important;
}

/* darkgray en filas/headers (competitividad) */
th[style*="background-color:darkgray"],
td[style*="background-color:darkgray"],
tr[style*="background-color:darkgray"] {
    background: #e8e4dd !important;
    color: var(--texto) !important;
}

/* RoyalBlue panel-heading */
.card-header[style*="RoyalBlue"],
.card-header[style*="royalblue"] {
    background: var(--azul) !important;
}

/* ── Override estilos oscuros legacy (clases) ── */

/* thead-inverse (fideicomiso) */
.thead-inverse,
.thead-inverse > tr > th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important;
}

/* tablaHead (fideicomiso, planes, gobiernoabierto, prioridades) */
.tablaHead,
.tablaHead > tr > th,
tr.tablaHead > th,
thead.tablaHead > tr > th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important;
}

/* bg-primary en thead */
thead.bg-primary,
thead.bg-primary > tr > th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    color: #fff !important;
}

/* Filas grupo (#CCCCCC inline) — sector/grupo separators */
tr[style*="background-color:#CCCCCC"],
tr[style*="background-color: #CCCCCC"] {
    background: var(--dorado-bg) !important;
    border-left: 3px solid var(--dorado) !important;
}
tr[style*="background-color:#CCCCCC"] td,
tr[style*="background-color: #CCCCCC"] td {
    background: var(--dorado-bg) !important;
    font-weight: 600 !important;
    color: var(--azul) !important;
}

/* ── Links dentro de tablas ── */
table a:not(.btn):not(.dropdown-toggle):not(.glyphicon) {
    color: var(--azul-l) !important;
    text-decoration: none;
    font-weight: 500;
}
table a:not(.btn):not(.dropdown-toggle):not(.glyphicon):hover {
    color: var(--dorado) !important;
    text-decoration: underline;
}

/* Celda linkUser (responsable clickeable) */
.linkUser { cursor: pointer !important; }
.linkUser:hover { color: var(--dorado) !important; }

/* ════════════════════════════════════════════════════════════
   DataTables BS5 Compatibility (replaces DT 1.10.15 defaults)
   ════════════════════════════════════════════════════════════ */

/* Wrapper layout — convert floats to flexbox */
.dataTables_wrapper {
    padding: 0 !important;
}
.dataTables_wrapper::after {
    display: none !important; /* kill clearfix */
}

/* Top row: length (left) + filter (right) */
.dataTables_length,
.dataTables_filter {
    float: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 !important;
    margin-bottom: 16px !important;
}
.dataTables_length {
    float: left !important;
}
.dataTables_filter {
    float: right !important;
    text-align: right !important;
}

/* Labels */
.dataTables_length label,
.dataTables_filter label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--texto-sec) !important;
    white-space: nowrap !important;
}

/* Length select — BS5 form-select style */
.dataTables_length select {
    display: inline-block !important;
    width: auto !important;
    min-width: 70px !important;
    padding: 6px 32px 6px 12px !important;
    font-size: 13px !important;
    font-family: inherit !important;
    color: var(--texto) !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 12px !important;
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio-s) !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    transition: border-color .2s, box-shadow .2s !important;
    cursor: pointer !important;
}
.dataTables_length select:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1) !important;
    outline: none !important;
}

/* Search input — BS5 form-control style */
.dataTables_filter input,
.dataTables_filter input[type="search"] {
    display: inline-block !important;
    width: auto !important;
    min-width: 220px !important;
    padding: 7px 14px 7px 36px !important;
    font-size: 13px !important;
    font-family: inherit !important;
    color: var(--texto) !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23999' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 14px !important;
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio-s) !important;
    transition: border-color .2s, box-shadow .2s !important;
}
.dataTables_filter input:focus,
.dataTables_filter input[type="search"]:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1) !important;
    outline: none !important;
}
/* Hide the search icon from label text (some views add bi-search icon) */
.dataTables_filter label > .bi-search,
.dataTables_filter label > span.bi {
    display: none !important;
}
/* Fix WebKit search cancel button */
.dataTables_filter input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none !important;
}

/* Bottom row: info (left) + pagination (right) */
.dataTables_info {
    float: left !important;
    padding-top: 10px !important;
    font-size: 12.5px !important;
    color: var(--texto-sec) !important;
}

/* Pagination — BS5 pill style */
.dataTables_paginate {
    float: right !important;
    text-align: right !important;
    padding-top: 6px !important;
}
.dataTables_paginate .paginate_button {
    display: inline-block !important;
    min-width: 34px !important;
    padding: 6px 12px !important;
    margin: 0 2px !important;
    font-size: 13px !important;
    font-family: inherit !important;
    text-align: center !important;
    text-decoration: none !important;
    color: var(--texto) !important;
    background: #fff !important;
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio-s) !important;
    cursor: pointer !important;
    transition: all .2s !important;
    box-sizing: border-box !important;
}
.dataTables_paginate .paginate_button:hover {
    background: var(--dorado) !important;
    color: #fff !important;
    border-color: var(--dorado) !important;
}
.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:hover {
    background: var(--azul) !important;
    color: #fff !important;
    border-color: var(--azul) !important;
    font-weight: 600 !important;
}
.dataTables_paginate .paginate_button.disabled,
.dataTables_paginate .paginate_button.disabled:hover {
    color: #ccc !important;
    background: #f8f8f8 !important;
    border-color: var(--borde) !important;
    cursor: default !important;
}

/* Processing indicator */
.dataTables_processing {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    padding: 16px 24px !important;
    background: rgba(255,255,255,.95) !important;
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio) !important;
    box-shadow: var(--sombra-2) !important;
    font-size: 14px !important;
    color: var(--azul) !important;
    z-index: 10 !important;
}

/* Table base — consistent with BS5 */
table.dataTable {
    border-collapse: collapse !important;
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    width: 100% !important;
}
table.dataTable thead th,
table.dataTable thead td {
    border-bottom: 2px solid var(--azul) !important;
    padding: 10px 12px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
    color: #fff !important;
    background: var(--azul) !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg: transparent !important;
    --bs-table-striped-bg: transparent !important;
    box-shadow: none !important;
}
table.dataTable tbody td {
    padding: 10px 12px !important;
    font-size: 13px !important;
    vertical-align: middle !important;
    border-bottom: 1px solid #eee !important;
}
table.dataTable tbody tr:hover {
    background-color: rgba(0,61,123,.04) !important;
}
table.dataTable.table-striped tbody tr:nth-child(odd) {
    background-color: rgba(0,0,0,.02) !important;
}
table.dataTable.table-striped tbody tr:nth-child(odd):hover {
    background-color: rgba(0,61,123,.04) !important;
}

/* Sorting icons — cleaner arrows */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    cursor: pointer !important;
    position: relative !important;
    padding-right: 26px !important;
}
table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 10px !important;
    opacity: .6 !important;
}
table.dataTable thead .sorting::after { content: "\2195" !important; opacity: .3 !important; }
table.dataTable thead .sorting_asc::after { content: "\2191" !important; color: var(--dorado-l) !important; opacity: 1 !important; }
table.dataTable thead .sorting_desc::after { content: "\2193" !important; color: var(--dorado-l) !important; opacity: 1 !important; }
/* Remove default DT background-image sort icons (url() only, preserve gradient) */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background-image: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%) !important;
}

/* Empty/zero records message */
.dataTables_empty {
    text-align: center !important;
    padding: 32px 16px !important;
    color: var(--texto-sec) !important;
    font-style: italic !important;
}

/* Responsive clearfix for top/bottom rows */
.dataTables_wrapper .dataTables_length + .dataTables_filter,
.dataTables_wrapper .dataTables_info + .dataTables_paginate {
    clear: none !important;
}

/* Mobile responsive */
@media (max-width: 767.98px) {
    .dataTables_length,
    .dataTables_filter {
        float: none !important;
        text-align: left !important;
        width: 100% !important;
        margin-bottom: 10px !important;
    }
    .dataTables_filter input,
    .dataTables_filter input[type="search"] {
        width: 100% !important;
        min-width: 0 !important;
    }
    .dataTables_info,
    .dataTables_paginate {
        float: none !important;
        text-align: center !important;
        width: 100% !important;
        padding-top: 12px !important;
    }
    .dataTables_paginate .paginate_button {
        padding: 5px 8px !important;
        font-size: 12px !important;
        min-width: 28px !important;
    }
    table.dataTable thead th,
    table.dataTable thead td {
        font-size: 11px !important;
        padding: 8px 6px !important;
    }
    table.dataTable tbody td {
        font-size: 12px !important;
        padding: 8px 6px !important;
    }
}

/* ════════════════════════════════════════════════════════════
   CARDS — Con profundidad elegante
   ════════════════════════════════════════════════════════════ */
.card {
    border: 1px solid var(--borde-l) !important;
    border-radius: var(--radio) !important;
    box-shadow: var(--sombra-1) !important;
    overflow: hidden; transition: box-shadow var(--ease);
    background: var(--blanco) !important;
}
.card:hover { box-shadow: var(--sombra-2) !important; }

.card>.card-header {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%) !important;
    color: #fff !important; border: none !important;
    padding: 14px 20px !important; font-size: 14px;
}
.card>.card-header .card-title,
.card>.card-header h3,
.card>.card-header h4,
.card>.card-header a { color: #fff !important; }

.card-body { background: var(--blanco) !important; padding: 20px; overflow-x: auto; }
/* Card bodies with explicit padding override (Metas tables use 0 horizontal) */
.card-body[style*="padding"] { padding: unset; }
.card.border-primary>.card-header { background: linear-gradient(135deg,var(--azul),var(--azul-l)) !important; }
.card.border-info>.card-header { background: linear-gradient(135deg,var(--dorado),var(--dorado-l)) !important; border-color:var(--dorado)!important; color:#fff!important; }

/* Contenedores blancos genéricos (dashboard) */
div[style*="background: white"], div[style*="background:white"],
div[style*="background-color: white"], div[style*="background-color:white"] {
    border-radius: var(--radio) !important;
    box-shadow: var(--sombra-1) !important;
    border: 1px solid var(--borde-l) !important;
}

/* ════════════════════════════════════════════════════════════
   MODALES — Impactantes y pulidos
   ════════════════════════════════════════════════════════════ */
.modal-content {
    border: none !important; border-radius: var(--radio) !important;
    box-shadow: var(--sombra-3) !important; overflow: hidden;
}
.modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%) !important;
    color: #fff !important; border-bottom: 3px solid var(--dorado) !important;
    padding: 16px 24px !important;
}
.modal-header .modal-title, .modal-header h4, .modal-header h5 { color: #fff !important; font-weight: 700; }
.modal-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%); opacity: .8; order: 1; }
.modal-header .btn-close:hover { opacity: 1; }
.modal-body { padding: 24px !important; overflow-x: auto; }
.modal-footer { border-top: 1px solid var(--borde-l) !important; padding: 14px 24px !important; }

/* Modal grande */
.modal-lg { max-width: 900px; }

/* ════════════════════════════════════════════════════════════
   SELECT2 — Consistente con diseño
   ════════════════════════════════════════════════════════════ */
.select2-container--default .select2-selection--single {
    border: 2px solid var(--borde) !important; border-radius: var(--radio-s) !important;
    height: 40px !important; transition: all var(--ease);
    box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important; color: var(--texto) !important;
    padding-left: 14px !important; font-size: 14px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important; right: 8px !important;
}
.select2-container--default .select2-selection--single:hover {
    border-color: #c0bbb3 !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--azul) !important; }
.select2-container--default .select2-results__option[aria-selected=true] { background: var(--dorado-bg) !important; color: var(--azul) !important; }
.select2-container--default .select2-results__option { padding: 8px 14px !important; font-size: 13.5px !important; }
.select2-dropdown {
    border: 2px solid var(--azul) !important;
    border-radius: 0 0 var(--radio-s) var(--radio-s) !important;
    box-shadow: var(--sombra-2) !important;
}
.select2-container--default .select2-selection--multiple {
    border: 2px solid var(--borde) !important; border-radius: var(--radio-s) !important;
    min-height: 40px !important; padding: 4px 8px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--azul) !important; color: #fff !important;
    border: none !important; border-radius: 4px !important;
    padding: 2px 8px !important; font-size: 13px !important;
}

/* ════════════════════════════════════════════════════════════
   SWEETALERT2
   ════════════════════════════════════════════════════════════ */
.swal2-popup { border-radius: var(--radio) !important; }
.swal2-confirm { background: linear-gradient(135deg,var(--azul),var(--azul-l)) !important; border-radius:var(--radio-s)!important; font-weight:600!important; box-shadow:0 2px 8px rgba(0,61,123,.25)!important; }
.swal2-cancel { background:var(--dorado)!important; border-radius:var(--radio-s)!important; font-weight:600!important; }
.swal2-title { color: var(--azul) !important; }

/* ════════════════════════════════════════════════════════════
   JQUERY UI — Datepicker, Dialog
   ════════════════════════════════════════════════════════════ */
.ui-widget-header { background: var(--azul) !important; color: #fff !important; border-color: var(--azul) !important; }
.ui-state-default, .ui-widget-content .ui-state-default { border-color: var(--borde)!important; background: var(--blanco)!important; color: var(--texto)!important; border-radius: 4px!important; }
.ui-state-hover, .ui-widget-content .ui-state-hover { background: var(--dorado-bg)!important; color: var(--azul)!important; border-color: var(--dorado)!important; }
.ui-state-active, .ui-widget-content .ui-state-active { background: var(--dorado)!important; color: #fff!important; }
.ui-state-highlight { background: var(--dorado-bg)!important; border-color: var(--dorado)!important; }
.ui-datepicker { box-shadow: var(--sombra-3)!important; border-radius: var(--radio)!important; border: none!important; }
.ui-datepicker .ui-datepicker-header { background: linear-gradient(135deg,var(--azul),var(--azul-l))!important; border-radius: var(--radio) var(--radio) 0 0!important; padding: 10px!important; }
.ui-datepicker td .ui-state-active { background: var(--azul)!important; color: #fff!important; }

/* UI Dialog mejorado */
.ui-dialog { border-radius: var(--radio) !important; box-shadow: var(--sombra-3) !important; border: none !important; }
.ui-dialog .ui-dialog-titlebar { background: linear-gradient(135deg,var(--azul),var(--azul-l)) !important; color: #fff !important; border: none !important; padding: 14px 20px !important; }
.ui-dialog .ui-dialog-title { color: #fff !important; font-weight: 700; }
.ui-dialog .ui-dialog-content { padding: 24px !important; }
.ui-dialog .ui-dialog-buttonpane { padding: 12px 20px !important; border-color: var(--borde-l) !important; }

/* ════════════════════════════════════════════════════════════
   JQWIDGETS
   ════════════════════════════════════════════════════════════ */
.jqx-widget-header { background: var(--azul)!important; color: #fff!important; }
.jqx-grid-column-header { background: var(--azul)!important; color: #fff!important; }
.jqx-fill-state-hover { background: var(--dorado-bg)!important; color: var(--azul)!important; }
.jqx-fill-state-pressed, .jqx-fill-state-focus { background: var(--dorado)!important; color: #fff!important; }

/* ════════════════════════════════════════════════════════════
   LABELS, BADGES
   ════════════════════════════════════════════════════════════ */
.label { border-radius: 4px !important; font-weight: 700; padding: 3px 8px !important; font-size: 11px !important; }
.label-primary { background: var(--azul)!important; }
.label-info { background: var(--dorado)!important; }
.label-default { background: #706a63!important; }
.label-success { background: #2e7d32!important; }
.label-danger { background: #c62828!important; }
.badge { background: var(--dorado)!important; color: #fff!important; font-weight:700; padding: 4px 10px; border-radius: 12px; }

/* ════════════════════════════════════════════════════════════
   BREADCRUMBS
   ════════════════════════════════════════════════════════════ */
.breadcrumb {
    background: var(--blanco) !important; border: 1px solid var(--borde-l) !important;
    border-radius: var(--radio-s) !important; padding: 10px 16px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.02);
}
.breadcrumb>li>a { color: var(--azul) !important; }
.breadcrumb>li>a:hover { color: var(--dorado) !important; }
.breadcrumb>.active { color: var(--dorado) !important; font-weight: 600; }

/* ════════════════════════════════════════════════════════════
   PAGINACIÓN
   ════════════════════════════════════════════════════════════ */
.pagination>li>a, .pagination>li>span {
    color: var(--azul) !important; border: 1px solid var(--borde) !important;
    border-radius: var(--radio-s) !important; margin: 0 2px; padding: 6px 12px !important;
}
.pagination>.active>a, .pagination>.active>span { background: var(--azul)!important; border-color: var(--azul)!important; color: #fff!important; }
.pagination>li>a:hover { background: var(--dorado-bg)!important; color: var(--dorado)!important; border-color: var(--dorado)!important; }

/* ════════════════════════════════════════════════════════════
   ALERTS — Con borde lateral de color
   ════════════════════════════════════════════════════════════ */
.alert { border-radius: var(--radio-s)!important; border-left: 4px solid!important; font-size: 14px; border-top: none!important; border-right: none!important; border-bottom: none!important; }
.alert-success { background: #e8f5e9!important; border-left-color: #2e7d32!important; color: #1b5e20!important; }
.alert-info { background: #e3f2fd!important; border-left-color: var(--azul)!important; color: var(--azul)!important; }
.alert-warning { background: #fff8e1!important; border-left-color: var(--dorado)!important; color: #8a6a0e!important; }
.alert-danger { background: #ffebee!important; border-left-color: #c62828!important; color: #b71c1c!important; }

/* ════════════════════════════════════════════════════════════
   TABS
   ════════════════════════════════════════════════════════════ */
.nav-tabs { border-bottom: 2px solid var(--borde)!important; }
.nav-tabs>li>a { color: var(--texto-sec)!important; border: none!important; transition: all var(--ease); padding: 10px 18px !important; }
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: var(--azul)!important; border: none!important;
    border-bottom: 3px solid var(--dorado)!important; font-weight: 700!important;
    background: transparent!important;
}
.nav-tabs>li>a:hover { color: var(--dorado)!important; background: transparent!important; border: none!important; }
.nav-pills>li.active>a, .nav-pills>li.active>a:hover { background: var(--azul)!important; color: #fff!important; border-radius: var(--radio-s)!important; }
.nav-pills .nav-link.active, .nav-pills .nav-link.active:hover { background: var(--azul)!important; color: #fff!important; border-radius: var(--radio-s)!important; }

/* ════════════════════════════════════════════════════════════
   PROGRESS BARS — Redondeados y modernos
   ════════════════════════════════════════════════════════════ */
.progress { border-radius: 20px!important; background: var(--borde-l)!important; height: 8px!important; overflow: hidden; box-shadow: inset 0 1px 2px rgba(0,0,0,.05); }
.progress-bar { background: linear-gradient(90deg,var(--azul),var(--azul-l))!important; border-radius: 20px!important; transition: width .6s ease; }
.progress-bar-success { background: linear-gradient(90deg,#2e7d32,#43a047)!important; }
.progress-bar-warning { background: linear-gradient(90deg,var(--dorado),var(--dorado-l))!important; }
.progress-bar-danger { background: linear-gradient(90deg,#c62828,#e53935)!important; }

/* ════════════════════════════════════════════════════════════
   AVATAR USUARIO — Base (estilo compartido)
   ════════════════════════════════════════════════════════════ */
.imagenUser, img.imagenUser {
    object-fit: cover!important;
    border: 2px solid var(--dorado)!important;
    box-shadow: 0 2px 8px rgba(0,0,0,.25)!important;
    border-radius: 50%!important; transition: all var(--ease);
    vertical-align: middle!important;
}
.imagenUser:hover { box-shadow: 0 4px 12px rgba(173,132,17,.35)!important; transform: scale(1.08); }

/* AVATAR — Navbar (48px, no choca con menú) */
.navbar .imagenUser,
.dropdown-menu .imagenUser,
#avatarUser {
    width: 48px!important; height: 48px!important;
    margin: 0!important; margin-left: 12px!important; margin-top: 25px!important;
    position: relative!important; top: 0!important;
}

/* ════════════════════════════════════════════════════════════
   SCROLLBAR & SELECTION
   ════════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c4b9a8; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--dorado); }
::selection { background: var(--dorado); color: #fff; }

/* ════════════════════════════════════════════════════════════
   BODY CONTAINER & OVERRIDES GENERALES
   ════════════════════════════════════════════════════════════ */
#bodyPrincipal { background: var(--fondo) !important; }

.well {
    background: var(--blanco)!important; border: 1px solid var(--borde-l)!important;
    border-radius: var(--radio)!important; box-shadow: var(--sombra-1)!important;
}
.tooltip-inner { background: var(--azul-d)!important; border-radius: var(--radio-s)!important; padding: 6px 12px; font-size: 12.5px; }
.list-group-item { border-color: var(--borde-l)!important; transition: background var(--ease); padding: 12px 16px; }
.list-group-item:hover { background: #fcfbf9!important; }
.list-group-item.active, .list-group-item.active:hover { background: var(--azul)!important; border-color: var(--azul)!important; }

/* ════════════════════════════════════════════════════════════
   DASHBOARD ESPECÍFICO
   ════════════════════════════════════════════════════════════ */
.lineaSep[style*="background: white"], .lineaSep[style*="background:white"] {
    border: 1px solid var(--borde-l)!important; box-shadow: var(--sombra-1)!important;
}

/* Loader del dashboard */
.sigpret-loader {
    width: 44px; height: 44px; margin: 0 auto;
    border: 3px solid var(--borde); border-top-color: var(--azul);
    border-radius: 50%; animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {
    #ttr_menu::before { height: 3px; }
    .navbar-collapse { background: var(--azul-d)!important; border-top: 2px solid var(--dorado)!important; }
    .navbar-collapse .dropdown-menu { background: rgba(0,42,86,.95)!important; border-top: none!important; }
    .navbar-collapse .dropdown-menu>li>a { color: rgba(255,255,255,.85)!important; border-left: none!important; }
    .navbar-collapse .dropdown-menu>li>a:hover { color: var(--dorado-l)!important; background: transparent!important; }
    .form-control { font-size: 16px !important; } /* Evita zoom en iOS */
}

/* ════════════════════════════════════════════════════════════
   PRINT
   ════════════════════════════════════════════════════════════ */
@media print {
    .navbar, #ttr_menu, #footerPrincipal { display: none!important; }
    body { background: #fff!important; color: #000!important; }
    .card, .table { box-shadow: none!important; }
}

/* ════════════════════════════════════════════════════════════════
   ██████   PORTAL PÚBLICO & MINISTROS — Vista Pública Presidencial
   ════════════════════════════════════════════════════════════════ */

/* ─── Cabecera pública — logos ─── */
.portal-header {
    background: var(--blanco);
    padding: 16px 0;
    border-bottom: 3px solid var(--dorado);
}

/* ─── Navegación del portal público (barra de tabs) ─── */
.portal-nav {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    border-radius: 14px;
    padding: 10px 16px;
    margin-bottom: 24px;
    box-shadow: var(--sombra-2);
}
.pnav-item {
    background: rgba(255,255,255,.12);
    border-radius: 10px; padding: 10px 18px;
    transition: all var(--ease); text-align: center;
    cursor: pointer; color: #fff; font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif!important;
}
.pnav-item:hover { background: rgba(255,255,255,.25); }
.pnav-item.active { background: var(--dorado)!important; color: #fff!important; }
.pnav-item a, .pnav-item .letrasDinamic {
    color: #fff!important; font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif!important;
    text-decoration: none;
}
.pnav-label {
    background: rgba(255,255,255,.15);
    border-radius: 8px; padding: 6px 14px;
    color: rgba(255,255,255,.85); font-weight: 600;
    font-size: 13px; text-transform: uppercase;
    letter-spacing: 1px; text-align: center;
}

/* ─── Módulos de seguimiento (panel derecho) ─── */
.contMonitoreo {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%)!important;
    border-radius: 12px!important;
    transition: all var(--ease); border: none!important;
    box-shadow: 0 2px 6px rgba(0,61,123,.15)!important;
}
.contMonitoreo:hover { transform: translateY(-2px); box-shadow: var(--sombra-2)!important; }
.enlaceMonitoreo { color: #fff!important; text-decoration: none!important; }
.enlaceMonitoreo:hover { color: #fff!important; }
.enlaceMonitoreo .letraEnlace { color: #fff!important; margin: 0; font-size: 15px!important; font-weight: 600; }
.enlaceMonitoreo .card { background: transparent!important; border: none!important; box-shadow: none!important; margin: 0!important; }
.enlaceMonitoreo .card-body:not(.contMonitoreo) { background: transparent!important; padding: 0!important; }
.enlaceMonitoreo .card-body.contMonitoreo {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%)!important;
    border-radius: 12px!important; padding: 14px 18px!important;
    border: none!important; box-shadow: 0 2px 6px rgba(0,61,123,.15)!important;
}

/* ─── Botón "scroll to top" ─── */
#myBtn {
    background-color: var(--dorado)!important;
    background-image: none!important;
    border-radius: 14px!important;
    width: 56px!important; height: 56px!important;
    font-size: 24px!important; line-height: 56px!important;
    padding: 0!important; text-align: center;
    box-shadow: var(--sombra-2)!important;
    transition: all var(--ease);
}
#myBtn::after { content: none; }
#myBtn:hover { background-color: var(--azul)!important; transform: scale(1.08); }

/* ─── Panel portada del portal ─── */
#panelPortada .card { border-radius: 16px!important; overflow: hidden; }

/* ─── Footer público — Override del gris viejo ─── */
footer.footer {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%)!important;
    border-top: 4px solid var(--dorado)!important;
    padding: 0!important;
}
footer.footer > .container-fluid { padding: 28px 20px 12px!important; }
footer.footer .blockFooter {
    background: transparent!important;
    border: none!important; box-shadow: none!important;
}
footer.footer .blockFooterMid {
    border-left: 1px solid rgba(255,255,255,.15)!important;
    border-right: 1px solid rgba(255,255,255,.15)!important;
}
footer.footer #parrafCopyright { color: rgba(255,255,255,.75)!important; font-size: 13px!important; }
footer.footer .imgFoo { max-height: 100px; filter: brightness(1.1); }
footer.footer .card, footer.footer .card { background: transparent!important; border: none!important; box-shadow: none!important; }
footer.footer .card-body { background: transparent!important; }

/* ─── Breadcrumbs del portal ─── */
body .breadcrumb {
    background: var(--blanco)!important;
    border: 1px solid var(--borde-l)!important;
    border-radius: 10px!important;
    box-shadow: var(--sombra-1)!important;
    font-size: 14px!important; padding: 12px 18px!important;
}

/* ─── Tabs del portal público (pills originales) ─── */
.nav-pills>li.active, .nav-pills>li.active:hover, .nav-pills>li.active:focus {
    background: transparent !important;
    border-radius: var(--radio-s) !important;
    padding: 0 !important;
}
.nav-pills>li>a { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.nav-pills>li:hover { color: var(--dorado)!important; }

/* ─── Paneles "letrasDinamic" del menú público ─── */
.letrasDinamic {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif!important;
    border-radius: 10px!important;
    transition: all var(--ease);
}
#liInicio .letrasDinamic { font-weight: 700; font-size: 18px; }

/* Contenedor menú público */
#menuMain .letrasDinamic { border-radius: 10px!important; }
.rowMenu {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%)!important;
    border-radius: 14px!important;
    box-shadow: var(--sombra-2);
}

/* ─── Select redondeado del portal ─── */
.select-redondo {
    background-color: var(--azul)!important; border: 2px solid rgba(255,255,255,.3)!important;
    border-radius: 10px!important; color: #fff!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important;
    padding: 6px 20px!important; height: auto!important;
    transition: all var(--ease);
}
.select-redondo:focus { border-color: var(--dorado)!important; box-shadow: 0 0 0 3px rgba(173,132,17,.2)!important; }
.select-redondo>option { background: var(--blanco)!important; color: var(--texto)!important; }

/* ─── Tipografía Portal de Ministros: alineada con Poppins (familia oficial DIGER) ─── */
.letraSombreada { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; color: var(--texto-sec)!important; }
#parrafoNombrePresi { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
#spanNombrePresi { color: var(--dorado)!important; }
#parraMonitoreo { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; color: var(--azul)!important; }

/* ════════════════════════════════════════════════════════════
   PORTAL MINISTROS — Tabs y header
   ════════════════════════════════════════════════════════════ */

/* Header */
.rowHeadContEl { border-bottom: 3px solid var(--dorado)!important; }
.hTitHead { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; color: var(--azul)!important; }
.hrGrey { border-color: var(--dorado)!important; }

/* Tabs */
.letraTabsTitulo { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.letraTabsTitulo>a { color: var(--azul)!important; font-weight: 700; }
.letraTabsTitulo>a:hover { color: var(--dorado)!important; }
li.active.letraTabsTitulo { background-color: var(--dorado)!important; border-radius: 10px!important; }
li.active.letraTabsTitulo>a { color: #fff!important; }

/* Category boxes */
.category-box { border-color: var(--borde)!important; color: var(--azul)!important; border-radius: 14px!important; transition: all var(--ease); }
.category-box:hover { border-color: var(--dorado)!important; box-shadow: var(--sombra-2)!important; transform: translateY(-2px); }
.amount { color: var(--azul)!important; }
.nomInst { color: var(--azul)!important; }
.btn-detalle { background-color: var(--azul)!important; border-radius: 10px!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.btn-detalle:hover { background-color: var(--azul-d)!important; }

/* Table headers del portal */
.headTable { color: var(--azul)!important; background: var(--dorado-bg)!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.panCollapseTabla { background: var(--dorado-bg)!important; }
.detCollapseTabla { background: var(--azul)!important; color: #fff!important; }
.panelPlanSedespa { background: #f0ebe0!important; border-radius: 12px!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.panelCollapse { background: var(--dorado-bg)!important; border-radius: 12px!important; }

/* Ficha de proyecto */
.header { background-color: var(--azul)!important; border-radius: 12px!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.sub-header { background-color: var(--dorado-bg)!important; border-radius: 10px!important; color: var(--azul)!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; border-bottom-color: var(--dorado)!important; }
.detail { border-left-color: var(--azul)!important; }
.detail-content { color: var(--azul)!important; }
.back-link a { background-color: var(--azul)!important; border-radius: 10px!important; font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }
.back-link a:hover { background-color: var(--azul-d)!important; }

/* Botones del portal */
#btnEjecFin, #toggleAll { background-color: var(--texto-sec)!important; border-radius: 10px!important; }
#btnEjecFis { background-color: var(--azul)!important; border-radius: 10px!important; }
#reboot { background-color: #c62828!important; border-radius: 10px!important; }
.btnTabla { font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; }

/* Filtros del portal ministros */
.filtros {
    border: 2px solid var(--borde)!important; border-radius: 10px!important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif!important; transition: all var(--ease);
}
.filtros:focus { border-color: var(--azul)!important; box-shadow: 0 0 0 3px rgba(0,61,123,.1)!important; }
#fText { border: 2px solid var(--borde)!important; border-radius: 10px!important; }
#fText:focus { border-color: var(--azul)!important; }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE PORTAL PÚBLICO
   ════════════════════════════════════════════════════════════ */
/* ─── Override old gray nav containers (Xio/Secundario2 layouts) ─── */
#ContainerMenuSecundario > .row[style*="dedede"] {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%)!important;
    border-radius: 14px!important;
    box-shadow: var(--sombra-2)!important;
}
#ContainerMenuSecundario > .row[style*="dedede"] .letrasDinamic {
    background: rgba(255,255,255,.15)!important;
    color: #fff!important;
}
#ContainerMenuSecundario > .row[style*="dedede"] .letrasDinamic3 {
    color: #fff!important;
}
#ContainerMenuSecundario > .row[style*="dedede"] a[style*="color: black"] {
    color: #fff!important;
}
#ContainerMenuSecundario > .row[style*="dedede"] a:hover .letrasDinamic {
    background: rgba(255,255,255,.3)!important;
}

/* ─── Override old footer gray background ─── */
footer.footer[style*="474747"] {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%)!important;
    border-top: 4px solid var(--dorado)!important;
}

/* ════════════════════════════════════════════════════════════
   CATCH-ALL: Override inline teal/cyan styles across ALL views
   These selectors target elements with old inline color values
   ════════════════════════════════════════════════════════════ */

/* Override any remaining inline background-color: #88cfe0/#88d0d8/#45c5e3/#269ebb */
div[style*="88cfe0"], div[style*="88CFE0"],
div[style*="88d0d8"], div[style*="88D0D8"],
div[style*="45c5e3"], div[style*="45C5E3"],
div[style*="269ebb"], div[style*="269EBB"],
div[style*="64c4da"], div[style*="64C4DA"],
div[style*="45C5DF"], div[style*="45c5df"],
span[style*="88cfe0"], span[style*="88CFE0"],
span[style*="88d0d8"], span[style*="88D0D8"],
span[style*="45c5e3"], span[style*="45C5E3"],
td[style*="88cfe0"], td[style*="88CFE0"],
td[style*="88d0d8"], td[style*="88D0D8"],
th[style*="88cfe0"], th[style*="88CFE0"],
th[style*="269ebb"], th[style*="269EBB"] {
    background-color: #02395e!important;
    color: #fff!important;
}

/* Override inline color: #88cfe0/#45c5e3 (text color usage) */
*[style*="color: #88cfe0"], *[style*="color:#88cfe0"],
*[style*="color: #88CFE0"], *[style*="color:#88CFE0"],
*[style*="color: #88d0d8"], *[style*="color:#88d0d8"],
*[style*="color: #88D0D8"], *[style*="color:#88D0D8"],
*[style*="color: #45c5e3"], *[style*="color:#45c5e3"],
*[style*="color: #45C5E3"], *[style*="color:#45C5E3"],
*[style*="color: #269ebb"], *[style*="color:#269EBB"],
*[style*="color: #64c4da"], *[style*="color:#64C4DA"],
*[style*="color:dodgerblue"], *[style*="color: dodgerblue"] {
    color: #02395e!important;
}

/* Override inline border-color for teal */
*[style*="border-color: #88cfe0"], *[style*="border-color:#88cfe0"],
*[style*="border-color: #88CFE0"], *[style*="border-color:#88CFE0"],
*[style*="border: 5px solid #88cfe0"], *[style*="border:5px solid #88cfe0"] {
    border-color: #ad8411!important;
}

/* Override inline background: dodgerblue */
*[style*="background-color: dodgerblue"], *[style*="background-color:dodgerblue"],
*[style*="background: dodgerblue"], *[style*="background:dodgerblue"] {
    background-color: #02395e!important;
    color: #fff!important;
}

/* Override Poppins-Bold in inline styles */
*[style*="Poppins-Bold"], *[style*="poppins-bold"],
*[style*="Poppins-Regular"], *[style*="poppins-regular"],
*[style*="Poppins"], *[style*="poppins"] {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif!important;
}

/* ─── headPrincipal (fideicomiso + planes) ─── */
.headPrincipal {
    background-color: #02395e!important;
    color: #fff!important;
}

/* ─── offer-info/offer-success borders (Evidencia views) ─── */
.offer-info { border-color: #02395e!important; }
.offer-info .shape { border-color: transparent #02395e transparent transparent!important; }
.offer-success { border-color: #2e7d32!important; }
.offer-success .shape { border-color: transparent #2e7d32 transparent transparent!important; }

/* ─── circle-container (plan gobierno/vision pais) ─── */
.circle-container { background: #2e7d32!important; }

/* ─── Institucion portal cards ─── */
.btnPrincipal { background-color: #02395e!important; }
.txtBlue { color: #02395e!important; }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE PORTAL PÚBLICO
   ════════════════════════════════════════════════════════════ */
@media (max-width: 767.98px) {
    .portal-nav { padding: 8px; border-radius: 10px; }
    .pnav-item { padding: 8px 12px!important; font-size: 13px; }
    .pnav-label { font-size: 11px; padding: 4px 10px; }
    footer.footer .imgFoo { max-height: 60px; }
}

/* ════════════════════════════════════════════════════════════
   MODERNIZACIÓN DE FORMULARIOS — Transforma Bootstrap 3 legacy
   form-horizontal + col-md-2/col-md-10 → diseño moderno stacked
   ════════════════════════════════════════════════════════════ */

/* --- Card wrapper moderno para formularios --- */
.gob-card {
    background: var(--blanco);
    border-radius: 14px;
    box-shadow: var(--sombra-1);
    border: 1px solid var(--borde-l);
    padding: 32px;
    margin-bottom: 24px;
    transition: box-shadow var(--ease);
}
.gob-card:hover { box-shadow: var(--sombra-2); }

.gob-card-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 2px solid var(--borde-l);
}
.gob-card-header h2, .gob-card-header h3 {
    margin: 0!important;
    font-size: 22px!important;
    color: var(--azul)!important;
    font-weight: 700;
}
.gob-card-header p {
    margin: 4px 0 0!important;
    color: var(--texto-sec);
    font-size: 14px;
}
.gob-card-icon {
    width: 48px; height: 48px;
    background: linear-gradient(135deg, var(--azul), var(--azul-l));
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 22px;
    flex-shrink: 0;
}

/* --- Avatar circular moderno --- */
.gob-avatar-section {
    text-align: center;
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--borde-l);
}
.gob-avatar {
    width: 120px!important; height: 120px!important;
    border-radius: 50%!important;
    object-fit: cover!important;
    border: 4px solid var(--borde)!important;
    box-shadow: 0 4px 16px rgba(0,0,0,.08)!important;
    margin: 0 auto 16px!important;
    display: block!important;
    transition: all var(--ease);
}
.gob-avatar:hover {
    border-color: var(--dorado)!important;
    box-shadow: 0 6px 24px rgba(173,132,17,.2)!important;
    transform: scale(1.03);
}

/* Modernizar thumbnails existentes dentro de formularios */
.form-horizontal .thumbnail,
.card-body .thumbnail,
.gob-card .thumbnail {
    width: 120px!important; height: 120px!important;
    border-radius: 50%!important;
    object-fit: cover!important;
    border: 4px solid var(--borde)!important;
    box-shadow: 0 4px 16px rgba(0,0,0,.08)!important;
    display: block!important;
    transition: all var(--ease);
    padding: 0!important;
}
.form-horizontal .thumbnail:hover,
.card-body .thumbnail:hover {
    border-color: var(--dorado)!important;
    box-shadow: 0 6px 24px rgba(173,132,17,.2)!important;
}

/* --- File input moderno --- */
.gob-file-input {
    border: 2px dashed var(--borde)!important;
    border-radius: var(--radio)!important;
    padding: 16px!important;
    text-align: center;
    transition: all var(--ease);
    cursor: pointer;
    background: #fcfbf9;
}
.gob-file-input:hover {
    border-color: var(--azul)!important;
    background: var(--dorado-bg);
}

/* Modernizar filestyle existente (fix overflow en cards) */
.bootstrap-filestyle,
.bootstrap-filestyle.input-group {
    display: flex !important;
    gap: 8px;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;      /* override BS3 input-group table layout */
}
.bootstrap-filestyle .form-control {
    flex: 1 1 0% !important;
    min-width: 0 !important;             /* allow flex shrink below content */
    width: auto !important;
    display: block !important;
    border-radius: var(--radio-s) !important;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bootstrap-filestyle .input-group-btn,
.bootstrap-filestyle .group-span-filestyle {
    display: flex !important;
    width: auto !important;
    flex-shrink: 0;
}
.bootstrap-filestyle .btn {
    border-radius: var(--radio-s) !important;
    white-space: nowrap;
    flex-shrink: 0;
}
/* Asegurar que gob-card/gob-field contienen sus hijos */
.gob-field { overflow: hidden; }

/* --- Form grid moderno (2 columnas en desktop) --- */
.gob-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.gob-form-grid .gob-field-full {
    grid-column: 1 / -1;
}
@media (max-width: 767.98px) {
    .gob-form-grid { grid-template-columns: 1fr; }
}

/* --- Campo de formulario moderno --- */
.gob-field {
    margin-bottom: 20px;
}
.gob-field label,
.gob-field .control-label {
    display: block!important;
    float: none!important;
    width: 100%!important;
    text-align: left!important;
    padding: 0!important;
    margin-bottom: 6px!important;
    color: var(--negro)!important;
    font-weight: 700!important;
    font-size: 13px!important;
    letter-spacing: .3px;
    text-transform: uppercase;
}

/* --- Botones de acción del formulario --- */
.gob-form-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 2px solid var(--borde-l);
}
.gob-form-actions .btn-primary,
.gob-form-actions input[type="submit"] {
    background: linear-gradient(135deg, var(--azul), var(--azul-l))!important;
    border: none!important;
    color: #fff!important;
    padding: 12px 32px!important;
    border-radius: var(--radio)!important;
    font-weight: 700!important;
    font-size: 15px!important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25)!important;
    transition: all var(--ease)!important;
    cursor: pointer;
}
.gob-form-actions input[type="submit"]:hover,
.gob-form-actions .btn-primary:hover {
    background: linear-gradient(135deg, var(--azul-d), var(--azul))!important;
    box-shadow: 0 4px 18px rgba(0,61,123,.35)!important;
    transform: translateY(-1px);
}

/* --- Override btn-default cuando se usa como submit principal --- */
.gob-card input[type="submit"].btn-default,
.gob-card .btn-default[type="submit"] {
    background: linear-gradient(135deg, var(--azul), var(--azul-l))!important;
    border: none!important;
    color: #fff!important;
    padding: 12px 32px!important;
    border-radius: var(--radio)!important;
    font-weight: 700!important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25)!important;
}
.gob-card input[type="submit"].btn-default:hover {
    background: linear-gradient(135deg, var(--azul-d), var(--azul))!important;
    box-shadow: 0 4px 18px rgba(0,61,123,.35)!important;
    transform: translateY(-1px);
}

/* --- HR separators modernos --- */
.gob-card hr {
    border: none;
    border-top: 1px solid var(--borde-l);
    margin: 24px 0;
}

/* --- Link de acción secundaria --- */
.gob-link-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--azul);
    font-weight: 600;
    font-size: 14px;
    transition: all var(--ease);
    text-decoration: none;
    margin-top: 16px;
}
.gob-link-action:hover {
    color: var(--dorado)!important;
    transform: translateX(3px);
}

/* --- Checkbox moderno --- */
.gob-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #fcfbf9;
    border-radius: var(--radio-s);
    border: 1px solid var(--borde-l);
    transition: all var(--ease);
}
.gob-checkbox:hover { background: var(--dorado-bg); border-color: var(--dorado); }
.gob-checkbox input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--azul); }
.gob-checkbox label { margin: 0!important; font-weight: 600!important; color: var(--texto)!important; }

/* --- Status badge --- */
.gob-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
}
.gob-badge-success {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #c8e6c9;
}
.gob-badge-info {
    background: #e3f2fd;
    color: var(--azul);
    border: 1px solid #bbdefb;
}

/* --- Error page moderno --- */
.gob-error-page {
    text-align: center;
    padding: 60px 20px;
}
.gob-error-page .gob-error-icon {
    width: 80px; height: 80px;
    background: #ffebee;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 24px;
    font-size: 36px;
    color: #c62828;
}
.gob-error-page h2 {
    color: #c62828!important;
    margin-bottom: 16px!important;
}

/* --- Sección de info del usuario en perfil --- */
.gob-user-info {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: #f0f7ff;
    border-radius: var(--radio-s);
    border-left: 4px solid var(--azul);
    margin-bottom: 24px;
}
.gob-user-info strong {
    color: var(--azul);
}

/* --- Password strength visual --- */
.gob-password-hint {
    font-size: 12px;
    color: var(--texto-sec);
    margin-top: 6px;
}

/* ════════════════════════════════════════════════════════════
   FORM-HORIZONTAL → STACKED MODERN LAYOUT (system-wide)
   Transforms Bootstrap 3 col-md-2/col-md-10 into stacked fields
   ════════════════════════════════════════════════════════════ */

/* Make labels full-width and stack above inputs */
.card-body .form-horizontal .control-label,
.card-body .form-horizontal .col-md-2.control-label,
.card-body .form-horizontal label.control-label[class*="col-md-"] {
    float: none!important;
    width: 100%!important;
    text-align: left!important;
    padding: 0 15px!important;
    margin-bottom: 6px!important;
    font-size: 13px!important;
    text-transform: uppercase;
    letter-spacing: .3px;
}

/* Expand input columns to full width */
.card-body .form-horizontal .col-md-7,
.card-body .form-horizontal .col-md-9,
.card-body .form-horizontal .col-md-10,
.card-body .form-horizontal .col-md-12 {
    width: 100%!important;
    float: none!important;
}

/* Fix offset buttons */
.card-body .form-horizontal .col-md-offset-2 {
    margin-left: 0!important;
    padding-top: 20px;
    border-top: 2px solid var(--borde-l);
    margin-top: 8px;
}

/* Submit buttons in cards */
.card-body .form-horizontal input[type="submit"].btn-default,
.card-body input[type="submit"].btn-default {
    background: linear-gradient(135deg, var(--azul), var(--azul-l))!important;
    border: none!important;
    color: #fff!important;
    padding: 12px 32px!important;
    border-radius: var(--radio)!important;
    font-weight: 700!important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25)!important;
    transition: all var(--ease)!important;
}
.card-body .form-horizontal input[type="submit"].btn-default:hover,
.card-body input[type="submit"].btn-default:hover {
    background: linear-gradient(135deg, var(--azul-d), var(--azul))!important;
    box-shadow: 0 4px 18px rgba(0,61,123,.35)!important;
    transform: translateY(-1px);
}

/* Panel heading - remove inline color:black */
.card-header h3, .card-header h4 {
    color: #fff!important;
}

/* Form group spacing inside panels */
.card-body .form-horizontal .form-group {
    margin-bottom: 18px;
    padding-bottom: 0;
}

/* Selects inside panels - full width */
.card-body .form-horizontal select:not(.select2-hidden-accessible) {
    width: 100%!important;
    border: 2px solid var(--borde)!important;
    border-radius: var(--radio-s)!important;
    padding: 8px 12px!important;
    font-size: 14px!important;
    color: var(--negro)!important;
    background: var(--blanco)!important;
    transition: all var(--ease)!important;
}
.card-body .form-horizontal select:focus {
    border-color: var(--azul)!important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1)!important;
}

/* ════════════════════════════════════════════════════════════
   DL-HORIZONTAL — Modern definition list for profile views
   ════════════════════════════════════════════════════════════ */
.dl-horizontal dt {
    color: var(--texto-sec)!important;
    font-weight: 700!important;
    font-size: 13px!important;
    text-transform: uppercase;
    letter-spacing: .3px;
    width: auto!important;
    text-align: left!important;
    padding: 4px 0!important;
}
.dl-horizontal dd {
    margin-bottom: 14px!important;
    font-size: 15px!important;
    color: var(--negro)!important;
    margin-left: 200px!important;
    padding: 4px 0!important;
    border-bottom: 1px solid var(--borde-l);
}
.dl-horizontal dd:last-child { border-bottom: none; }

/* ════════════════════════════════════════════════════════════
   PANEL-HEADING — Remove inline styles like color:black
   ════════════════════════════════════════════════════════════ */
.card-header h3[style*="color:black"],
.card-header h3[style*="color: black"],
.card-header h4[style*="color:black"],
.card-header h4[style*="color: black"] {
    color: #fff!important;
}
.card-title[style*="height:31px"],
.card-title[style*="height: 31px"] {
    height: auto!important;
}
.card[style*="height:700px"],
.card[style*="height: 700px"] {
    height: auto!important;
    max-height: none!important;
}

/* ════════════════════════════════════════════════════════════
   BG-PRIMARY — Override Bootstrap 3 bg-primary (#337ab7 → azul GOB)
   ════════════════════════════════════════════════════════════ */
.bg-primary,
.modal-header.bg-primary,
div.bg-primary,
td.bg-primary,
th.bg-primary {
    background-color: var(--azul)!important;
    color: #fff!important;
}

/* #3d868e teal in inline styles */
*[style*="background-color: #3d868e"], *[style*="background-color:#3d868e"],
*[style*="background: #3d868e"], *[style*="background:#3d868e"],
tr[style*="3d868e"], th[style*="3d868e"], td[style*="3d868e"] {
    background-color: var(--azul)!important;
    color: #fff!important;
}
*[style*="color: #3d868e"], *[style*="color:#3d868e"] {
    color: var(--azul)!important;
}
*[style*="border-color: #3d868e"], *[style*="border-color:#3d868e"],
*[style*="border: 1px solid #3d868e"] {
    border-color: var(--azul)!important;
}

/* #5D5D5D old gray in layouts */
*[style*="color: #5D5D5D"], *[style*="color:#5D5D5D"],
*[style*="color: #5d5d5d"], *[style*="color:#5d5d5d"] {
    color: var(--texto-sec)!important;
}
*[style*="background-color: #5D5D5D"], *[style*="background-color:#5D5D5D"],
*[style*="background: #5D5D5D"], *[style*="background:#5D5D5D"],
*[style*="background-color: #5d5d5d"], *[style*="background:#5d5d5d"] {
    background-color: var(--azul)!important;
    color: #fff!important;
}

/* --- Inline old colors still in some views --- */
*[style*="color:mediumseagreen"], *[style*="color: mediumseagreen"] {
    color: #2e7d32!important;
}
*[style*="color:orangered"], *[style*="color: orangered"] {
    color: #c62828!important;
}
*[style*="color:dimgray"], *[style*="color: dimgray"] {
    color: var(--texto-sec)!important;
}
*[style*="color: #81828a"], *[style*="color:#81828a"] {
    color: var(--texto-sec)!important;
}
*[style*="background-color: #3d868e"], *[style*="background-color:#3d868e"] {
    background-color: var(--azul)!important;
    color: #fff!important;
}

/* --- User list table header override --- */
th[style*="3d868e"], td[style*="3d868e"] {
    background-color: var(--azul)!important;
    color: #fff!important;
}

/* ════════════════════════════════════════════════════════════════
   ICONOS — Bootstrap Icons + Glyphicons mejorados
   ════════════════════════════════════════════════════════════════ */

/* --- CRITICAL: Restaurar fuentes de iconos sobre la tipografía global !important --- */
.glyphicon,
[class^="glyphicon-"],
[class*=" glyphicon-"] {
    font-family: 'Glyphicons Halflings' !important;
    font-size: inherit;
    vertical-align: middle;
}
.bi,
[class^="bi-"],
[class*=" bi-"] {
    font-family: 'bootstrap-icons' !important;
}

/* Iconos en botones — espaciado consistente */
.btn .glyphicon,
.btn .bi {
    margin-right: 5px;
    vertical-align: -1px;
}
.btn .glyphicon:last-child,
.btn .bi:last-child {
    margin-right: 0;
}

/* --- Iconos de acción en tablas --- */
td .glyphicon,
td .bi {
    font-size: 16px;
    cursor: pointer;
    transition: color var(--ease), transform var(--ease);
}
td .glyphicon:hover,
td .bi:hover {
    color: var(--azul) !important;
    transform: scale(1.15);
}
/* --- Action links/buttons in tables: ensure icon visibility --- */
td a > .bi,
td a > .glyphicon,
td a.bi,
td a.glyphicon {
    color: var(--azul, #02395e);
    opacity: 1;
}
td a > .bi:hover,
td a > .glyphicon:hover,
td a.bi:hover,
td a.glyphicon:hover {
    color: var(--dorado, #ad8411) !important;
}
td .btn-outline-danger .bi,
td .btn-danger .bi {
    color: inherit;
}
/* --- Icon-only buttons: min tap target --- */
.btn .bi:only-child,
.btn .glyphicon:only-child {
    margin-right: 0;
}
.btn-xs .bi,
.btn-xs .glyphicon {
    font-size: 13px;
    vertical-align: -1px;
}

/* --- Iconos en panel headings --- */
.card-header .glyphicon,
.card-header .bi {
    margin-right: 6px;
    opacity: .85;
}

/* --- Iconos en list-group items --- */
.list-group-item .glyphicon,
.list-group-item .bi {
    margin-right: 8px;
    color: var(--azul);
    width: 20px;
    text-align: center;
}

/* --- Iconos en alerts --- */
.alert .glyphicon,
.alert .bi {
    margin-right: 6px;
    font-size: 15px;
}

/* --- Iconos en nav/tabs --- */
.nav > li > a > .glyphicon,
.nav > li > a > .bi {
    margin-right: 5px;
    font-size: 14px;
    opacity: .8;
}
.nav > li.active > a > .glyphicon,
.nav > li.active > a > .bi {
    opacity: 1;
}

/* --- Scroll-to-top button (reemplazo de fa fa-home) --- */
.gob-scroll-top,
#myBtn {
    position: fixed !important;
    bottom: 28px;
    right: 28px;
    z-index: 9999;
    display: none;
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    background: var(--azul) !important;
    color: #fff !important;
    font-size: 22px;
    line-height: 48px;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0,61,123,.35);
    transition: all var(--ease);
    padding: 0;
}
.gob-scroll-top:hover,
#myBtn:hover {
    background: var(--dorado) !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(173,132,17,.4);
}
.gob-scroll-top:active,
#myBtn:active {
    transform: translateY(-1px);
}

/* --- Badges con iconos (status indicators) --- */
.badge .glyphicon,
.badge .bi {
    font-size: 11px;
    margin-right: 3px;
}

/* --- Card icon headers (gob-card-icon) mejora --- */
.gob-card-icon .glyphicon,
.gob-card-icon .bi {
    font-size: 24px;
}

/* --- Download/action links con icono --- */
a > .bi-download,
a > .glyphicon-download-alt {
    transition: transform var(--ease);
}
a:hover > .bi-download,
a:hover > .glyphicon-download-alt {
    transform: translateY(2px);
}

/* --- Mejorar aspecto de iconos en modales --- */
.modal-header .glyphicon,
.modal-header .bi {
    margin-right: 8px;
    opacity: .9;
}

/* --- Compatibilidad: iconos de Font Awesome residuales → ocultar si no cargan --- */
.fa { font-family: "bootstrap-icons" !important; }
.fa-home::before { content: "\F51A" !important; }
.fa-download::before { content: "\F30A" !important; }
.fa-arrow-down::before { content: "\F128" !important; }
.fa-check::before { content: "\F26E" !important; }
.fa-times::before { content: "\F62A" !important; }
.fa-pencil::before { content: "\F4CB" !important; }
.fa-trash::before { content: "\F5DE" !important; }
.fa-plus::before { content: "\F4FE" !important; }
.fa-search::before { content: "\F52A" !important; }
.fa-eye::before { content: "\F341" !important; }
.fa-edit::before { content: "\F4CB" !important; }
.fa-save::before { content: "\F7A4" !important; }
.fa-file::before { content: "\F3A4" !important; }
.fa-print::before { content: "\F4D7" !important; }
.fa-refresh::before { content: "\F116" !important; }
.fa-cog::before { content: "\F3E5" !important; }
.fa-user::before { content: "\F4E1" !important; }
.fa-lock::before { content: "\F47C" !important; }
.fa-envelope::before { content: "\F32F" !important; }
.fa-calendar::before { content: "\F1E7" !important; }
.fa-bar-chart::before { content: "\F17A" !important; }
.fa-warning::before { content: "\F33B" !important; }
.fa-info-circle::before { content: "\F431" !important; }
.fa-question-circle::before { content: "\F504" !important; }
.fa-sign-out::before { content: "\F1C3" !important; }

/* ════════════════════════════════════════════════════════════
   ERRADICACIÓN DE TURQUESA/TEAL — Override global
   Reemplaza TODOS los colores teal/cyan/turquesa del sistema
   legacy por la paleta oficial de gobierno.
   ════════════════════════════════════════════════════════════ */

/* --- Fondos turquesa en banners/secciones → Azul Gobierno --- */
[style*="#249cad"],
[style*="#249CAD"],
[style*="#1cb7c0"],
[style*="#1CB7C0"],
[style*="#88cfe0"],
[style*="#88CFE0"],
[style*="#88d0d8"],
[style*="#88D0D8"],
[style*="#64c4da"],
[style*="#64C4DA"],
[style*="#269ebb"],
[style*="#269EBB"],
[style*="cadetblue"],
[style*="teal"],
[style*="lightblue"],
[style*="powderblue"] {
    /* Forzar herencia — los overrides específicos abajo ganan */
}

/* Banners/divs con fondo turquesa → Azul gobierno */
div[style*="background-color: #249cad"],
div[style*="background-color:#249cad"],
div[style*="background-color: #249CAD"],
div[style*="background-color:#249CAD"],
div[style*="background: #249cad"],
div[style*="background: #64c4da"],
div[style*="background-color: #64c4da"],
div[style*="background: #88cfe0"],
div[style*="background-color: #88cfe0"],
div[style*="background: #88d0d8"],
div[style*="background-color: #88d0d8"],
div[style*="background: teal"],
div[style*="background-color: teal"],
div[style*="background: cadetblue"],
div[style*="background-color: cadetblue"],
div[style*="background: lightblue"],
div[style*="background-color: lightblue"],
div[style*="background: powderblue"],
div[style*="background-color: powderblue"] {
    background-color: var(--azul) !important;
    background: var(--azul) !important;
    color: #fff !important;
}

/* Texto turquesa → Azul gobierno */
[style*="color: #1cb7c0"],
[style*="color:#1cb7c0"],
[style*="color: #1CB7C0"],
[style*="color:#1CB7C0"],
[style*="color: #249cad"],
[style*="color:#249cad"],
[style*="color: #88cfe0"],
[style*="color:#88cfe0"],
[style*="color: #88CFE0"],
[style*="color:#88CFE0"],
[style*="color: #64c4da"],
[style*="color:#64c4da"],
[style*="color: #269ebb"],
[style*="color:#269ebb"],
[style*="color: teal"],
[style*="color:teal"],
[style*="color: cadetblue"],
[style*="color:cadetblue"] {
    color: var(--azul) !important;
}

/* Bootstrap .label-info, .badge-info → Dorado gobierno */
.label-info {
    background-color: var(--dorado) !important;
    color: #fff !important;
}

/* Bootstrap .text-info → Azul gobierno */
.text-info {
    color: var(--azul) !important;
}

/* Bootstrap .bg-info → Azul claro fondo */
.bg-info {
    background-color: rgba(0,61,123,.08) !important;
    color: var(--texto) !important;
}

/* Bootstrap .alert-info → Azul gobierno */
.alert-info {
    background-color: rgba(0,61,123,.06) !important;
    border-color: rgba(0,61,123,.15) !important;
    color: var(--azul) !important;
}

/* Bootstrap .card.border-info → Azul gobierno */
.card.border-info { border-color: var(--azul) !important; }
.card.border-info > .card-header {
    background: var(--azul) !important;
    border-color: var(--azul) !important;
    color: #fff !important;
}

/* jqWidgets info overrides */
.jqx-info { background: var(--dorado) !important; border-color: var(--dorado) !important; }

/* Modal headers con cadetblue → Azul gobierno */
.modal-header[style*="cadetblue"],
.modal-header {
    /* Solo override si tiene cadetblue — el selector general ya cubre */
}

/* ─── FIX: Dropdown border-top más fino ─── */
/* Reducir de 3px a 2px para que no se vea grueso */

/* ─── FIX: Nav-pills en cabecera de entidad ─── */
/* Los tabs de "Tablero de Control / Presupuesto / Calificaciones" */
.nav.nav-pills.pull-left > li > a,
ul.nav.nav-pills[style*="font-size:15px"] > li > a {
    color: var(--texto) !important;
    font-weight: 600 !important;
    padding: 10px 16px !important;
    border-radius: var(--radio-s) !important;
    transition: all var(--ease) !important;
    border: 2px solid transparent !important;
    background: transparent !important;
}

.nav.nav-pills.pull-left > li > a:hover,
ul.nav.nav-pills[style*="font-size:15px"] > li > a:hover {
    color: var(--dorado) !important;
    background: var(--dorado-bg) !important;
    border-color: transparent !important;
}

.nav.nav-pills.pull-left > li.active > a,
.nav.nav-pills.pull-left > li.active > a:hover,
.nav.nav-pills.pull-left > li.active > a:focus,
ul.nav.nav-pills[style*="font-size:15px"] > li.active > a,
ul.nav.nav-pills[style*="font-size:15px"] > li.active > a:hover {
    background: var(--azul) !important;
    color: #fff !important;
    border-color: var(--azul) !important;
    border-radius: var(--radio-s) !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25) !important;
}

/* ─── FIX: Contenedor de tabs con línea turquesa → Dorado ─── */
hr.rowHeadContEl,
.rowHeadContEl,
hr[style*="#88"],
hr[style*="#64"],
hr[style*="#26"],
hr[style*="teal"],
hr[style*="cadetblue"] {
    border-color: var(--dorado) !important;
}

/* Calificación Institucional — fondo azul claro box */
div[style*="background-color: lightblue"],
div[style*="background: lightblue"],
div[style*="background-color:lightblue"],
td[style*="background-color: lightblue"],
td[style*="background: lightblue"],
span[style*="background-color: lightblue"],
span[style*="background: lightblue"],
[style*="background-color: powderblue"],
[style*="background: powderblue"] {
    background-color: rgba(0,61,123,.08) !important;
    background: rgba(0,61,123,.08) !important;
}

/* ─── FIX: Border turquesa en cajas → Azul gobierno ─── */
[style*="border-color: #88cfe0"],
[style*="border-color:#88cfe0"],
[style*="border-color: #64c4da"],
[style*="border-color:#64c4da"],
[style*="border-color: #249cad"],
[style*="border-color:#249cad"],
[style*="border: 1px solid #88"],
[style*="border: 2px solid #88"],
[style*="border: 1px solid #64"],
[style*="border: 2px solid #64"],
[style*="border-color: teal"],
[style*="border-color:teal"],
[style*="border-color: cadetblue"],
[style*="border-color:cadetblue"] {
    border-color: var(--azul) !important;
}

/* ─── FIX: Links turquesa en tablas → Azul gobierno ─── */
table a[style*="color: #1cb7c0"],
table a[style*="color:#1cb7c0"],
table th[style*="color: #1cb7c0"],
table td[style*="color: #1cb7c0"],
table h5[style*="color: #1cb7c0"],
table h4[style*="color: #1cb7c0"],
table h3[style*="color: #1cb7c0"] {
    color: var(--azul) !important;
}

/* ─── Override para letraDinamicGene (usada en tablas turquesa) ─── */
.letraDinamicGene[style*="color: #1cb7c0"],
.letraDinamicGene[style*="color:#1cb7c0"],
h5.letraDinamicGene[style*="color: #1cb7c0"],
h4.letraDinamicGene[style*="color: #1cb7c0"],
h3.letraDinamicGene[style*="color: #1cb7c0"] {
    color: var(--azul) !important;
}

/* ─── FIX: Dropdown menu active item → Mejor legibilidad ─── */
.dropdown-menu > li.active > a,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    background: var(--azul) !important;
    color: #fff !important;
    border-left-color: var(--dorado) !important;
}

/* ─── FIX: jqWidgets teal → Azul gobierno ─── */
.jqx-fill-state-pressed,
.jqx-fill-state-hover {
    background-color: var(--azul) !important;
    border-color: var(--azul) !important;
}

/* ─── Sección Evaluación/Calificación boxes ─── */
.calificacion-box,
div.col-lg-2 > div[style*="border"],
div.col-md-2 > div[style*="border"] {
    border-color: var(--borde) !important;
}

/* ─── Catch-all: cualquier fondo #83cee1 restante ─── */
[style*="background-color: #83cee1"],
[style*="background-color:#83cee1"],
[style*="background: #83cee1"],
.contenidoazul[style*="#83cee1"],
.boxCalInst {
    background-color: rgba(0,61,123,.1) !important;
    background: rgba(0,61,123,.1) !important;
}

/* ─── Inline styles legacy con Poppins-Bold/Regular se mantienen
   en Poppins (familia genérica). Antes esta regla los forzaba a
   Georgia para alinear con el sistema de tipografía Georgia que
   existía pre-DIGER. Ahora que la familia oficial del sistema es
   Poppins, ese forzado quedó invertido y se elimina. */

/* ─── Skyblue backgrounds restantes ─── */
[style*="background: skyblue"],
[style*="background-color: skyblue"],
[style*="background:skyblue"],
[style*="background-color:skyblue"] {
    background: var(--azul) !important;
    background-color: var(--azul) !important;
}

/* ════════════════════════════════════════════════════════════
   DROPDOWN MENÚ — Global (Cabecera, Tablas, Cards, etc.)
   ════════════════════════════════════════════════════════════ */

/* Nota: Los dropdowns dentro de tablas/paneles se manejan via JS en bootstrap-compat.js
   (se mueven al body al abrirse para evitar clipping por overflow de contenedores) */

/* Global dropdown menu styling */
.dropdown-menu {
    min-width: 260px !important;
    border: 1px solid var(--borde) !important;
    border-top: 2px solid var(--dorado) !important;
    border-radius: 0 0 var(--radio) var(--radio) !important;
    background: var(--blanco) !important;
    box-shadow: var(--sombra-3) !important;
    padding: 6px 0 !important;
    z-index: 1050 !important;
}

/* All dropdown items — BS3 <li><a> → BS5 dropdown-item style */
.dropdown-menu > li > a:not(.dropdown-item),
.dropdown-menu > li > a.dropdown-item,
.dropdown-menu .list-inline-item > a {
    display: block !important;
    padding: 8px 18px !important;
    font-size: 13.5px !important;
    color: var(--texto) !important;
    line-height: 1.5 !important;
    white-space: normal !important;
    text-decoration: none !important;
    background: transparent !important;
    transition: all .15s ease !important;
}
.dropdown-menu > li > a:hover,
.dropdown-menu .list-inline-item > a:hover {
    background: rgba(0,61,123,.06) !important;
    color: var(--azul) !important;
    text-decoration: none !important;
}
/* Iconos dentro de items de dropdown */
.dropdown-menu .glyphicon,
.dropdown-menu .bi {
    margin-right: 8px !important;
    font-size: 14px !important;
    width: auto !important;
    color: var(--azul) !important;
    vertical-align: middle !important;
}
.dropdown-menu .icono.inactivo {
    color: var(--texto-sec) !important;
    opacity: .5 !important;
}
/* list-inline-item inside dropdown — force block display */
.dropdown-menu .list-inline-item {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* Divider */
.dropdown-menu .divider,
.dropdown-menu > li.divider {
    height: 0 !important;
    margin: 4px 0 !important;
    border-top: 1px solid var(--borde-l) !important;
    padding: 0 !important;
    display: block !important;
}
/* Sub-collapse inside dropdown (e.g., SIAFI section) */
.dropdown-menu .ul-collapse > a {
    font-weight: 600 !important;
}
.dropdown-menu .collapse ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}
.dropdown-menu .collapse ul > li > a {
    padding-left: 32px !important;
    font-size: 12.5px !important;
}

/* Botón hamburguesa de tabla — mejorar apariencia */
img.botonMenu {
    width: 28px !important;
    height: 28px !important;
    padding: 3px !important;
    border-radius: var(--radio-s) !important;
    transition: background .15s ease !important;
    opacity: .7 !important;
}
img.botonMenu:hover {
    opacity: 1 !important;
    background: var(--dorado-bg) !important;
}

/* ════════════════════════════════════════════════════════════
   PORCENTAJES GRANDES — Prevenir overflow
   ════════════════════════════════════════════════════════════ */

/* Calificaciones Institucionales — box principal */
.boxCalInst {
    width: 100% !important;
    max-width: 400px !important;
    height: auto !important;
    min-height: 120px !important;
    padding: 20px 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.semCalInst {
    font-size: clamp(36px, 5vw, 62px) !important;
    line-height: 1.1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-break: break-all !important;
}

/* Cards de calificación (Meta Principal, Complementarias, etc.) */
.r2box .grpelem,
.r2box .t3 .grpelem,
div[onclick="cambiatab1()"] .grpelem {
    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.2 !important;
}
/* Calificación ponderada en los 4 cards */
.r2box .t5,
div[onclick="cambiatab1()"] .t5 {
    font-size: clamp(26px, 3.5vw, 36px) !important;
    line-height: 1.2 !important;
    word-break: break-all !important;
}

/* Porcentajes en boxes de reporte (54px) */
.porcentajes > label {
    font-size: clamp(30px, 4vw, 48px) !important;
    word-break: break-all !important;
    overflow: hidden !important;
}

/* Porcentajes en gabinete/dashboard con font-size 50px inline */
.lineaSep > div > form > span {
    font-size: clamp(28px, 4vw, 42px) !important;
}

/* Portal Público — porcentajes grandes (72-96px) */
[style*="font-size: 85px"],
[style*="font-size:85px"],
[style*="font-size: 82px"],
[style*="font-size:82px"],
[style*="font-size: 90px"],
[style*="font-size:90px"],
[style*="font-size: 96px"],
[style*="font-size:96px"],
[style*="font-size: 76px"],
[style*="font-size:76px"],
[style*="font-size: 72px"],
[style*="font-size:72px"] {
    font-size: clamp(36px, 5vw, 60px) !important;
    line-height: 1.1 !important;
    word-break: break-all !important;
}

/* Porcentajes inline 50px — soporte técnico, hospital, planes */
[style*="font-size: 50px"],
[style*="font-size:50px"] {
    font-size: clamp(28px, 4vw, 42px) !important;
    line-height: 1.2 !important;
}

/* Porcentajes inline 54px — reporte institución */
[style*="font-size: 54px"],
[style*="font-size:54px"] {
    font-size: clamp(30px, 4vw, 46px) !important;
    line-height: 1.2 !important;
}

/* Porcentajes inline 45px/48px — calificaciones cards */
[style*="font-size: 45px"],
[style*="font-size:45px"],
[style*="font-size: 48px"],
[style*="font-size:48px"] {
    font-size: clamp(26px, 3.5vw, 38px) !important;
    line-height: 1.2 !important;
}

/* ─── boxCalSem (Calificaciones desglosadas por trimestre) ─── */
.boxCalSem {
    font-size: clamp(16px, 2vw, 22px) !important;
    word-break: break-word !important;
    overflow: hidden !important;
}

/* ─── Responsive: tamaños aún más pequeños en pantallas chicas ─── */
@media (max-width: 992px) {
    .semCalInst { font-size: 40px !important; }
    .boxCalInst { max-width: 100% !important; padding: 15px !important; }
    .r2box .grpelem,
    div[onclick="cambiatab1()"] .grpelem { font-size: 28px !important; }
    .r2box .t5,
    div[onclick="cambiatab1()"] .t5 { font-size: 26px !important; }
}
@media (max-width: 767.98px) {
    .semCalInst { font-size: 32px !important; }
    .boxCalSem { font-size: 16px !important; }
    table .dropdown-menu,
    td .dropdown-menu { min-width: 260px !important; max-width: 320px !important; }
}

/* ════════════════════════════════════════════════════════════════
   V2 REDESIGN — Rediseno UI/UX Marzo 2026
   Portal Publico Premium + App Interna Polish
   ════════════════════════════════════════════════════════════════ */

/* ─── FASE 1: Portal Publico — Header Premium ─── */

.portal-header {
    background: linear-gradient(180deg, #ffffff 0%, #faf9f6 100%) !important;
    padding: 20px 0 !important;
    border-bottom: none !important;
    box-shadow: 0 2px 20px rgba(0,42,86,.07) !important;
    position: relative;
    z-index: 10;
    margin-bottom: 12px !important;
}
.portal-header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l) 50%, var(--dorado));
}
.portal-header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--azul), var(--azul-l) 40%, var(--dorado) 70%, var(--dorado-l));
}
.sigpret-brand {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--azul) !important;
    letter-spacing: 3px;
    text-transform: uppercase;
    display: block;
    line-height: 1.2;
}
.sigpret-subtitle {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 12px !important;
    color: var(--texto-sec) !important;
    letter-spacing: .5px;
    display: block;
    margin-top: 4px;
    position: relative;
    padding-top: 6px;
}
.sigpret-subtitle::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 40px; height: 2px;
    background: var(--dorado);
}

/* ─── FASE 2: Portal Publico — Tab Navigation Premium ─── */

.portal-nav {
    background: linear-gradient(135deg, var(--azul-d) 0%, var(--azul) 45%, var(--azul-l) 100%) !important;
    border-radius: 16px !important;
    padding: 8px 12px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 24px rgba(0,42,86,.22), inset 0 1px 0 rgba(255,255,255,.06) !important;
    position: relative;
    overflow: hidden;
}
.portal-nav::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--dorado-l) 50%, transparent);
    z-index: 1;
}
.pnav-item {
    background: rgba(255,255,255,.07) !important;
    border-radius: 12px !important;
    padding: 14px 24px !important;
    transition: all .3s cubic-bezier(.4,0,.2,1) !important;
    text-align: center;
    cursor: pointer;
    color: rgba(255,255,255,.8) !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    border: 1px solid rgba(255,255,255,.06);
    line-height: 1.3 !important;
}
.pnav-item:hover {
    background: rgba(255,255,255,.16) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    color: #fff !important;
}
.pnav-item.active {
    background: linear-gradient(135deg, var(--dorado), var(--dorado-l)) !important;
    color: #fff !important;
    box-shadow: 0 4px 20px rgba(173,132,17,.4), inset 0 1px 0 rgba(255,255,255,.2) !important;
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.12) !important;
}
.pnav-label {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 6px 10px !important;
    color: rgba(255,255,255,.5) !important;
    font-weight: 600 !important;
    font-size: 9px !important;
    text-transform: uppercase;
    letter-spacing: 2px !important;
    border: none !important;
    border-left: 1px solid rgba(255,255,255,.2) !important;
    white-space: nowrap;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    cursor: default;
    user-select: none;
}

/* ─── FASE 3: Portal Publico — Landing Page ─── */

#panelPortada > div {
    border: 1px solid var(--borde-l) !important;
    border-radius: 20px !important;
    position: relative;
    overflow: hidden;
}
#panelPortada > div::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--dorado), var(--azul) 50%, var(--dorado));
    border-radius: 20px 20px 0 0;
    z-index: 4;
}

/* Module cards panel */
.contMonitoreo {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 60%, #1a6fc9 100%) !important;
    border-radius: 14px !important;
    transition: all .3s cubic-bezier(.4,0,.2,1) !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.18), inset 0 1px 0 rgba(255,255,255,.08) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    position: relative;
    overflow: hidden;
}
.contMonitoreo::after {
    content: '';
    position: absolute;
    top: -10px; right: -10px;
    width: 80px; height: 80px;
    background: radial-gradient(circle, rgba(173,132,17,.12), transparent 70%);
    pointer-events: none;
}
.contMonitoreo:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 32px rgba(0,61,123,.28), inset 0 1px 0 rgba(255,255,255,.12) !important;
    border-color: rgba(255,255,255,.12) !important;
}
.contMonitoreo:active {
    transform: translateY(-1px) !important;
}

/* Module heading */
#parraMonitoreo {
    color: var(--azul) !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: -.3px;
    position: relative;
    padding-bottom: 14px !important;
    margin-bottom: 18px !important;
}
#parraMonitoreo::after {
    content: '';
    position: absolute;
    bottom: 0; left: 50%;
    transform: translateX(-50%);
    width: 60px; height: 3px;
    background: var(--dorado);
    border-radius: 2px;
}

/* Fix container1 clipping in portal ministros */
#container1 {
    height: auto !important;
    min-height: 0 !important;
}

/* ─── FASE 4: Portal Publico — Footer Premium ─── */

footer.footer {
    background: linear-gradient(180deg, var(--azul) 0%, #001a3d 100%) !important;
    border-top: none !important;
    position: relative;
    margin-top: 40px !important;
}
footer.footer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l) 40%, var(--azul-l) 80%, var(--azul));
}
footer.footer > .container-fluid {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    padding: 40px 48px 32px !important;
    gap: 16px;
}
footer.footer .card,
footer.footer .blockFooter {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
footer.footer .blockFooterMid {
    border: none !important;
}
footer.footer .blockFooterMid img {
    max-width: 360px !important;
    width: 100%;
    opacity: .9;
    transition: opacity .3s ease;
}
footer.footer .blockFooterMid img:hover {
    opacity: 1;
}
footer.footer #parrafCopyright {
    color: rgba(255,255,255,.6) !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    max-height: none !important;
    margin: 0 !important;
}
footer.footer .col-sm-4 {
    flex: 1 1 0 !important;
    display: flex !important;
    align-items: center !important;
}
footer.footer .col-sm-4:first-child { justify-content: flex-start !important; }
footer.footer .col-sm-4:nth-child(2) { justify-content: center !important; }
footer.footer .col-sm-4:last-child { justify-content: flex-end !important; text-align: right !important; }

/* ─── FASE 5: Portal Ministros — Category & Investment Cards ─── */

.category-box {
    border: 2px solid var(--borde) !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, #ffffff 0%, #faf9f7 100%) !important;
    transition: all .3s cubic-bezier(.4,0,.2,1) !important;
    position: relative;
    overflow: hidden;
    color: var(--azul) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.04) !important;
}
.category-box::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--azul), var(--dorado));
    opacity: 0;
    transition: opacity .3s ease;
}
.category-box:hover {
    border-color: var(--azul) !important;
    box-shadow: 0 8px 32px rgba(0,61,123,.12) !important;
    transform: translateY(-4px) !important;
}
.category-box:hover::before {
    opacity: 1;
}
.iconCat {
    color: var(--azul) !important;
    font-size: 40px !important;
    transition: color .3s ease, transform .3s ease;
}
.category-box:hover .iconCat {
    color: var(--dorado) !important;
    transform: scale(1.1);
}
.boxMontoTotal {
    border: 3px solid var(--azul) !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, rgba(0,61,123,.02), rgba(173,132,17,.02)) !important;
    position: relative;
    overflow: hidden;
}
.boxMontoTotal::after {
    content: '';
    position: absolute;
    bottom: 0; left: 50%;
    transform: translateX(-50%);
    width: 80px; height: 3px;
    background: var(--dorado);
    border-radius: 2px;
}
.amount {
    color: var(--azul) !important;
}

/* ─── FASE 6: App Interna — Navbar Premium ─── */

body {
    margin: 0 !important;
    padding: 0 !important;
}

#ttr_menu {
    margin-bottom: 0 !important;
}
#ttr_menu .navbar,
.navbar-default {
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: 0 4px 24px rgba(0,42,86,.35) !important;
}
#ttr_menu::after {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l) 50%, var(--dorado));
}

/* Container — relative for absolute logo, padding-left reserves logo zone */
#ttr_menu_inner_in {
    min-height: 0 !important;
    height: auto !important;
    width: 100% !important;
    position: relative !important;
    padding: 0 24px 0 560px !important;
}

/* Logo — BIG, absolute, vertically centered on left */
.ttr_menu_logo {
    position: absolute !important;
    top: 50% !important;
    left: 24px !important;
    transform: translateY(-50%) !important;
    z-index: 502 !important;
    border: none !important;
}
.ttr_menu_logo img,
#logoSig {
    height: 80px !important;
    max-height: 80px !important;
    width: auto !important;
    max-width: 400px !important;
    border: none !important;
    outline: none !important;
}

/* Nav wrapper — full width */
#navigationmenu {
    width: 100% !important;
}

/* Hide BS3 toggle on desktop */
.navbar-header,
.navbar-toggle {
    display: none !important;
}
@media (max-width: 767.98px) {
    .navbar-header, .navbar-toggle { display: block !important; }
    #ttr_menu_inner_in { padding-left: 24px !important; }
}

.ttr_images_container { display: block !important; }

/* Menu center: flex-grow so it fills all space after logo zone */
.menu-center {
    width: 100% !important;
    flex-grow: 1 !important;
}

/* Menu items UL: flex, pushed to FAR RIGHT via margin-left auto */
.nav.ttr_menu_items,
ul.ttr_menu_items.nav.navbar-nav.navbar-right {
    padding-top: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    margin: 0 !important;
    margin-left: auto !important;
    float: none !important;
    width: auto !important;
}

/* Hide hr separators */
#ttr_menu hr.horiz_separator,
#ttr_menu hr,
.nav.ttr_menu_items > li > hr {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Kill BS5 dropdown caret, replace with gold underline on hover */
.nav.ttr_menu_items > li > a.dropdown-toggle::after,
.nav.ttr_menu_items > li > .ttr_menu_items_parent_link.dropdown-toggle::after,
#ttr_menu .ttr_menu_items_parent_link::after {
    border: none !important;
    width: 0 !important;
    height: 2px;
    display: block !important;
    position: absolute;
    background: var(--dorado-l);
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    content: '';
    transition: width .3s cubic-bezier(.4,0,.2,1);
}

/* Menu links — BIG, legible, generous spacing */
.nav.ttr_menu_items > li > .ttr_menu_items_parent_link,
.nav.ttr_menu_items > li > a:not(.dropdown-item) {
    padding: 40px 24px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    white-space: nowrap;
    position: relative;
    letter-spacing: .4px;
}

/* Body content */
#bodyPrincipal {
    padding: 24px 28px !important;
    margin: 0 !important;
    min-height: calc(100vh - 140px) !important;
}
.margin_collapsetop {
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ─── FASE 7: App Interna — Dashboard + Cards ─── */

.dash-header {
    background: linear-gradient(135deg, #02395e 0%, #0d5ba3 100%) !important;
    border-radius: 16px !important;
    padding: 28px 32px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 20px rgba(0,42,86,.18) !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    position: relative;
    overflow: hidden;
}
.dash-header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    width: auto;
    background: linear-gradient(90deg, #ad8411, #c9a227 50%, #ad8411);
    border-radius: 0;
}
.dash-header::after {
    content: '';
    position: absolute;
    top: -40px; right: -40px;
    width: 160px; height: 160px;
    background: radial-gradient(circle, rgba(173,132,17,.12), transparent 70%);
    pointer-events: none;
}
.dash-header h1 {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #fff !important;
    margin: 0 !important;
    line-height: 1.2;
    letter-spacing: -.5px;
    text-shadow: 0 1px 4px rgba(0,0,0,.15);
}
.dash-greeting {
    font-size: 15px;
    color: rgba(255,255,255,.75);
    margin-top: 6px;
}
.dash-greeting .user-name {
    color: #c9a227;
    font-weight: 700;
    text-transform: capitalize;
    cursor: pointer;
    transition: color .2s;
}
.dash-greeting .user-name:hover {
    color: #e8c44a;
}

/* Dashboard filters (integrated in header) */
.dash-filters {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.dash-filter-item {
    min-width: 180px;
}
.dash-filter-label {
    font-size: 14px;
    color: rgba(255,255,255,.75);
    white-space: nowrap;
}
.dash-filter-label strong {
    color: #c9a227;
    font-weight: 700;
}
.dash-select {
    background: rgba(255,255,255,.15) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    border-radius: 8px !important;
    padding: 8px 36px 8px 14px !important;
    font-size: 13.5px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    cursor: pointer;
    transition: all .2s;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23c9a227' d='M1 1l5 5 5-5' stroke='%23c9a227' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 12px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    line-height: 1.4;
}
.dash-select:hover {
    background: rgba(255,255,255,.22) !important;
    border-color: rgba(201,162,39,.6) !important;
}
.dash-select:focus {
    outline: none !important;
    border-color: #c9a227 !important;
    box-shadow: 0 0 0 3px rgba(201,162,39,.25) !important;
    background: rgba(255,255,255,.2) !important;
}
.dash-select option {
    background: #02395e;
    color: #fff;
    padding: 8px;
}

.dash-content {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 24px 28px !important;
    box-shadow: var(--sombra-1) !important;
    border: 1px solid var(--borde-l) !important;
    min-height: 320px;
}

/* ══ Executive Dashboard ══ */
.exec-row {
    display: grid;
    gap: 20px;
    margin-bottom: 22px;
}
.exec-row-2 { grid-template-columns: 1fr 1fr; }
.exec-row-5 { grid-template-columns: repeat(5, 1fr); }
.exec-row-auto { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

/* Donut gauge card */
.exec-gauge-card {
    background: #fff;
    border-radius: 14px;
    padding: 28px 24px;
    border: 1px solid #e8e4dc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.exec-gauge-wrap {
    position: relative;
    width: 160px;
    height: 160px;
    margin-bottom: 12px;
}
.gauge-bg { fill: none; stroke: #eeebe5; stroke-width: 10; }
.gauge-ring {
    fill: none;
    stroke-width: 10;
    stroke-linecap: round;
    transform: rotate(-90deg);
    transform-origin: center;
    animation: gaugeFill 1.2s ease-out forwards;
}
.gauge-val {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 32px;
    font-weight: 800;
    line-height: 1;
}
.gauge-val small {
    font-size: 16px;
    font-weight: 600;
}
.gauge-label {
    font-size: 14px;
    font-weight: 700;
    color: #02395e;
    margin-bottom: 2px;
}
.gauge-sublabel {
    font-size: 11px;
    color: #999;
    text-transform: uppercase;
    letter-spacing: .5px;
}
@keyframes gaugeFill {
    from { stroke-dashoffset: 440; }
}

/* Distribution card */
.exec-dist-card {
    background: #fff;
    border-radius: 14px;
    padding: 28px 24px;
    border: 1px solid #e8e4dc;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.exec-dist-title {
    font-size: 14px;
    font-weight: 700;
    color: #02395e;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.dist-stacked {
    height: 36px;
    border-radius: 8px;
    display: flex;
    overflow: hidden;
    margin-bottom: 16px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.06);
}
.dist-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    transition: width .8s ease;
    min-width: 0;
}
.dist-seg.high { background: #1b8a4a; }
.dist-seg.mid  { background: #b8860b; }
.dist-seg.low  { background: #c0392b; }
.dist-seg.na   { background: #d0cdc7; color: #888; }
.dist-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
.dist-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #555;
}
.dist-legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    flex-shrink: 0;
}
.dist-legend-val {
    font-weight: 700;
    margin-right: 2px;
}

/* Pillar KPI cards */
.exec-pillar {
    background: #fff;
    border-radius: 12px;
    padding: 18px 16px;
    border: 1px solid #e8e4dc;
    text-align: center;
    transition: box-shadow .2s, transform .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.exec-pillar:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
    transform: translateY(-2px);
}
.exec-pillar .pillar-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    margin-bottom: 10px;
}
.exec-pillar .pillar-val {
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
}
.exec-pillar .pillar-lbl {
    font-size: 11px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-weight: 600;
    margin-top: 4px;
}
.exec-pillar .pillar-weight {
    font-size: 10px;
    color: #bbb;
    margin-top: 2px;
}
.exec-pillar .pillar-bar {
    width: 100%;
    height: 4px;
    background: #eeebe5;
    border-radius: 2px;
    overflow: hidden;
    margin-top: 10px;
}
.exec-pillar .pillar-fill {
    height: 100%;
    border-radius: 2px;
    transition: width .8s ease;
}

/* Rankings */
.exec-ranking {
    background: #fff;
    border-radius: 14px;
    padding: 20px 22px;
    border: 1px solid #e8e4dc;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.exec-ranking-title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.exec-ranking-title.top { color: #1b8a4a; }
.exec-ranking-title.bottom { color: #c0392b; }
.rank-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f5f3ef;
}
.rank-item:last-child { border-bottom: none; }
.rank-pos {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
}
.rank-pos.top { background: #ecfdf5; color: #1b8a4a; }
.rank-pos.bottom { background: #fef2f2; color: #c0392b; }
.rank-name {
    flex: 1;
    font-size: 13px;
    color: #333;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.rank-name a {
    color: inherit;
    text-decoration: none;
    transition: color .2s;
}
.rank-name a:hover { color: #02395e; }
.rank-bar-wrap {
    width: 80px;
    height: 6px;
    background: #eeebe5;
    border-radius: 3px;
    overflow: hidden;
    flex-shrink: 0;
}
.rank-bar-fill {
    height: 100%;
    border-radius: 3px;
    transition: width .6s ease;
}
.rank-pct {
    font-size: 13px;
    font-weight: 700;
    min-width: 52px;
    text-align: right;
}

/* Sector bars */
.exec-sectors {
    background: #fff;
    border-radius: 14px;
    padding: 20px 22px;
    border: 1px solid #e8e4dc;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.exec-sectors-title {
    font-size: 14px;
    font-weight: 700;
    color: #02395e;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.sector-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid #faf8f5;
}
.sector-row:last-child { border-bottom: none; }
.sector-name {
    width: 100px;
    font-size: 12px;
    font-weight: 600;
    color: #555;
    text-align: right;
    flex-shrink: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sector-bar-wrap {
    flex: 1;
    height: 20px;
    background: #f5f3ef;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}
.sector-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width .8s ease;
    display: flex;
    align-items: center;
    padding-left: 8px;
}
.sector-bar-fill span {
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.sector-count {
    font-size: 11px;
    color: #bbb;
    width: 32px;
    text-align: center;
    flex-shrink: 0;
}

/* Section separator */
.exec-separator {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 28px 0 20px;
    color: #999;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}
.exec-separator::before,
.exec-separator::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, #d4cfc4, transparent);
}

/* Toggle button */
.exec-toggle {
    background: none;
    border: 1px solid #d4cfc4;
    border-radius: 6px;
    padding: 4px 12px;
    font-size: 11px;
    color: #888;
    cursor: pointer;
    transition: all .2s;
    font-family: inherit;
}
.exec-toggle:hover {
    border-color: #02395e;
    color: #02395e;
}

/* Responsive */
@media (max-width: 992px) {
    .exec-row-5 { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
    .sector-name { width: 80px; font-size: 11px; }
}
@media (max-width: 767.98px) {
    .exec-row-2 { grid-template-columns: 1fr; }
    .exec-row-5 { grid-template-columns: repeat(2, 1fr); }
    .exec-gauge-wrap { width: 130px; height: 130px; }
    .gauge-val { font-size: 26px; }
    .sector-name { width: 60px; }
}

/* Card global enhancement */
.card {
    transition: box-shadow .3s ease, transform .3s ease !important;
    border: 1px solid var(--borde-l) !important;
    border-radius: var(--radio) !important;
}
.card:hover {
    box-shadow: var(--sombra-2) !important;
}
.card-header {
    border-radius: var(--radio) var(--radio) 0 0 !important;
}

/* Internal app footer */
#footerPrincipal {
    margin-top: 32px !important;
    position: relative;
}
#footerPrincipal::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l) 50%, var(--dorado));
}

/* ─── FASE 8: Polish Global ─── */

@keyframes gobFadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.dash-header, .dash-content,
#panelPortada, .portal-nav {
    animation: gobFadeIn .4s ease-out;
}

/* Smooth transitions on interactive elements */
a { transition: color var(--ease) !important; }
.btn { transition: all var(--ease) !important; }

/* Portal table header modernization */
.headTable {
    background: var(--azul) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.headTable th {
    color: #fff !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
    padding: 14px 16px !important;
}
.trTotales {
    background: var(--dorado-bg) !important;
    color: var(--azul) !important;
    font-weight: 700 !important;
}
.panCollapseTabla {
    background: rgba(0,61,123,.06) !important;
}
.panCollapseTabla:hover {
    background: rgba(0,61,123,.1) !important;
}
.detCollapseTabla {
    background: var(--azul) !important;
    color: #fff !important;
}
.nameAccion {
    color: #fff !important;
}
.nameInstitucion {
    color: var(--azul) !important;
    font-weight: 600 !important;
}

/* Portal filter inputs modernization */
.filtros {
    border: 2px solid var(--borde) !important;
    border-radius: var(--radio) !important;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.filtros:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.12) !important;
    outline: none;
}
#fText {
    border: 2px solid var(--borde) !important;
    border-radius: var(--radio) !important;
}
#fText:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.12) !important;
}

/* Button modernization for portal */
.btn-detalle {
    background: linear-gradient(135deg, var(--dorado), var(--dorado-l)) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 8px rgba(173,132,17,.3) !important;
    transition: all .3s ease !important;
}
.btn-detalle:hover {
    box-shadow: 0 4px 16px rgba(173,132,17,.4) !important;
    transform: translateY(-1px);
    color: #fff !important;
}
.btnTabla {
    border-radius: 10px !important;
    font-size: 13px !important;
    padding: 8px 18px !important;
}
#reboot {
    background: #8b2d2d !important;
    border-radius: 10px !important;
}
#btnEjecFis {
    background: var(--azul) !important;
    border-radius: 10px !important;
}
#btnEjecFin {
    background: var(--texto-sec) !important;
    border-radius: 10px !important;
}

/* Responsive adjustments for redesign */
@media (max-width: 767.98px) {
    .pnav-item { padding: 10px 14px !important; font-size: 13px !important; }
    .pnav-label { font-size: 9px !important; padding: 6px 10px !important; }
    .sigpret-brand { font-size: 18px !important; letter-spacing: 2px; }
    .dash-header { padding: 20px !important; flex-direction: column !important; align-items: flex-start !important; }
    .dash-header h1 { font-size: 22px !important; }
    .dash-greeting { font-size: 13px; }
    .dash-filters { width: 100%; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.12); flex-direction: column; gap: 10px; }
    .dash-filter-item { width: 100%; min-width: 0; }
    .dash-content { padding: 16px 18px !important; }
    #bodyPrincipal { padding: 12px 14px !important; }
    .nav.ttr_menu_items > li > .ttr_menu_items_parent_link,
    .nav.ttr_menu_items > li > a:not(.dropdown-item) {
        padding: 14px 8px !important;
        font-size: 12px !important;
    }
    .nav.ttr_menu_items {
        flex-wrap: wrap !important;
    }
    #logoSig {
        max-height: 32px !important;
    }
}
@media (min-width: 769px) and (max-width: 992px) {
    .dash-header {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    .dash-filters {
        width: 100%;
        padding-top: 14px;
        border-top: 1px solid rgba(255,255,255,.12);
    }
}
@media (min-width: 769px) and (max-width: 1279px) {
    #ttr_menu_inner_in {
        padding-left: 420px !important;
    }
    .nav.ttr_menu_items > li > .ttr_menu_items_parent_link,
    .nav.ttr_menu_items > li > a:not(.dropdown-item) {
        padding: 32px 10px !important;
        font-size: 14px !important;
    }
    .ttr_menu_logo img,
    #logoSig {
        height: 55px !important;
        max-height: 55px !important;
        max-width: 220px !important;
    }
    .navbar-sigpret-logo {
        max-height: 36px !important;
    }
}

/* ─── FASE 9: Portal Portada Hero — Presidente ─── */

.hero-portada {
    flex: 1;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    box-shadow: var(--sombra-3) !important;
    min-height: 480px;
    background: #001a2e !important;
    display: flex !important;
}

.hero-foto {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0; left: 0;
    z-index: 0;
    transition: transform 8s cubic-bezier(.25,.1,.25,1);
}
.hero-portada:hover .hero-foto {
    transform: scale(1.05);
}

.hero-overlay {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 65%;
    background: linear-gradient(
        to top,
        rgba(0,26,46,.94) 0%,
        rgba(0,42,86,.55) 45%,
        rgba(0,61,123,.1) 75%,
        transparent 100%
    );
    z-index: 1;
    pointer-events: none;
}

.hero-content {
    position: absolute;
    bottom: 40px; left: 40px; right: 40px;
    z-index: 2;
}

.hero-accent {
    display: block;
    width: 56px; height: 3px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l));
    margin-bottom: 20px;
    border-radius: 2px;
    box-shadow: 0 0 12px rgba(173,132,17,.3);
}

.hero-cargo {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: rgba(255,255,255,.7) !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 6px 0 !important;
    line-height: 1.4 !important;
    text-shadow: 0 1px 6px rgba(0,0,0,.3);
}
.hero-nombre {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: -.3px;
    margin: 0 0 20px 0 !important;
    line-height: 1.1 !important;
    text-shadow: 0 2px 16px rgba(0,0,0,.35);
}
.hero-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--dorado-l) !important;
    letter-spacing: -.3px;
    margin: 16px 0 8px 0 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.3);
}

.hero-desc {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 14.5px !important;
    color: rgba(255,255,255,.72) !important;
    margin: 0 !important;
    line-height: 1.65 !important;
    max-width: 400px;
    text-shadow: 0 1px 4px rgba(0,0,0,.2);
}

/* SIGER logos across the system (class names kept as sigpret-* for compatibility) */
.sigpret-header-logo {
    max-height: 52px !important;
    width: auto !important;
    border: none !important;
    box-shadow: none !important;
    transition: opacity .3s ease;
}
.sigpret-header-logo:hover {
    opacity: .8;
}
.footer-sigpret-logo {
    display: block !important;
    max-height: 56px !important;
    width: auto !important;
    margin-bottom: 16px !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    opacity: .9;
    transition: opacity .3s ease;
}
.footer-sigpret-logo:hover {
    opacity: 1;
}
.internal-footer-sigpret {
    max-height: 44px !important;
    width: auto !important;
    border: none !important;
    box-shadow: none !important;
    opacity: .85;
    transition: opacity .3s ease;
}
.internal-footer-sigpret:hover {
    opacity: 1;
}
.navbar-sigpret-logo {
    max-height: 48px !important;
    width: auto !important;
    border: none !important;
    box-shadow: none !important;
    opacity: .95;
    transition: opacity .3s ease;
    /* La fuente del PNG se redujo a 600x196 (Logo-siger-navbar.png) para
       evitar artefactos de downsampling extremo en el navbar (antes 9280px). */
    image-rendering: -webkit-optimize-contrast;
    display: block;
}
.navbar-sigpret-logo:hover {
    opacity: 1;
}

/* El contenedor histórico .ttr_images_container venía con overflow:hidden,
   lo que recortaba la parte superior del logo SIGER cuando éste superaba la
   altura virtual del bloque (50-56px sobre un contenedor de 24px). Permitir
   overflow visible y mostrar el logo completo. */
.ttr_images_container {
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
}
.ttr_images_container .ttr_menu_logo {
    overflow: visible !important;
}

/* ─── Override del logo de cabecera: el CSS legacy .ttr_menu_logo img fuerza
   height:80px lo que descoloca al logo SIGER y al escudo en ciertos zoom y
   resoluciones (los dos terminan empalmados). Subimos especificidad para
   garantizar altura uniforme y un layout flex robusto del contenedor. */
.ttr_menu_logo a {
    display: flex !important;
    align-items: center !important;
    gap: 22px !important;
    line-height: 1 !important;
    text-decoration: none !important;
}
.ttr_menu_logo .navbar-sigpret-logo {
    height: 52px !important;
    max-height: 52px !important;
    width: auto !important;
    max-width: 220px !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
}
.ttr_menu_logo #logoSig {
    height: 52px !important;
    max-height: 52px !important;
    width: auto !important;
    max-width: 200px !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
}
/* Separador entre los dos logos: altura consistente con los logos para no
   verse picudo en pantallas con DPR fraccional. */
.ttr_menu_logo a > span {
    width: 1px !important;
    height: 36px !important;
    background: rgba(255,255,255,.28) !important;
    flex: 0 0 auto !important;
    display: inline-block !important;
}
/* Asegurar altura mínima del contenedor para que los logos no se desborden
   ni se compriman cuando el navbar reduce su alto en ciertas vistas. */
.ttr_menu_logo {
    min-height: 64px !important;
    display: flex !important;
    align-items: center !important;
}
@media (max-width: 767.98px) {
    .ttr_menu_logo .navbar-sigpret-logo,
    .ttr_menu_logo #logoSig {
        height: 38px !important;
        max-height: 38px !important;
    }
    .ttr_menu_logo a > span {
        height: 28px !important;
    }
    .ttr_menu_logo a { gap: 14px !important; }
}

/* Responsive hero */
@media (max-width: 767.98px) {
    .hero-portada { min-height: 340px; }
    .hero-content { bottom: 24px; left: 24px; right: 24px; }
    .hero-cargo { font-size: 10px !important; letter-spacing: 1.5px; }
    .hero-nombre { font-size: 24px !important; }
    .hero-title { font-size: 17px !important; }
    .hero-desc { font-size: 13px !important; }
    .sigpret-header-logo { max-height: 36px !important; }
    .footer-sigpret-logo { max-height: 40px !important; }
}
@media (min-width: 769px) and (max-width: 1279px) {
    .hero-portada { min-height: 400px; }
    .hero-nombre { font-size: 30px !important; }
    .hero-title { font-size: 20px !important; }
}

/* ─── FASE 11: Entidad Vista — Tabs + Metas Redesign ─── */

/* Entidad nav pills — horizontal tab bar */
.entidad-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}
.entidad-nav .nav-item {
    margin: 0 !important;
}
.entidad-nav .nav-link {
    padding: 8px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    color: var(--texto) !important;
    border-radius: 8px !important;
    transition: all .2s !important;
    white-space: nowrap !important;
    border: 1px solid transparent !important;
}
.entidad-nav .nav-link:hover {
    background: rgba(0,61,123,.06) !important;
    color: var(--azul) !important;
}
.entidad-nav .nav-link.active,
.entidad-nav .nav-item.active .nav-link {
    background: var(--azul) !important;
    color: #fff !important;
    border-color: var(--azul) !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.25) !important;
    position: relative !important;
}
.entidad-nav .nav-link.active::after,
.entidad-nav .nav-item.active .nav-link::after {
    content: '' !important;
    position: absolute !important;
    bottom: -4px !important;
    left: 20% !important;
    right: 20% !important;
    height: 3px !important;
    background: var(--dorado, #ad8411) !important;
    border-radius: 2px !important;
}

/* Entidad year selector */
.entidad-year-select {
    padding: 6px 32px 6px 12px !important;
    font-size: 13px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    border: 1px solid var(--borde) !important;
    border-radius: var(--radio-s) !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5' stroke='%23666' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 12px !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    cursor: pointer !important;
    transition: border-color .2s !important;
}
.entidad-year-select:focus {
    border-color: var(--azul) !important;
    box-shadow: 0 0 0 3px rgba(0,61,123,.1) !important;
    outline: none !important;
}

/* Entidad header card with officials */
#ttr_content_and_sidebar_container {
    margin-bottom: 8px;
}

/* ─── FIX 1: BS5 box-shadow override on colored table header rows ─── */
/* BS5 .table paints a white box-shadow (inset 0 0 0 9999px) over cells,
   hiding the inline background-color on <tr>. Reset BS5 variables. */
.table > thead > tr[style*="background"] > th,
.table > thead > tr[style*="background"] > td,
.table > tbody > tr[style*="background"] > th,
.table > tbody > tr[style*="background"] > td,
table.table-bordered > thead > tr[style*="background"] > th,
table.table-bordered > thead > tr[style*="background"] > td,
table.table-bordered > tbody > tr[style*="background"] > th,
table.table-bordered > tbody > tr[style*="background"] > td {
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg: transparent !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-active-bg: transparent !important;
    --bs-table-hover-bg: transparent !important;
    box-shadow: none !important;
    background-color: inherit !important;
    color: inherit !important;
}

/* ─── FIX 2: botonMenu visibility on dark backgrounds ─── */
/* The hamburger icon (menuIcono.svg) is dark by default.
   Invert it when inside colored table rows or dark containers. */
tr[style*="background"] img.botonMenu,
td[style*="background"] img.botonMenu,
.card-header[style*="background-color"] img.botonMenu,
.bg-primary img.botonMenu {
    filter: brightness(0) invert(1) !important;
    opacity: .85 !important;
}
tr[style*="background"] img.botonMenu:hover,
td[style*="background"] img.botonMenu:hover,
.card-header[style*="background-color"] img.botonMenu:hover,
.bg-primary img.botonMenu:hover {
    opacity: 1 !important;
    filter: brightness(0) invert(1) drop-shadow(0 0 4px rgba(255,255,255,.3)) !important;
}

/* ─── FIX 3: Card headers with inline background:none (Metas sections) ─── */
/* Some card-headers explicitly set background:none in inline styles
   (e.g., _ProgramaMetasInstitucionalesPorTipo section headers).
   Override the global blue gradient to respect their intent. */
.card > .card-header[style*="background: none"],
.card > .card-header[style*="background:none"] {
    background: none !important;
    padding: 0px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #b3b3b3 !important;
    position: relative !important;
}
/* Layout fix: col-12 inside transparent card-header → flexbox row
   so col-11 (title) and col-1 (dropdown) sit side by side */
.card > .card-header[style*="background: none"] > .container-fluid > .col-12,
.card > .card-header[style*="background:none"] > .container-fluid > .col-12 {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
}
.card > .card-header[style*="background: none"] > .container-fluid > .col-12 > .col-11,
.card > .card-header[style*="background:none"] > .container-fluid > .col-12 > .col-11 {
    flex: 1 1 auto !important;
    width: auto !important;
}
.card > .card-header[style*="background: none"] > .container-fluid > .col-12 > .col-1,
.card > .card-header[style*="background:none"] > .container-fluid > .col-12 > .col-1 {
    flex: 0 0 auto !important;
    width: auto !important;
    display: flex !important;
    align-items: flex-start !important;
    padding-top: 8px !important;
}
/* Remove the margin-top on the dropdown trigger — now aligned by flexbox */
.card > .card-header[style*="background: none"] .dropdown > a,
.card > .card-header[style*="background:none"] .dropdown > a {
    margin-top: 0 !important;
    padding: 4px !important;
}
/* Text in transparent card headers must be dark, not white */
.card > .card-header[style*="background: none"] h3,
.card > .card-header[style*="background: none"] h4,
.card > .card-header[style*="background: none"] h6,
.card > .card-header[style*="background:none"] h3,
.card > .card-header[style*="background:none"] h4,
.card > .card-header[style*="background:none"] h6 {
    color: var(--negro) !important;
}
.card > .card-header[style*="background: none"] h3 a,
.card > .card-header[style*="background:none"] h3 a {
    color: var(--azul) !important;
    text-decoration: none !important;
}
.card > .card-header[style*="background: none"] h3 a:hover,
.card > .card-header[style*="background:none"] h3 a:hover {
    color: var(--dorado) !important;
    text-decoration: underline !important;
}
/* Dropdown trigger button in transparent card headers */
.card > .card-header[style*="background: none"] .dropdown > a,
.card > .card-header[style*="background:none"] .dropdown > a {
    color: var(--azul) !important;
}
/* Calificacion badge in transparent headers — ensure visible */
.card > .card-header[style*="background: none"] .dot,
.card > .card-header[style*="background:none"] .dot {
    border: 1px solid rgba(0,0,0,.1);
}

/* Responsive entidad nav */
@media (max-width: 767.98px) {
    .entidad-nav {
        gap: 2px !important;
    }
    .entidad-nav .nav-link {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
}

/* ---------- Fix 5: _TabContactos layout (orphaned cols + user cards) ---------- */
/* Nested col-* without .row wrappers need flexbox to align horizontally */
.col-md-12 > [class*="col-md-"]:not(.row [class*="col-md-"]) {
    float: left;
    min-height: 1px;
    box-sizing: border-box;
}
/* .inline helper class used in some views for inline col layout */
.inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
/* User profile cards in _TabContactos: fix display:table-cell vertical alignment */
div[style*="display:table-cell"][style*="vertical-align:middle"] {
    display: flex !important;
    align-items: center;
    justify-content: center;
}
/* Avatar — Cabecera institucional (tamaño completo) */
.imagenUser {
    width: 80px;
    height: 80px;
}

/* ---------- Fix 6: Global breadcrumb horizontal layout ---------- */
/* Ensure breadcrumbs always display horizontally */
.breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    list-style: none !important;
    padding: 8px 16px !important;
    margin-bottom: 12px !important;
    background-color: var(--blanco, #fff) !important;
    border-radius: var(--radio, .375rem) !important;
    border: 1px solid var(--borde, #dee2e6) !important;
    font-size: 14px !important;
}

/* ---------- Fix 7: Global AJAX loading indicator ---------- */
/* Loading text placeholder style for AJAX-loaded content */
[id$="-container"]:empty,
#tablaPresupuesto:empty,
#contenedorTabInfo:empty,
#contenedorDeCalificonesInstitucionales:empty {
    min-height: 80px;
    position: relative;
}

/* ---------- Fix 8: DataTables default thead styling ---------- */
/* Ensures DataTable header rows that have NO inline background get proper styling */
.dataTables_wrapper .table > thead > tr > th {
    background: var(--azul, #02395e);
    color: #fff !important;
    font-weight: 600;
    font-size: 13px;
    border-color: rgba(255,255,255,.12) !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg: transparent !important;
    box-shadow: none !important;
}

/* ---------- Fix 9: SIAFI submenu styling ---------- */
.ul-collapse {
    position: relative;
}
.ul-collapse > a.collapseSiafiClass {
    font-weight: 600 !important;
    color: var(--azul, #02395e) !important;
}
.ul-collapse > a.collapseSiafiClass .caret {
    border-top-color: var(--azul, #02395e);
    transition: transform .2s;
}
#collapseSefin {
    list-style: none;
    padding-left: 16px;
    margin-top: 4px;
}
#collapseSefin > li > a {
    font-size: 13px;
    padding: 5px 10px;
    display: block;
    border-radius: 4px;
}
#collapseSefin > li > a:hover {
    background: var(--azul-bg, rgba(0,61,123,.08));
}

/* ---------- Fix 10: Trimestre nav buttons in AnalisisInstitucion ---------- */
.btCarousel3 {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: 8px !important;
    transition: background .2s, transform .15s;
    cursor: pointer;
}
.btCarousel3:hover {
    transform: scale(1.08);
}
.btCarousel3 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* ---------- Fix 11: User profile dropdown overflow ---------- */
/* The entity name (e.g. "Dirección de Gestión por Resultados") overflows */
.ttr_menu_items_parent.dropdown > .dropdown-menu {
    min-width: 260px;
    max-width: 320px;
    padding: 8px 0;
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    border: 1px solid #e9ecef;
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li {
    padding: 0 !important;
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li > span.menuchildicon {
    display: block;
    padding: 8px 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--azul, #02395e);
    white-space: normal !important;
    word-wrap: break-word;
    line-height: 1.3;
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li > a {
    display: block;
    padding: 8px 16px;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    transition: background .15s;
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li > a:hover {
    background: rgba(0,61,123,.06);
    color: var(--azul, #02395e);
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li > form > a {
    display: block;
    padding: 8px 16px;
    font-size: 14px;
    color: #dc3545;
    text-decoration: none;
    font-weight: 500;
}
.ttr_menu_items_parent.dropdown > .dropdown-menu > li > form > a:hover {
    background: rgba(220,53,69,.06);
}
.ttr_menu_items_parent.dropdown > .dropdown-menu hr.separator {
    margin: 2px 12px;
    border-color: #e9ecef;
    opacity: .5;
}

/* ---------- Fix 12: CEDRITO / Portal Público — NivelInstitucional ---------- */

/* 12a: Tab content containers — light bg instead of flat #dedede */
#CalificacionTrimestral > .container-fluid,
#CalificacionPromedio > .container-fluid,
#CalificacionMensuales > .container-fluid {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

/* 12b: Global summary wrapper — light bg */
#listadoInstitucionesGENE > div {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

/* 12c: Institution row cards — white, with BS5 flex layout fix */
.itemsDeLista {
    background: #fff !important;
    border: 1px solid #e9ecef !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.04) !important;
    transition: box-shadow .2s, transform .15s;
    margin-bottom: 8px !important;
}
.itemsDeLista:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,.08) !important;
    transform: translateY(-1px);
}
/* BS5 fix: cols inside <a.btn> need flex parent for horizontal layout */
.itemsDeLista > .btn,
.itemsDeLista > a.btn {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px;
}

/* 12d: Inner column cells — subtle border */
.itemsDeLista .column {
    border: 1px solid #f0f0f0 !important;
    transition: border-color .2s;
}
.itemsDeLista:hover .column {
    border-color: #d0d5dd !important;
}

/* 12e: Performance dots — refined shadow */
.itemsDeLista .dot,
.dott {
    box-shadow: inset 0 1px 3px rgba(0,0,0,.15);
    border: 2px solid rgba(255,255,255,.5) !important;
}

/* 12f: CEDRITO loading spinner (replaces old GIF animation) */
.cedrito-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 20px;
    gap: 14px;
}
.cedrito-loading .spinner-border {
    width: 3rem;
    height: 3rem;
    color: var(--azul, #02395e);
    border-width: .3rem;
}
.cedrito-loading p {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 600;
    color: #475569;
    font-size: 16px;
    margin: 0;
}

/* 12g: Search input group — blue search icon button */
#CalificacionTrimestral .input-group .input-group-text,
#CalificacionPromedio .input-group .input-group-text,
#CalificacionMensuales .input-group .input-group-text {
    background: var(--azul, #02395e) !important;
    border: none !important;
}
#CalificacionTrimestral .input-group .bi-search,
#CalificacionPromedio .input-group .bi-search,
#CalificacionMensuales .input-group .bi-search {
    color: #fff !important;
}

/* 12h: selectInstitucion dropdown — focus ring */
.selectInstitucion:focus {
    box-shadow: 0 0 0 3px rgba(0,61,123,.2) !important;
    outline: none !important;
}
.selectInstitucion option {
    background: #fff;
    color: #1a1a2e;
}

/* ---------- Fix 13: PerfilInstitucional — tabs + layout ---------- */

/* 13a: PerfilInstitucional tabs — override global .nav-tabs styles */
#Institucion .nav-tabs {
    border-bottom: 3px solid var(--azul, #02395e) !important;
    gap: 4px;
}
#Institucion .nav-tabs > li > a,
#Institucion .nav-tabs > li > a.nav-link {
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
    padding: 12px 24px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--texto-sec, #555) !important;
    background: #f4f6f8 !important;
    transition: all .2s ease;
}
#Institucion .nav-tabs > li > a:hover,
#Institucion .nav-tabs > li > a.nav-link:hover {
    background: #e8ecf0 !important;
    color: var(--azul, #02395e) !important;
}
#Institucion .nav-tabs > li > a.active,
#Institucion .nav-tabs > li > a.nav-link.active,
#Institucion .nav-tabs > li.active > a {
    background: var(--azul, #02395e) !important;
    color: #fff !important;
    border: none !important;
    border-bottom: none !important;
}
#Institucion .nav-tabs > li > a.active:hover,
#Institucion .nav-tabs > li > a.nav-link.active:hover {
    background: var(--azul, #02395e) !important;
    color: #fff !important;
}

/* 13b: PerfilInstitucional — breadcrumb miga consistent */
#Institucion .migaFix {
    padding-right: 20px;
}

/* 13c: PerfilInstitucional — calificación box polish */
#Institucion .contenidoazul {
    border: 1px solid rgba(0,61,123,.1);
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

/* ---------- Fix 14: Logout button — native <button> styled as link ---------- */
#logoutForm button[type="submit"] {
    display: block;
    width: 100%;
    text-align: left;
    background: none !important;
    border: none !important;
    cursor: pointer;
    font: inherit;
    color: var(--dorado, #ad8411) !important;
    font-weight: 600;
}
#logoutForm button[type="submit"]:hover {
    color: var(--azul, #02395e) !important;
    background: #f0f0f0 !important;
}

/* ---------- Fix 15: Nested dropdown menus — text overflow containment ---------- */
.nav.ttr_menu_items .dropdown-menu .dropdown-menu {
    min-width: 220px;
    max-width: 320px;
    white-space: normal;
    word-wrap: break-word;
}
.nav.ttr_menu_items .dropdown-menu .ttr_menu_items_parent.dropdown {
    position: relative;
}
.nav.ttr_menu_items .dropdown-menu .ttr_menu_items_parent.dropdown > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -2px;
    border-top: 2px solid var(--dorado, #ad8411) !important;
    border-radius: 0 var(--radio, 8px) var(--radio, 8px) var(--radio, 8px) !important;
}
/* Reset inline styles on nested dropdown trigger */
.nav.ttr_menu_items .dropdown-menu li.ttr_menu_items_parent > a.dropdown-toggle {
    width: 100% !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    padding: 10px 20px !important;
}

/* ---------- Fix 16: ResumenGlobal — design improvements ---------- */
.resumen-global-header {
    background: linear-gradient(135deg, var(--azul, #02395e) 0%, #0d5ba3 100%);
    border-radius: 12px;
    text-align: center;
    padding: 18px 20px;
    margin-bottom: 30px;
}
.resumen-global-header h3 {
    color: #fff;
    font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    margin: 0;
    font-size: 22px;
}
.resumen-trim-row {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 20px 10px;
    flex-wrap: wrap;
}
.resumen-trim-box {
    background: #fff;
    border-radius: 14px;
    padding: 20px 16px;
    text-align: center;
    flex: 1;
    min-width: 150px;
    max-width: 200px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    border: 1px solid rgba(0,61,123,.08);
    transition: transform .2s ease, box-shadow .2s ease;
}
.resumen-trim-box:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,61,123,.12);
}
.resumen-trim-box.promedio {
    background: linear-gradient(135deg, var(--azul, #02395e) 0%, #0d5ba3 100%);
    border: none;
}
.resumen-trim-box.promedio h4,
.resumen-trim-box.promedio h2 {
    color: #fff !important;
}
.resumen-desempeno-table {
    background: #fff;
    border-radius: 14px;
    padding: 20px 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    border: 1px solid rgba(0,61,123,.08);
}
.resumen-desempeno-table .tableColumn {
    width: 33%;
}
.resumen-desempeno-table hr {
    border-color: rgba(0,61,123,.1) !important;
}

/* ---------- Fix 17: CalificacionInstGlobal — hide brecha column ---------- */
.hide-brecha-col th:nth-child(3),
.hide-brecha-col td:nth-child(3) {
    display: none !important;
}
/* Expand remaining columns */
.hide-brecha-col th:nth-child(1),
.hide-brecha-col td:nth-child(1) {
    width: 50%;
}
.hide-brecha-col th:nth-child(2),
.hide-brecha-col td:nth-child(2),
.hide-brecha-col th:nth-child(4),
.hide-brecha-col td:nth-child(4) {
    width: 25%;
}

/* ---------- Fix 18: MonitoreoPresupuestoGeneral — chart containers ---------- */
.chart-container-wrap {
    background: #fff;
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    border: 1px solid rgba(0,61,123,.08);
    margin-bottom: 20px;
}

/* ---------- Fix 19: CalificacionInstGlobal — design polish ---------- */
.calif-global-container {
    padding: 20px 0;
    background: white;
    border-radius: 14px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.calif-global-title {
    color: var(--azul, #02395e);
    font-size: 28px;
    margin-bottom: 8px;
    text-align: center;
    font-weight: bold;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.calif-global-subtitle {
    font-size: 15px;
    color: #666;
    text-align: center;
    font-weight: 400;
}
.calif-filter-bar {
    background: #f5f4f1;
    border-radius: 14px;
    padding: 12px 16px;
    margin: 20px 0;
}
.calif-filter-bar .selectInstitucion {
    border: 1px solid rgba(0,61,123,.15);
    background: #fff;
    color: var(--azul, #02395e);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 600;
}
.calif-filter-bar .input-group {
    background: white;
    border-radius: 27px;
    font-size: 14px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    border: 1px solid rgba(0,61,123,.15);
    overflow: hidden;
}
.calif-section-header {
    background: linear-gradient(135deg, var(--azul, #02395e) 0%, #0d5ba3 100%);
    border-radius: 12px;
    text-align: center;
    padding: 12px 20px;
    margin: 20px 0 10px;
}
.calif-section-header h4 {
    color: #fff;
    font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    margin: 0;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* ---------- Fix 20: CEDRITO personalTab — BS5 active state ---------- */
/* bootstrap-compat.js mueve .active del <li> al <a.nav-link>.
   BS5 gestiona .active en el <a> al cambiar tabs.
   Este CSS apunta a .personalTab > a.active para todas las vistas CEDRITO. */
.personalTab > a.active,
.personalTab > a.nav-link.active,
.personalTab.tab-active > a {
    background: linear-gradient(135deg, var(--azul, #02395e), #00527a) !important;
    color: white !important;
    box-shadow: 0 4px 16px rgba(0,61,123,.25);
    border-radius: 12px;
}
.personalTab > a.active > label,
.personalTab > a.nav-link.active > label,
.personalTab.tab-active > a > label {
    color: white !important;
}
/* Tab inactivo — asegurar fondo neutro */
.personalTab > a:not(.active) {
    background: transparent !important;
}
.personalTab > a:not(.active) > label {
    color: #1a1a2e !important;
}

/* ── Portal: Botón "Regresar" (.btnBack) ── */
a.btn.btnBack,
a.btn.btnBack:hover,
a.btn.btnBack:focus,
a.btn.btnBack:active {
    background: transparent !important;
    border: 2px solid var(--azul) !important;
    color: var(--azul) !important;
    box-shadow: none !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 600;
    font-size: 14px;
    border-radius: 10px;
    padding: 8px 22px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background .2s, color .2s;
    text-decoration: none;
    transform: none !important;
}
a.btn.btnBack:hover,
a.btn.btnBack:focus {
    background: var(--azul) !important;
    color: #fff !important;
}

/* ── ERDISICA Module ── */
.erdi-miga {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
    padding: 10px 20px; margin-bottom: 20px;
    background: linear-gradient(135deg, #faf5e8 0%, #f5edd4 100%);
    border-radius: 10px; border: 1px solid #e8dfc8;
    font-size: 14px;
}
.erdi-miga a { color: var(--azul); text-decoration: none; font-weight: 500; }
.erdi-miga a:hover { text-decoration: underline; }
.erdi-miga .sep { color: #bba855; margin: 0 2px; }
.erdi-miga .current { font-weight: 700; color: #1a1a1a; }

.erdi-header {
    background: #fff; border-radius: 14px; border: 1px solid #e8e6e1;
    box-shadow: var(--sombra-1); overflow: hidden; margin-bottom: 20px;
}
.erdi-header-top {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    padding: 18px 24px; color: #fff;
}
.erdi-header-top h3 { color: #fff; margin: 0; font-size: 18px; font-weight: 700; }
.erdi-header-top h4 { color: rgba(255,255,255,.7); font-size: 13px; margin: 0 0 4px; font-weight: 400; }
.erdi-header-body { padding: 16px 24px; }
.erdi-header-body h5 { color: var(--texto); font-size: 14px; margin: 0; }
.erdi-stats { display: flex; gap: 24px; flex-wrap: wrap; }
.erdi-stat { text-align: center; }
.erdi-stat-num { font-size: 22px; font-weight: 700; color: var(--azul); display: block; }
.erdi-stat-label { font-size: 12px; color: var(--texto-sec); text-transform: uppercase; letter-spacing: .5px; }

.erdi-section {
    background: #fff; border-radius: 14px; border: 1px solid #e8e6e1;
    box-shadow: var(--sombra-1); overflow: hidden; margin-bottom: 20px;
}
.erdi-section-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 24px;
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff;
}
.erdi-section-head h4 { font-size: 15px; font-weight: 700; margin: 0; color: #fff; }
.erdi-section-body { padding: 16px 24px; }

.erdi-area-head {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    padding: 12px 20px; border-radius: 10px; margin-bottom: 8px;
    display: flex; align-items: center; justify-content: space-between;
    cursor: pointer; transition: box-shadow var(--ease);
}
.erdi-area-head:hover { box-shadow: var(--sombra-2); }
.erdi-area-head a.erdi-area-title {
    color: #fff !important; font-size: 15px; font-weight: 600;
    text-decoration: none; flex: 1;
}
.erdi-area-head .erdi-area-actions a {
    color: rgba(255,255,255,.75); margin-left: 10px; font-size: 16px;
    transition: color .2s;
}
.erdi-area-head .erdi-area-actions a:hover { color: #fff; }
.erdi-area-body { padding: 8px 0 16px 20px; }

.erdi-prio {
    background: #f8f7f4; border-radius: 10px; padding: 12px 16px;
    margin-bottom: 8px; border-left: 4px solid var(--dorado);
    transition: box-shadow var(--ease), transform var(--ease);
}
.erdi-prio:hover { box-shadow: var(--sombra-1); transform: translateY(-1px); }
.erdi-prio-head {
    display: flex; align-items: center; justify-content: space-between;
}
.erdi-prio-head a.erdi-prio-title {
    color: var(--azul); font-weight: 600; font-size: 14px; text-decoration: none; flex: 1;
}
.erdi-prio-head .erdi-prio-actions a {
    color: var(--texto-sec); margin-left: 8px; font-size: 15px; transition: color .2s;
}
.erdi-prio-head .erdi-prio-actions a:hover { color: var(--azul); }

.erdi-ini-panel {
    background: var(--dorado-bg); border-radius: 10px; margin-top: 10px;
    padding: 14px 16px; border: 1px solid #e8dfc8;
}
.erdi-ini-panel .erdi-ini-label {
    font-size: 13px; font-weight: 700; color: var(--azul);
    text-transform: uppercase; letter-spacing: .5px; margin-bottom: 8px;
}
.erdi-ini-row {
    display: flex; align-items: center; padding: 6px 0;
    border-bottom: 1px solid rgba(0,0,0,.05);
}
.erdi-ini-row:last-child { border-bottom: none; }
.erdi-ini-row .bi-arrow-right-circle { color: var(--dorado); font-size: 16px; margin-right: 10px; }
.erdi-ini-row a { color: var(--azul); font-weight: 500; font-size: 14px; text-decoration: none; flex: 1; }
.erdi-ini-row a:hover { text-decoration: underline; }
.erdi-ini-row .erdi-ini-actions a {
    color: var(--texto-sec); margin-left: 8px; font-size: 15px; transition: color .2s;
}
.erdi-ini-row .erdi-ini-actions a:hover { color: var(--azul); }

.erdi-btn-add {
    background: transparent; border: 1.5px dashed var(--dorado);
    color: var(--dorado); font-size: 13px; font-weight: 600;
    padding: 6px 16px; border-radius: 8px; cursor: pointer;
    transition: background .2s, color .2s;
}
.erdi-btn-add:hover { background: var(--dorado); color: #fff; }

/* ERDISICA modals */
#modalEditComponente .modal-content,
#modalEditSubComp .modal-content,
#modalEditIntervencion .modal-content,
#modalEditFinan .modal-content,
#modalError .modal-content,
#ModalAprobacion .modal-content {
    border-radius: 14px; overflow: hidden; border: none;
}
#modalEditComponente .modal-header,
#modalEditSubComp .modal-header,
#modalEditIntervencion .modal-header,
#modalEditFinan .modal-header,
#modalError .modal-header,
#ModalAprobacion .modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; padding: 16px 24px;
}
#modalEditComponente .modal-header .modal-title,
#modalEditSubComp .modal-header .modal-title,
#modalEditIntervencion .modal-header .modal-title,
#modalEditFinan .modal-header .modal-title,
#modalError .modal-header .modal-title,
#ModalAprobacion .modal-header .modal-title {
    color: #fff !important; font-weight: 700; padding: 0;
}
#modalEditComponente .modal-header .btn-close,
#modalEditSubComp .modal-header .btn-close,
#modalEditIntervencion .modal-header .btn-close,
#modalEditFinan .modal-header .btn-close,
#modalError .modal-header .btn-close,
#ModalAprobacion .modal-header .btn-close {
    filter: brightness(0) invert(1);
}

/* ERDISICA spinner */
.erdi-loader { text-align: center; padding: 48px 20px; }
.erdi-spinner {
    width: 40px; height: 40px; margin: 0 auto 14px;
    border: 3px solid #e8e4dc; border-top-color: var(--azul);
    border-radius: 50%; animation: erdiSpin .7s linear infinite;
}
.erdi-loader p { color: var(--azul); font-size: 14px; font-weight: 600; margin: 0; }
@keyframes erdiSpin { to { transform: rotate(360deg); } }

/* ── Planes Index2 Module ── */
.plan-miga {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
    padding: 10px 20px; margin-bottom: 20px;
    background: linear-gradient(135deg, #faf5e8 0%, #f5edd4 100%);
    border-radius: 10px; border: 1px solid #e8dfc8;
    font-size: 14px;
}
.plan-miga a { color: var(--azul); text-decoration: none; font-weight: 500; }
.plan-miga a:hover { text-decoration: underline; }
.plan-miga .sep { color: #bba855; margin: 0 2px; }
.plan-miga .current { font-weight: 700; color: #1a1a1a; }

.plan-card {
    background: #fff; border-radius: 14px; border: 1px solid #e8e6e1;
    box-shadow: var(--sombra-1); overflow: hidden; margin-bottom: 20px;
}
.plan-card-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 24px;
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff;
}
.plan-card-head h3 { font-size: 16px; font-weight: 700; margin: 0; color: #fff; }
.plan-card-body { padding: 0; }

.plan-table { width: 100%; border-collapse: collapse; }
.plan-table thead th {
    background: linear-gradient(135deg, #f8f7f4 0%, #f0ede6 100%);
    color: var(--azul); font-size: 13px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .5px;
    padding: 10px 16px; border-bottom: 2px solid var(--dorado);
    text-align: left;
}
.plan-table thead th:last-child { text-align: center; }
.plan-table tbody td {
    padding: 12px 16px; border-bottom: 1px solid #eae6df;
    font-size: 14px; vertical-align: middle;
}
.plan-table tbody tr:last-child td { border-bottom: none; }
.plan-table tbody tr { transition: background var(--ease); }
.plan-table tbody tr:hover { background: #faf9f6; }
.plan-table tbody td:first-child {
    font-weight: 700; color: var(--azul); text-align: center; width: 60px;
}
.plan-table tbody td:last-child { text-align: center; }
.plan-table tbody td a:not(.plan-action) {
    color: var(--azul); font-weight: 600; text-decoration: none;
}
.plan-table tbody td a:not(.plan-action):hover { text-decoration: underline; }
.plan-action {
    color: var(--texto-sec); font-size: 17px; margin: 0 5px;
    transition: color .2s; display: inline-block;
}
.plan-action:hover { color: var(--azul); }

.plan-btn-add {
    background: transparent; border: 1.5px dashed var(--dorado);
    color: var(--dorado); font-size: 13px; font-weight: 600;
    padding: 8px 20px; border-radius: 8px; cursor: pointer;
    transition: background .2s, color .2s; margin: 16px 24px 20px;
}
.plan-btn-add:hover { background: var(--dorado); color: #fff; }

/* Planes modal */
#modalEditPlan .modal-content {
    border-radius: 14px; overflow: hidden; border: none;
}
#modalEditPlan .modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; padding: 16px 24px;
}
#modalEditPlan .modal-header .modal-title {
    color: #fff !important; font-weight: 700; padding: 0;
}
#modalEditPlan .modal-header .btn-close {
    filter: brightness(0) invert(1);
}

/* Planes spinner */
.plan-loader { text-align: center; padding: 48px 20px; }
.plan-spinner {
    width: 40px; height: 40px; margin: 0 auto 14px;
    border: 3px solid #e8e4dc; border-top-color: var(--azul);
    border-radius: 50%; animation: planSpin .7s linear infinite;
}
.plan-loader p { color: var(--azul); font-size: 14px; font-weight: 600; margin: 0; }
@keyframes planSpin { to { transform: rotate(360deg); } }

/* ── Planes: Vista Iniciativa / Intervencion detail ── */
.ini-detail {
    background: #fff; border-radius: 14px; border: 1px solid #e8e6e1;
    box-shadow: var(--sombra-1); overflow: hidden; margin-bottom: 20px;
}
.ini-detail-head {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    padding: 18px 24px; color: #fff;
}
.ini-detail-head h3 { color: #fff; margin: 0; font-size: 17px; font-weight: 700; }
.ini-detail-body { padding: 20px 24px; }
.ini-detail-label {
    font-size: 12px; color: var(--texto-sec); text-transform: uppercase;
    letter-spacing: .5px; margin-bottom: 2px; font-weight: 600;
}
.ini-detail-value {
    font-size: 15px; color: var(--azul); font-weight: 600; margin-top: 0; margin-bottom: 0;
}
.ini-detail-body hr { border-color: #eae6df; margin: 12px 0; }
.ini-aprobado-si { color: #2e7d32; font-weight: 700; }
.ini-aprobado-no { color: #c62828; font-weight: 700; }

/* Toggle switch — shared Planes module */
.plan-switch {
    position: relative; display: inline-block; width: 44px; height: 24px;
}
.plan-switch input { display: none; }
.plan-switch .plan-slider {
    position: absolute; cursor: pointer; inset: 0;
    background: #ccc; border-radius: 24px; transition: .3s;
}
.plan-switch .plan-slider::before {
    content: ""; position: absolute; height: 18px; width: 18px;
    left: 3px; bottom: 3px; background: #fff; border-radius: 50%;
    transition: .3s;
}
.plan-switch input:checked + .plan-slider { background: var(--azul); }
.plan-switch input:checked + .plan-slider::before { transform: translateX(20px); }

/* Planes tabs styling */
.ini-tabs-card {
    background: #fff; border-radius: 14px; border: 1px solid #e8e6e1;
    box-shadow: var(--sombra-1); overflow: hidden; margin-bottom: 20px;
}
.ini-tabs-card .nav-tabs {
    border-bottom: 2px solid var(--dorado); padding: 0 24px; background: #faf9f6;
}
.ini-tabs-card .nav-tabs .nav-link,
.ini-tabs-card .nav-tabs > li > a {
    color: var(--texto-sec); font-weight: 600; font-size: 14px;
    border: none; padding: 12px 20px; border-radius: 0;
    border-bottom: 3px solid transparent; margin-bottom: -2px;
    transition: color .2s, border-color .2s;
}
.ini-tabs-card .nav-tabs .nav-link:hover,
.ini-tabs-card .nav-tabs > li > a:hover {
    color: var(--azul); border-bottom-color: var(--azul);
}
.ini-tabs-card .nav-tabs .nav-link.active,
.ini-tabs-card .nav-tabs > li.active > a,
.ini-tabs-card .nav-tabs > li > a.active {
    color: var(--azul) !important; font-weight: 700;
    border-bottom-color: var(--dorado) !important; background: transparent;
}
.ini-tabs-card .tab-content { padding: 20px 24px; }

/* Planes: all modals in tabs (actividades/indicadores) */
#ModalNuevaActividad .modal-content,
#ModalEditAvance .modal-content,
#ModalCumplimientoActividad .modal-content,
#ModalMsj .modal-content,
#modalEditEvidencia .modal-content,
#modalVerEvidencias .modal-content,
#modalNuevoIndicador .modal-content,
#modalMediciones .modal-content {
    border-radius: 14px; overflow: hidden; border: none;
}
#ModalNuevaActividad .modal-header,
#ModalEditAvance .modal-header,
#ModalCumplimientoActividad .modal-header,
#ModalMsj .modal-header,
#modalEditEvidencia .modal-header,
#modalVerEvidencias .modal-header,
#modalNuevoIndicador .modal-header,
#modalMediciones .modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; padding: 16px 24px;
}
#ModalNuevaActividad .modal-header .modal-title,
#ModalEditAvance .modal-header .modal-title,
#ModalCumplimientoActividad .modal-header .modal-title,
#ModalMsj .modal-header .modal-title,
#modalEditEvidencia .modal-header .modal-title,
#modalVerEvidencias .modal-header .modal-title,
#modalNuevoIndicador .modal-header .modal-title,
#modalMediciones .modal-header .modal-title {
    color: #fff !important; font-weight: 700; padding: 0;
}
#ModalNuevaActividad .modal-header .btn-close,
#ModalEditAvance .modal-header .btn-close,
#ModalCumplimientoActividad .modal-header .btn-close,
#ModalMsj .modal-header .btn-close,
#modalEditEvidencia .modal-header .btn-close,
#modalVerEvidencias .modal-header .btn-close,
#modalNuevoIndicador .modal-header .btn-close,
#modalMediciones .modal-header .btn-close {
    filter: brightness(0) invert(1);
}

/* Planes: Actividades table styling */
.tablaActividad thead th {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%) !important;
    color: #fff !important; font-size: 13px; font-weight: 600;
    padding: 10px 8px; border-color: rgba(255,255,255,.15) !important;
}
.tablaActividad tbody td {
    border-color: #eae6df !important; font-size: 13px;
}
.tablaActividad .iconoActi { color: var(--texto-sec); transition: color .2s; }
.tablaActividad .iconoActi:hover { color: var(--azul); }

/* ── Solicitud de Cambios Module ── */
.sol-card {
    border: none; border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0,61,123,.08);
    overflow: hidden;
}
.sol-card > .card-header,
.sol-card-head {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; padding: 14px 20px; border: none;
}
.sol-card-head h3,
.sol-card > .card-header h3 {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 17px; font-weight: 700;
    color: #fff; margin: 0;
}
.sol-card > .card-body { padding: 20px; }

/* Solicitud tabs */
.sol-tabs .nav-tabs { border-bottom: 2px solid #e9ecef; }
.sol-tabs .nav-link {
    font-weight: 600; font-size: 13px; color: var(--texto-sec);
    border: none; border-bottom: 3px solid transparent;
    padding: 10px 18px; transition: all .2s;
}
.sol-tabs .nav-link:hover { color: var(--azul); }
.sol-tabs .nav-link.active {
    color: var(--azul); border-bottom-color: var(--dorado);
    background: transparent;
}
.sol-tabs .sol-badge {
    display: inline-block; min-width: 22px; height: 22px; line-height: 22px;
    text-align: center; border-radius: 11px; font-size: 11px; font-weight: 700;
    background: var(--azul); color: #fff; margin-left: 6px;
    vertical-align: middle;
}

/* Solicitud tables */
.sol-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.sol-table thead th {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%) !important;
    color: #fff !important; font-size: 12px; font-weight: 600;
    padding: 10px 10px; border-color: rgba(255,255,255,.15) !important;
    white-space: nowrap;
}
.sol-table tbody td {
    padding: 10px; vertical-align: middle;
    border-color: #eae6df !important; font-size: 13px;
}
.sol-table tbody tr:hover { background-color: #f7f5f0; }

/* Download pill (replaces #87cee0 teal) */
.sol-download {
    display: inline-block; background: var(--azul); color: #fff;
    padding: 4px 12px; border-radius: 20px; font-size: 12px;
    text-decoration: none; margin: 2px 0; transition: all .2s;
    white-space: nowrap;
}
.sol-download:hover { background: #0d5ba3; color: #fff; text-decoration: none; }
.sol-download .bi { margin-right: 4px; }

/* Action buttons */
.sol-btn-approve {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 6px;
    background: #28a745; color: #fff; border: none; font-size: 14px;
    text-decoration: none; transition: all .2s; cursor: pointer;
}
.sol-btn-approve:hover { background: #218838; color: #fff; transform: translateY(-1px); }
.sol-btn-reject {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 6px;
    background: #dc3545; color: #fff; border: none; font-size: 14px;
    text-decoration: none; transition: all .2s; cursor: pointer;
}
.sol-btn-reject:hover { background: #c82333; color: #fff; transform: translateY(-1px); }

/* Empty state */
.sol-empty {
    text-align: center; padding: 30px 20px; color: var(--texto-sec);
}
.sol-empty .bi { font-size: 28px; display: block; margin-bottom: 8px; color: #ccc; }

/* Solicitud modals */
#myModal1 .modal-dialog,
#myModal11 .modal-dialog,
#myModal2 .modal-dialog {
    max-width: 650px;
}
#myModal1 .modal-content,
#myModal11 .modal-content,
#myModal2 .modal-content {
    border-radius: 14px; overflow: hidden; border: none;
    box-shadow: 0 8px 30px rgba(0,0,0,.15);
}
#myModal1 .modal-header,
#myModal11 .modal-header,
#myModal2 .modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; border: none; padding: 14px 20px;
}
#myModal1 .modal-title,
#myModal11 .modal-title,
#myModal2 .modal-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 15px; font-weight: 700; color: #fff;
}
#myModal1 .btn-close,
#myModal11 .btn-close,
#myModal2 .btn-close { filter: brightness(0) invert(1); }
#myModal1 .modal-body textarea,
#myModal11 .modal-body textarea,
#myModal2 .modal-body textarea {
    width: 100% !important; border-radius: 8px; border: 1px solid #ddd;
    padding: 10px; font-size: 13px; resize: vertical;
}

/* Historial / Tracking */
.sol-bitacora-head {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; padding: 18px 24px; border-radius: 14px;
    margin-bottom: 16px;
}
.sol-bitacora-head h4 {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 20px; font-weight: 700;
    color: #fff; margin: 0;
}
.sol-bitacora-head h5 {
    font-size: 13px; color: rgba(255,255,255,.7); margin: 4px 0 0;
}
.sol-search-bar {
    background: #fff; border-radius: 12px; padding: 12px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 16px;
    display: flex; align-items: center;
}
.sol-search-bar input {
    border: 1px solid #e0e0e0; border-radius: 8px; padding: 8px 14px;
    font-size: 13px; flex: 1; max-width: 350px; margin-left: auto;
}
.sol-search-bar .bi-search { color: var(--azul); margin-left: 8px; }

.sol-tracking-card {
    border: none; border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    margin-bottom: 14px; overflow: hidden;
    transition: box-shadow .2s;
}
.sol-tracking-card:hover { box-shadow: 0 4px 16px rgba(0,61,123,.12); }
.sol-tracking-card .card-body { padding: 16px 20px; }
.sol-tracking-id { color: var(--dorado); font-weight: 700; }
.sol-tracking-card h3 { font-size: 16px; margin: 0; color: var(--azul); }
.sol-tracking-card h4 { font-size: 13px; color: #555; margin: 4px 0; }

/* Progress bar (replaces #4bb8a9 teal) */
.sol-progress-wrap {
    padding: 16px 20px; background: #fafafa; border-top: 1px solid #eee;
}
.sol-progress-wrap #progressbar li.active:before,
.sol-progress-wrap #progressbar li.active:after { background: var(--azul); }
.sol-progress-wrap #progressbar li.active2:before,
.sol-progress-wrap #progressbar li.active2:after { background: #dc3545; }

/* Historial btn-outline override */
.sol-btn-tracking {
    background: var(--azul) !important; color: #fff !important;
    border: none; border-radius: 8px; font-size: 12px;
    padding: 6px 14px; font-weight: 600; transition: all .2s;
}
.sol-btn-tracking:hover { background: #0d5ba3 !important; transform: translateY(-1px); }

/* Solicitud form */
.sol-form-card {
    border: none; border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0,61,123,.08);
    overflow: hidden;
}
.sol-form-card > .card-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; border: none; padding: 14px 20px;
}
.sol-form-card > .card-header h2 {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 17px; font-weight: 700;
    color: #fff; margin: 0;
}
.sol-form-card > .card-body { padding: 24px; }
.sol-form-card h4 {
    font-size: 14px; font-weight: 600; color: var(--azul); margin-bottom: 8px;
}

/* ── SOPORTE TÉCNICO ── */

/* --- Tabs (#tabla nav-pills) --- */
#tabla.nav-pills {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%) !important;
    border-radius: 12px !important;
    padding: 6px !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.18);
    display: flex; flex-wrap: wrap; gap: 4px;
}
#tabla.nav-pills > li { flex: 1; }
#tabla.nav-pills > li > a {
    color: rgba(255,255,255,.72) !important;
    border-radius: 8px !important;
    padding: 10px 10px !important;
    font-size: 13.5px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    transition: all .2s; text-align: center; display: block;
}
#tabla.nav-pills > li > a:hover {
    color: #fff !important;
    background: rgba(255,255,255,.12) !important;
}
#tabla.nav-pills > li.active > a,
#tabla.nav-pills > li > a.active {
    color: var(--azul) !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.12) !important;
    font-weight: 700;
}

/* --- Table header row --- */
.sop-thead-row {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%) !important;
    color: #fff !important;
}
.sop-thead-row th {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-weight: 600; font-size: 13.5px;
    padding: 14px 16px !important;
    border-color: rgba(255,255,255,.15) !important;
    color: #fff !important;
}
.sop-table { border-collapse: collapse; width: 100%; }
.sop-table tbody tr { transition: background .15s; }
.sop-table tbody tr:hover { background: var(--dorado-bg); }
.sop-table td { vertical-align: middle; padding: 10px 14px; font-size: 13.5px; }

/* --- Card --- */
.sop-card { border: none; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.07); overflow: hidden; }
.sop-card > .card-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; border: none; padding: 14px 20px;
}
.sop-card > .card-header h3,
.sop-card > .card-header h4 {
    color: #fff; margin: 0; font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 16px; font-weight: 700;
}
.sop-card > .card-body { padding: 20px; }

/* --- Form card --- */
.sop-form-card { border: none; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.07); overflow: hidden; }
.sop-form-card > .card-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; border: none; padding: 14px 20px;
}
.sop-form-card > .card-header h4 {
    color: #fff; margin: 0; font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 16px; font-weight: 700;
}
.sop-form-card > .card-body { padding: 24px; }
.sop-form-label {
    font-size: 15px !important; color: var(--azul) !important;
    font-weight: 600; margin-bottom: 6px;
}

/* --- Status badges --- */
.sop-status { padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; display: inline-block; }
.sop-status-solicitada { background: #e3edf7; color: #4682b4; }
.sop-status-progreso { background: #e6f7e6; color: #2e8b57; }
.sop-status-revision { background: #fff3e0; color: #e67e22; }
.sop-status-resuelta { background: #e0f5ef; color: #18bc9c; }
.sop-status-cancelada { background: #fde8e8; color: #dc3545; }
.sop-status-cerrada { background: #f0f0f0; color: #888; }

/* --- Modals --- */
.sop-modal .modal-content { border-radius: 14px; overflow: hidden; border: none; }
.sop-modal .modal-header {
    background: linear-gradient(135deg, var(--azul) 0%, #0d5ba3 100%);
    color: #fff; border: none; padding: 14px 20px;
}
.sop-modal .modal-header .modal-title { color: #fff; font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-weight: 700; }
.sop-modal .modal-header .btn-close { filter: brightness(0) invert(1); }
.sop-modal .modal-body { padding: 20px; }
.sop-modal .modal-footer { border-top: 1px solid #eee; padding: 12px 20px; }

/* --- Breadcrumb --- */
.sop-miga {
    padding: 12px 20px; margin-bottom: 18px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 14px;
    background: linear-gradient(90deg, var(--dorado-bg) 0%, #fff 100%);
    border-radius: 10px; border-left: 4px solid var(--dorado);
}
.sop-miga a { color: var(--azul); text-decoration: none; font-weight: 600; }
.sop-miga a:hover { color: var(--dorado); }
.sop-miga .sep { margin: 0 8px; color: #bbb; }
.sop-miga .current { color: var(--dorado); font-weight: 600; }

/* --- Bandeja header --- */
.sop-bandeja-header {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-weight: 700; font-size: 28px;
    color: var(--azul); margin-bottom: 16px;
    padding-bottom: 10px; border-bottom: 3px solid var(--dorado);
}

/* --- Chat bubbles (RevisarSolicitud) --- */
.sop-chat-agent {
    background: #e8f0fc; border-radius: 12px; padding: 10px 14px;
    margin-bottom: 8px; border-left: 3px solid var(--azul);
}
.sop-chat-user {
    background: #f0f9e8; border-radius: 12px; padding: 10px 14px;
    margin-bottom: 8px; border-left: 3px solid #6abf69;
}

/* --- Form field underline (replaces cornflowerblue/darkorange) --- */
.sop-field-underline {
    color: #333; width: 90%; padding-left: 18px; font-size: 16px;
    border: 0; outline: 0; border-bottom: 2px solid var(--azul);
    background: transparent;
}

/* --- SoporteTecnico.cshtml tabs --- */
.sop-user-tabs .nav-tabs { border-bottom: 2px solid #eee; }
.sop-user-tabs .nav-tabs .nav-link {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-weight: 600; font-size: 14px;
    color: #888; border: none; padding: 10px 20px;
    border-bottom: 3px solid transparent; transition: all .2s;
}
.sop-user-tabs .nav-tabs .nav-link:hover { color: var(--azul); }
.sop-user-tabs .nav-tabs .nav-link.active {
    color: var(--azul); border-bottom-color: var(--dorado);
    background: transparent;
}

/* --- Bandeja tab-content wrapper --- */
.sop-tab-content {
    background: #fff; margin: 16px 0; padding: 16px 20px;
    border-radius: 12px; box-shadow: 0 1px 6px rgba(0,0,0,.06);
}

/* --- Dropdown menu override --- */
.sop-bandeja-header + .col-md-2 .dropdown-menu {
    border-radius: 10px; box-shadow: 0 4px 16px rgba(0,0,0,.12); border: 1px solid #eee;
}

/* --- Navigation arrows (steelblue → azul) --- */
.sop-nav-arrow {
    color: var(--azul) !important; cursor: pointer;
    font-size: 19px; font-weight: bold;
}
.sop-nav-arrow:hover { color: var(--dorado) !important; }

/* --- Filter selects --- */
.sop-filter-select {
    font-weight: bold; color: var(--azul) !important;
}

/* --- Empty state --- */
.sop-empty {
    text-align: center; padding: 40px 20px; color: #aaa;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif; font-size: 15px;
}
.sop-empty .bi { font-size: 40px; display: block; margin-bottom: 12px; }

/* --- Info report header --- */
.sop-report-title {
    color: var(--azul) !important;
}

/* --- Fix BS3 modal width hacks — BS5 modal-dialog controls sizing --- */
.modal .modal-content {
    width: 100% !important;
    right: auto !important;
}

/* ─── Indicador/Vista — Nav pills de ficha ─── */
#navMenuIndicador {
    display: flex !important;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0 !important;
    margin: 0 !important;
    background: #f4f6f8;
    border-radius: var(--radio-s);
    padding: 6px !important;
}
#navMenuIndicador > li { list-style: none; }
#navMenuIndicador > li > a {
    display: block;
    padding: 8px 16px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    color: var(--texto-sec) !important;
    border-radius: var(--radio-s) !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer;
    transition: all var(--ease) !important;
    white-space: nowrap;
}
#navMenuIndicador > li > a:hover {
    color: var(--dorado) !important;
    background: var(--dorado-bg) !important;
}
#navMenuIndicador > li.active > a,
#navMenuIndicador > li.active > a:hover,
#navMenuIndicador > li > a.active,
#navMenuIndicador > li > a.active:hover {
    background: var(--azul) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(0,61,123,.2) !important;
}

/* ─── Indicador/Vista — Contenedor principal ─── */
#containerIndicador {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    overflow-x: auto;
}
#containerIndicador > .col-md-6 {
    padding: 20px !important;
}
#containerIndicador > .col-md-6:first-child {
    border-right: 2px solid #e0e0e0 !important;
}
#containerIndicador > .col-md-12 {
    flex: 0 0 100%;
    max-width: 100%;
}
#containerIndicador h3 {
    color: var(--azul) !important;
    font-size: 20px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-weight: 700 !important;
    margin-bottom: 12px !important;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--dorado);
}
#containerIndicador .tdTitulo {
    color: var(--azul) !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 15px !important;
}
#containerIndicador .tdCelda {
    font-size: 14.5px !important;
    color: #333 !important;
    line-height: 1.5 !important;
}
#containerIndicador .tdHorizontal {
    font-size: 14.5px !important;
    border-bottom: 1px solid #e0e0e0 !important;
    padding: 8px 0 !important;
}
#containerIndicador .tdHorizontal b {
    color: var(--azul) !important;
}

/* ─── Indicador/Vista — Dropdown menu ─── */
#navMenuIndicador + .col-1 .dropdown-menu {
    border-radius: var(--radio-s) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.12) !important;
    border: 1px solid #e0e0e0 !important;
}
#navMenuIndicador + .col-1 .dropdown-menu a {
    padding: 8px 16px !important;
    font-size: 14px !important;
    transition: background var(--ease) !important;
}
#navMenuIndicador + .col-1 .dropdown-menu a:hover {
    background: var(--dorado-bg) !important;
    color: var(--dorado) !important;
}

/* ─── Historial de cambios (bitacora/historico) ─── */
.hist-container {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}
.hist-header {
    background: linear-gradient(135deg, var(--azul, #02395e), #0d5ba3);
    color: #fff;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 20px;
    padding: 16px 24px;
}
.hist-table {
    margin: 0;
    font-size: 14px;
}
.hist-table thead tr {
    background: #f4f6f8 !important;
}
.hist-table thead th {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 13px;
    color: var(--azul, #02395e);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 12px 16px !important;
    border-bottom: 2px solid var(--dorado, #ad8411) !important;
    white-space: nowrap;
}
.hist-group-row td {
    background: #eef2f7 !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: var(--azul, #02395e);
    padding: 10px 16px !important;
    border-bottom: 1px solid #d0d8e0 !important;
}
.hist-table tbody tr:not(.hist-group-row) td {
    padding: 10px 16px !important;
    vertical-align: middle;
    border-bottom: 1px solid #eee !important;
}
.hist-table tbody tr:not(.hist-group-row):hover {
    background: var(--dorado-bg, #faf5e8) !important;
}

/* ─── Ponderaciones — Filter bar ─── */
.pond-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    background: #f4f6f8;
    border-radius: 12px;
    padding: 12px 20px;
    margin-bottom: 16px;
}
.pond-filter-item {
    display: flex;
    align-items: center;
    gap: 8px;
}
.pond-filter-item label {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: var(--azul, #02395e);
    margin: 0;
    white-space: nowrap;
}
.pond-filter-item .form-select {
    min-width: 140px;
    border-radius: 8px !important;
    font-size: 14px;
    border-color: #ccc;
}
.pond-tipo-calculo {
    font-size: 14px;
    color: #555;
    margin-left: auto;
}
.pond-tipo-calculo strong {
    color: var(--azul, #02395e);
}

/* ─── Ponderaciones — Table ─── */
.pond-table {
    font-size: 13.5px;
    min-width: 900px;
}
.pond-table thead tr {
    background: linear-gradient(135deg, var(--azul, #02395e), #0d5ba3) !important;
}
.pond-table thead th {
    color: #fff !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 600;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 12px 10px !important;
    text-align: center;
    white-space: nowrap;
    border: none !important;
}
.pond-table tbody td {
    padding: 10px !important;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #eee !important;
}
.pond-table tbody tr:hover {
    background: var(--dorado-bg, #faf5e8) !important;
}

/* ── Cambio A: Fuente Poppins explícita en dashboard ejecutivo ── */
.exec-row, .exec-gauge-card, .exec-dist-card, .exec-pillar,
.exec-ranking, .exec-sectors, .mi-section, .mi-action {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
}

/* ── Cambio E: Bordes visibles en tablas de indicadores (Entidad Vista) ── */
.table.table-bordered > tbody > tr > td {
    border-bottom: 1px solid #d4cfc4 !important;
}

/* ── Cambio B: Carga de Trabajo por Analista ── */
.exec-analyst-workload {
    background: #fff;
    border-radius: 14px;
    padding: 20px 24px;
    border: 1px solid #e8e4dc;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    margin-bottom: 22px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
}
.exec-analyst-title {
    font-size: 15px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.analyst-wl-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e8e4dc;
}
.analyst-wl-table thead th {
    background: var(--azul, #02395e);
    color: #fff;
    font-weight: 600;
    text-align: center;
    padding: 9px 12px;
    font-size: 11px;
    letter-spacing: .4px;
    text-transform: uppercase;
    border: none;
}
.analyst-wl-table thead th:first-child { text-align: left; }
.analyst-wl-table tbody td {
    padding: 8px 12px;
    border-bottom: 1px solid #eeebe5;
    text-align: center;
    color: #444;
    background: #fff;
    vertical-align: middle;
}
.analyst-wl-table tbody td:first-child { text-align: left; }
.analyst-wl-table tbody tr:hover td { background: #faf8f5; }
.analyst-wl-table .wl-pending { font-weight: 700; }
.analyst-wl-table .wl-pending.has-pending { color: #c0392b; }
.analyst-wl-table .wl-pending.ok { color: #1b8a4a; }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — Mobile breakpoints (Auditoria Marzo 2026)
   Orden: de mayor a menor para que las reglas menores sobreescriban
   ════════════════════════════════════════════════════════════ */

/* ── Tablets portrait (768px–991.98px) ── */
@media (max-width: 991.98px) {
    /* P0-1: Navbar padding escalonado para tablets */
    #ttr_menu_inner_in { padding-left: 200px !important; }
}

/* ── Tablets small / landscape phones (≤767.98px) ── */
@media (max-width: 767.98px) {
    /* P0-1: Restaurar padding movil — DEBE venir despues del 991.98px */
    #ttr_menu_inner_in { padding-left: 24px !important; }

    /* P1-1: Modal large responsive */
    .modal-lg { max-width: 95vw; }

    /* P1-6: Sub-menus flyout inline en movil */
    .dropdown-submenu .dropdown-menu {
        position: static !important;
        left: 0 !important;
        width: 100% !important;
        box-shadow: none !important;
        border: none !important;
        padding-left: 16px !important;
    }

    /* P2-4: Contenedor principal sin min-height forzado */
    [style*="min-height:600px"] { min-height: auto !important; }
}

/* ── Small phones (≤575.98px) ── */
@media (max-width: 575.98px) {
    /* P0-1: Navbar padding minimo */
    #ttr_menu_inner_in { padding-left: 16px !important; }

    /* P0-2: Tablas pond-table reducir min-width */
    .pond-table { min-width: 600px; }

    /* P1-4: Boton scroll-to-top reducido */
    #myBtn { width: 56px !important; height: 56px !important; font-size: 20px !important; }

    /* P1-7: Footer padding reducido */
    footer.footer > .container-fluid { padding: 24px 16px 20px !important; }

    /* P1-8: Dropdowns sin min-width fijo */
    .dropdown-menu { min-width: auto !important; max-width: 90vw !important; }
    .nav.ttr_menu_items .dropdown-menu { min-width: auto; max-width: 90vw; }

    /* P2-3: Logo navbar — solo reducir imagen, NO el contenedor */
    .ttr_menu_logo img, #logoSig { max-width: 200px !important; height: 60px !important; }

    /* P2-6: Selector cabecera gestion mas compacto */
    .cabecera-selector [style*="min-width:180px"],
    .cabecera-selector [style*="min-width: 180px"] { min-width: 140px !important; }

    /* P2-7: Body margin reducido */
    body[style*="margin: 20px"] { margin: 8px !important; }
    body[style*="margin:20px"] { margin: 8px !important; }

    /* P3-3: Imagenes footer con max-width */
    footer.footer .imgFoo { max-width: 100%; }
}

/* ── Extra-small phones (≤479.98px) ── */
@media (max-width: 479.98px) {
    /* P0-1: Navbar padding extra minimo */
    #ttr_menu_inner_in { padding-left: 12px !important; padding-right: 12px !important; }

    /* P2-3: Logo aun mas compacto */
    .ttr_menu_logo img, #logoSig { max-width: 160px !important; height: 50px !important; }
}

/* ── V2 REDESIGN END ── */

/* === APROBACION TRIMESTRAL UPEG === */
.trimestre-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}
.trimestre-badge.aprobado {
    background: #198754;
    color: #fff;
    border-color: #157347;
}
.trimestre-badge.aprobado:hover {
    transform: scale(1.12);
    box-shadow: 0 2px 8px rgba(25, 135, 84, 0.4);
}
.trimestre-badge.pendiente {
    background: #ffc107;
    color: #333;
    border-color: #e0a800;
    cursor: pointer;
}
.trimestre-badge.pendiente:hover {
    transform: scale(1.12);
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.4);
}
.trimestre-badge.futuro {
    background: #e9ecef;
    color: #adb5bd;
    border-color: #dee2e6;
    cursor: default;
}

.aprobacion-trimestral-banner {
    background: linear-gradient(135deg, #d1e7dd 0%, #badbcc 100%);
    border: 1px solid #a3cfbb;
    border-radius: 8px;
    padding: 12px 18px;
    margin-bottom: 16px;
}
.aprobacion-trimestral-banner .bi-check-circle-fill { color: #198754; }

.aprobacion-programa-card {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    margin-bottom: 12px;
    overflow: hidden;
}
.aprobacion-programa-card .card-header {
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    padding: 10px 16px;
    font-weight: 600;
    cursor: pointer;
}
.aprobacion-programa-card .card-header:hover { background: #e9ecef; }

.aprobacion-indicador-row {
    padding: 8px 16px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}
.aprobacion-indicador-row:last-child { border-bottom: none; }
.aprobacion-indicador-row .valor-cell { text-align: right; min-width: 80px; }
.aprobacion-indicador-row .indicador-nombre { flex: 1; }

.aprobacion-resumen-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
.aprobacion-resumen-item {
    text-align: center;
    padding: 12px;
    border-radius: 8px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
}
.aprobacion-resumen-item .numero {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
}
.aprobacion-resumen-item .etiqueta {
    font-size: 12px;
    color: #6c757d;
    margin-top: 4px;
}
/* === FIN APROBACION TRIMESTRAL UPEG === */


/* =============================================================
   SOPORTE TECNICO V2 - Rediseno 2026-04-23
   Extensiones al design system .sop-* para el modulo completo
   ============================================================= */

/* --- Contenedor general --- */
.sop-layout { max-width: 1400px; margin: 0 auto; padding: 0 8px; }

/* --- Hero header del modulo --- */
/* El glow decorativo se pinta como background (no como pseudo-elemento con overflow clipping)
   para permitir que dropdowns y popovers internos floten fuera del hero sin recortarse. */
.sop-hero {
    position: relative;
    background:
        radial-gradient(circle 160px at calc(100% + 40px) -40px, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 70%),
        linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff;
    border-radius: 14px;
    padding: 22px 28px;
    margin-bottom: 20px;
    box-shadow: var(--sombra-2);
}
.sop-hero .dropdown-menu {
    z-index: 1050;
}
.sop-hero .dropdown-item {
    font-weight: 500;
    color: var(--texto);
}
.sop-hero .dropdown-item:hover,
.sop-hero .dropdown-item:focus {
    background: rgba(0,61,123,.08);
    color: var(--azul);
}
.sop-hero-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: rgba(255,255,255,.12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    color: var(--dorado-l);
    margin-right: 14px;
}
.sop-hero-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 26px;
    margin: 0;
    line-height: 1.2;
    color: #fff;
}
.sop-hero-subtitle {
    color: rgba(255,255,255,.85);
    font-size: 14px;
    margin-top: 4px;
}
.sop-hero-actions { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 10px; }

/* --- Stats grid --- */
.sop-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}
.sop-stats-card {
    background: #fff;
    border-radius: 12px;
    padding: 18px 20px;
    box-shadow: var(--sombra-1);
    border-left: 4px solid var(--azul);
    transition: transform var(--ease), box-shadow var(--ease);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.sop-stats-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--sombra-2);
}
.sop-stats-card .sop-stats-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--texto-sec);
    font-weight: 600;
}
.sop-stats-card .sop-stats-value {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 28px;
    color: var(--azul);
    line-height: 1;
}
.sop-stats-card .sop-stats-hint {
    font-size: 12px;
    color: var(--texto-sec);
}
.sop-stats-card.acento-dorado { border-left-color: var(--dorado); }
.sop-stats-card.acento-dorado .sop-stats-value { color: var(--dorado); }
.sop-stats-card.acento-verde  { border-left-color: #2e8b57; }
.sop-stats-card.acento-verde .sop-stats-value { color: #2e8b57; }
.sop-stats-card.acento-rojo   { border-left-color: #c0392b; }
.sop-stats-card.acento-rojo .sop-stats-value { color: #c0392b; }
.sop-stats-card.acento-naranja { border-left-color: #e67e22; }
.sop-stats-card.acento-naranja .sop-stats-value { color: #e67e22; }

/* --- Toolbar de filtros --- */
.sop-toolbar {
    background: #fff;
    border-radius: 12px;
    padding: 14px 18px;
    box-shadow: var(--sombra-1);
    margin-bottom: 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.sop-toolbar .form-control,
.sop-toolbar .form-select {
    min-height: 42px;
    border-radius: 8px;
    border-color: var(--borde);
    font-size: 14px;
}
.sop-toolbar .form-control:focus,
.sop-toolbar .form-select:focus {
    border-color: var(--azul);
    box-shadow: 0 0 0 3px rgba(0,61,123,.1);
}
.sop-toolbar .sop-toolbar-search { flex: 1; min-width: 220px; position: relative; }
.sop-toolbar .sop-toolbar-search .bi {
    position: absolute; left: 12px; top: 50%;
    transform: translateY(-50%);
    color: var(--texto-sec);
    pointer-events: none;
}
.sop-toolbar .sop-toolbar-search .form-control { padding-left: 36px; }
.sop-toolbar-actions { display: flex; gap: 8px; margin-left: auto; }

/* --- Botones --- */
.sop-btn-primary {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%);
    color: #fff;
    border: none;
    padding: 10px 22px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all var(--ease);
    text-decoration: none;
    line-height: 1.2;
}
.sop-btn-primary:hover {
    background: linear-gradient(135deg, var(--azul-d) 0%, var(--azul) 100%);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--sombra-2);
}
.sop-btn-primary:focus {
    outline: 3px solid rgba(0,61,123,.3);
    color: #fff;
}
.sop-btn-primary:disabled, .sop-btn-primary.disabled {
    opacity: .6;
    transform: none;
    cursor: not-allowed;
}
.sop-btn-ghost {
    background: transparent;
    color: var(--azul);
    border: 1.5px solid var(--borde);
    padding: 9px 18px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all var(--ease);
    text-decoration: none;
    line-height: 1.2;
}
.sop-btn-ghost:hover {
    background: var(--dorado-bg);
    border-color: var(--dorado);
    color: var(--azul);
}
.sop-btn-dorado {
    background: linear-gradient(135deg, var(--dorado) 0%, var(--dorado-l) 100%);
    color: #fff;
    border: none;
    padding: 10px 22px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all var(--ease);
    text-decoration: none;
    line-height: 1.2;
}
.sop-btn-dorado:hover {
    background: linear-gradient(135deg, #8c6a0d 0%, var(--dorado) 100%);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--sombra-2);
}
.sop-btn-peligro {
    background: #fff;
    color: #c0392b;
    border: 1.5px solid #e0b4ae;
    padding: 9px 18px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all var(--ease);
    text-decoration: none;
}
.sop-btn-peligro:hover {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}
.sop-btn-sm { padding: 6px 14px; font-size: 13px; }

/* --- Panel / Seccion --- */
.sop-panel {
    background: #fff;
    border-radius: 12px;
    box-shadow: var(--sombra-1);
    padding: 20px 24px;
    margin-bottom: 18px;
}
.sop-panel-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--azul);
    margin: 0 0 14px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--dorado-bg);
    display: flex;
    align-items: center;
    gap: 8px;
}
.sop-panel-title .bi { color: var(--dorado); }

/* --- Definition list moderna (replaza los inputs readonly feos) --- */
.sop-dl {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px 28px;
    margin: 0;
}
.sop-dl .sop-dl-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 8px 0;
    border-bottom: 1px dashed var(--borde-l);
}
.sop-dl .sop-dl-item:last-child { border-bottom: none; }
.sop-dl .sop-dl-label {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--texto-sec);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
}
.sop-dl .sop-dl-label .bi { color: var(--azul); font-size: 14px; }
.sop-dl .sop-dl-value {
    font-size: 15px;
    color: var(--texto);
    font-weight: 500;
    word-break: break-word;
}

/* --- Description larger text (descripcion, motivo) --- */
.sop-texto-bloque {
    background: #f9f7f2;
    border-left: 3px solid var(--dorado);
    padding: 14px 16px;
    border-radius: 0 8px 8px 0;
    font-size: 14.5px;
    color: var(--texto);
    line-height: 1.5;
    white-space: pre-wrap;
}

/* --- Attachment chips --- */
.sop-attach-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
}
.sop-attach-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--borde);
    border-radius: 8px;
    background: #fff;
    text-decoration: none;
    color: var(--texto);
    font-size: 13px;
    transition: all var(--ease);
}
.sop-attach-chip:hover {
    border-color: var(--azul);
    background: var(--dorado-bg);
    color: var(--texto);
}
.sop-attach-chip img { width: 28px; height: 28px; flex-shrink: 0; }
.sop-attach-chip .sop-attach-nombre {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- Timeline de comentarios --- */
.sop-timeline {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 14px 0;
}
.sop-timeline .sop-msg {
    display: flex;
    gap: 10px;
    max-width: 78%;
}
.sop-timeline .sop-msg .sop-msg-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-weight: 700;
    font-size: 14px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.sop-timeline .sop-msg .sop-msg-body {
    background: #f4f7fb;
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 14px;
    color: var(--texto);
    line-height: 1.45;
    border-left: 3px solid var(--azul);
    word-break: break-word;
}
.sop-timeline .sop-msg .sop-msg-meta {
    display: flex;
    gap: 10px;
    font-size: 11.5px;
    color: var(--texto-sec);
    margin-bottom: 4px;
    align-items: center;
}
.sop-timeline .sop-msg.mine { flex-direction: row-reverse; margin-left: auto; }
.sop-timeline .sop-msg.mine .sop-msg-avatar {
    background: linear-gradient(135deg, var(--dorado) 0%, var(--dorado-l) 100%);
}
.sop-timeline .sop-msg.mine .sop-msg-body {
    background: #fbf6e8;
    border-left: none;
    border-right: 3px solid var(--dorado);
    text-align: left;
}
.sop-timeline .sop-msg.mine .sop-msg-meta { justify-content: flex-end; }

/* --- Comentario textarea + boton enviar --- */
.sop-comment-compose {
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--borde);
    padding: 14px;
    margin-top: 16px;
}
.sop-comment-compose textarea {
    border: none;
    resize: vertical;
    min-height: 90px;
    font-size: 14.5px;
    font-family: inherit;
    color: var(--texto);
    outline: none;
    padding: 6px 8px;
    box-shadow: none;
}
.sop-comment-compose textarea:focus { outline: none; box-shadow: none; }
.sop-comment-compose .sop-compose-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--borde-l);
    padding-top: 10px;
}
.sop-comment-compose .sop-compose-hint {
    font-size: 12px;
    color: var(--texto-sec);
}

/* --- Acciones finales (footer de acciones) --- */
.sop-actions-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    padding: 14px 18px;
    background: #fafaf7;
    border-top: 1px solid var(--borde-l);
    border-radius: 0 0 12px 12px;
    margin: 20px -24px -20px;
}
.sop-actions-bar .spacer { margin-right: auto; }

/* --- Priority badge --- */
.sop-prio {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.sop-prio::before {
    content: "";
    width: 8px; height: 8px;
    border-radius: 50%;
    background: currentColor;
    opacity: .85;
}
.sop-prio-alta { background: #fde8e8; color: #c0392b; }
.sop-prio-media { background: #fff3e0; color: #e67e22; }
.sop-prio-baja { background: #e3edf7; color: #4682b4; }
.sop-prio-critica { background: #f8d7da; color: #a1291a; }

/* --- Tag genérico para metadata --- */
.sop-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: var(--dorado-bg);
    color: var(--azul);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

/* --- Empty state ilustrado --- */
.sop-empty-state {
    text-align: center;
    padding: 48px 24px;
    color: var(--texto-sec);
}
.sop-empty-state .sop-empty-icon {
    font-size: 48px;
    color: var(--dorado);
    margin-bottom: 14px;
    opacity: .75;
}
.sop-empty-state .sop-empty-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--azul);
    margin-bottom: 6px;
}
.sop-empty-state .sop-empty-hint {
    font-size: 14px;
    color: var(--texto-sec);
    max-width: 420px;
    margin: 0 auto;
}

/* --- Subheader con metadata del ticket --- */
.sop-ticket-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    align-items: center;
    color: var(--texto-sec);
    font-size: 13px;
}
.sop-ticket-meta .bi { color: var(--azul); }
.sop-ticket-meta .sop-ticket-id {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    color: var(--dorado);
    font-size: 18px;
}

/* --- Tabla row estados color --- */
.sop-table tr.sop-row-urgent td { font-weight: 600; }
.sop-table tr[data-estado="1"],
.sop-table tr[data-estado="2"] {
    border-left: 3px solid var(--dorado);
}
.sop-table tr[data-estado="4"] {
    border-left: 3px solid #2e8b57;
}
.sop-table tr[data-estado="7"] {
    border-left: 3px solid #18BC9C;
}
.sop-table tr[data-estado="8"] {
    border-left: 3px solid #ccc;
    color: #888;
}

/* --- Tabs mejorados --- */
.sop-user-tabs .nav-pills {
    background: #fff;
    padding: 6px;
    border-radius: 12px;
    box-shadow: var(--sombra-1);
    gap: 4px;
}
.sop-user-tabs .nav-pills .nav-link {
    border-radius: 8px;
    color: var(--texto-sec);
    font-weight: 600;
    font-size: 14px;
    transition: all var(--ease);
    border: none;
    padding: 10px 16px;
}
.sop-user-tabs .nav-pills .nav-link:hover {
    background: var(--dorado-bg);
    color: var(--azul);
}
.sop-user-tabs .nav-pills .nav-link.active {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-l) 100%) !important;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(0,61,123,.25);
}

/* --- Contador en tabs --- */
.sop-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: 11px;
    background: rgba(255,255,255,.25);
    color: inherit;
    font-size: 11px;
    font-weight: 700;
    margin-left: 6px;
}
.nav-link:not(.active) .sop-tab-count {
    background: var(--dorado-bg);
    color: var(--dorado);
}

/* --- Responsive ajustes --- */
@media (max-width: 768px) {
    .sop-hero { padding: 18px 20px; }
    .sop-hero-title { font-size: 22px; }
    .sop-hero-icon { width: 44px; height: 44px; font-size: 22px; }
    .sop-timeline .sop-msg { max-width: 92%; }
    .sop-actions-bar { margin: 20px -14px -14px; padding: 12px 14px; }
    .sop-panel { padding: 16px; }
    .sop-dl { grid-template-columns: 1fr; }
}

/* =============================================================
   MODAL SLA (Acuerdo de Nivel de Servicio) — rediseño 2026-04-23
   ============================================================= */
.sla-modal .sla-modal-content {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.sla-modal-header {
    display: flex; align-items: center; gap: 14px;
    padding: 20px 28px !important;
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%) !important;
    border: 0 !important;
    color: #fff;
}
.sla-modal-header .sla-header-icon {
    width: 48px; height: 48px; border-radius: 12px;
    background: rgba(255,255,255,.15);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 22px; color: var(--dorado-l);
    flex-shrink: 0;
}
.sla-modal-header .sla-header-text { flex: 1; }
.sla-modal-header .modal-title {
    color: #fff !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    margin: 0 !important;
}
.sla-modal-header .sla-header-sub {
    color: rgba(255,255,255,.85);
    font-size: 13px;
    margin-top: 2px;
}
.sla-modal-header .btn-close { align-self: flex-start; margin-top: 6px; }

.sla-modal-body {
    padding: 0 !important;
    display: grid;
    grid-template-columns: 240px 1fr;
    min-height: 520px;
    max-height: 70vh;
}

/* Tabla de contenidos lateral */
.sla-toc {
    background: #f6f7f9;
    border-right: 1px solid var(--borde);
    padding: 18px 10px;
    overflow-y: auto;
    display: flex; flex-direction: column; gap: 3px;
}
.sla-toc-link {
    display: block;
    padding: 9px 14px;
    border-radius: 8px;
    color: var(--texto-sec);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: all .15s;
    border-left: 3px solid transparent;
}
.sla-toc-link:hover {
    background: rgba(0,61,123,.06);
    color: var(--azul);
    text-decoration: none;
}
.sla-toc-link.active {
    background: #fff;
    color: var(--azul);
    border-left-color: var(--dorado);
    box-shadow: var(--sombra-1);
}

/* Contenido principal */
.sla-article {
    padding: 24px 32px;
    overflow-y: auto;
    color: var(--texto);
    font-size: 14.5px;
    line-height: 1.65;
    scroll-behavior: smooth;
}
.sla-section { margin-bottom: 34px; scroll-margin-top: 8px; }
.sla-section:last-child { margin-bottom: 0; }

.sla-article .sla-h {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    color: var(--azul);
    font-size: 22px;
    margin: 0 0 14px 0;
    padding-bottom: 10px;
    border-bottom: 3px solid var(--dorado);
    display: inline-block;
}
.sla-article .sla-h2 {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    color: var(--azul-d);
    font-size: 16px;
    margin: 22px 0 10px 0;
    padding-left: 12px;
    border-left: 4px solid var(--dorado);
}
.sla-article p { margin: 0 0 12px 0; color: var(--texto); }
.sla-article strong { color: var(--azul-d); }

.sla-list {
    margin: 8px 0 14px 0;
    padding-left: 22px;
    color: var(--texto);
}
.sla-list li { margin-bottom: 6px; }
.sla-list.sla-cols {
    list-style: none; padding-left: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 6px 14px;
}
.sla-list.sla-cols li {
    padding: 6px 12px;
    background: rgba(0,61,123,.04);
    border-left: 3px solid var(--azul);
    border-radius: 4px;
    margin: 0;
}
.sla-list.sla-contact {
    list-style: none; padding-left: 0;
}
.sla-list.sla-contact li {
    padding: 8px 12px;
    background: rgba(173,132,17,.06);
    border-radius: 6px;
    margin-bottom: 6px;
}
.sla-list.sla-contact .bi { color: var(--dorado); margin-right: 6px; }

/* Tablas del SLA */
.sla-table {
    width: 100%;
    border-collapse: collapse;
    margin: 8px 0 14px 0;
    font-size: 14px;
}
.sla-table th {
    background: var(--azul);
    color: #fff;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    padding: 10px 14px;
    text-align: left;
    font-size: 13px;
    letter-spacing: .3px;
}
.sla-table td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--borde);
    color: var(--texto);
    vertical-align: top;
}
.sla-table tbody tr:nth-child(even) td { background: #fafafa; }
.sla-table tbody tr:hover td { background: rgba(0,61,123,.04); }
.sla-table.sla-table-prio td:first-child { text-align: center; width: 90px; }

/* Chips de prioridad (1 rojo, 2 naranja, 3 dorado, 4 verde) */
.sla-prio {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    color: #fff;
    font-size: 15px;
}
.sla-prio-1 { background: #d93a3a; }
.sla-prio-2 { background: #e67e22; }
.sla-prio-3 { background: #d4a11a; }
.sla-prio-4 { background: #1f8b4c; }

.sla-note {
    background: rgba(173,132,17,.08);
    border-left: 4px solid var(--dorado);
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 13.5px;
    color: var(--texto);
    margin: 14px 0;
}

.sla-footnotes {
    margin-top: 20px;
    padding: 14px 18px;
    background: #f6f7f9;
    border-radius: 8px;
    font-size: 13px;
    color: var(--texto-sec);
}
.sla-footnotes p { margin: 0 0 4px 0; }

.sla-modal-footer {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center;
    padding: 14px 28px !important;
    background: #f6f7f9;
    border-top: 1px solid var(--borde) !important;
}
.sla-footer-meta { color: var(--texto-sec); font-size: 13px; }
.sla-footer-meta .bi { color: #1f8b4c; margin-right: 6px; }

@media (max-width: 767.98px) {
    .sla-modal-body {
        grid-template-columns: 1fr;
        max-height: 80vh;
    }
    .sla-toc {
        border-right: 0;
        border-bottom: 1px solid var(--borde);
        flex-direction: row;
        flex-wrap: wrap;
        padding: 10px;
        gap: 4px;
        overflow-x: auto;
    }
    .sla-toc-link { white-space: nowrap; font-size: 12px; padding: 6px 10px; }
    .sla-article { padding: 18px 20px; }
    .sla-modal-footer { flex-direction: column; gap: 10px; }
}

/* === FIN SOPORTE TECNICO V2 === */


/* ════════════════════════════════════════════════════════════════
   ENT MODULE V2 — Modulo Institucion / Indicadores (SIGER 2026)
   Familia: .ent-* (aditiva, no sobreescribe lo existente).
   Usa tokens del :root global (--azul, --dorado, --texto, etc).
   Para rollback: borrar todo desde aqui hasta FIN ENT MODULE V2.
   ════════════════════════════════════════════════════════════════ */

/* ---------- Layout raiz del modulo ---------- */
.ent-shell {
    max-width: 1600px;
    margin: 0 auto;
    padding: 4px 4px 32px 4px;
    display: flex;
    flex-direction: column;
}
/* Uniformidad vertical: toda .ent-section hija directa del shell separa 16px */
.ent-shell > .ent-section,
.ent-shell > section.ent-section,
.ent-shell > #contenedorCabecera,
.ent-shell > #contenedorCabecera + .ent-section,
.ent-shell > .ent-hero,
.ent-shell > #containerIndicador,
.ent-shell > #containerIndicador > .ent-section {
    margin-top: 16px;
    width: 100%;
    box-sizing: border-box;
}
.ent-shell > nav:first-child,
.ent-shell > nav[aria-label="Migas de pan"] { margin-top: 0; }
/* Las secciones dentro de containerIndicador también tienen separación */
#containerIndicador > .ent-section + .ent-section { margin-top: 16px; }
#contenedorCabecera + .ent-hero { margin-top: 0; }
/* Banda dorada superior uniforme */
.ent-shell > .ent-section,
.ent-shell > #containerIndicador > .ent-section {
    position: relative;
    overflow: hidden;
}
.ent-shell > .ent-section::before,
.ent-shell > #containerIndicador > .ent-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--azul), var(--dorado));
    pointer-events: none;
    border-radius: var(--radio) var(--radio) 0 0;
}

/* Breadcrumb moderno */
.ent-crumb {
    list-style: none;
    padding: 10px 4px;
    margin: 0 0 10px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 8px;
    font-size: 13.5px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-crumb li { color: var(--texto-sec); display: inline-flex; align-items: center; }
.ent-crumb li + li::before {
    content: '\203A';
    color: var(--texto-sec);
    margin: 0 8px 0 0;
    font-size: 15px;
    opacity: .7;
}
.ent-crumb a {
    color: var(--azul);
    font-weight: 600;
    transition: color var(--ease);
    text-decoration: none;
}
.ent-crumb a:hover { color: var(--dorado) !important; }
.ent-crumb li.active,
.ent-crumb li[aria-current="page"] {
    color: var(--texto);
    font-weight: 700;
}

/* Alerts del modulo */
.ent-alert {
    border-radius: var(--radio);
    border: 1px solid transparent;
    padding: 14px 18px;
    margin: 0 0 14px 0;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-alert > .bi { font-size: 22px; line-height: 1; flex-shrink: 0; margin-top: 1px; }
.ent-alert > div { flex: 1 1 auto; }
.ent-alert strong { margin-right: 6px; }
.ent-alert-ok    { background: #e8f5e9; color: #1b5e20; border-color: #a5d6a7; }
.ent-alert-ok    > .bi { color: #1b8d3a; }
.ent-alert-warn  { background: #fff3e0; color: #7a4a00; border-color: #ffcc80; }
.ent-alert-warn  > .bi { color: #c67100; }
.ent-alert-err   { background: #ffebee; color: #8b0000; border-color: #ef9a9a; }
.ent-alert-err   > .bi { color: #c62828; }
.ent-alert-info  { background: rgba(0,61,123,.06); color: var(--azul-d); border-color: rgba(0,61,123,.2); }
.ent-alert-info  > .bi { color: var(--azul); }

/* ---------- Hero institucional ---------- */
.ent-hero {
    background: var(--blanco);
    border-radius: var(--radio);
    box-shadow: var(--sombra-1);
    border: 1px solid var(--borde-l);
    /* overflow visible para que los dropdowns puedan salir del hero.
       La franja dorada del top se recorta via border-radius en el propio pseudo. */
    overflow: visible;
    margin-bottom: 14px;
    position: relative;
}
.ent-hero::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--dorado) 0%, var(--dorado-l) 50%, var(--dorado) 100%);
    border-radius: var(--radio) var(--radio) 0 0;
    pointer-events: none;
}
.ent-hero-top {
    display: flex;
    gap: 20px;
    padding: 22px 26px 18px 26px;
    align-items: center;
    flex-wrap: wrap;
}

/* Marca + logo + titulos */
.ent-hero-brand {
    display: flex;
    gap: 20px;
    align-items: center;
    min-width: 0;
    flex: 1 1 420px;
}
.ent-hero-logo {
    width: 132px;
    height: 132px;
    border-radius: var(--radio-s);
    background: var(--fondo);
    border: 1px solid var(--borde-l);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    box-shadow: 0 2px 8px rgba(0,61,123,.06);
}
.ent-hero-logo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}
.ent-hero-logo-edit {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,.78);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    padding: 7px 4px;
    opacity: 0;
    transform: translateY(100%);
    transition: all var(--ease);
    text-decoration: none;
    letter-spacing: .2px;
}
.ent-hero-logo:hover .ent-hero-logo-edit,
.ent-hero-logo:focus-within .ent-hero-logo-edit {
    opacity: 1;
    transform: translateY(0);
}
.ent-hero-logo-edit:hover,
.ent-hero-logo-edit:focus { color: #fff !important; background: var(--azul-d); }
.ent-hero-logo-edit .bi { margin-right: 4px; }

.ent-hero-titles { min-width: 0; flex: 1 1 auto; }
.ent-hero-parent {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    color: var(--dorado);
    font-weight: 700;
    font-size: 13.5px;
    letter-spacing: .6px;
    text-transform: uppercase;
    margin: 0 0 5px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ent-hero-title {
    margin: 0;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    color: var(--azul-d);
    font-weight: 700;
    font-size: clamp(26px, 2.6vw, 36px);
    line-height: 1.2;
    letter-spacing: -.01em;
    word-wrap: break-word;
}
.ent-hero-type {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 3px 11px 4px;
    background: var(--dorado-bg);
    color: var(--dorado);
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-hero-type .bi { font-size: 12px; }

/* Cluster de personas (autoridad + UPEG) */
.ent-hero-people {
    display: flex;
    gap: 22px;
    align-items: center;
    flex-wrap: wrap;
    flex: 0 1 auto;
    margin-left: auto;
}
.ent-person {
    display: flex;
    gap: 14px;
    align-items: center;
    min-width: 0;
    max-width: 320px;
    padding: 7px 18px 7px 7px;
    border-radius: 999px;
    border: 1px solid var(--borde-l);
    background: #fafaf8;
    transition: all var(--ease);
}
.ent-person:hover {
    background: #fff;
    border-color: var(--borde);
    box-shadow: var(--sombra-1);
}
.ent-person-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--blanco);
    background: var(--fondo);
    flex-shrink: 0;
    box-shadow: 0 0 0 1px var(--borde-l), 0 2px 6px rgba(0,61,123,.08);
}
.ent-person-info { min-width: 0; }
.ent-person-role {
    font-size: 11px;
    color: var(--texto-sec);
    text-transform: uppercase;
    letter-spacing: .7px;
    font-weight: 700;
    margin: 0 0 2px 0;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-person-name {
    font-weight: 700;
    color: var(--azul-d);
    font-size: 16px;
    margin: 0 0 2px 0;
    line-height: 1.2;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 240px;
}
.ent-person-name a { color: inherit !important; text-decoration: none; }
.ent-person-name a:hover { color: var(--dorado) !important; }
.ent-person-cargo {
    font-size: 13px;
    color: var(--texto-sec);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 240px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}

/* Barra de nav + selector año + acciones */
.ent-hero-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    border-top: 1px solid var(--borde-l);
    background: linear-gradient(180deg, transparent 0%, rgba(0,61,123,.025) 100%);
    padding: 10px 22px;
}
/* Cluster derecho: selector gestion + badges trim + acciones */
.ent-hero-bar-right {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    flex-wrap: nowrap;
    justify-content: flex-end;
    flex: 0 0 auto;
}
/* Nav tabs no ocupa todo el ancho — deja espacio al cluster derecho */
.ent-hero-bar > .ent-nav {
    flex: 0 1 auto;
    min-width: 0;
}
/* Compactar nav y cluster para que quepan en una sola linea en pantallas medianas-grandes */
@media (max-width: 1700px) {
    .ent-hero-bar { padding: 8px 14px; gap: 6px; }
    .ent-hero-bar > .ent-nav { gap: 1px; }
    .ent-hero-bar > .ent-nav .ent-nav-link {
        padding: 7px 11px;
        font-size: 12.5px;
        gap: 4px;
    }
    .ent-hero-bar > .ent-nav .ent-nav-link .bi { font-size: 13px; }
    .ent-trim-badges-wrap { padding: 4px 8px; gap: 5px; }
    .ent-trim-badge { width: 26px; height: 26px; font-size: 10.5px; border-width: 1.5px; }
    .ent-trim-badges-label { font-size: 10.5px; letter-spacing: 0.2px; }
    .ent-year-wrap { padding: 4px 10px; }
    .ent-year-select { font-size: 13px; padding: 5px 22px 5px 8px; }
    .ent-year-label { font-size: 10.5px; }
    .ent-actions-btn { padding: 6px 11px; font-size: 12.5px; }
    .ent-hero-bar-right { gap: 8px; }
}
/* Cuando el cluster cae a fila 2: darle look de toolbar integrado */
.ent-hero-bar-right {
    padding: 0;
}
@media (max-width: 1400px) {
    .ent-hero-bar-right {
        width: 100%;
        margin-top: 4px;
        padding-top: 8px;
        border-top: 1px dashed var(--borde-l);
        justify-content: flex-end;
    }
}
@media (max-width: 1280px) {
    .ent-hero-bar-right { flex-wrap: wrap; }
}
@media (max-width: 768px) {
    .ent-hero-bar-right { margin-left: 0; width: 100%; justify-content: flex-start; }
    .ent-hero-bar > .ent-nav .ent-nav-link .ent-nav-link-text,
    .ent-hero-bar > .ent-nav .ent-nav-link span:not(.ent-chip) { display: inline; }
}
.ent-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    flex: 1 1 auto;
    min-width: 0;
}
.ent-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    /* Pill consistente. Bootstrap 5 .nav-tabs .nav-link sobrescribe solo
       border-top-left-radius y border-top-right-radius con un valor pequeno,
       lo que dejaba los tabs con esquinas asimetricas (forma de boomerang).
       Forzamos las 4 propiedades especificas para derrotar el override. */
    border-radius: 999px;
    border-top-left-radius: 999px;
    border-top-right-radius: 999px;
    border-bottom-left-radius: 999px;
    border-bottom-right-radius: 999px;
    /* Bootstrap 5 .nav-tabs .nav-link aplica margin-bottom: -1px para que
       el tab activo se monte sobre el borde inferior del nav-tabs. Aqui no
       hay borde inferior, asi que ese desplazamiento solo distorsiona el
       lift visual del hover. Lo neutralizamos. */
    margin-bottom: 0;
    background-color: transparent;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--texto-sec);
    text-decoration: none;
    transition: all var(--ease);
    border: 1px solid transparent;
    white-space: nowrap;
    cursor: pointer;
}
.ent-nav-link:hover {
    background: rgba(0,61,123,.07);
    color: var(--azul) !important;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,61,123,.10);
}
.ent-nav-link:focus-visible {
    outline: 2px solid var(--dorado-l);
    outline-offset: 2px;
}
.ent-nav-link .bi {
    font-size: 16px;
    opacity: .75;
    transition: opacity .15s ease, transform var(--ease);
}
.ent-nav-link:hover .bi { opacity: 1; transform: scale(1.05); }
.ent-nav-link.active {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff !important;
    border-color: var(--azul-d);
    box-shadow: 0 6px 16px rgba(0,61,123,.28), 0 1px 2px rgba(0,61,123,.20), inset 0 1px 0 rgba(255,255,255,.12);
    transform: translateY(0);
}
.ent-nav-link.active:hover {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(0,61,123,.32), 0 1px 2px rgba(0,61,123,.20), inset 0 1px 0 rgba(255,255,255,.12);
}
.ent-nav-link.active .bi { opacity: 1; }

/* ════════════════════════════════════════════════════════════
   ENT TABS MODERN — segmented control independiente de nav-tabs
   Diseno alternativo para tabs robustos y modernos. NO usa
   .nav-tabs para evitar conflictos con el bloque legacy de la
   linea ~1172 (border-bottom + !important) y el override de BS5
   sobre border-top-*-radius. Aplica via clase ent-tabs-modern
   en el <ul> y ent-tabs-modern-link en cada <a>.
   ════════════════════════════════════════════════════════════ */
.ent-tabs-modern {
    list-style: none;
    margin: 0 0 18px;
    padding: 5px;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    background: linear-gradient(135deg, rgba(0,61,123,.04) 0%, rgba(173,132,17,.03) 100%);
    border: 1px solid var(--borde-l);
    border-radius: 14px;
    box-shadow: inset 0 1px 2px rgba(15,23,42,.04);
    max-width: 100%;
}
.ent-tabs-modern .ent-tabs-modern-item,
.ent-tabs-modern li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ent-tabs-modern-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--texto-sec);
    text-decoration: none;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.ent-tabs-modern-link:hover {
    background: rgba(0,61,123,.06);
    color: var(--azul) !important;
    text-decoration: none;
    transform: translateY(-1px);
}
.ent-tabs-modern-link:focus-visible {
    outline: 2px solid var(--dorado-l);
    outline-offset: 2px;
}
.ent-tabs-modern-link .bi {
    font-size: 16px;
    opacity: .7;
    transition: opacity .15s ease, transform .2s var(--ease);
}
.ent-tabs-modern-link:hover .bi { opacity: .95; transform: scale(1.05); }
.ent-tabs-modern-link.active {
    background: #fff;
    color: var(--azul) !important;
    border-color: var(--borde-l);
    box-shadow: 0 4px 12px rgba(0,61,123,.12), 0 1px 3px rgba(0,61,123,.08), 0 0 0 1px rgba(0,61,123,.04);
    transform: translateY(0);
}
.ent-tabs-modern-link.active:hover {
    background: #fff;
    color: var(--azul) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0,61,123,.16), 0 1px 3px rgba(0,61,123,.10), 0 0 0 1px rgba(0,61,123,.06);
}
.ent-tabs-modern-link.active .bi {
    opacity: 1;
    color: var(--azul);
}
.ent-tabs-modern-link.active::after {
    content: "";
    width: 20px;
    height: 3px;
    background: linear-gradient(90deg, var(--dorado), var(--dorado-l));
    border-radius: 3px;
    margin-left: 4px;
    flex-shrink: 0;
    box-shadow: 0 1px 2px rgba(173,132,17,.30);
}

@media (max-width: 575.98px) {
    .ent-tabs-modern {
        display: flex;
        gap: 3px;
        padding: 4px;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .ent-tabs-modern::-webkit-scrollbar { display: none; }
    .ent-tabs-modern-link { font-size: 13px; padding: 8px 14px; }
    .ent-tabs-modern-link.active::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ent-tabs-modern-link, .ent-tabs-modern-link .bi { transition: none; }
    .ent-tabs-modern-link:hover { transform: none; }
}

.ent-year-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.ent-year-label {
    font-size: 11px;
    color: var(--texto-sec);
    text-transform: uppercase;
    letter-spacing: .6px;
    font-weight: 700;
    margin: 0;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-year-select {
    background: var(--blanco);
    border: 1px solid var(--borde);
    border-radius: 999px;
    padding: 7px 36px 7px 14px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--azul-d);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16' fill='%23003d7b'%3E%3Cpath d='M4.427 6.427a.6.6 0 0 1 .849 0L8 9.151l2.724-2.724a.6.6 0 1 1 .849.849l-3.149 3.149a.6.6 0 0 1-.849 0L4.427 7.276a.6.6 0 0 1 0-.849z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    cursor: pointer;
    transition: all var(--ease);
    min-width: 140px;
}
.ent-year-select:hover { border-color: var(--azul); }
.ent-year-select:focus {
    outline: none;
    border-color: var(--azul);
    box-shadow: 0 0 0 3px rgba(0,61,123,.15);
}

/* Boton de acciones (kebab) */
.ent-actions { position: relative; }
.ent-actions-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--borde);
    background: var(--blanco);
    color: var(--azul-d);
    cursor: pointer;
    transition: all var(--ease);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 13.5px;
    font-weight: 700;
}
.ent-actions-btn:hover,
.ent-actions-btn:focus {
    border-color: var(--azul);
    color: var(--azul) !important;
    background: rgba(0,61,123,.05);
    text-decoration: none;
}
.ent-actions-btn:focus-visible { outline: 2px solid var(--dorado-l); outline-offset: 2px; }
.ent-actions-btn .bi { font-size: 18px; line-height: 1; }

.ent-actions-menu {
    min-width: 300px;
    max-width: 340px;
    padding: 6px !important;
    border: 1px solid var(--borde) !important;
    border-top: 2px solid var(--dorado) !important;
    border-radius: 0 0 var(--radio) var(--radio) !important;
    box-shadow: var(--sombra-2) !important;
    background: var(--blanco) !important;
}
.ent-actions-menu > li { list-style: none; }
.ent-actions-menu > li > a,
.ent-actions-menu > li.ul-collapse > a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 14px !important;
    color: var(--texto) !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    border-radius: var(--radio-s);
    text-decoration: none;
    border-left: 0 !important;
    background: transparent !important;
    transition: all var(--ease);
    cursor: pointer;
}
.ent-actions-menu > li > a:hover,
.ent-actions-menu > li > a:focus,
.ent-actions-menu > li.ul-collapse > a:hover {
    background: rgba(0,61,123,.07) !important;
    color: var(--azul) !important;
    border-left: 0 !important;
}
.ent-actions-menu > li > a > .bi {
    color: var(--azul);
    font-size: 16px;
    flex-shrink: 0;
    width: 22px;
    text-align: center;
}
.ent-actions-menu-header {
    padding: 10px 14px 4px !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 10.5px !important;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--texto-sec) !important;
    font-weight: 700 !important;
    margin: 0;
}
.ent-actions-menu hr {
    margin: 4px 8px !important;
    border: none !important;
    border-top: 1px solid var(--borde-l) !important;
}
.ent-actions-menu .collapse,
.ent-actions-menu .collapsing {
    padding-left: 20px !important;
    list-style: none;
}
.ent-actions-menu .caret {
    margin-left: auto;
    opacity: .5;
    transition: transform .2s ease;
}
.ent-actions-menu .ul-collapse[aria-expanded="true"] .caret,
.ent-actions-menu .ul-collapse.open .caret { transform: rotate(180deg); }

/* ---------- Tablero (board) ---------- */
.ent-board {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ent-section {
    background: var(--blanco);
    border: 1px solid var(--borde-l);
    border-radius: var(--radio);
    box-shadow: var(--sombra-1);
    padding: 18px 20px;
    position: relative;
}
.ent-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px 0;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--dorado-bg);
}
.ent-section-title {
    margin: 0;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    color: var(--azul-d);
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: -.005em;
}
.ent-section-title .bi {
    color: var(--dorado);
    font-size: 20px;
    line-height: 1;
}
.ent-section-hint {
    font-size: 12.5px;
    color: var(--texto-sec);
    margin: 4px 0 0 0;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-section-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Loading y empty */
.ent-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 32px 16px;
    color: var(--texto-sec);
    font-size: 13.5px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    text-align: center;
}
.ent-loading::before {
    content: '';
    display: block;
    width: 36px;
    height: 36px;
    border: 3px solid var(--borde-l);
    border-top-color: var(--azul);
    border-radius: 50%;
    animation: entSpin .9s linear infinite;
}
@keyframes entSpin { to { transform: rotate(360deg); } }

.ent-empty {
    text-align: center;
    padding: 36px 20px;
    color: var(--texto-sec);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}
.ent-empty > .bi {
    font-size: 40px;
    color: var(--borde);
    display: block;
    margin-bottom: 10px;
    line-height: 1;
}
.ent-empty h4 {
    color: var(--texto);
    margin: 0 0 6px 0;
    font-size: 16px;
    font-weight: 700;
}
.ent-empty p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.5;
}

/* Botones del modulo (consistentes con design system) */
.ent-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 16px;
    border-radius: var(--radio-s);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all var(--ease);
    line-height: 1.2;
    white-space: nowrap;
}
.ent-btn:focus-visible { outline: 2px solid var(--dorado-l); outline-offset: 2px; }
.ent-btn .bi { font-size: 15px; line-height: 1; }
.ent-btn-sm { padding: 6px 12px; font-size: 12.5px; }

.ent-btn-primary {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(0,61,123,.25);
}
.ent-btn-primary:hover {
    background: linear-gradient(135deg, var(--azul-d) 0%, #001a3b 100%);
    color: #fff !important;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,61,123,.35);
    transform: translateY(-1px);
}
.ent-btn-ghost {
    background: var(--blanco);
    color: var(--azul-d) !important;
    border-color: var(--borde);
}
.ent-btn-ghost:hover {
    background: rgba(0,61,123,.05);
    border-color: var(--azul);
    color: var(--azul) !important;
    text-decoration: none;
}
.ent-btn-dorado {
    background: linear-gradient(135deg, var(--dorado) 0%, #8e6b0c 100%);
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(173,132,17,.25);
}
.ent-btn-dorado:hover {
    color: #fff !important;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(173,132,17,.35);
    transform: translateY(-1px);
}
.ent-btn-peligro {
    background: transparent;
    color: #c62828 !important;
    border-color: rgba(198,40,40,.35);
}
.ent-btn-peligro:hover {
    background: rgba(198,40,40,.08);
    border-color: #c62828;
    color: #8b0000 !important;
    text-decoration: none;
}

/* Chips / badges de estado */
.ent-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 999px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .3px;
    line-height: 1.4;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid transparent;
}
.ent-chip .bi { font-size: 12px; line-height: 1; }
.ent-chip-ok   { background: #e8f5e9; color: #1b5e20; border-color: rgba(27,94,32,.18); }
.ent-chip-warn { background: #fff3e0; color: #a45a00; border-color: rgba(164,90,0,.18); }
.ent-chip-err  { background: #ffebee; color: #8b0000; border-color: rgba(139,0,0,.2); }
.ent-chip-info { background: rgba(0,61,123,.08); color: var(--azul-d); border-color: rgba(0,61,123,.2); }
.ent-chip-muted{ background: #f0efec; color: var(--texto-sec); border-color: var(--borde-l); }
.ent-chip-dorado{ background: var(--dorado-bg); color: var(--dorado); border-color: rgba(173,132,17,.3); }

/* Semaforo numerico (para porcentajes) */
.ent-sem {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 15px;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: var(--radio-s);
    min-width: 72px;
}
.ent-sem-rojo    { background: rgba(198,40,40,.10); color: #8b0000; }
.ent-sem-amarillo{ background: rgba(220,160,0,.14);  color: #7a4a00; }
.ent-sem-verde   { background: rgba(27,139,58,.12);  color: #0e5c25; }
.ent-sem-azul    { background: rgba(0,61,123,.08);   color: var(--azul-d); }
.ent-sem-vacio   { color: var(--texto-sec); font-weight: 500; }

/* KPI cards */
.ent-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}
.ent-kpi {
    background: linear-gradient(180deg, #fafaf8 0%, #fff 100%);
    border: 1px solid var(--borde-l);
    border-radius: var(--radio-s);
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: all var(--ease);
}
.ent-kpi:hover {
    border-color: var(--borde);
    box-shadow: var(--sombra-1);
    transform: translateY(-1px);
}
.ent-kpi-label {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 11.5px;
    color: var(--texto-sec);
    text-transform: uppercase;
    letter-spacing: .5px;
    font-weight: 700;
    margin: 0;
}
.ent-kpi-value {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 26px;
    font-weight: 700;
    color: var(--azul-d);
    margin: 0;
    line-height: 1.1;
}
.ent-kpi-hint {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    color: var(--texto-sec);
    margin: 0;
}

/* Cards y programas */
.ent-card {
    background: var(--blanco);
    border: 1px solid var(--borde-l);
    border-radius: var(--radio-s);
    padding: 14px 16px;
    transition: all var(--ease);
}
.ent-card:hover {
    border-color: var(--borde);
    box-shadow: var(--sombra-1);
}

/* Tabla con estilo del modulo */
.ent-table-wrap {
    border: 1px solid var(--borde-l);
    border-radius: var(--radio-s);
    overflow: auto;
    background: var(--blanco);
}
.ent-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 14px;
}
.ent-table thead th {
    background: linear-gradient(180deg, #f6f4ef 0%, #efece5 100%);
    color: var(--azul-d);
    text-align: left;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .4px;
    padding: 10px 14px;
    border-bottom: 2px solid var(--dorado-bg);
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}
.ent-table tbody td {
    padding: 11px 14px;
    border-bottom: 1px solid var(--borde-l);
    vertical-align: middle;
    color: var(--texto);
}
.ent-table tbody tr:last-child td { border-bottom: none; }
.ent-table tbody tr:hover td { background: rgba(0,61,123,.025); }
.ent-table .ent-col-center { text-align: center; }
.ent-table .ent-col-right { text-align: right; }
.ent-table a { color: var(--azul); font-weight: 600; text-decoration: none; }
.ent-table a:hover { color: var(--dorado) !important; text-decoration: underline; }

/* Barra resumen horizontal */
.ent-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: rgba(0,61,123,.04);
    border-left: 4px solid var(--azul);
    border-radius: var(--radio-s);
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 13.5px;
    flex-wrap: wrap;
}
.ent-bar .bi { color: var(--azul); font-size: 18px; }
.ent-bar strong { color: var(--azul-d); font-weight: 700; }

/* Responsive */
@media (max-width: 991.98px) {
    .ent-hero-people { margin-left: 0; width: 100%; border-top: 1px dashed var(--borde-l); padding-top: 14px; margin-top: 4px; }
}
@media (max-width: 767.98px) {
    .ent-shell { padding: 2px 0 24px 0; }
    .ent-crumb { font-size: 12.5px; padding: 8px 4px; }
    .ent-hero-top { padding: 16px 16px 14px 16px; gap: 14px; }
    .ent-hero-brand { flex: 1 1 100%; }
    .ent-hero-logo { width: 108px; height: 108px; }
    .ent-hero-bar { padding: 10px 14px; gap: 8px; }
    .ent-nav { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .ent-nav::-webkit-scrollbar { display: none; }
    .ent-nav-link { font-size: 13px; padding: 7px 12px; }
    .ent-section { padding: 14px; }
    .ent-section-head { margin-bottom: 10px; padding-bottom: 8px; }
    .ent-section-title { font-size: 16px; }
    .ent-actions-menu { min-width: 260px; }
    .ent-person { max-width: none; width: 100%; }
    .ent-person-avatar { width: 56px; height: 56px; }
    .ent-person-name, .ent-person-cargo { max-width: none; white-space: normal; }
}
@media (max-width: 479.98px) {
    .ent-hero-top { padding: 14px; }
    .ent-hero-brand { gap: 14px; }
    .ent-hero-logo { width: 92px; height: 92px; }
    .ent-hero-title { font-size: 22px; }
    .ent-person-avatar { width: 52px; height: 52px; }
    .ent-year-wrap { width: 100%; justify-content: space-between; }
    .ent-year-select { flex: 1 1 auto; }
}

/* Foco accesible global del modulo */
.ent-shell a:focus-visible,
.ent-shell button:focus-visible,
.ent-shell [tabindex]:focus-visible {
    outline: 2px solid var(--dorado-l);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .ent-btn, .ent-btn-primary, .ent-btn-dorado, .ent-kpi, .ent-card, .ent-person,
    .ent-nav-link, .ent-actions-btn, .ent-hero-logo-edit {
        transition: none;
    }
    .ent-btn-primary:hover, .ent-btn-dorado:hover, .ent-kpi:hover { transform: none; }
    .ent-loading::before { animation: none; }
}

/* ---------- Sub-secciones (para subdividir secciones grandes) ---------- */
.ent-sub-section {
    background: var(--blanco);
    border: 1px solid var(--borde-l);
    border-radius: var(--radio);
    box-shadow: var(--sombra-1);
    padding: 16px 20px;
    margin-bottom: 14px;
}

/* ---------- Acciones dentro de una fila de tabla ---------- */
.ent-row-actions { position: relative; }
.ent-row-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid transparent;
    color: var(--texto-sec);
    cursor: pointer;
    transition: all var(--ease);
    padding: 0;
}
.ent-row-action-btn:hover,
.ent-row-action-btn[aria-expanded="true"] {
    background: rgba(0,61,123,.08);
    border-color: var(--borde);
    color: var(--azul) !important;
}
.ent-row-action-btn:focus-visible {
    outline: 2px solid var(--dorado-l);
    outline-offset: 2px;
}
.ent-row-action-btn .bi { font-size: 18px; line-height: 1; }

/* ---------- Link del nombre del responsable ---------- */
.ent-responsable-link {
    color: var(--azul) !important;
    font-weight: 600;
    text-decoration: none;
    transition: color var(--ease);
}
.ent-responsable-link:hover { color: var(--dorado) !important; text-decoration: underline; }

/* ---------- Filas archivadas (atenuadas) ---------- */
.ent-row-archivado td {
    background: #faf9f5 !important;
    color: var(--texto-sec) !important;
}
.ent-row-archivado a { color: var(--texto-sec) !important; }
.ent-row-archivado a:hover { color: var(--azul) !important; }

/* ---------- Bloque de archivados ---------- */
.ent-archivo-block { }
.ent-table-programas-wrap { }

/* ---------- Tabla de metas e indicadores (_ProgramaMetas*) ---------- */
.ent-metas-panel { }
.ent-metas-table-wrap { overflow-x: auto; }
.ent-metas-table { font-size: 13.5px; min-width: 1150px; }
.ent-metas-table thead th {
    background: linear-gradient(180deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff;
    border-bottom: 0;
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.ent-metas-table tbody.ent-indicador-block { border-bottom: 3px solid var(--borde-l); }
.ent-metas-table tbody.ent-indicador-block:last-child { border-bottom: none; }
.ent-metas-table tbody.ent-row-alt > tr > td { background: #fbfaf6; }
.ent-metas-table tbody > tr:hover > td { background: rgba(0,61,123,.04); }

.ent-col-resultado {
    font-weight: 600;
    color: var(--azul-d);
    background: rgba(0,61,123,.04);
    border-right: 1px solid var(--borde-l);
}
.ent-col-indicador { padding: 12px 14px !important; vertical-align: top; }
.ent-indicador-link {
    font-weight: 700;
    color: var(--azul) !important;
    text-decoration: none;
    font-size: 14.5px;
    display: block;
    margin-bottom: 6px;
}
.ent-indicador-link:hover { color: var(--dorado) !important; text-decoration: underline; }

.ent-meta-principal-dot {
    display: inline-block;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--dorado);
    box-shadow: 0 0 0 3px var(--dorado-bg);
    margin-right: 8px;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.ent-indicador-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}
.ent-ind-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px; height: 24px;
    border-radius: 6px;
    border: 1px solid transparent;
    font-size: 12px;
    text-decoration: none;
    transition: all var(--ease);
    cursor: default;
}
a.ent-ind-badge { cursor: pointer; }
.ent-ind-badge:focus-visible { outline: 2px solid var(--dorado-l); outline-offset: 2px; }
.ent-ind-badge-ok {
    background: rgba(27,139,58,.12);
    color: #0e5c25;
    border-color: rgba(27,139,58,.25);
}
.ent-ind-badge-ok:hover { background: rgba(27,139,58,.2); color: #0e5c25 !important; }
.ent-ind-badge-warn {
    background: rgba(220,160,0,.16);
    color: #7a4a00;
    border-color: rgba(220,160,0,.3);
}
.ent-ind-badge-warn:hover { background: rgba(220,160,0,.24); color: #7a4a00 !important; }
.ent-ind-badge-info {
    background: rgba(0,61,123,.08);
    color: var(--azul);
    border-color: rgba(0,61,123,.2);
}
.ent-ind-badge-info:hover { background: rgba(0,61,123,.14); color: var(--azul) !important; }

.ent-calculo-chip {
    display: inline-block;
    padding: 3px 10px;
    background: var(--dorado-bg);
    color: var(--dorado);
    border: 1px solid rgba(173,132,17,.25);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    letter-spacing: .3px;
}

.ent-trim-num {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    color: var(--texto-sec);
    font-size: 13px;
    background: rgba(0,61,123,.03);
}
.ent-trim-num strong { color: var(--azul-d); font-weight: 700; font-size: 13.5px; }

.ent-indicador-row-empty td { color: var(--texto-sec); font-style: italic; }

/* ---------- Acordeon de metas (_ProgramaMetas) ---------- */
.ent-metas-accordion {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ent-meta-card {
    border: 1px solid var(--borde-l);
    border-radius: var(--radio-s);
    background: var(--blanco);
    overflow: hidden;
    transition: border-color var(--ease);
}
.ent-meta-card:hover { border-color: var(--borde); }

.ent-meta-head {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 14px 18px;
    background: linear-gradient(135deg, var(--dorado) 0%, #8e6b0c 100%);
    border: none;
    cursor: pointer;
    color: #fff;
    text-align: left;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    transition: all var(--ease);
}
.ent-meta-head:hover { filter: brightness(1.05); }
.ent-meta-head:focus-visible { outline: 2px solid var(--azul); outline-offset: -2px; }
.ent-meta-head[aria-expanded="true"] .ent-meta-chevron { transform: rotate(180deg); }

.ent-meta-head-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.ent-meta-label {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .6px;
    font-weight: 700;
    opacity: .85;
}
.ent-meta-name {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ent-meta-head-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.ent-meta-head-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.35);
    text-decoration: none;
    transition: all var(--ease);
}
.ent-meta-head-btn:hover { background: rgba(255,255,255,.3); color: #fff !important; text-decoration: none; }
.ent-meta-head-btn .bi { font-size: 14px; }

.ent-meta-head-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.22);
    border: 1px solid rgba(255,255,255,.4);
    color: #fff !important;
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: all var(--ease);
}
.ent-meta-head-pill:hover { background: rgba(255,255,255,.36); color: #fff !important; text-decoration: none; }

.ent-meta-chevron {
    font-size: 18px;
    transition: transform var(--ease);
    flex-shrink: 0;
}

.ent-meta-body {
    padding: 0;
}
.ent-meta-body .ent-table-wrap { border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0; }
.ent-cadena-table thead th {
    background: #fafaf8;
    color: var(--azul-d);
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.ent-ind-row-principal > td { background: var(--blanco); font-weight: 500; }
.ent-ind-row-relacion > td {
    background: #fafaf8;
    font-size: 13px;
    color: var(--texto-sec);
}
.ent-ind-row-relacion[data-rel-tipo="sumariza"]    > td { border-left: 3px solid rgba(0,61,123,.4); }
.ent-ind-row-relacion[data-rel-tipo="resumen"]     > td { border-left: 3px solid var(--dorado); }
.ent-ind-row-relacion[data-rel-tipo="intermedio"]  > td { border-left: 3px solid rgba(27,139,58,.4); }
.ent-ind-row-relacion .ent-indicador-link { color: var(--texto) !important; font-size: 13px; }

.ent-inline-actions {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767.98px) {
    .ent-meta-head-pill { display: none; }
    .ent-meta-name { white-space: normal; }
}

/* ---------- Vista de trabajo mensual del indicador (VistaPorGestion) ---------- */
.ent-data-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.ent-data-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 10px 0;
}
.ent-data-table {
    font-size: 14px;
}
.ent-data-table thead th {
    background: linear-gradient(180deg, #f6f4ef 0%, #efece5 100%);
    color: var(--azul-d);
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .4px;
    border-bottom: 2px solid var(--dorado-bg);
}
.ent-data-periodo {
    font-weight: 700;
    color: var(--azul-d);
    background: rgba(0,61,123,.03);
    border-right: 1px solid var(--borde-l);
}
.ent-valor-reportado {
    font-weight: 700;
    color: var(--azul-d);
    font-size: 14.5px;
}
.ent-valor-validado {
    font-weight: 700;
    color: #0e5c25;
    font-size: 14.5px;
}
.ent-data-justificacion {
    font-size: 13px;
    color: var(--texto);
    line-height: 1.45;
}
.ent-justificacion-item {
    padding: 6px 10px;
    background: rgba(0,61,123,.03);
    border-left: 3px solid var(--azul);
    border-radius: 0 4px 4px 0;
    margin-bottom: 4px;
}
.ent-justificacion-item:last-child { margin-bottom: 0; }

/* ---------- Vista del Indicador (indicador/Vista) ---------- */
.ent-indicador-hero .ent-hero-title {
    font-size: clamp(20px, 2vw, 26px);
    line-height: 1.3;
}
.ent-indicador-navbar {
    background: var(--blanco);
    border: 1px solid var(--borde-l);
    border-radius: var(--radio);
    box-shadow: var(--sombra-1);
    padding: 10px 18px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.ent-indicador-navbar .ent-nav { flex: 1 1 auto; min-width: 0; overflow-x: auto; }
.ent-indicador-navbar .ent-nav::-webkit-scrollbar { display: none; }

.ent-indicador-ficha .ent-section-head { margin-bottom: 16px; }

.ent-ficha-subtitle {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    color: var(--azul-d);
    font-weight: 700;
    font-size: 17px;
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--dorado-bg);
}

/* Refinar tabla del indicador con tokens ENT (sin romper clases legacy) */
.ent-indicador-ficha .tdTitulo {
    color: var(--azul-d) !important;
    border-bottom: 1px solid var(--borde-l) !important;
}
.ent-indicador-ficha .tdCelda {
    color: var(--texto) !important;
}
.ent-indicador-ficha .tdHorizontal {
    border-bottom: 1px solid var(--borde-l) !important;
    padding: 10px 0 !important;
}
.ent-indicador-ficha .tdHorizontal > b {
    color: var(--azul-d) !important;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
}

/* =============== Formulario moderno ent-form-* =============== */
.ent-form-group {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 18px;
}
.ent-form-group.ent-form-cols-2 { grid-template-columns: 1fr 1fr; }
.ent-form-group.ent-form-cols-3 { grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 768px) {
    .ent-form-group.ent-form-cols-2,
    .ent-form-group.ent-form-cols-3 { grid-template-columns: 1fr; }
}
.ent-form-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ent-form-field.ent-form-field-full { grid-column: 1 / -1; }
.ent-form-label {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--azul);
    letter-spacing: 0.2px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}
.ent-form-label .bi { color: var(--dorado); font-size: 14px; }
.ent-form-label .ent-req { color: #dc2626; margin-left: 2px; font-weight: 700; }
.ent-form-hint {
    font-size: 12.5px;
    color: var(--texto-l);
    margin: 2px 0 0;
    line-height: 1.45;
}
/* Inputs / selects / textarea estilizados cuando estan dentro de ent-form-field */
.ent-form-field .form-control,
.ent-form-field input[type=text],
.ent-form-field input[type=number],
.ent-form-field input[type=email],
.ent-form-field input[type=date],
.ent-form-field input[type=file],
.ent-form-field select,
.ent-form-field textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1.5px solid var(--borde);
    border-radius: 8px;
    background: #fff;
    color: var(--texto);
    font-size: 14px;
    font-family: inherit;
    transition: border-color .15s ease, box-shadow .15s ease;
    min-height: 40px;
    box-shadow: none;
}
.ent-form-field .form-control:focus,
.ent-form-field input:focus,
.ent-form-field select:focus,
.ent-form-field textarea:focus {
    outline: none;
    border-color: var(--azul);
    box-shadow: 0 0 0 3px rgba(0, 61, 123, 0.12);
}
.ent-form-field textarea { min-height: 90px; resize: vertical; }
.ent-form-field .select2-container--default .select2-selection--single,
.ent-form-field .select2-container--default .select2-selection--multiple {
    border: 1.5px solid var(--borde) !important;
    border-radius: 8px !important;
    min-height: 40px !important;
    padding: 4px 6px !important;
}
.ent-form-field .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 30px !important;
}
.ent-form-field .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
}
/* Radio group pill */
.ent-radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.ent-radio-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1.5px solid var(--borde);
    border-radius: 999px;
    background: #fff;
    color: var(--texto);
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    transition: all .15s ease;
    user-select: none;
}
.ent-radio-pill:hover { border-color: var(--azul); color: var(--azul); }
.ent-radio-pill input[type=radio] {
    accent-color: var(--azul);
    margin: 0;
    width: 15px;
    height: 15px;
}
.ent-radio-pill:has(input[type=radio]:checked) {
    background: linear-gradient(135deg, rgba(0,61,123,0.08), rgba(173,132,17,0.08));
    border-color: var(--azul);
    color: var(--azul);
    font-weight: 600;
}
/* Checkbox fila */
.ent-checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border: 1.5px solid var(--borde);
    border-radius: 10px;
    background: #fff;
    transition: border-color .15s ease, background .15s ease;
    cursor: pointer;
}
.ent-checkbox-row:hover { border-color: var(--azul); background: #fafbff; }
.ent-checkbox-row input[type=checkbox] {
    accent-color: var(--azul);
    margin-top: 2px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.ent-checkbox-row-text { flex: 1; min-width: 0; }
.ent-checkbox-row-label { font-weight: 600; color: var(--azul); font-size: 14px; display: block; }
.ent-checkbox-row-hint { font-size: 12.5px; color: var(--texto-l); margin-top: 3px; line-height: 1.45; }
/* Panel colapsable para detalle de resumen/sumariza */
.ent-form-subpanel {
    border-left: 3px solid var(--dorado);
    background: #fafbff;
    padding: 14px 18px;
    border-radius: 0 8px 8px 0;
    margin: -8px 0 6px 22px;
}
.ent-form-subpanel-hint { font-size: 12.5px; color: var(--texto-l); margin-top: 6px; line-height: 1.5; }
/* Divider */
.ent-form-divider {
    border: none;
    border-top: 1px dashed var(--borde);
    margin: 22px 0;
}
.ent-form-group-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--azul);
    margin: 8px 0 14px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--dorado);
    display: inline-block;
}
/* Card de archivo (imagen/icono) */
.ent-file-card {
    border: 2px dashed var(--borde);
    border-radius: 10px;
    padding: 14px;
    text-align: center;
    background: #fafbff;
    transition: border-color .15s ease;
}
.ent-file-card:hover { border-color: var(--dorado); }
.ent-file-card img {
    max-width: 120px;
    max-height: 120px;
    margin: 0 auto 10px;
    display: block;
    border-radius: 8px;
}
.ent-file-card input[type=file] {
    width: 100%;
    margin-top: 6px;
    font-size: 13px;
}
/* Validation message */
.ent-form-field .validationMessage,
.ent-form-field .field-validation-error {
    color: #dc2626;
    font-size: 12.5px;
    margin-top: 2px;
}
/* Actions footer del form */
.ent-form-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 18px;
    border-top: 1px solid var(--borde-l);
    margin-top: 10px;
}

/* =============== Filtros tipo tarjeta con título y botón limpiar =============== */
.ent-filtros-card {
    background: linear-gradient(135deg, rgba(0, 61, 123, 0.03), rgba(173, 132, 17, 0.03));
    border: 1.5px solid var(--borde-l);
    border-radius: 10px;
    padding: 14px 16px;
}
.ent-filtros-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px dashed var(--borde-l);
}
.ent-filtros-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--azul);
    font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 14.5px;
}
.ent-filtros-title .bi { color: var(--dorado); }
.ent-filtros-limpiar {
    background: none;
    border: 1px solid var(--borde);
    color: var(--texto-l);
    font-size: 12px;
    font-weight: 500;
    padding: 4px 10px;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: border-color .15s ease, color .15s ease;
}
.ent-filtros-limpiar:hover {
    border-color: var(--azul);
    color: var(--azul);
}
.ent-filtros-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr auto;
    gap: 12px;
    align-items: end;
}
.ent-filtros-submit button { min-width: 160px; }
.ent-input-with-suffix {
    position: relative;
    display: flex;
    align-items: center;
}
.ent-input-with-suffix .form-control { padding-right: 28px; }
.ent-input-suffix {
    position: absolute;
    right: 10px;
    color: var(--texto-l);
    font-weight: 600;
    font-size: 13px;
    pointer-events: none;
}
@media (max-width: 1100px) {
    .ent-filtros-grid { grid-template-columns: 1fr 1fr 1fr; }
    .ent-filtros-submit { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .ent-filtros-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
    .ent-filtros-grid { grid-template-columns: 1fr; }
}

/* =============== Mejoras responsive móvil =============== */
/* Menu mobile: compacto, scrollable, con jerarquía clara */
@media (max-width: 991px) {
    .menu-center.navbar-collapse.show {
        max-height: calc(100vh - 70px) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        padding: 8px 0 16px !important;
        background: rgb(0, 42, 86) !important;
    }
    .ttr_menu_items {
        width: 100%;
        flex-direction: column !important;
    }
    .ttr_menu_items > li,
    .ttr_menu_items > li.ttr_menu_items_parent {
        width: 100% !important;
        margin: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
    .ttr_menu_items > li:last-child { border-bottom: 0; }
    /* Links principales compactos */
    #ttr_menu .nav.ttr_menu_items > li > a,
    .menu-center ul.navbar-nav > li > a,
    .nav.ttr_menu_items li .ttr_menu_items_parent_link,
    .nav.ttr_menu_items li a.ttr_menu_items_parent_link_arrow {
        padding: 14px 20px !important;
        font-size: 14px !important;
        text-align: left !important;
        justify-content: flex-start !important;
    }
    /* Sin subrayado animado en móvil — sólo color */
    .nav.ttr_menu_items > li > a::after,
    .menu-center ul.navbar-nav > li > a::after { display: none !important; }
    /* Dropdowns del menú (Reportes, Módulos, etc) ocultan imagen del submenu */
    .ttr_menu_items > li .child.dropdown-menu {
        position: static !important;
        background: rgba(0, 0, 0, 0.18) !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        border: 0 !important;
        box-shadow: none !important;
    }
    .ttr_menu_items > li .child.dropdown-menu > li > a {
        padding: 11px 28px !important;
        font-size: 13.5px !important;
        color: #fff !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    }
    .ttr_menu_items > li .child.dropdown-menu > li:last-child > a { border-bottom: 0 !important; }
    /* Ocultar imagenes decorativas dentro del submenu en mobile */
    .ttr_menu_items > li .child.dropdown-menu img {
        display: none !important;
    }
    .ttr_menu_items > li .child.dropdown-menu hr,
    .ttr_menu_items > li .horiz_separator { display: none !important; }
    /* Header mobile: logo chico + botón hamburguesa al lado */
    .navbar-header {
        display: flex !important;
        justify-content: flex-end !important;
        padding: 10px 12px !important;
        float: none !important;
    }
    #nav-expander, .navbar-toggle {
        padding: 8px 12px !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
    }
    .ttr_menu_toggle_button { display: inline-block !important; }
    .ttr_menu_button_text { display: none !important; }
    /* FIX: en desktop el logo es position:absolute flotando.
       En movil esto causa que se superponga al item "Módulos".
       Forzamos a position:static y lo reubicamos como bloque. */
    .ttr_menu_logo {
        position: static !important;
        transform: none !important;
        top: auto !important;
        left: auto !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        z-index: auto !important;
    }
    .ttr_images_container {
        position: static !important;
        padding: 10px 12px !important;
        width: 100% !important;
        text-align: center !important;
        display: block !important;
        background: rgb(0, 42, 86) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
    .ttr_menu_logo a {
        gap: 8px !important;
        align-items: center !important;
    }
    .ttr_menu_logo img,
    #logoSig {
        max-height: 40px !important;
        height: auto !important;
        width: auto !important;
    }
    .navbar-sigpret-logo {
        max-height: 32px !important;
        height: auto !important;
        width: auto !important;
    }
    /* Separator vertical entre logos en móvil: más fino */
    .ttr_menu_logo a > span[style*="width:1px"],
    .ttr_menu_logo a > span[style*="background:rgba(255,255,255,.25)"] {
        height: 26px !important;
    }
    /* Header wrapper: asegurar que el padding-left de 560px del desktop NO aplique */
    #ttr_menu_inner_in {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    /* Orden: navbar-header (botón) primero, luego logo, luego menú */
    .navbar-header { order: 1; }
    .ttr_images_container { order: 2; }
    .menu-center.navbar-collapse { order: 3; }
    #navigationmenu {
        display: flex !important;
        flex-direction: column !important;
    }
    /* Evitar que el sidebar sticky se rompa en móvil */
    .ent-hero-bar {
        padding: 10px 12px;
    }
    .ent-hero-bar > .ent-nav {
        flex-wrap: wrap;
        width: 100%;
        overflow-x: auto;
        scrollbar-width: thin;
    }
    .ent-hero-bar > .ent-nav::-webkit-scrollbar { height: 6px; }
    .ent-hero-bar > .ent-nav::-webkit-scrollbar-thumb { background: var(--borde); border-radius: 3px; }
    .ent-hero-bar-right {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }
    /* Heroes: reducir padding en móvil */
    .ent-hero-top { padding: 14px 16px !important; }
    .ent-hero-title { font-size: 22px !important; line-height: 1.3; }
    .ent-hero-people { flex-wrap: wrap; gap: 6px; }
    /* Breadcrumb compacto */
    .ent-crumb { font-size: 12px; padding: 6px 4px; }
    /* KPI grid: una columna en móvil */
    .ent-kpi-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
    /* Section padding reducido */
    .ent-section { padding: 14px 12px !important; }
}
@media (max-width: 540px) {
    .ent-section { padding: 12px 10px !important; }
    .ent-hero-title { font-size: 19px !important; }
    .ent-section-title { font-size: 15px !important; }
    .ent-form-group.ent-form-cols-2,
    .ent-form-group.ent-form-cols-3 {
        grid-template-columns: 1fr !important;
    }
}

/* =============== Aprobación trimestral: badges en cabecera =============== */
.ent-trim-badges-wrap {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    background: linear-gradient(135deg, rgba(0,61,123,0.05), rgba(173,132,17,0.05));
    border: 1px solid var(--borde-l);
    border-radius: 999px;
    flex: 0 0 auto;
}
.ent-trim-badges-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--azul);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
}
.ent-trim-badges-label .bi { color: var(--dorado); font-size: 13px; }
.ent-trim-badges {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ent-trim-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    transition: transform .15s ease, box-shadow .15s ease;
    border: 2px solid transparent;
    user-select: none;
}
.ent-trim-badge-aprobado {
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #fff;
    border-color: #14532d;
    cursor: pointer;
}
.ent-trim-badge-aprobado:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(22, 163, 74, 0.35);
}
.ent-trim-badge-pendiente {
    background: linear-gradient(135deg, var(--dorado), #8a6a0f);
    color: #fff;
    border-color: #6e520b;
    cursor: pointer;
}
.ent-trim-badge-pendiente:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(173, 132, 17, 0.35);
}
.ent-trim-badge-futuro {
    background: #e5e7eb;
    color: #9ca3af;
    border-color: #d1d5db;
    cursor: default;
}
.ent-trim-badge:focus-visible {
    outline: 2px solid var(--azul);
    outline-offset: 2px;
}

/* =============== Aprobación MIR: botón único anual en cabecera =============== */
.ent-aprob-mir-wrap {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}
.ent-aprob-mir-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid var(--borde-l);
    background: linear-gradient(135deg, rgba(2,57,94,0.06), rgba(122,203,221,0.18));
    font-size: 12.5px;
    font-weight: 700;
    color: var(--azul);
    cursor: pointer;
    transition: transform .12s ease, box-shadow .15s ease, background .15s ease;
    line-height: 1;
    white-space: nowrap;
}
.ent-aprob-mir-btn .bi {
    font-size: 15px;
    color: var(--dorado);
}
.ent-aprob-mir-label {
    text-transform: uppercase;
    letter-spacing: 0.6px;
}
.ent-aprob-mir-estado {
    display: inline-flex;
    align-items: center;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-left: 4px;
    background: #fff;
    color: var(--azul);
    border: 1px solid var(--borde-l);
    text-transform: uppercase;
}
.ent-aprob-mir-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(2, 57, 94, 0.18);
}
.ent-aprob-mir-btn:focus-visible {
    outline: 2px solid var(--azul);
    outline-offset: 2px;
}
.ent-aprob-mir-btn.is-aprobada {
    background: linear-gradient(135deg, rgba(22,163,74,0.12), rgba(34,197,94,0.10));
    color: #14532d;
    border-color: #a7f3d0;
}
.ent-aprob-mir-btn.is-aprobada .bi { color: #16a34a; }
.ent-aprob-mir-btn.is-aprobada .ent-aprob-mir-estado {
    background: #16a34a;
    color: #fff;
    border-color: #15803d;
}
.ent-aprob-mir-btn.is-pendiente {
    background: linear-gradient(135deg, rgba(173,132,17,0.10), rgba(245,158,11,0.10));
    color: #5b3d04;
    border-color: #fde68a;
}
.ent-aprob-mir-btn.is-pendiente .bi { color: var(--dorado); }
.ent-aprob-mir-btn.is-pendiente .ent-aprob-mir-estado {
    background: var(--dorado);
    color: #fff;
    border-color: #8a6a0f;
}
/* Aprobada con observaciones: ambar saturado para diferenciar del verde
   ("aprobada limpia") y del dorado claro ("pendiente"). El chip lateral
   adopta el mismo tono saturado para que el lector entienda de un vistazo
   que la MIR pasa, pero tiene comentarios que la institucion debe atender. */
.ent-aprob-mir-btn.is-con-observaciones {
    background: linear-gradient(135deg, rgba(180,83,9,0.12), rgba(217,119,6,0.10));
    color: #7c2d12;
    border-color: #fdba74;
}
.ent-aprob-mir-btn.is-con-observaciones .bi { color: #b45309; }
.ent-aprob-mir-btn.is-con-observaciones .ent-aprob-mir-estado {
    background: #b45309;
    color: #fff;
    border-color: #92400e;
}
@media (max-width: 600px) {
    .ent-aprob-mir-btn { padding: 6px 12px; font-size: 11.5px; }
    .ent-aprob-mir-label { display: none; }
    .ent-aprob-mir-estado { font-size: 10px; padding: 2px 8px; }
}

/* =============== Ficha del indicador (grid moderno) =============== */
.ent-ficha-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 18px 4px 4px;
}
@media (max-width: 960px) {
    .ent-ficha-grid { grid-template-columns: 1fr; }
}
.ent-ficha-col {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}
.ent-ficha-col + .ent-ficha-col {
    padding-left: 24px;
    border-left: 2px solid var(--borde-l);
}
@media (max-width: 960px) {
    .ent-ficha-col + .ent-ficha-col { padding-left: 0; border-left: 0; border-top: 2px solid var(--borde-l); padding-top: 18px; }
}
.ent-ficha-subtitle {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: var(--azul);
    margin: 0 0 4px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--dorado);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
}
.ent-ficha-subtitle .bi { color: var(--dorado); font-size: 15px; }
.ent-ficha-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 10px 14px;
    background: #fafbff;
    border-radius: 8px;
    border: 1px solid var(--borde-l);
}
.ent-ficha-item-wide { grid-column: 1 / -1; }
.ent-ficha-label {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--azul);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ent-ficha-label .bi { color: var(--dorado); font-size: 14px; }
.ent-ficha-value {
    font-size: 14.5px;
    color: var(--texto);
    line-height: 1.5;
    word-break: break-word;
}
.ent-ficha-empty {
    color: var(--texto-l);
    font-style: italic;
    font-size: 13.5px;
}
.ent-ficha-formula {
    font-family: 'SF Mono', ui-monospace, Monaco, monospace;
    font-size: 13.5px;
    background: #fff;
    padding: 8px 10px;
    border-radius: 6px;
    border: 1px solid var(--borde-l);
    color: var(--azul-d);
}
.ent-ficha-person {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--azul);
    text-decoration: none;
    padding: 6px 10px;
    background: #fff;
    border: 1px solid var(--borde-l);
    border-radius: 8px;
    transition: border-color .15s ease, background .15s ease;
    max-width: fit-content;
}
.ent-ficha-person:hover {
    border-color: var(--azul);
    background: rgba(0, 61, 123, 0.04);
    color: var(--azul-d);
}
.ent-ficha-person .bi { color: var(--dorado); font-size: 18px; }
.ent-ficha-attrs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 4px;
}
@media (max-width: 540px) {
    .ent-ficha-attrs { grid-template-columns: 1fr; }
}
.ent-ficha-attr {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
    border: 1px solid var(--borde-l);
    border-radius: 8px;
    background: #fff;
    transition: border-color .15s ease;
}
.ent-ficha-attr:hover { border-color: var(--dorado); }
.ent-ficha-attr-wide { grid-column: 1 / -1; }
.ent-ficha-attr-label {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--azul);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.ent-ficha-attr-value {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13.5px;
    color: var(--texto);
}
.ent-ficha-attr-value .ent-chip { padding: 3px 9px; font-size: 12px; }

/* =============== Presupuesto accordion =============== */
.ent-pres-accordion { display: flex; flex-direction: column; gap: 10px; }
.ent-pres-programa {
    border: 1.5px solid var(--borde);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ent-pres-programa:hover { border-color: var(--azul); }
.ent-pres-programa.open { box-shadow: 0 6px 14px rgba(0,61,123,0.08); }
.ent-pres-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px 160px 160px 120px 28px;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    cursor: pointer;
    user-select: none;
    transition: background .15s ease;
}
.ent-pres-header:hover { background: rgba(0,61,123,0.03); }
.ent-pres-header-lvl1 {
    background: linear-gradient(135deg, var(--azul) 0%, var(--azul-d) 100%);
    color: #fff;
}
.ent-pres-header-lvl1:hover { background: linear-gradient(135deg, var(--azul-d) 0%, var(--azul) 100%); }
.ent-pres-header-lvl2 {
    background: linear-gradient(135deg, #f6efde 0%, #ede0c2 100%);
    color: var(--azul-d);
}
.ent-pres-header-lvl2:hover { background: linear-gradient(135deg, #ede0c2 0%, #e2d3a8 100%); }
.ent-pres-header-lvl3 {
    background: #f4f6fb;
    color: var(--azul);
    border-top: 1px solid var(--borde-l);
}
.ent-pres-header-lvl3:hover { background: #eaeef5; }
.ent-pres-header-title {
    font-family: 'Poppins', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 14.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.ent-pres-header-lvl2 .ent-pres-header-title,
.ent-pres-header-lvl3 .ent-pres-header-title {
    font-size: 13.5px;
}
.ent-pres-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    border-radius: 6px;
    background: rgba(255,255,255,0.2);
    color: #fff;
    flex-shrink: 0;
}
.ent-pres-header-lvl2 .ent-pres-tag {
    background: rgba(0, 61, 123, 0.1);
    color: var(--azul-d);
}
.ent-pres-header-lvl3 .ent-pres-tag {
    background: rgba(173, 132, 17, 0.12);
    color: var(--dorado);
}
.ent-pres-monto {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 13.5px;
    font-weight: 600;
    white-space: nowrap;
}
.ent-pres-porcentaje {
    text-align: right;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.ent-pres-chev {
    transition: transform .2s ease;
    font-size: 14px;
    opacity: 0.85;
}
.ent-pres-header.open .ent-pres-chev,
[aria-expanded="true"] .ent-pres-chev { transform: rotate(180deg); }
.ent-pres-body { display: none; background: #fff; }
.ent-pres-body.show { display: block; }
.ent-pres-body-inner { padding: 0; }
.ent-pres-body-inner .ent-pres-programa { border-radius: 0; border-left: 0; border-right: 0; border-top: 0; }
.ent-pres-body-inner .ent-pres-programa:last-child { border-bottom: 0; }
.ent-pres-tabla-obj { width: 100%; border-collapse: collapse; }
.ent-pres-tabla-obj thead th {
    background: #fafbff;
    color: var(--azul);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 8px 14px;
    border-bottom: 2px solid var(--dorado);
}
.ent-pres-tabla-obj tbody td {
    padding: 8px 14px;
    font-size: 13px;
    border-bottom: 1px solid var(--borde-l);
    vertical-align: middle;
}
.ent-pres-tabla-obj tbody td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ent-pres-tabla-obj tbody tr:last-child td { border-bottom: 0; }
.ent-pres-tabla-obj tbody tr:hover td { background: #fafbff; }
.ent-pres-cols-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px 160px 160px 120px 28px;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: #fafbff;
    border-bottom: 2px solid var(--dorado);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--azul);
}
.ent-pres-cols-head > div { text-align: right; }
.ent-pres-cols-head > div:first-child { text-align: left; }
.ent-pres-total {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px 160px 160px 120px 28px;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(0,61,123,0.06), rgba(173,132,17,0.06));
    border-top: 2px solid var(--dorado);
    font-weight: 700;
    color: var(--azul);
    font-size: 14px;
}
.ent-pres-empty {
    padding: 40px 20px;
    text-align: center;
    color: var(--texto-l);
    background: #fafbff;
    border: 1.5px dashed var(--borde);
    border-radius: 10px;
    font-style: italic;
}
@media (max-width: 900px) {
    .ent-pres-header, .ent-pres-cols-head, .ent-pres-total {
        grid-template-columns: 1fr 1fr;
    }
    .ent-pres-header-title, .ent-pres-cols-head > div:first-child { grid-column: 1 / -1; }
}

/* =============== Leyenda de iconos =============== */
.ent-leyenda {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    padding: 10px 14px;
    background: linear-gradient(135deg, rgba(0,61,123,0.03), rgba(173,132,17,0.03));
    border: 1px solid var(--borde-l);
    border-radius: 8px;
    margin: 10px 0 14px;
    font-size: 12.5px;
    color: var(--texto);
}
.ent-leyenda-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.3;
}
.ent-leyenda-item .ent-ind-badge {
    flex-shrink: 0;
    margin: 0;
}
.ent-leyenda-item-label { font-weight: 500; color: var(--texto); }
.ent-leyenda-title {
    font-weight: 700;
    color: var(--azul);
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-right: 4px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* === FIN ENT MODULE V2 === */
