/* Cierre mensual preventivo: meses, semáforo del mes, cifras, vencimientos, alertas y verificaciones */

/* Tira de meses: los últimos doce meses cerrados */
.meses { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 760px) { .meses { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 420px) { .meses { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.mes-boton { appearance: none; width: 100%; font: inherit; text-align: left; cursor: pointer; background: var(--superficie); color: var(--tinta); border: 1px solid var(--linea-fuerte); border-radius: var(--r-control);
  padding: 10px 12px; display: grid; gap: 2px; min-height: 72px; transition: border-color .15s, background-color .15s, color .15s; position: relative; overflow-wrap: break-word; hyphens: auto; }
.mes-boton:hover { border-color: var(--oro); }
.mes-boton b { font-weight: 600; font-size: .95rem; text-transform: capitalize; }
.mes-boton .anio { font-size: .78rem; color: var(--suave); font-family: var(--f-mono); }
.mes-boton .estado-mes { font-size: .76rem; color: var(--suave); line-height: 1.3; overflow-wrap: break-word; }
.mes-boton .punto { position: absolute; top: 11px; right: 11px; width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--linea-fuerte); background: transparent; }
.mes-boton .punto.rojo { background: var(--rojo); border-color: var(--rojo); }
.mes-boton .punto.ambar { background: var(--ambar); border-color: var(--ambar); }
.mes-boton .punto.verde { background: var(--verde); border-color: var(--verde); }
.mes-boton .punto.preparando { border-color: var(--ambar); background: var(--ambar-bg); animation: sire-pulso 1.6s ease-in-out infinite; }
.mes-boton[aria-pressed="true"] { background: var(--noche); color: #fff; border-color: var(--noche); }
.mes-boton[aria-pressed="true"] .anio, .mes-boton[aria-pressed="true"] .estado-mes { color: var(--noche-suave); }
.mes-boton[aria-pressed="true"] .punto:not(.rojo):not(.ambar):not(.verde) { border-color: var(--noche-suave); }
@media (prefers-reduced-motion: reduce) { .mes-boton .punto.preparando { animation: none; } }

/* Progreso de la descarga del mes */
.cierre-progreso { border: 1px solid var(--linea); border-radius: var(--r-control); padding: 12px 14px; background: var(--superficie-2); display: grid; gap: 8px; }
.descargas-cierre { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .88rem; }
.descargas-cierre li { display: inline-flex; align-items: center; gap: 8px; }
.descargas-cierre .sire-celda { width: 16px; height: 16px; border-radius: 4px; }

/* Semáforo del mes */
.semaforo { display: flex; gap: 18px; align-items: center; border-radius: var(--r-hoja); padding: 18px 20px; border: 1px solid transparent; }
.semaforo.rojo { background: var(--rojo-bg); color: var(--rojo); }
.semaforo.ambar { background: var(--ambar-bg); color: var(--ambar); }
.semaforo.verde { background: var(--verde-bg); color: var(--verde); }
.semaforo.vacio-mes { background: var(--superficie-2); color: var(--suave); border-color: var(--linea); }
.semaforo .luz { width: 54px; height: 54px; border-radius: 50%; background: currentColor; flex: none; box-shadow: 0 0 0 6px color-mix(in srgb, currentColor 18%, transparent); }
.semaforo .texto { display: grid; gap: 4px; min-width: 0; }
.semaforo .texto b { font-family: var(--f-titulo); font-weight: 400; font-size: clamp(1.35rem, 3vw, 1.75rem); line-height: 1.15; color: var(--tinta); }
.semaforo .texto span { color: var(--tinta); font-size: .93rem; }
@media (max-width: 520px) { .semaforo { gap: 14px; padding: 16px; } .semaforo .luz { width: 40px; height: 40px; } }

.fuente-cierre { font-size: .86rem; color: var(--suave); border-left: 3px solid var(--oro); padding: 2px 0 2px 12px; }
.cifras-cierre b.negativo { color: var(--verde); }
.cifras-cierre small { display: block; color: var(--suave); font-size: .74rem; font-weight: 400; }

/* Vencimientos */
.vencimientos { list-style: none; margin: 0; padding: 0; display: grid; border-top: 1px solid var(--linea); }
.vencimientos li { display: grid; grid-template-columns: 116px minmax(0, 1fr) auto; gap: 4px 14px; align-items: baseline; padding: 11px 0; border-bottom: 1px solid var(--linea); }
.vencimientos .fecha { font-family: var(--f-mono); font-size: .9rem; font-weight: 500; }
.vencimientos .que { display: grid; gap: 2px; }
.vencimientos .que span { font-size: .82rem; color: var(--suave); }
.vencimientos .cuando { font-size: .82rem; font-weight: 600; white-space: nowrap; }
.vencimientos .vencido .cuando, .vencimientos .vencido .fecha { color: var(--rojo); }
.vencimientos .hoy .cuando, .vencimientos .proximo .cuando { color: var(--ambar); }
@media (max-width: 560px) { .vencimientos li { grid-template-columns: minmax(0, 1fr) auto; } .vencimientos .que { grid-column: 1 / -1; grid-row: 2; } }

/* Alertas del cierre */
.grupo-alertas { display: grid; gap: 10px; }
.grupo-alertas > h3 { font-size: 1rem; display: flex; align-items: center; gap: 8px; }
.alerta-cierre { border: 1px solid var(--linea); border-left: 4px solid var(--linea-fuerte); border-radius: var(--r-control); padding: 16px 18px; display: grid; gap: 10px; background: var(--superficie); }
.alerta-cierre.rojo { border-left-color: var(--rojo); }
.alerta-cierre.ambar { border-left-color: var(--ambar); }
.alerta-cierre.info { border-left-color: var(--oro); }
.alerta-cabeza { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.alerta-cabeza > div:first-child { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.alerta-cabeza h4 { font-size: 1.02rem; }
.alerta-cabeza .monto { text-align: right; display: grid; justify-items: end; flex: none; }
.alerta-cabeza .monto b { font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.alerta-cabeza .monto span { font-size: .76rem; color: var(--suave); }
@media (max-width: 560px) { .alerta-cabeza { flex-direction: column; } .alerta-cabeza .monto { justify-items: start; text-align: left; } }
.que-hacer { background: var(--superficie-2); border-radius: var(--r-control); padding: 10px 14px; display: grid; gap: 4px; }
.que-hacer b { font-size: .85rem; }
.que-hacer .plazo { font-size: .84rem; font-weight: 600; color: var(--oro-tinta); }
.que-hacer .plazo.vencido { color: var(--rojo); }
.alerta-cierre details summary { cursor: pointer; font-size: .88rem; font-weight: 600; color: var(--oro-tinta); }
.alerta-cierre details .tabla { margin-top: 8px; }
.alerta-cierre table { font-size: .84rem; }
.alerta-cierre th, .alerta-cierre td { padding: 8px 10px; }
.base-cierre { font-size: .8rem; color: var(--suave); }
.etiqueta.rojo { background: var(--rojo-bg); color: var(--rojo); border-color: transparent; }
.etiqueta.ambar { background: var(--ambar-bg); color: var(--ambar); border-color: transparent; }
.etiqueta.verde { background: var(--verde-bg); color: var(--verde); border-color: transparent; }

/* Lo que se verificó */
.verificaciones { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 6px 18px; }
.verificaciones li { display: flex; gap: 10px; align-items: flex-start; font-size: .9rem; padding: 6px 0; }
.verificaciones .marca-v { width: 20px; height: 20px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: .72rem; font-weight: 700; margin-top: 1px; border: 1.5px solid var(--linea-fuerte); color: var(--suave); }
.verificaciones .ok .marca-v { background: var(--verde); border-color: var(--verde); color: #fff; }
.verificaciones .rojo .marca-v { background: var(--rojo); border-color: var(--rojo); color: #fff; }
.verificaciones .ambar .marca-v { background: var(--ambar); border-color: var(--ambar); color: #fff; }
.verificaciones .info .marca-v { border-color: var(--oro); color: var(--oro-tinta); }
.verificaciones li > span:last-child { display: grid; gap: 1px; min-width: 0; }
.verificaciones small { color: var(--suave); font-size: .78rem; }

.nota-cierre { font-size: .84rem; color: var(--suave); }
.sire-empresa { display: grid; gap: 10px; }
.sire-empresa .fila { align-items: flex-end; }

@media print {
  .barra, .pie, #p-meses, #mes-acciones, #p-sire, #aviso, .cierre-progreso, .validez-acciones, .validez-progreso { display: none !important; }
  .hoja { box-shadow: none; border: 0; padding: 0; }
  .alerta-cierre { break-inside: avoid; }
}