/* Botones */
.boton {
  font: inherit; font-weight: 500; font-size: var(--t-s); cursor: pointer; min-height: var(--alto-boton); line-height: 1.3;
  padding: var(--e1) var(--e4); border-radius: var(--radio); border: 1px solid var(--acento);
  background: var(--acento); color: #fff; display: inline-flex; align-items: center; gap: var(--e2);
  text-decoration: none; transition: background-color var(--duracion), border-color var(--duracion), transform var(--duracion) var(--curva);
}
.boton:hover { background: var(--acento-oscuro); color: #fff; }
.boton:active { transform: scale(0.97); }
.boton[disabled], .boton[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.boton--sec { background: var(--superficie); color: var(--marino); border-color: var(--linea-fuerte); }
.boton--sec:hover { background: var(--acento-fondo); color: var(--acento-oscuro); }
.boton--discreto { background: transparent; color: var(--tinta-suave); border-color: transparent; }
.boton--discreto:hover { background: var(--acento-fondo); color: var(--tinta); }
.boton--peligro { background: var(--superficie); color: var(--error-t); border-color: var(--error-b); }
.boton--peligro:hover { background: var(--error-f); color: var(--error-t); }
.boton--s { min-height: var(--alto-boton-s); padding: 0 var(--e3); font-size: var(--t-xs); }

/* Campos de formulario */
.campo { display: grid; gap: var(--e1); margin-bottom: var(--e4); min-width: 0; }
.campo > label, .campo > .campo__titulo { font-weight: 500; font-size: var(--t-s); }
.campo__ayuda { color: var(--tinta-suave); font-size: var(--t-xs); margin: 0; }
.campo__error { color: var(--error-t); font-size: var(--t-xs); font-weight: 500; margin: 0; }
.req { color: var(--error-t); font-weight: 400; }
input[type="text"], input[type="email"], input[type="password"], input[type="date"], input[type="url"], input[type="number"], input[type="search"], input[type="time"], input[type="tel"], select, textarea {
  font: inherit; color: var(--tinta); background: var(--crema); width: 100%; min-height: var(--alto-control);
  border: 1px solid var(--crema-borde); border-radius: var(--radio); padding: var(--e1) var(--e3);
}
input::placeholder, textarea::placeholder { color: #6B6455; opacity: 1; }
textarea[readonly] { background: var(--superficie-2); border-color: var(--linea-fuerte); }
input:disabled, select:disabled, textarea:disabled { background: var(--superficie-2); border-color: var(--linea-fuerte); color: var(--tinta-suave); cursor: not-allowed; }
textarea { min-height: 4.5rem; resize: vertical; line-height: 1.5; padding-block: var(--e2); }
input:hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color: var(--tinta-suave); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--foco); outline-offset: 1px; }
input[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--error-b); background: #fffafa; }
.marca-confirmar { border-color: var(--e-pendiente-b); background: #F3F7FD; }
fieldset { border: 0; padding: 0; margin: 0 0 var(--e4); min-width: 0; }
legend { font-weight: 500; font-size: var(--t-s); padding: 0; margin-bottom: var(--e2); }
.casilla { display: flex; gap: var(--e2); align-items: center; min-height: 1.75rem; font-size: var(--t-s); }
.casilla input { width: 1rem; height: 1rem; accent-color: var(--acento); }

/* Estados de un elemento: punto + texto, nunca solo color */
.estado {
  display: inline-flex; align-items: center; gap: 0.4em; font-size: var(--t-xs); font-weight: 500;
  padding: 0.14em 0.65em 0.14em 0.5em; border-radius: 999px; white-space: nowrap; letter-spacing: 0.01em;
}
.estado::before {
  content: ""; width: 0.72em; height: 0.72em; border-radius: 50%; flex: none;
  border: 2px solid currentColor; background: transparent; box-sizing: border-box;
}
.estado--pendiente { color: var(--e-pendiente-t); background: var(--e-pendiente-f); }
.estado--recibido { color: var(--e-recibido-t); background: var(--e-recibido-f); }
.estado--recibido::before { background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
.estado--en_revision { color: var(--e-revision-t); background: var(--e-revision-f); }
.estado--en_revision::before { background: radial-gradient(circle, currentColor 38%, transparent 42%); }
.estado--aprobado { color: #fff; background: var(--marino); }
.estado--aprobado::before { background: currentColor; }

/* Barra de avance partida por estados */
.avance { display: flex; height: 0.5rem; border-radius: 999px; overflow: hidden; background: #E1E8F2; gap: 2px; }
.avance > span { display: block; min-width: 0; }
.avance .a-aprobado { background: var(--e-aprobado-b); }
.avance .a-en_revision { background: var(--e-revision-b); }
.avance .a-recibido { background: var(--e-recibido-b); }

/* Pantallas de carga, vacío y error */
.estado-pantalla { text-align: center; padding: var(--e7) var(--e4); color: var(--tinta-suave); }
.estado-pantalla h2 { color: var(--tinta); margin-bottom: var(--e2); font-size: var(--t-m); }
.estado-pantalla--error { background: var(--error-f); color: var(--error-t); border-radius: var(--radio-g); }
.estado-pantalla--error h2 { color: var(--error-t); }
.estado-pantalla .boton { margin-top: var(--e3); }
.giro {
  width: 1.375rem; height: 1.375rem; border-radius: 50%; border: 3px solid var(--linea);
  border-top-color: var(--acento); margin: 0 auto var(--e3); animation: gira 0.8s linear infinite;
}
@keyframes gira { to { transform: rotate(360deg); } }

.migas { font-size: var(--t-s); margin-bottom: var(--e3); color: var(--tinta-suave); }
.migas a { color: var(--tinta-suave); }
.pestanas { display: flex; gap: var(--e1); border-bottom: 1px solid var(--linea); margin: var(--e4) 0 var(--e5); overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.pestanas a {
  padding: var(--e2) var(--e3); text-decoration: none; color: var(--tinta-suave); font-weight: 500; font-size: var(--t-s);
  border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap;
}
.pestanas a:hover { color: var(--tinta); }
.pestanas a[aria-current="page"] { color: var(--acento-oscuro); border-bottom-color: var(--acento); }
input[type="date"]:focus-within { outline: 3px solid var(--foco); outline-offset: 1px; }

.boton--grande { min-height: 2.5rem; padding: var(--e2) var(--e5); font-size: var(--t-base); }
.boton--s { }

/* Cuadro de diálogo (<dialog> nativo): «Regenerar landing». Foco atrapado y Escape cierran por sí solos. */
.dialogo { border: 0; padding: 0; border-radius: var(--radio-g); background: var(--superficie); color: var(--tinta); width: min(48rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); box-shadow: 0 24px 70px rgb(24 27 62 / 0.35); overflow: hidden; }
.dialogo::backdrop { background: rgb(24 27 62 / 0.55); }
.dialogo[open] { display: flex; flex-direction: column; }
.dialogo__cuerpo { padding: var(--e5); overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.dialogo__cuerpo > h2 { margin-bottom: var(--e2); }
.dialogo__intro { color: var(--tinta-suave); }
.dialogo__pie { position: sticky; bottom: calc(var(--e5) * -1); margin: var(--e5) calc(var(--e5) * -1) calc(var(--e5) * -1); padding: var(--e3) var(--e5); background: var(--superficie); border-top: 1px solid var(--linea); }
@media (prefers-reduced-motion: no-preference) {
  .dialogo[open] { animation: dialogo-entra 200ms var(--curva); }
  @keyframes dialogo-entra { from { opacity: 0; transform: translateY(8px) scale(0.985); } }
}
@media (max-width: 40rem) { .dialogo { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); } .dialogo__cuerpo { padding: var(--e4); } .dialogo__pie { margin: var(--e4) calc(var(--e4) * -1) calc(var(--e4) * -1); padding: var(--e3) var(--e4); bottom: calc(var(--e4) * -1); } }

/* Regenerar landing: lista de secciones y comparación */
.reg-grupo { border: 0; padding: 0; margin: var(--e5) 0 0; min-width: 0; }
.reg-grupo > legend, .reg-grupo > h3 { font: 600 var(--t-m)/1.3 var(--fuente-titulo); color: var(--marino); padding: 0; margin-bottom: var(--e2); }
.reg-estructura, .reg-comp__lista, .reg-versiones__lista { list-style: none; margin: 0; padding: 0; }
.reg-fila { display: flex; align-items: center; justify-content: space-between; gap: var(--e3); flex-wrap: wrap; padding: var(--e2) var(--e3); border: 1px solid var(--linea); border-radius: var(--radio); margin-bottom: var(--e2); background: var(--superficie); }
.reg-fila--fija { background: var(--superficie-2); color: var(--tinta-suave); border-style: dashed; }
.reg-fila--oculta .reg-fila__nombre { text-decoration: line-through; color: var(--tinta-suave); }
.reg-fila__nombre { font-weight: 500; flex: 1 1 10rem; }
.reg-fila__nota { font-size: var(--t-xs); color: var(--tinta-suave); }
.reg-fila__controles { display: inline-flex; align-items: center; gap: var(--e2); margin-left: auto; }
.reg-mov { width: 2rem; height: 2rem; border: 1px solid var(--linea-fuerte); border-radius: var(--radio); background: var(--superficie); color: var(--marino); cursor: pointer; font-size: var(--t-s); transition: background-color var(--duracion), transform var(--duracion) var(--curva); }
.reg-mov:active:not(:disabled) { transform: scale(0.95); }
.reg-mov:disabled { opacity: 0.35; cursor: default; }
@media (hover: hover) and (pointer: fine) { .reg-mov:hover:not(:disabled) { background: var(--acento-fondo); } }
.reg-comp__cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e4); }
@media (max-width: 40rem) { .reg-comp__cols { grid-template-columns: 1fr; } }
.reg-comp h4 { font: 600 var(--t-s)/1.3 var(--fuente-texto); text-transform: uppercase; letter-spacing: 0.06em; color: var(--tinta-suave); margin: 0 0 var(--e2); }
.reg-comp__item { display: flex; justify-content: space-between; align-items: center; gap: var(--e2); padding: var(--e2) var(--e3); border: 1px solid var(--linea); border-radius: var(--radio); margin-bottom: var(--e1); font-size: var(--t-s); }
.reg-comp__item--cambia { border-color: var(--cobalto); background: var(--acento-fondo); }
.reg-comp__marca { font-size: var(--t-xs); font-weight: 600; color: var(--cobalto); white-space: nowrap; }
.reg-comp__quitadas { font-size: var(--t-s); margin: var(--e2) 0 0; color: var(--e-pendiente-t); }
.reg-comp__sin { color: var(--tinta-suave); font-size: var(--t-s); }
.reg-versiones { margin-top: var(--e5); }
.reg-versiones summary { cursor: pointer; font-weight: 500; color: var(--cobalto); }
.reg-versiones__lista li { border-top: 1px solid var(--linea); padding: var(--e3) 0; }
.reg-versiones__cab, .reg-versiones__objetivo, .reg-versiones__indicaciones, .reg-versiones__orden { margin: 0 0 var(--e1); font-size: var(--t-s); }
.reg-versiones__orden { color: var(--tinta-suave); }

/* Regenerar landing: propuesta del asistente */
.reg-porque { background: var(--acento-fondo); border-left: 4px solid var(--cobalto); border-radius: var(--radio); padding: var(--e3) var(--e4); margin: var(--e4) 0; }
.reg-porque h3 { font: 600 var(--t-m)/1.3 var(--fuente-titulo); margin-bottom: var(--e1); }
.reg-porque p { margin: 0 0 var(--e1); }
.reg-porque__notas { font-size: var(--t-s); color: var(--tinta-suave); }
.reg-txt { border: 1px solid var(--linea-fuerte); border-radius: var(--radio-g); padding: var(--e3) var(--e4); margin: 0 0 var(--e3); background: var(--superficie); }
.reg-txt__cab { display: flex; justify-content: space-between; align-items: center; gap: var(--e3); flex-wrap: wrap; margin-bottom: var(--e2); }
.reg-txt__cab h4 { font: 600 var(--t-base)/1.3 var(--fuente-texto); margin: 0; color: var(--marino); }
.reg-txt__cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e4); }
@media (max-width: 40rem) { .reg-txt__cols { grid-template-columns: 1fr; gap: var(--e2); } }
.reg-txt h5 { font: 600 var(--t-xs)/1.3 var(--fuente-texto); text-transform: uppercase; letter-spacing: 0.06em; color: var(--tinta-suave); margin: 0 0 var(--e1); }
.reg-txt__actual { margin: 0; white-space: pre-line; font-size: var(--t-s); background: var(--superficie-2); border-radius: var(--radio); padding: var(--e2) var(--e3); }
.reg-txt__vacio { margin: 0; color: var(--tinta-suave); font-size: var(--t-s); font-style: italic; }
.reg-txt textarea { width: 100%; }
.reg-faq__par { display: grid; gap: var(--e1); margin-bottom: var(--e2); }
.reg-txt__avisos { margin: var(--e2) 0 0; padding-left: var(--e5); font-size: var(--t-s); color: var(--e-pendiente-t); }
.reg-txt__nota { margin: var(--e1) 0 0; font-size: var(--t-xs); color: var(--tinta-suave); }
.reg-resumen { font-weight: 500; margin: var(--e4) 0 0; }