/* ==========================================================================
   REGISTRO — el formulario del enlace que se manda por WhatsApp
   --------------------------------------------------------------------------
   Se lee casi siempre en el teléfono y de una sentada, así que va en una sola
   columna, con los pasos numerados para que se vea cuánto falta.
   ========================================================================== */

.pagina-registro{
  background:var(--fondo);color:var(--texto);
  padding:0 0 60px;min-height:100%;
}

/* ------------------------------- cabecera -------------------------------- */
.reg-cab{
  text-align:center;padding:32px var(--pad-lat) 26px;
  border-bottom:3px solid var(--azul);background:var(--carbon);
}
.reg-logo{width:132px;height:auto;margin:0 auto 18px;display:block}
.reg-cab h1{
  font-family:var(--titulo);font-size:27px;font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;
}
.reg-cab p{
  font-size:14px;line-height:1.65;color:var(--texto2);
  max-width:520px;margin:0 auto;
}

/* -------------------------------- cuerpo --------------------------------- */
.reg-cuerpo{max-width:640px;margin:0 auto;padding:24px var(--pad-lat) 0}

.reg-paso{
  background:var(--superficie);border:1px solid var(--borde);
  border-radius:18px;padding:20px 18px;margin-bottom:16px;
}
.reg-titulo{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.reg-n{
  width:30px;height:30px;flex:0 0 auto;border-radius:9px;
  background:var(--azul);color:var(--sobre-acento);
  display:grid;place-items:center;
  font-family:var(--titulo);font-size:15px;font-weight:700;
}
.reg-titulo h2{
  font-family:var(--titulo);font-size:19px;font-weight:700;
  text-transform:uppercase;letter-spacing:.4px;
}
.reg-ayuda{
  font-size:13px;line-height:1.6;color:var(--texto3);
  margin:-4px 0 16px;
}
.reg-paso .campo{margin-bottom:14px}
.reg-paso .campo:last-child{margin-bottom:0}

/* Un campo que quedó mal se marca al enviar, no mientras se escribe */
.pagina-registro input.mal,
.pagina-registro select.mal,
.pagina-registro textarea.mal{
  border-color:var(--peligro);box-shadow:0 0 0 3px rgba(225,29,42,.16);
}

/* --------------------------- casillas de salud ---------------------------- */
.reg-casillas{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 18px;
}
.reg-casillas label{
  display:flex;align-items:center;gap:9px;cursor:pointer;
  background:var(--superficie2);border:1.5px solid var(--borde);
  border-radius:11px;padding:11px 12px;transition:.15s;
}
.reg-casillas label:has(input:checked){
  border-color:var(--azul);background:var(--azul-suave);
}
.reg-casillas input{
  width:19px;height:19px;flex:0 0 auto;min-height:auto;accent-color:var(--azul);
}
.reg-casillas span{font-size:13px;line-height:1.35;color:var(--texto2)}
@media(max-width:480px){ .reg-casillas{grid-template-columns:1fr} }

/* ------------------------------ autorización ------------------------------ */
.reg-legal{
  background:var(--superficie2);border-radius:12px;padding:14px 15px;
  margin-bottom:14px;max-height:200px;overflow-y:auto;
}
.reg-legal p{font-size:12.5px;line-height:1.65;color:var(--texto3);margin-bottom:10px}
.reg-legal p:last-child{margin-bottom:0}
.reg-legal b{color:var(--texto2)}

.reg-acepta{
  display:flex;align-items:flex-start;gap:11px;cursor:pointer;
  background:var(--superficie2);border:1.5px solid var(--borde2);
  border-radius:12px;padding:14px;
}
.reg-acepta:has(input:checked){border-color:var(--azul);background:var(--azul-suave)}
.reg-acepta input{
  width:21px;height:21px;flex:0 0 auto;min-height:auto;margin-top:1px;accent-color:var(--azul);
}
.reg-acepta span{font-size:13px;line-height:1.55;color:var(--texto2)}

/* --------------------------------- enviar --------------------------------- */
.reg-enviar{
  width:100%;justify-content:center;font-size:15px;
  min-height:56px;margin-top:6px;
}
.reg-enviar:disabled{opacity:.6;cursor:default}
.reg-pie{
  font-size:12.5px;line-height:1.6;color:var(--texto3);
  text-align:center;margin-top:14px;
}
.reg-error{
  background:rgba(225,29,42,.14);border-left:3px solid var(--peligro);
  border-radius:10px;padding:13px 15px;margin-bottom:14px;
  font-size:13.5px;line-height:1.5;color:var(--texto);
}

/* ------------------------------ confirmación ------------------------------ */
.reg-listo{text-align:center;padding:40px 10px}
.reg-check{
  width:74px;height:74px;margin:0 auto 22px;border-radius:50%;
  background:var(--azul);color:var(--sobre-acento);
  display:grid;place-items:center;font-size:38px;font-weight:700;
}
.reg-listo h2{
  font-family:var(--titulo);font-size:24px;font-weight:700;
  text-transform:uppercase;letter-spacing:.4px;margin-bottom:12px;
}
.reg-listo p{
  font-size:14px;line-height:1.7;color:var(--texto2);
  max-width:440px;margin:0 auto 10px;
}