/* ============================================================
   Gerencia v2 — zip #6 · tanda 2 (16-oct-2026): las seis lecturas (TEXTOS_tanda2 «Común de las lecturas»; medidas de
   Gerencia v2.dc.html g03…g09, extraídas en traspasos\zip6_t2\dibujo_g0N.md). SOLO la paleta de TEXTOS L9 (la misma de
   admin-gerencia.css). Prefijo `gl-`, dentro de `.cs-main.ger`. En la web (≥ 861 px) las rejillas del dibujo; entre 861 y
   1100 px las cinco cifras pasan a tres y las dos columnas bajan a una (no caben sin desbordar); en el teléfono (≤ 860 px) una
   columna y la rejilla de cifras a dos: a 375 px nada pasa de su ancho.
   ============================================================ */
.gl { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.gl--tel { gap: 12px; }

/* ---------- Cabecera (Común) ---------- */
.gl-cab { display: flex; align-items: center; gap: 12px; min-width: 0; }
.gl-cab__t { flex: 1; min-width: 0; }
.ger .gl-cab__pre { margin: 0 0 3px; font-size: 13px; line-height: 1.4; color: #8A8574; }
.gl-h1 { font-family: var(--font-display, inherit); font-size: 26px; line-height: 1.2; font-weight: 800; color: #304D45; letter-spacing: -0.01em; }
.gl--tel .gl-cab { gap: 8px; }
.ger .gl--tel .gl-cab__pre { font-size: 12.5px; margin: 0 0 2px; }
.gl--tel .gl-h1 { font-size: 22px; }
.gl-sel--fijo { padding: 0 14px 0 38px; font-size: 13px; font-weight: 600; color: #304D45; white-space: nowrap; }
.gl-sel--tel { height: 36px; }
.gl-sel--tel select { padding: 0 28px 0 10px; font-size: 12px; }
.gl-sel--tel .ger-sel__fl { right: 10px; }
.gl-exp { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 10px; background: #3C7E67; color: #fff;
  font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; flex: none; }
.gl-exp--tel { width: 36px; height: 36px; padding: 0; justify-content: center; }
.gl-exp:disabled { opacity: 0.55; cursor: progress; }
.gl-exp:focus-visible, .gl-abrir:focus-visible, .gl-abrir--tel:focus-visible, .gl-enl:focus-visible, .gl-fila--ir:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(60,126,103,0.3); }

/* ---------- Rótulo y textos con tono ---------- */
.gl-rot { font-size: 11px; line-height: 1.4; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; color: #8A8574; }
.gl--tel .gl-rot { font-size: 10.5px; }
.gl-rojo { color: #8E3A31; font-weight: 700; }
.gl-ambar { color: #B8860B; font-weight: 700; }
.gl-verde { color: #3C7E67; font-weight: 700; }
.gl-gris { color: #8A8574; }
.gl-fuerte { color: #27282A; font-weight: 700; }
.gl-placa { font-family: var(--font-mono, ui-monospace, monospace); font-size: 12px; font-weight: 700; color: #55605B; white-space: nowrap; }
.gl-enl { background: none; border: 0; padding: 0; color: #3C7E67; font-weight: 700; cursor: pointer; text-align: left; }

/* ---------- Titular (Común) ---------- */
.gl-tit { background: #fff; border: 1px solid #EAE5D9; border-radius: 14px; padding: 18px 22px; display: flex; align-items: center; gap: 22px; min-width: 0; }
.gl-tit__c { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.gl-tit__n { margin-top: 2px; font-size: 38px; line-height: 1; font-weight: 800; color: #304D45; letter-spacing: -0.02em; white-space: nowrap; }
.gl-tit__der { margin-left: auto; text-align: right; min-width: 0; }
.gl-tit__d1 { font-size: 14px; font-weight: 700; color: #304D45; }
.ger .gl-tit__d2 { margin-top: 2px; font-size: 12.5px; color: #6B6455; }
.gl-tit--tel { flex-direction: column; align-items: stretch; gap: 6px; padding: 14px 16px; }
.gl-tit--tel .gl-tit__n { font-size: 32px; }
.gl-tit__lt { font-size: 12px; color: #6B6455; }
.gl-chip { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 800; white-space: nowrap; flex: none; }
.gl-tit--tel .gl-chip { align-self: flex-start; padding: 4px 10px; font-size: 12px; white-space: normal; }
.gl-chip--bueno { background: #E7EEEB; color: #304D45; }
.gl-chip--bueno svg { color: #3C7E67; }
.gl-chip--malo { background: #FBEEEC; color: #8E3A31; }
.gl-chip--baja { background: #F5EBD3; color: #7A5A08; }
.gl-comp-txt { font-size: 13px; font-weight: 600; color: #8A8574; }
.gl-tit--tel .gl-comp-txt { font-size: 12px; }

/* ---------- Cifras (Común) ---------- */
.gl-cifras { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.gl-cif { background: #fff; border: 1px solid #EAE5D9; border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gl-cif__n { font-size: 22px; line-height: 1.15; font-weight: 800; color: #304D45; letter-spacing: -0.01em; }
.ger .gl-cif__l { font-size: 12px; line-height: 1.4; color: #55605B; }
/* El tono de una línea de cifra (Común: lo que duele #8E3A31 · el enlace #3C7E67 · lo neutro #8A8574; el verde y el ámbar de
   la letra): con más fuerza que `.ger .gl-cif__l` (0,2,0), que sola le ganaba a `.gl-rojo` · `.gl-ambar` · `.gl-verde` ·
   `.gl-gris` · `.gl-enl` (0,1,0) y pintaba todas las líneas #55605B, «Decidir en Hoy →» incluido (pedido 1 de CONTRATO_03). */
.ger .gl-cif__l.gl-rojo { color: #8E3A31; }
.ger .gl-cif__l.gl-ambar { color: #B8860B; }
.ger .gl-cif__l.gl-verde { color: #3C7E67; }
.ger .gl-cif__l.gl-gris { color: #8A8574; }
.ger .gl-cif__l.gl-enl { color: #3C7E67; }
.gl--tel .gl-cifras { grid-template-columns: 1fr 1fr; gap: 8px; }
.gl--tel .gl-cif { padding: 12px 14px; gap: 0; }
.gl--tel .gl-cif__n { font-size: 18px; }
.ger .gl--tel .gl-cif__l { font-size: 11.5px; }
.gl-cif--doble { grid-column: 1 / -1; }

/* ---------- Listas de excepciones (Común) ---------- */
.gl-lista { background: #fff; border: 1px solid #EAE5D9; border-radius: 14px; overflow: hidden; min-width: 0; }
.gl-lista__cab { display: flex; align-items: baseline; gap: 8px; padding: 14px 18px 10px; min-width: 0; }
.gl-lista__t { font-size: 14px; font-weight: 800; color: #304D45; }
.gl-lista__sub { font-size: 12px; color: #8A8574; }
.gl-lista__n { margin-left: auto; font-size: 12px; color: #8A8574; white-space: nowrap; }
.gl-lista__cols { display: grid; gap: 12px; padding: 7px 18px; font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; color: #8A8574;
  border-bottom: 1px solid #F2EFE6; }
.gl-fila { display: grid; gap: 12px; align-items: center; padding: 10px 18px; border-bottom: 1px solid #F2EFE6; min-width: 0; }
.gl-fila:last-of-type { border-bottom: 0; }
.gl-fila--roja { background: #FBEEEC; }
.gl-dos { min-width: 0; }
.gl-dos__1 { font-size: 13.5px; font-weight: 700; color: #304D45; overflow-wrap: anywhere; }
.ger .gl-dos__2 { font-size: 12px; color: #6B6455; overflow-wrap: anywhere; }
.gl-dias { font-size: 13.5px; font-weight: 800; color: #55605B; white-space: nowrap; }
.gl-dias.gl-rojo { color: #8E3A31; }
.gl-dias.gl-ambar { color: #B8860B; }
.gl-num { font-size: 13.5px; font-weight: 700; color: #27282A; white-space: nowrap; }
.gl-pill { justify-self: start; border-radius: 999px; padding: 3px 10px; font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.gl-pill--gris { background: #ECE9E0; color: #6B6455; }
.gl-pill--ambar { background: #F5EBD3; color: #7A5A08; }
.gl-pill--rojo { background: #FBEEEC; color: #8E3A31; }
.gl-pill--verde { background: #E7EEEB; color: #304D45; }
.gl-pill--vencido { background: #B4322A; color: #fff; }
.gl-lista__pie { display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-top: 1px solid #F2EFE6; background: #F7F5EF; }
.gl-lista__mas { flex: 1; font-size: 12.5px; color: #8A8574; }
.gl-abrir { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid #DDD9CC; color: #304D45; border-radius: 9px; padding: 8px 14px;
  font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.gl-abrir:hover { background: #F7F5EF; }
.gl-abrir--tel { font-size: 12px; font-weight: 700; color: #3C7E67; text-decoration: none; white-space: nowrap; }
.gl-lista--tel .gl-lista__cab { padding: 12px 14px 8px; }
.gl-lista--tel .gl-lista__t { font-size: 13.5px; }
.gl-lista--tel .gl-fila { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 0; border-top: 1px solid #F2EFE6; }
.gl-lista--tel .gl-lista__pie { padding: 10px 14px; }
.gl-lista--tel .gl-lista__mas { font-size: 12px; }

/* ---------- Pie, estados ---------- */
.gl-corte { font-size: 12px; color: #8A8574; }
.gl-sk { display: flex; flex-direction: column; gap: 12px; }
.cs-main .gl-sk .a-skel.gl-sk__b { margin: 0; }
.gl-caida { flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.gl-nocargo { padding: 14px 16px; border-radius: 12px; }

/* ---------- Rejillas de dos columnas (las lecturas las usan con su ancho del dibujo) ---------- */
.gl-dos-col { display: grid; gap: 12px; align-items: start; min-width: 0; }
.gl-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

@media (max-width: 1100px) {
  .gl:not(.gl--tel) .gl-cifras { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gl:not(.gl--tel) .gl-dos-col { grid-template-columns: minmax(0, 1fr) !important; }
  .gl-tit { flex-wrap: wrap; }
}