/* ═══════════════════════════════════════════════════════════════════════════
   v1.87 · La región «Hoja de cálculo»: Excel, LibreOffice y CSV dentro de la
   hoja (js/regions/hojacalc-region.js)
   ═══════════════════════════════════════════════════════════════════════════ */
.esci-hojacalc > .esci-body { display: flex; flex-direction: column; height: 100%; min-height: 0; padding: 0; }
.esci-hc-barra { display: flex; align-items: center; gap: 4px; padding: 4px 6px; border-bottom: 1px solid var(--line-soft); background: var(--chassis); flex: none; min-width: 0; }
.esci-hc-logo { color: #1d7a46; font-size: 13px; margin: 0 2px 0 4px; }
.esci-hc-nombre { font-size: var(--fs-ui-sm); font-weight: 600; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.esci-hc-info { flex: none; font-size: var(--fs-label); color: var(--ink-4); white-space: nowrap; }
.esci-hc-hueco { flex: 1; }
.esci-hc-barra .esci-ibtn { min-width: 28px; height: 28px; gap: 4px; }
.esci-hc-bt { font-size: var(--fs-label); }
.esci-hojacalc.sin-libro .esci-hc-barra .esci-ibtn { display: none; }
.esci-hojacalc.leyendo .esci-hc-cuerpo { opacity: .5; cursor: progress; }

/* la fila del rango y del contenido de la celda */
.esci-hc-fila { display: flex; align-items: center; gap: 6px; padding: 3px 6px; border-bottom: 1px solid var(--line-soft); background: var(--surface); flex: none; min-width: 0; }
.esci-hc-fila[hidden] { display: none; }
.esci-hc-caja { width: 150px; flex: none; height: 24px; padding: 0 6px; border: 1px solid var(--line); border-radius: 4px; background: var(--paper); color: var(--ink); font-family: var(--mono); font-size: var(--fs-label); }
.esci-hc-caja:focus { border-color: var(--accent); outline: none; box-shadow: 0 0 0 2px var(--accent-ring); }
.esci-hc-fxi { color: var(--ink-4); font-style: italic; font-size: var(--fs-label); flex: none; }
.esci-hc-fx { flex: 1; min-width: 0; font-family: var(--mono); font-size: var(--fs-label); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esci-hc-formula { color: #1d7a46; }
.esci-hc-nota { color: var(--ink-4); font-family: var(--sans, inherit); }

/* la rejilla (solo se pintan las filas que se ven) */
.esci-hc-cuerpo { position: relative; flex: 1; min-height: 60px; background: var(--paper); }
.esci-hc-rejilla { position: absolute; inset: 0; overflow: auto; outline: none; cursor: cell; }
.esci-hc-rejilla[hidden] { display: none; }
.esci-hc-rejilla:focus-visible { box-shadow: inset 0 0 0 2px var(--accent-ring); }
.esci-hc-lienzo { position: relative; }
.esci-hc-tabla { position: absolute; left: 0; top: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 13px; font-family: var(--mono); color: var(--ink); user-select: none; }
.esci-hc-tabla td, .esci-hc-tabla th { height: 24px; box-sizing: border-box; padding: 0 5px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 23px; }
.esci-hc-tabla thead th { position: sticky; top: 0; z-index: 2; background: var(--chassis); color: var(--ink-3); font-weight: 600; text-align: center; font-family: var(--sans, inherit); font-size: var(--fs-label); cursor: s-resize; }
.esci-hc-tabla th.esci-hc-num { position: sticky; left: 0; z-index: 1; background: var(--chassis); color: var(--ink-3); font-weight: 500; text-align: right; font-size: var(--fs-label); cursor: e-resize; }
.esci-hc-tabla th.esci-hc-esq { left: 0; z-index: 3; cursor: se-resize; }
.esci-hc-tabla th.sel { background: color-mix(in srgb, var(--accent) 22%, var(--chassis)); color: var(--ink); }
.esci-hc-tabla td.esci-hc-n { text-align: right; }
.esci-hc-tabla td.esci-hc-b { text-align: center; }
.esci-hc-tabla td.esci-hc-e { color: #c0392b; text-align: center; }
.esci-hc-tabla td.esci-hc-f { color: var(--ink-4); font-style: italic; }
.esci-hc-tabla td.tiene-formula { box-shadow: inset 3px 0 0 -1px color-mix(in srgb, #1d7a46 55%, transparent); }
/* los rangos enlazados, con el color de su enlace */
.esci-hc-tabla td.enl-0 { background: color-mix(in srgb, #2f6fdb 13%, var(--paper)); }
.esci-hc-tabla td.enl-1 { background: color-mix(in srgb, #1d9a55 14%, var(--paper)); }
.esci-hc-tabla td.enl-2 { background: color-mix(in srgb, #d98a1a 16%, var(--paper)); }
.esci-hc-tabla td.enl-3 { background: color-mix(in srgb, #9b4fd1 13%, var(--paper)); }
.esci-hc-tabla td.enl-4 { background: color-mix(in srgb, #d13f6a 13%, var(--paper)); }
.esci-hc-tabla td.enl-5 { background: color-mix(in srgb, #188a8a 15%, var(--paper)); }
.esci-hc-tabla td.sel { background-image: linear-gradient(color-mix(in srgb, var(--accent) 20%, transparent), color-mix(in srgb, var(--accent) 20%, transparent)); }
.esci-hc-tabla td.activa { outline: 2px solid var(--accent); outline-offset: -2px; }
/* v1.88.1 · los bordes de las letras y de los números se arrastran (ancho y alto) */
.esci-hc-tabla thead th.esci-hc-col { position: sticky; }
.esci-hc-borde-c { position: absolute; top: 0; right: 0; width: 6px; height: 100%; cursor: col-resize; z-index: 3; }
.esci-hc-tabla th.esci-hc-num { position: sticky; }
.esci-hc-borde-f { position: absolute; left: 0; bottom: 0; height: 5px; width: 100%; cursor: row-resize; z-index: 3; }
.esci-hc-borde-c:hover, .esci-hc-borde-f:hover { background: color-mix(in srgb, var(--accent) 45%, transparent); }
.esci-hc-guia { position: absolute; z-index: 6; pointer-events: none; background: var(--accent); }
.esci-hc-guia.es-v { width: 2px; height: 100%; }
.esci-hc-guia.es-h { height: 2px; width: 100%; }
.esci-hc-guia[hidden] { display: none; }
/* v1.88 · el controlador de relleno (la esquina de lo elegido) y su vista previa */
.esci-hc-asa { position: absolute; z-index: 4; width: 8px; height: 8px; box-sizing: border-box; background: var(--accent); border: 1.5px solid var(--paper); cursor: var(--esci-cur-cruz, crosshair); touch-action: none; }
.esci-hc-asa[hidden] { display: none; }
.esci-hc-tabla td.relleno { outline: 1.5px dashed var(--accent); outline-offset: -2px; }
.esci-hc-nota.es-error { color: #b3261e; }
.esci-hc-tabla td.esci-hc-e { font-family: var(--sans, inherit); font-size: 12px; }
.esci-hc-editor { position: absolute; z-index: 5; box-sizing: border-box; margin: 0; padding: 0 5px; border: 2px solid var(--accent); background: var(--paper); color: var(--ink); font: 13px var(--mono); outline: none; }

/* sin archivo todavía */
.esci-hc-elige { position: absolute; inset: 0; overflow: auto; padding: 14px 16px; background: var(--surface); color: var(--ink-2); font-size: var(--fs-ui-sm); line-height: 1.45; }
.esci-hc-elige[hidden] { display: none; }
.esci-hc-elige-t { font-size: var(--fs-ui); font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.esci-hc-elige-t i { color: #1d7a46; }
.esci-hc-elige p { margin: 4px 0 10px; max-width: 620px; }
.esci-hc-elige-b { display: flex; flex-wrap: wrap; gap: 8px; }
.esci-hc-elige .esci-hc-nota { margin-top: 12px; color: var(--ink-4); font-size: var(--fs-label); }

/* las pestañas del libro */
.esci-hc-pestanas { display: flex; gap: 2px; padding: 0 6px; border-top: 1px solid var(--line-soft); background: var(--chassis); overflow-x: auto; flex: none; }
.esci-hc-pestanas[hidden] { display: none; }
.esci-hc-pest { flex: none; max-width: 180px; padding: 3px 12px; border: 1px solid transparent; border-top: 0; border-radius: 0 0 6px 6px; background: transparent; color: var(--ink-3); font: inherit; font-size: var(--fs-label); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esci-hc-pest:hover { color: var(--ink); background: var(--surface); }
.esci-hc-pest.activa { background: var(--paper); color: #1d7a46; font-weight: 700; border-color: var(--line-soft); }

/* el pie: los enlaces con la hoja */
.esci-hc-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 4px 8px; border-top: 1px solid var(--line-soft); background: var(--chassis); color: var(--ink-3); font-size: var(--fs-label); flex: none; max-height: 40%; overflow: auto; }
.esci-hc-pie[hidden] { display: none; }
.esci-hc-ayuda i { color: #1d7a46; }
.esci-hc-enl { display: inline-flex; align-items: center; gap: 4px; padding: 1px 2px 1px 8px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--paper); color: var(--ink-2); font-family: var(--mono); cursor: pointer; }
.esci-hc-enl:hover { border-color: var(--accent); }
.esci-hc-enl b { color: var(--ink); }
.esci-hc-punto { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.esci-hc-enl.enl-0 .esci-hc-punto { background: #2f6fdb; }
.esci-hc-enl.enl-1 .esci-hc-punto { background: #1d9a55; }
.esci-hc-enl.enl-2 .esci-hc-punto { background: #d98a1a; }
.esci-hc-enl.enl-3 .esci-hc-punto { background: #9b4fd1; }
.esci-hc-enl.enl-4 .esci-hc-punto { background: #d13f6a; }
.esci-hc-enl.enl-5 .esci-hc-punto { background: #188a8a; }
.esci-hc-enl.es-error { border-color: #d9a441; }
.esci-hc-est { color: var(--ink-4); }
.esci-hc-enl.es-error .esci-hc-est { color: #b3261e; font-weight: 600; }
.esci-hc-quita { border: 0; background: transparent; color: var(--ink-4); cursor: pointer; padding: 0 5px; font-size: 11px; border-radius: 50%; }
.esci-hc-quita:hover { color: #b3261e; background: var(--surface); }
.esci-hc-error { flex-basis: 100%; color: #9a6a00; font-family: var(--sans, inherit); }

/* el diálogo de enlazar */
.esci-hc-dialogo { display: flex; flex-direction: column; gap: 10px; min-width: min(460px, 80vw); }
.esci-hc-dl { display: flex; flex-direction: column; gap: 3px; }
.esci-hc-dl-t { font-weight: 600; color: var(--ink-2); }
.esci-hc-dl small { color: var(--ink-4); }
.esci-hc-vista { min-height: 38px; padding: 6px 8px; border-radius: 6px; background: var(--surface); border: 1px solid var(--line-soft); font-size: var(--fs-ui-sm); line-height: 1.4; }
.esci-hc-vista .es-ok { color: #1d7a46; }
.esci-hc-vista .es-error { color: #b3261e; }
.esci-hc-muestra { margin-top: 4px; font-family: var(--mono); font-size: var(--fs-label); color: var(--ink-3); word-break: break-word; }

@media print {
  .esci-hc-barra .esci-ibtn, .esci-hc-fila, .esci-hc-pie .esci-hc-quita, .esci-hc-editor { display: none !important; }
  .esci-hc-rejilla { overflow: hidden; }
}
.esci-calco .esci-hc-barra .esci-ibtn, .esci-calco .esci-hc-fila, .esci-calco .esci-hc-quita, .esci-calco .esci-hc-editor { display: none !important; }

/* v1.89 · más como Excel: la pestaña «+», la celda que se apunta al escribir
   una fórmula y el resumen de lo elegido (promedio · recuento · suma) */
.esci-hc-pest.es-mas { padding: 3px 9px; color: var(--ink-4); }
.esci-hc-pest.es-mas:hover { color: #1d7a46; }
.esci-hc-tabla td.apuntada { outline: 2px dashed #2f7de1; outline-offset: -2px; background-color: color-mix(in srgb, #2f7de1 10%, transparent); }
.esci-hc-info.es-resumen { color: var(--ink-2); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; flex: 0 1 auto; min-width: 0; }
.esci-hc-barra .is-autosuma .esci-hc-bt { font: 700 15px/1 'Source Serif 4', Georgia, serif; }
.esci-hc-barra .is-autosuma i { display: none; }

/* v1.90 · la cinta de formato (como la pestaña «Inicio» de Excel) y su paleta */
.esci-hc-cinta { display: flex; align-items: center; gap: 2px; padding: 3px 6px; border-bottom: 1px solid var(--line-soft); background: var(--chassis); flex: none; flex-wrap: wrap; min-width: 0; }
.esci-hc-cinta[hidden] { display: none; }
.esci-hc-cb { position: relative; min-width: 26px; height: 26px; padding: 0 6px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--ink-2); font: inherit; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 3px; }
.esci-hc-cb:hover { background: var(--surface); color: var(--ink); }
.esci-hc-cb.is-on { background: color-mix(in srgb, var(--accent) 18%, var(--surface)); border-color: color-mix(in srgb, var(--accent) 45%, transparent); color: var(--ink); }
.esci-hc-cb.es-color::after { content: ''; position: absolute; left: 5px; right: 5px; bottom: 3px; height: 3px; border-radius: 1px; background: var(--barra, transparent); box-shadow: 0 0 0 1px var(--line-soft); }
.esci-hc-cb.es-dec span { font: 600 11px 'IBM Plex Mono', monospace; letter-spacing: -0.5px; }
.esci-hc-csep { width: 1px; height: 18px; margin: 0 4px; background: var(--line-soft); }
.esci-hc-nf { height: 26px; max-width: 150px; border: 1px solid var(--line-soft); border-radius: 5px; background: var(--paper); color: var(--ink); font: inherit; font-size: 12px; padding: 0 4px; }
.esci-barra-hc .is-cinta.is-on, .esci-hc-barra .is-cinta.is-on { color: var(--accent); }
.esci-hc-paleta { position: fixed; z-index: 9000; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.esci-hc-pal-rej { display: grid; grid-template-columns: repeat(12, 20px); gap: 4px; }
.esci-hc-pal-c { width: 20px; height: 20px; border: 1px solid rgba(0, 0, 0, .2); border-radius: 4px; cursor: pointer; padding: 0; }
.esci-hc-pal-c:hover, .esci-hc-pal-c:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.esci-hc-pal-fila { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 8px; font-size: 12px; color: var(--ink-2); }
.esci-hc-pal-b { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line-soft); border-radius: 5px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 12px; padding: 3px 8px; cursor: pointer; }
.esci-hc-pal-otro { width: 26px; height: 20px; padding: 0; border: 0; background: none; cursor: pointer; }
@media print { .esci-hc-cinta { display: none !important; } }
.esci-calco .esci-hc-cinta { display: none !important; }

/* v1.91 · la fila de títulos (fija arriba) y el nombre propio de las columnas */
.esci-hc-tabla thead tr.es-titulos td { position: sticky; top: 24px; z-index: 2; font-weight: 700; background-color: color-mix(in srgb, var(--accent) 9%, var(--paper)); border-bottom: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); }
.esci-hc-tabla thead tr.es-titulos th.esci-hc-num { top: 24px; z-index: 3; }
.esci-hc-tabla thead th.esci-hc-col.con-nombre { line-height: 1.05; padding-top: 1px; }
.esci-hc-cnom { display: block; color: var(--ink); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esci-hc-cletra { display: block; font-size: 9px; color: var(--ink-4); font-weight: 500; }
.esci-hc-dl-fila { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 10px; font-size: 13px; }
.esci-hc-dl-fila label { display: inline-flex; align-items: center; gap: 5px; }
.esci-hc-dl-fila input[type="color"] { width: 30px; height: 22px; padding: 0; border: 1px solid var(--line-soft); border-radius: 4px; background: none; }

/* ═══ v1.91 · la región Gráfico (gráficos como los de Excel, enlazados) ═══ */
.esci-grafico .esci-body { display: flex; flex-direction: column; height: 100%; background: var(--paper); border: 1px solid var(--line-soft); border-radius: 8px; overflow: hidden; }
.esci-gr-barra { display: flex; align-items: center; gap: 4px; padding: 4px 6px; border-bottom: 1px solid var(--line-soft); background: var(--chassis); flex: none; min-width: 0; }
.esci-gr-logo { color: #1d7a46; padding: 0 4px; }
.esci-gr-tipo, .esci-gr-tend { height: 26px; border: 1px solid var(--line-soft); border-radius: 5px; background: var(--paper); color: var(--ink); font: inherit; font-size: 12px; padding: 0 4px; max-width: 150px; }
.esci-gr-tend[hidden] { display: none; }
.esci-gr-rango { font: 11px 'IBM Plex Mono', monospace; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.esci-gr-hueco { flex: 1; }
.esci-gr-barra .esci-ibtn { min-width: 28px; height: 28px; }
.esci-gr-lienzo { flex: 1; min-height: 0; padding: 4px 8px; }
.esci-gr-pie { flex: none; font-size: 11px; color: var(--ink-4); padding: 2px 8px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.esci-gr-error { color: var(--bad, #b23a3a); font-size: 13px; padding: 20px; }
.esci-gr-svg { display: block; width: 100%; height: 100%; font-family: 'IBM Plex Sans', sans-serif; overflow: visible; }
.esci-gr-svg .gr-titulo { font-size: 15px; font-weight: 700; fill: var(--ink, #223); }
.esci-gr-svg .gr-marca { font-size: 11px; fill: var(--ink-3, #556); }
.esci-gr-svg .gr-rot { font-size: 12px; font-weight: 600; fill: var(--ink-2, #334); }
.esci-gr-svg .gr-ley { font-size: 11.5px; fill: var(--ink-2, #334); }
.esci-gr-svg .gr-pct { font-size: 11px; font-weight: 700; fill: #fff; paint-order: stroke; stroke: rgba(0, 0, 0, .25); stroke-width: 2px; }
.esci-gr-svg .gr-ecuacion { font: 600 12px 'IBM Plex Mono', monospace; }
.esci-gr-svg .gr-vacio { font-size: 13px; fill: var(--ink-4, #889); }
.esci-gr-svg .gr-rejilla { stroke: var(--line-soft, #e3e6ee); stroke-width: 1; fill: none; }
.esci-gr-svg .gr-eje { stroke: var(--ink-4, #889); stroke-width: 1.2; }
.esci-gr-svg .gr-punto, .esci-gr-svg .gr-barra, .esci-gr-svg .gr-barra-h, .esci-gr-svg .gr-sector { transition: opacity .15s, filter .15s; cursor: default; }
.esci-gr-svg .gr-punto:hover, .esci-gr-svg .gr-barra:hover, .esci-gr-svg .gr-barra-h:hover, .esci-gr-svg .gr-sector:hover { filter: brightness(1.15) drop-shadow(0 0 3px rgba(0, 0, 0, .35)); }
/* la animación al dibujar: las barras crecen, las líneas se trazan, los puntos aparecen, la torta gira */
.esci-gr-svg.anim .gr-barra { transform-box: fill-box; transform-origin: 50% 100%; animation: grCrece .7s cubic-bezier(.2, .8, .3, 1) both; animation-delay: calc(var(--i, 0) * 25ms); }
.esci-gr-svg.anim .gr-barra-h { transform-box: fill-box; transform-origin: 0 50%; animation: grCreceH .7s cubic-bezier(.2, .8, .3, 1) both; animation-delay: calc(var(--i, 0) * 25ms); }
.esci-gr-svg.anim .gr-linea { stroke-dasharray: 1; animation: grTraza 1.1s ease-out both; }
.esci-gr-svg.anim .gr-punto { transform-box: fill-box; transform-origin: 50% 50%; animation: grAparece .45s ease-out both; animation-delay: calc(var(--i, 0) * 18ms); }
.esci-gr-svg.anim .gr-torta, .esci-gr-svg.anim .gr-radar { animation: grGira .9s cubic-bezier(.2, .8, .3, 1) both; }
.esci-gr-svg.anim .gr-area, .esci-gr-svg.anim .gr-caja, .esci-gr-svg.anim .gr-tendencia { animation: grFunde .9s ease-out both; }
@keyframes grCrece { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes grCreceH { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes grTraza { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes grAparece { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes grGira { from { transform: rotate(-90deg) scale(.2); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes grFunde { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .esci-gr-svg.anim * { animation: none !important; } }
@media print { .esci-gr-barra { display: none !important; } }
.esci-calco .esci-gr-barra { display: none !important; }
