/* =====================================================================
   Colmena — Identidad Corporativa (portal Gobierno TI)
   Fuente de verdad: www.colmena.cl → azul Colmena #0077C8, azul profundo
   #265C8E, grises cálidos, tipografía Bliss Pro (respaldo Source Sans 3),
   formas rectas (radio 4–8 px), mucho blanco.
   Esta hoja fija los tokens y la piel del tema; el motor brand-engine.js
   re-mapea los colores literales de los plugins hacia estos tokens.
   ===================================================================== */

:root {
	/* Marca */
	--col-azul: #0077C8;
	--col-azul-hover: #0068B0;
	--col-azul-oscuro: #005A99;
	--col-azul-profundo: #265C8E;
	--col-azul-noche: #123F66;
	--col-celeste: #E8F3FB;
	--col-celeste-borde: #BFDCF1;
	/* Neutros cálidos (colmena.cl) */
	--col-texto: #4A4A4A;
	--col-texto-fuerte: #333333;
	--col-texto-suave: #727272;
	--col-texto-tenue: #9E9E9E;
	--col-borde: #E1E4E8;
	--col-borde-fuerte: #CECFD1;
	--col-fondo: #F5F7F9;
	--col-superficie: #FFFFFF;
	/* Semánticos (se conservan en todo el sitio) */
	--col-ok: #2E9E5B;
	--col-warn: #E39B0E;
	--col-bad: #D64545;
	/* Forma y tipografía */
	--col-radio: 8px;
	--col-radio-sm: 4px;
	--col-fuente: "Bliss Pro", "BlissPro", "Source Sans 3", "Segoe UI", Arial, sans-serif;

	/* Puente hacia las variables globales del tema Astra */
	--ast-global-color-0: var(--col-azul) !important;
	--ast-global-color-1: var(--col-azul-hover) !important;
	--ast-global-color-2: var(--col-azul-profundo) !important;
	--ast-global-color-3: var(--col-texto) !important;
	--ast-global-color-5: var(--col-fondo) !important;
	--ast-global-color-7: var(--col-borde-fuerte) !important;
}

/* ---------- Tipografía corporativa en todo el sitio ---------- */
html, body,
body *:not(i):not(.dashicons):not([class*="fa-"]):not(code):not(pre):not(kbd):not(samp):not(.material-icons):not(#wpadminbar):not(#wpadminbar *) {
	font-family: var(--col-fuente) !important;
}
body { color: var(--col-texto); background-color: var(--col-fondo); }

/* Titulares al estilo colmena.cl: azul, peso contenido, sin condensar en exceso */
h1, h2, h3, h4, h5, h6,
.entry-title, .site-title {
	color: var(--col-azul-profundo);
	letter-spacing: -0.01em;
}
h1 { font-weight: 600; }
h2, h3 { font-weight: 600; }
.entry-content h2, .entry-content h3 { color: var(--col-azul-profundo); }

a { color: var(--col-azul); }
a:hover { color: var(--col-azul-hover); }

/* ---------- Encabezado del sitio ---------- */
.site-header, .ast-primary-header-bar, #masthead { background: #fff; border-bottom: 1px solid var(--col-borde); }
.site-title a, .site-title { color: var(--col-azul) !important; font-weight: 700; }
.main-header-menu .menu-link, .main-header-menu a { color: var(--col-texto-fuerte) !important; font-weight: 600; letter-spacing: 0.01em; }
.main-header-menu .current-menu-item > .menu-link,
.main-header-menu .current-menu-ancestor > .menu-link,
.main-header-menu .menu-link:hover { color: var(--col-azul) !important; background: var(--col-celeste) !important; border-radius: var(--col-radio-sm); }

/* ---------- Botones del tema y de bloques ---------- */
.ast-button, .wp-block-button__link, button.button, input[type="submit"], .button.button-primary,
.entry-content a.button, .entry-content a.btn, .entry-content a[class*="cta"] {
	background: var(--col-azul) !important; background-image: none !important; color: #fff !important;
	border: 1px solid var(--col-azul) !important; border-radius: var(--col-radio-sm) !important;
	font-weight: 700 !important; box-shadow: none !important;
}
.ast-button:hover, .wp-block-button__link:hover, button.button:hover, input[type="submit"]:hover, .entry-content a.button:hover {
	background: var(--col-azul-hover) !important; border-color: var(--col-azul-hover) !important; color: #fff !important;
}
.is-style-outline .wp-block-button__link, .entry-content a.button.is-outline {
	background: #fff !important; color: var(--col-azul) !important; border: 1px solid var(--col-azul) !important;
}

/* ---------- Pie de página ---------- */
.site-footer, footer.site-footer, .ast-footer-row { background: var(--col-azul) !important; color: rgba(255,255,255,.9) !important; }
.site-footer a, .site-footer .ast-footer-copyright, .site-footer p { color: #fff !important; }

/* ---------- Página /kpi/ (hub corporativo) ---------- */
.col-hub { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin: 8px 0 24px; }
.col-hub-intro { color: var(--col-texto-suave); max-width: 72ch; margin-bottom: 18px; font-size: 15px; }
.col-card { background: #fff; border: 1px solid var(--col-borde); border-radius: var(--col-radio); padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; border-top: 3px solid var(--col-azul); box-shadow: 0 1px 2px rgba(38,92,142,.06); }
.col-card h3 { margin: 0; font-size: 19px; color: var(--col-azul-profundo); font-weight: 600; }
.col-card p { margin: 0; color: var(--col-texto-suave); font-size: 14px; line-height: 1.5; flex: 1; }
.col-card .col-fuente { font-size: 12px; color: var(--col-texto-tenue); }
.col-card a.col-btn { align-self: flex-start; margin-top: 6px; display: inline-block; padding: 9px 16px; border-radius: var(--col-radio-sm); border: 1px solid var(--col-azul); color: var(--col-azul); background: #fff; font-weight: 700; text-decoration: none; }
.col-card a.col-btn:hover { background: var(--col-azul); color: #fff; }
.col-card a.col-btn.col-btn-solido { background: var(--col-azul); color: #fff; }
.col-card a.col-btn.col-btn-solido:hover { background: var(--col-azul-hover); }
/* v1.6.2 (auditoría 360, R5): el azul de marca (#0077C8) sobre el celeste de
   marca (#E8F3FB) da 4,17:1 — bajo el 4,5:1 de WCAG AA para texto de 11px.
   Mismo tono Colmena, un paso más oscuro: 5,65:1. */
.col-eyebrow { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #0062A6; background: var(--col-celeste); border: 1px solid var(--col-celeste-borde); border-radius: var(--col-radio-sm); padding: 3px 10px; margin-bottom: 10px; }
.col-hub-historico { margin-top: 8px; padding: 14px 18px; border: 1px dashed var(--col-borde-fuerte); border-radius: var(--col-radio); color: var(--col-texto-suave); font-size: 14px; background: #fff; }

/* ---------- Ajustes finos a componentes propios (Gestor de Proyectos) ---------- */
.gp-panel {
	--gp-navy: var(--col-azul-profundo);
	--gp-ink: var(--col-texto-fuerte);
	--gp-muted: var(--col-texto-suave);
	--gp-faint: var(--col-texto-tenue);
	--gp-line: var(--col-borde);
	--gp-line-strong: var(--col-borde-fuerte);
	--gp-canvas: var(--col-fondo);
	--gp-accent: var(--col-azul);
	--gp-accent-bg: var(--col-celeste);
	--gp-ok: var(--col-ok); --gp-ok-bg: #E8F5EE;
	--gp-warn: var(--col-warn); --gp-warn-bg: #FCF3DF;
	--gp-bad: var(--col-bad); --gp-bad-bg: #FBE9E9;
	--gp-radius: var(--col-radio);
	--gp-radius-sm: var(--col-radio-sm);
}
.gp-global-titulo { background: var(--col-azul) !important; }
.gp-chip-activo { background: var(--col-azul) !important; border-color: var(--col-azul) !important; }

/* ---------- Layout: ancho completo fluido en todo el sitio (decisión 08-09-2026) ----------
   Portal de trabajo con tableros y grillas: se usa todo el ancho, con tope de 1760 px en
   pantallas gigantes y márgenes fluidos. Cabecera y contenido comparten los mismos bordes. */
:root { --col-ancho-max: 1760px; --col-gutter: clamp(16px, 2.6vw, 44px); }
.pgti-topbar__inner, .site-header .ast-container, .ast-primary-header-bar .ast-container {
	max-width: var(--col-ancho-max) !important; width: 100%;
	padding-left: var(--col-gutter) !important; padding-right: var(--col-gutter) !important; box-sizing: border-box;
}
main.pgti-page, .site-content .ast-container {
	max-width: none !important; width: 100%;
	padding-left: var(--col-gutter) !important; padding-right: var(--col-gutter) !important; box-sizing: border-box;
}
main.pgti-page > *, .site-content .ast-container > * {
	max-width: var(--col-ancho-max) !important; width: 100%;
	margin-left: auto !important; margin-right: auto !important; box-sizing: border-box;
}
/* Guardas responsive: nada debe desbordar horizontalmente */
html, body { overflow-x: clip; }
main.pgti-page img, main.pgti-page svg, main.pgti-page video, main.pgti-page iframe { max-width: 100%; }
main.pgti-page table { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 782px) {
	:root { --col-gutter: 14px; }
	.gp-panel .gp-kanban, .col-hub { grid-template-columns: 1fr !important; }
}

/* ---------- Simetría de grillas: filas de KPIs completas, sin huérfanos ----------
   Los dashboards traían grillas fijas de 4 columnas con 5–7 tiles (fila incompleta).
   auto-fit reparte los tiles existentes en una sola fila pareja al ancho disponible. */
.cjd-ve-kpis, .cjd-res-tiles, .cjd-ini-summary, .cjd-gc-global-kpis {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
}
.ceq-dirs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (max-width: 1100px) { .ceq-dirs { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important; } }

/* ---------- Encabezado estándar de página (mismo relato en todas las secciones) ---------- */
.col-eyebrow { width: auto !important; }
.col-page-head { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 18px 0 22px; }
.col-page-head .col-eyebrow { margin-bottom: 2px; }
.col-page-head .col-eyebrow::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--col-ok); margin-right: 7px; vertical-align: 1px; }
.col-page-head h1 { margin: 0; font-size: clamp(26px, 2.2vw, 34px); line-height: 1.15; color: var(--col-azul-profundo); font-weight: 700; }
.col-page-head p { margin: 0; color: var(--col-texto-suave); font-size: 15px; max-width: 80ch; }

/* ---------- Relato único v1.3.0: espejo de cifras, alertas y utilitarios ---------- */
.col-cifras { margin: 0 0 26px; padding: 16px 18px 18px; background: #fff; border: 1px solid var(--col-borde); border-top: 3px solid var(--col-azul); border-radius: var(--col-radio); }
.col-cifras-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 12px; }
.col-cifras-head .col-eyebrow { margin-bottom: 0; }
.col-cifras-fuente { font-size: 12px; color: var(--col-texto-tenue); }
.col-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.col-tile { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; background: var(--col-fondo); border: 1px solid var(--col-borde); border-radius: var(--col-radio-sm); text-decoration: none !important; color: inherit; transition: border-color .15s, box-shadow .15s; min-height: 92px; box-sizing: border-box; }
.col-tile:hover { border-color: var(--col-azul); box-shadow: 0 2px 8px rgba(0,119,200,.12); }
.col-live-v { font-size: clamp(26px, 2vw, 32px); line-height: 1.05; font-weight: 700; color: var(--col-azul-profundo); font-variant-numeric: tabular-nums; }
.col-live-v.col-live-cargando { color: var(--col-texto-tenue); }
.col-live-v.col-live-bad { color: var(--col-bad); }
.col-live-v.col-live-warn { color: var(--col-warn); }
.col-live-v.col-live-ok { color: var(--col-ok); }
.col-tile-l { font-size: 13px; font-weight: 600; color: var(--col-texto-fuerte); line-height: 1.3; }
.col-live-s { font-size: 12px; color: var(--col-texto-suave); line-height: 1.3; }
.col-live-s:empty { display: none; }
.col-alerta { display: flex; align-items: flex-start; gap: 10px; padding: 12px 16px; margin: 0 0 18px; border-radius: var(--col-radio-sm); border: 1px solid var(--col-borde); background: #fff; font-size: 14px; line-height: 1.45; color: var(--col-texto-fuerte); }
.col-alerta a { color: inherit; font-weight: 700; }
.col-alerta.col-alerta-bad { border-color: #F1B9B9; background: #FBE9E9; border-left: 4px solid var(--col-bad); }
.col-alerta.col-alerta-warn { border-color: #F1D9A6; background: #FCF3DF; border-left: 4px solid var(--col-warn); }
.col-alerta strong { font-weight: 700; }
.col-utilitario { margin: 28px 0 0; padding-top: 14px; border-top: 1px dashed var(--col-borde-fuerte); color: var(--col-texto-suave); font-size: 14px; }
.col-utilitario a { color: var(--col-azul); font-weight: 600; text-decoration: none; }
.col-utilitario a:hover { text-decoration: underline; }
.col-nota-metodo { margin-top: 18px !important; }
/* Resumen Ejecutivo: el título nativo duplica el encabezado estándar */
.cjd-resumen .cjd-res-h, .cjd-resumen .cjd-res-sub, .cjd-res-h, .cjd-res-sub { display: none !important; }
/* Portada: consola de cifras vivas y capítulos del relato */
.pgti-console .col-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pgti-console .col-tile { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: #fff; min-height: 84px; padding: 12px 14px; }
.pgti-console .col-tile:hover { border-color: rgba(255,255,255,.55); box-shadow: none; }
.pgti-console .col-live-v { color: #fff; font-size: clamp(22px, 1.8vw, 28px); }
.pgti-console .col-live-v.col-live-bad { color: #FFB3B3; }
.pgti-console .col-live-v.col-live-warn { color: #FFD98A; }
.pgti-console .col-live-v.col-live-ok { color: #9FE3B8; }
.pgti-console .col-tile-l, .pgti-console .col-live-s { color: rgba(255,255,255,.85); }
.pgti-console .col-live-s { color: rgba(255,255,255,.6); }
.col-console-pie { font-size: 12px; color: rgba(255,255,255,.65); margin-top: 10px; }
@media (max-width: 480px) { .pgti-console .col-tiles { grid-template-columns: 1fr; } }
.col-tile.col-live-vacio .col-live-v { color: var(--col-texto-tenue); }