:root {
  --superficie: #fcfcfb;
  --fondo: #f4f3ef;
  --texto: #0b0b0b;
  --texto-2: #52514e;
  --texto-3: #8a8984;
  --borde: #e4e3de;
  --azul: #2a78d6;
  --critico: #d03b3b;
  --advertencia: #b07800;
  --bien: #0a7f0a;
}
body { background: var(--fondo); color: var(--texto); font-family: Inter, system-ui, sans-serif; }

.barra { background: #0d366b; padding: 10px 20px; }
.barra .marca { color: #fff; font-weight: 600; font-size: 1.05rem; letter-spacing: .2px; }
.barra .marca small { color: #9ec5f4; font-weight: 400; margin-left: 8px; }
.barra .nav-link { color: #cde2fb !important; font-size: .92rem; padding: 6px 12px !important; border-radius: 6px; }
.barra .nav-link.active, .barra .nav-link:hover { background: rgba(255,255,255,.12); color: #fff !important; }
.sello { background: rgba(255,255,255,.12); color: #fff; border-radius: 999px; padding: 3px 12px; font-size: .8rem; }

.contenido { padding: 18px 20px 40px; max-width: 1500px; margin: 0 auto; }
.pagina-titulo { font-size: 1.35rem; font-weight: 600; margin: 4px 0 2px; }
.pagina-sub { color: var(--texto-2); margin-bottom: 14px; font-size: .93rem; }

.tarjeta { background: var(--superficie); border: 1px solid var(--borde); border-radius: 10px; padding: 14px 16px; height: 100%; }
.tarjeta h6 { font-size: .8rem; text-transform: uppercase; letter-spacing: .5px; color: var(--texto-2); margin-bottom: 8px; font-weight: 600; }

.kpi { background: var(--superficie); border: 1px solid var(--borde); border-radius: 10px; padding: 12px 16px; height: 100%; }
.kpi .etq { font-size: .78rem; color: var(--texto-2); text-transform: uppercase; letter-spacing: .4px; }
.kpi .val { font-size: 1.65rem; font-weight: 650; line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi .det { font-size: .8rem; color: var(--texto-3); }
.sube { color: var(--bien); } .baja { color: var(--critico); }

.filtros { background: var(--superficie); border: 1px solid var(--borde); border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
.filtros label { font-size: .78rem; color: var(--texto-2); margin-bottom: 2px; font-weight: 600; }

.ficha-titulo { font-size: 1.15rem; font-weight: 650; }
.ficha-dato { display: flex; justify-content: space-between; border-bottom: 1px dashed var(--borde); padding: 4px 0; font-size: .9rem; }
.ficha-dato span:last-child { font-weight: 600; font-variant-numeric: tabular-nums; }
.pista { color: var(--texto-3); font-size: .85rem; }

.etiqueta-estado { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 2px 10px; font-size: .8rem; font-weight: 600; }
.est-alta, .est-error { background: #fbe9e9; color: var(--critico); }
.est-media { background: #fff4dc; color: var(--advertencia); }
.est-ok { background: #e6f5e6; color: var(--bien); }

.nota { background: #eef5fd; border-left: 3px solid var(--azul); padding: 8px 12px; border-radius: 6px; font-size: .88rem; color: var(--texto-2); }
.dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner th { background: #f1f0ec !important; font-weight: 600; }

/* ---------- Alineamiento con el Plan Estratégico ---------- */
.nav-oei { display:inline-block; margin-left:6px; font-size:.68rem; font-weight:700; background:rgba(255,255,255,.16);
           color:#cde2fb; border-radius:999px; padding:1px 7px; vertical-align:middle; }
.encabezado-oei { margin-bottom:14px; }
.encabezado-oei .pagina-titulo { font-size:1.55rem; margin-top:6px; }
.objetivo-texto { color:var(--texto-2); font-size:.85rem; margin-left:8px; }
.chip-oei { display:inline-block; background:#0d366b; color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.3px;
            border-radius:6px; padding:2px 8px; }
.chip-decision { display:inline-block; background:#eef5fd; color:#184f95; font-size:.78rem; border-radius:6px; padding:2px 9px; }
.bloque { margin-bottom:0; }
.bloque-cab { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:6px; }
.bloque-pregunta { font-size:1.02rem; font-weight:650; color:var(--texto); line-height:1.3; max-width:640px; }
.bloque-chips { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.lectura { border-top:1px dashed var(--borde); margin-top:8px; padding-top:8px; font-size:.9rem; color:#2d2c29; }
.lectura b { color:var(--azul); }
.seccion-titulo { font-weight:650; font-size:1.15rem; }

.mision h6 { color:var(--azul); } .mision p { margin:0; font-size:.92rem; color:#2d2c29; font-style:italic; }
.decisiones { margin-top:14px; border-left:4px solid var(--azul); }
.decisiones ol { margin:0; padding-left:20px; } .decisiones li { margin-bottom:8px; font-size:.95rem; line-height:1.45; }
.enlace-oei { font-size:.82rem; font-weight:600; color:var(--azul); text-decoration:none; white-space:nowrap; }

.perspectiva { margin-bottom:12px; }
.perspectiva-titulo { font-size:.78rem; text-transform:uppercase; letter-spacing:.6px; font-weight:700; color:var(--texto-2); margin:6px 0; }
.oei-grilla { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:10px; }
.oei { background:var(--superficie); border:1px solid var(--borde); border-radius:10px; padding:12px 14px; border-top:4px solid #c9c8c2;
       display:flex; flex-direction:column; gap:6px; }
.oei-mide { border-top-color:#0ca30c; } .oei-aprox { border-top-color:#e3a72f; } .oei-no { opacity:.75; }
.oei-cab { display:flex; justify-content:space-between; align-items:center; }
.oei-num { font-weight:750; color:#0d366b; }
.oei-nombre { font-weight:650; font-size:.93rem; line-height:1.3; }
.oei-meta { font-size:.8rem; color:var(--texto-2); }
.oei-aporte { font-size:.85rem; color:#2d2c29; flex:1; }
.est-gris { background:#efeeea; color:#6b6a66; }

.visor-log { background:#14161a; color:#d6dae0; border-radius:8px; padding:10px 12px; font-size:12px; line-height:1.5;
             max-height:420px; overflow:auto; white-space:pre-wrap; margin:0; font-family:ui-monospace, Menlo, monospace; }
.visor-log.comando { max-height:none; color:#9ec5f4; }
.log-error { color:#ff8a8a; font-weight:600; } .log-warn { color:#fab219; } .log-fin { color:#7fd17f; }
.pestanas .tab { padding:6px 12px !important; }
.bloque { overflow:hidden; }

/* Controles de MapLibre (Plotly no incluye su hoja de estilos): atribución dentro del mapa, abajo a la derecha */
.maplibregl-map { position: relative; }
.maplibregl-ctrl-bottom-right, .maplibregl-ctrl-bottom-left { position: absolute; bottom: 0; z-index: 2; pointer-events: none; }
.maplibregl-ctrl-bottom-right { right: 0; } .maplibregl-ctrl-bottom-left { left: 0; }
.maplibregl-ctrl-top-right, .maplibregl-ctrl-top-left { position: absolute; top: 0; z-index: 2; }
.maplibregl-ctrl-attrib { pointer-events: auto; background: rgba(255,255,255,.75); font-size: 10px; padding: 0 5px; }
.maplibregl-ctrl-attrib-button { display: none; }

/* Logos */
.logo-barra { width: 34px; height: 34px; border-radius: 50%; background: #fff; padding: 2px; }
.marca:hover { color: #fff; }
.logo-pie { height: 38px; }
.pie { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; max-width: 1500px; margin: 10px auto 30px;
       padding: 16px 20px; border-top: 1px solid var(--borde); color: var(--texto-3); font-size: .8rem; }
.logo-inicio { height: 56px; margin-bottom: 10px; }
