/* ============================================================
   Reinicia GEO — Formulario de auditoría en una sola pantalla.
   Estilos calcados del diseño aprobado en /formulario, pero
   ACOTADOS a .rg-form-wrap para no afectar al resto de la página:
     · el reset universal del mockup (*{}) se limita al formulario;
     · las variables :root del mockup se mueven a .rg-form-wrap
       (las heredan sus descendientes) en vez de pisar las globales.
   ============================================================ */

/* Reset acotado al formulario (NO global).
   Especificidad 0,1,0 (.rg-form-wrap *): supera a los estilos de elemento del
   tema (p{}, div{}…) pero EMPATA con mis reglas de clase, que ganan por ir
   después. Así el reset no se come los márgenes de cada sección. */
.rg-form-wrap, .rg-form-wrap *, .rg-form-wrap *::before, .rg-form-wrap *::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

.rg-form-wrap{
  /* Variables del formulario (acotadas, heredadas por los descendientes). */
  --bg:#0B0E12;--panel:#12161D;--panel2:#181D26;--border:#1E2530;
  --orange:#FF5A2B;--mint:#7CF5C4;
  --text:#E8EDF4;--muted:#6B7A8D;--muted2:#8A9BB0;
  --danger:#F05454;--warn:#F5A623;

  background:#12161D;
  border:1px solid #1E2530;
  border-radius:16px;
  padding:40px;
  max-width:640px;
  margin:0 auto;
  font-family:'Inter',sans-serif;
}

.rg-form-eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--orange);
  margin-bottom:10px;
  display:flex;
  align-items:center;
  gap:8px;
}
.rg-form-eyebrow::after{content:'';flex:1;height:1px;background:var(--border);}

.rg-form-title{
  font-family:'Space Grotesk',sans-serif;
  font-size:22px;
  font-weight:700;
  color:#fff;
  margin-bottom:6px;
  line-height:1.25;
}

.rg-form-sub{
  font-size:14px;
  color:#8A9BB0;
  margin-bottom:28px;
  line-height:1.6;
}

/* ── Sección de opciones ── */
.rg-field-label{
  font-family:'Space Grotesk',sans-serif;
  font-size:14px;
  font-weight:600;
  color:#B8C5D4;
  margin-bottom:10px;
  display:block;
}

.rg-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:24px;
}

.rg-option{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--panel2);
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px 16px;
  cursor:pointer;
  font-size:14px;
  color:#B8C5D4;
  font-family:'Inter',sans-serif;
  transition:border-color .15s,background .15s,color .15s;
  user-select:none;
}
.rg-option:hover{border-color:rgba(255,90,43,.4);color:var(--text);}
.rg-option.selected{border-color:var(--orange);background:rgba(255,90,43,.08);color:#fff;}
.rg-option input[type="radio"]{display:none;}
.rg-radio{
  width:16px;height:16px;
  border-radius:50%;
  border:2px solid var(--border);
  flex-shrink:0;
  transition:border-color .15s,background .15s;
  display:flex;align-items:center;justify-content:center;
}
.rg-option.selected .rg-radio{border-color:var(--orange);background:var(--orange);}
.rg-option.selected .rg-radio::after{content:'';width:5px;height:5px;background:#fff;border-radius:50%;display:block;}

/* ── Separador ── */
.rg-divider{border:none;border-top:1px solid var(--border);margin:4px 0 24px;}

/* ── Campos de texto ── */
.rg-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:28px;
}
.rg-field{display:flex;flex-direction:column;gap:6px;}
.rg-field.full{grid-column:1/-1;}
.rg-field label{
  font-family:'JetBrains Mono',monospace;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted2);
}
.rg-field .rg-opt{color:var(--muted);font-size:10px;text-transform:none;letter-spacing:0;}
.rg-field input{
  background:var(--panel2);
  border:1px solid var(--border);
  border-radius:8px;
  padding:11px 14px;
  font-family:'Inter',sans-serif;
  font-size:14px;
  color:var(--text);
  outline:none;
  transition:border-color .15s;
  width:100%;
}
.rg-field input::placeholder{color:var(--muted);}
.rg-field input:focus{border-color:rgba(255,90,43,.5);}
.rg-field input.error{border-color:var(--danger);}

/* ── Nota de privacidad ── */
.rg-privacy{
  font-size:12px;
  color:var(--muted);
  line-height:1.55;
  margin-bottom:20px;
  font-family:'Inter',sans-serif;
}
.rg-privacy a{color:var(--muted2);text-decoration:underline;}

/* ── Botón submit ── */
.rg-submit{
  width:100%;
  background:var(--orange);
  color:#fff;
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:15px;
  border:none;
  border-radius:10px;
  padding:15px 28px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:opacity .15s;
}
.rg-submit:hover{opacity:.9;}
.rg-submit:disabled{opacity:.5;cursor:not-allowed;}
.rg-submit svg{flex-shrink:0;}

/* ── Estado loading ── */
.rg-spinner{
  width:16px;height:16px;
  border:2px solid rgba(255,255,255,.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:rg-spin .7s linear infinite;
  display:none;
}
@keyframes rg-spin{to{transform:rotate(360deg);}}

/* ── Error global ── */
.rg-error-msg{
  background:rgba(240,84,84,.08);
  border:1px solid rgba(240,84,84,.25);
  border-radius:8px;
  padding:12px 16px;
  font-size:13px;
  color:#FF9090;
  margin-top:14px;
  display:none;
  font-family:'Inter',sans-serif;
}

/* ── Confirmación (éxito en línea) ── */
.rg-success{display:none;text-align:center;padding:10px 0;}
.rg-success-icon{
  width:56px;height:56px;border-radius:50%;
  background:rgba(255,90,43,.12);color:var(--orange);
  display:flex;align-items:center;justify-content:center;
  font-size:26px;margin:0 auto 18px;
  border:1px solid rgba(255,90,43,.35);
}
.rg-success-title{text-align:center;}
.rg-success-sub{text-align:center;margin-bottom:0;}

/* ── Responsive ── */
@media(max-width:600px){
  .rg-form-wrap{padding:28px 20px;}
  .rg-options{grid-template-columns:1fr;}
  .rg-fields{grid-template-columns:1fr;}
  .rg-field.full{grid-column:1;}
}
