/* ==========================================================================
   signup.css — Registro con prueba gratis (auth/signup.blade.php).
   Se suma a login.css: misma paleta (navy + cobalto) y mismos campos.
   ========================================================================== */

.login-wrapper.login-wrapper--wide{ max-width: 540px; }

.signup-perks{ display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 14px 0 0; padding: 0; list-style: none; font-size: 12.5px; color: var(--login-ink-soft); }
.signup-perks li{ display: inline-flex; align-items: center; gap: 6px; }
.signup-perks i{ color: #2E8B57; }

.signup-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.signup-grid .is-full{ grid-column: 1 / -1; }

.signup-section{ font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--login-ink-soft); margin: 6px 0 12px; }

/* Combo buscable estándar (combo-select.js) con el aspecto de los campos del login. */
.signup-form .crear-field{ margin-bottom: 18px; }
.signup-form .crear-field > label{ display: block; font-size: 14px; font-weight: 600; color: var(--zeus-ink); margin-bottom: 8px; }
.signup-form .crear-req{ color: var(--login-error); margin-left: 2px; }
.signup-form .crear-combo-input{ min-height: 52px; display: flex; align-items: center; border: 1.5px solid var(--login-field-line); border-radius: var(--login-radius); padding: 0 14px; font-size: 15px; background: var(--login-field-bg); }
.signup-form .crear-combo-input.is-open{ border-color: var(--zeus-accent); box-shadow: 0 0 0 4px var(--login-ring); }
.signup-form .crear-error{ font-size: 12px; color: var(--login-error); margin-top: 4px; }

/* El toggle (.crear-toggle-row) vive en login.css: lo comparte con el login. */

.signup-legal{ font-size: 12px; color: var(--login-ink-soft); text-align: center; margin-top: 14px; line-height: 1.5; }
.signup-legal a{ color: var(--zeus-accent); }
.signup-honeypot{ position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 560px){
    .signup-grid{ grid-template-columns: 1fr; }
}

/* Teléfono con bandera (phone-input.js): el selector de país ocupa el lugar del ícono. */
.input-wrapper--phone .iti{ width: 100%; }
.input-wrapper--phone .iti__selected-country{ border-radius: var(--login-radius) 0 0 var(--login-radius); }
.input-wrapper--phone .form-input{ padding-top: 12px; padding-bottom: 12px; }
.signup-form .crear-hint{ font-size: 12px; font-weight: 500; color: var(--login-ink-soft); margin-left: 4px; }
.signup-form .crear-combo-input.is-locked{ background: var(--zeus-bg); cursor: not-allowed; }

/* En el formulario ancho la nota de seguridad entra en una línea: centrada,
   como la versión debajo (en el login angosto ocupa todo el ancho). */
.login-wrapper--wide .security{ justify-content: center; text-align: center; }