/* Login estilo referencia: fondo recital + tarjeta cristal.
   TODO: reemplazar el fondo CSS por foto con licencia:
   .auth-hero { background-image: url('../img/concert.jpg'); background-size: cover; } */
.auth-hero{
  min-height:calc(100vh - 73px);
  display:flex;align-items:center;justify-content:center;
  padding:48px 16px;
  background-color:#0b1020;
  background-image:
    radial-gradient(ellipse 45% 60% at 18% 0%, rgba(255,255,255,.85), transparent 60%),
    radial-gradient(ellipse 35% 55% at 82% 0%, rgba(180,200,255,.5), transparent 60%),
    radial-gradient(ellipse 30% 40% at 12% 35%, rgba(120,160,255,.35), transparent 65%),
    radial-gradient(ellipse 40% 35% at 88% 88%, rgba(255,120,60,.28), transparent 65%),
    linear-gradient(180deg, #101a33 0%, #0b1020 55%, #1a0f0a 100%);
}
.auth-card{
  width:480px;max-width:100%;
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.6);
  border-radius:20px;
  box-shadow:0 24px 64px rgba(0,0,0,.35);
  padding:48px 56px;text-align:center;
}
.auth-card h1{font-size:3rem;margin:0 0 8px;font-weight:800}
.auth-welcome{font-size:1.15rem;font-weight:600;margin:0 0 28px}
.auth-google{margin-bottom:8px}
.auth-divider{display:flex;align-items:center;gap:12px;color:var(--muted-500);margin:16px 0;font-size:14px}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.auth-field{margin:14px 0}
.auth-field input{
  width:100%;padding:16px 24px;text-align:center;font-size:15px;
  border:1px solid transparent;border-radius:999px;background:rgba(255,255,255,.95);
  box-shadow:0 2px 8px rgba(16,24,64,.08);font-family:inherit;
}
.auth-field input:focus{outline:2px solid var(--brand-600)}
.auth-field .errorlist{list-style:none;padding:0;color:#b00020;font-size:13px}
.auth-field--password{position:relative}
.auth-field--password input{padding-right:52px}
.auth-eye{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--brand-600);cursor:pointer;padding:4px}
.auth-welcome--only{margin-bottom:28px}
.auth-phone{
  display:flex;align-items:center;gap:0;
  background:rgba(255,255,255,.95);border-radius:999px;
  box-shadow:0 2px 8px rgba(16,24,64,.08);padding:6px 12px;
}
.auth-phone select{
  border:0;background:transparent;font-family:inherit;font-size:14px;font-weight:600;
  padding:10px 4px;max-width:128px;cursor:pointer;
}
.auth-phone select:focus{outline:none}

.auth-phone:focus-within{
  outline:none;
  box-shadow:0 0 0 2px var(--brand-600);
  border-color:var(--brand-600);
}
.auth-phone input:focus{ outline:none; box-shadow:none; }

.auth-phone:focus-within{outline:2px solid var(--brand-600)}
.auth-phone .errorlist{flex-basis:100%}
.auth-referral{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 4px;font-size:14px}
.auth-referral ul,.auth-referral div[id^="id_has_referral"]{list-style:none;display:flex;gap:16px;margin:0;padding:0}
.auth-referral li label,.auth-referral div[id^="id_has_referral"] label{display:flex;align-items:center;gap:6px;cursor:pointer}
.auth-referral input[type="radio"]{accent-color:var(--brand-600);width:18px;height:18px}
.auth-terms{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px 0;font-size:14px}
.auth-terms input[type="checkbox"]{accent-color:var(--brand-600);width:18px;height:18px}
.auth-terms .errorlist{list-style:none;padding:0;color:#b00020;font-size:13px}
.auth-submit{display:block;width:65%;margin:20px auto 0;padding:16px;font-size:16px}
.auth-badge{
  width:44px;height:44px;border-radius:50%;background:var(--brand-600);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.auth-resend{margin-top:14px;font-size:13px}
.auth-resend a{color:var(--ink-900);text-decoration:none}
.auth-resend a:hover{text-decoration:underline}
.auth-forgot{margin-top:14px;font-size:13px}
.auth-forgot a,.auth-switch a{color:var(--ink-900);text-decoration:none}
.auth-forgot a:hover,.auth-switch a:hover{text-decoration:underline}
.auth-switch{font-size:14px;color:var(--muted-500)}
@media(max-width:560px){.auth-card{padding:36px 24px}}
.recover-back{margin:8px 0 0}
.recover-back a{color:var(--ink-900);text-decoration:none;font-size:24px}
.recover-title{font-size:1.9rem;margin:4px 0 40px;font-weight:800}
.recover-card{
  position:relative;max-width:480px;margin:0 auto;text-align:center;
  background:var(--trust-bg);border-radius:var(--radius-lg);padding:56px 32px 32px;
}
.recover-badge{
  position:absolute;top:-20px;left:50%;transform:translateX(-50%);
  width:40px;height:40px;border-radius:50%;background:var(--brand-600);
  display:flex;align-items:center;justify-content:center;
}
.recover-text{font-size:15px;margin:0 0 8px}
.recover-card .auth-field input{background:#fff}