/* /revisa-tu-coa · lista de verificación de un COA. Tokens y componentes: /assets/css/ll-base.css.
   Solo la carga esta página. Sin JS se lee la lista completa; los campos, el estado y el resumen
   aparecen cuando ll-revisa-coa.js les quita [hidden]. Estados sin color: palabra y peso 800. */


/* ── Columna de guía: en escritorio, el bloque de la herramienta (ejemplo, estado, ir al resumen)
      acompaña al scroll mientras se llenan los pasos; el titular y la entrada se van. ── */
.rv-guia{display:grid;gap:24px;align-content:start}
.rv-herramienta{display:grid;gap:16px;justify-items:start}
.rv-estado{font-weight:800;font-size:17px;line-height:1.4;padding-top:16px;border-top:2px solid var(--negro);width:100%}
.rv-estado:empty{display:none}
.rv-ir{display:inline-flex;align-items:center;min-height:44px;font-weight:800}
.rv-ejemplo{display:grid;gap:8px;justify-items:start;font-size:var(--t-nota);line-height:1.5;color:var(--grafito)}
.rv-ejemplo a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
@media (min-width:900px){
  .rv-dos{align-items:stretch}
  .rv-herramienta{position:sticky;top:calc(var(--header-h) + 32px)}
}

/* ── Campos de cada paso ── */
.rv-campos{display:grid;gap:20px;margin-top:22px;padding-top:22px;border-top:1px solid var(--linea)}
.rv-par{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.rv-campo{display:grid;gap:8px}
.rv-etiqueta{display:grid;gap:8px;align-content:start;font-weight:800;font-size:15px;line-height:1.3;color:var(--negro)}
.rv-etiqueta .ll-campo{width:100%;font-weight:500;min-width:0}
.rv-etiqueta input[type="date"]{min-height:48px;line-height:1.2}
.rv-corto .ll-campo{max-width:220px}
.rv-paso .rv-ayuda{margin:0;font-size:var(--t-nota);line-height:1.5;color:var(--grafito)}
.rv-opciones{border:0;margin:0;padding:0;min-width:0}
.rv-opciones legend{padding:0;margin-bottom:10px;font-weight:800;font-size:15px;line-height:1.3;color:var(--negro)}
.rv-opciones__botones{display:flex;flex-wrap:wrap;gap:8px}

/* Lectura de cada paso: una línea por hallazgo, la palabra de estado en 800. */
.rv-paso .rv-lectura{margin:0;max-width:none;display:grid;gap:6px;padding-left:16px;border-left:2px solid var(--negro);color:var(--negro);font-size:16px;line-height:1.5}
.rv-lectura span{display:block}

/* ── Resumen ── */
.rv-resumen{display:grid;gap:24px;margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:2px solid var(--negro);scroll-margin-top:calc(var(--header-h) + 24px)}
.rv-resumen:focus{outline:none}
.rv-resumen:focus-visible{outline:2px solid var(--negro);outline-offset:6px}
.rv-resumen__vacio{color:var(--grafito);max-width:52ch}
.rv-resumen__grupo h4{font-weight:800;font-size:var(--t-h3);line-height:1.2;letter-spacing:-.01em;margin:0 0 6px}
.rv-resumen__grupo li{padding:12px 0;border-bottom:1px solid var(--linea);max-width:64ch}
.rv-resumen__grupo li:last-child{border-bottom:0}

.rv-emisores{margin-top:28px}

/* Entrada de lo que aparece al revisar: solo opacidad y transform, y nada con «reducir movimiento». */
@media (prefers-reduced-motion:no-preference){
  .rv-lectura:not([hidden]),.rv-resumen__grupo:not([hidden]),.rv-ejemplo:not([hidden]){animation:rv-entra var(--d-2) var(--sale) both}
}
@keyframes rv-entra{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
