/* ═══ AlphaTeam Login Ultra v4 — تجربهٔ ورود لوکس (۲۰۲۶-۰۹-۱۸) ══ */
/* چیپ‌های بالا */
.chips{position:absolute;top:max(12px,env(safe-area-inset-top));left:0;right:0;display:flex;justify-content:center;flex-wrap:nowrap;gap:8px;margin:0;pointer-events:none;z-index:5}
.chip{white-space:nowrap;padding:8px 14px;border-radius:99px;font-size:10.5px;font-weight:800;color:#f7e4a8;background:linear-gradient(135deg,rgba(224,184,98,.14),rgba(111,224,207,.05));border:1px solid rgba(224,184,98,.32);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(0,0,0,.35);animation:chipFloat 5s ease-in-out infinite}
.chip:nth-child(2){animation-delay:.8s;color:#9fe8db;border-color:rgba(111,224,207,.35)}
.chip:nth-child(3){animation-delay:1.6s;color:#d4c6ff;border-color:rgba(179,155,251,.35)}
@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:560px){.chip:nth-child(3){display:none}.chip{font-size:9.5px;padding:7px 11px}}
@media(max-width:380px){.chip:nth-child(2){display:none}}

/* شفق قطبی چرخان پشت صحنه */
body::after{content:'';position:fixed;inset:-25%;pointer-events:none;z-index:0;
 background:conic-gradient(from 0deg at 50% 50%,transparent 0deg,rgba(224,184,98,.06) 45deg,transparent 95deg,rgba(111,224,207,.055) 165deg,transparent 225deg,rgba(179,155,251,.05) 300deg,transparent 360deg);
 animation:auroraSpin 46s linear infinite}
@keyframes auroraSpin{to{transform:rotate(1turn)}}

/* کارت: حلقهٔ مرزی چرخان + هالهٔ محو + ورود نرم */
.card{animation:cardIn .85s cubic-bezier(.22,.61,.36,1) both}
@keyframes cardIn{from{opacity:0;transform:translateY(28px) scale(.965)}to{opacity:1;transform:none}}
.card::before{content:'';position:absolute;inset:-1.5px;border-radius:27px;z-index:-2;
 background:conic-gradient(from 0deg,rgba(224,184,98,.7),rgba(111,224,207,.35),rgba(179,155,251,.4),rgba(224,184,98,.7));
 animation:haloSpin 8s linear infinite;opacity:.75}
.card::after{content:'';position:absolute;inset:-3px;border-radius:29px;z-index:-1;
 background:conic-gradient(from 0deg,rgba(224,184,98,.5),rgba(111,224,207,.4),rgba(179,155,251,.4),rgba(224,184,98,.5));
 animation:haloSpin 8s linear infinite;filter:blur(16px);opacity:.4}
@keyframes haloSpin{to{transform:rotate(1turn)}}
/* ورود پلکانی اجزای کارت */
.card>*{animation:fadeUp .7s cubic-bezier(.22,.61,.36,1) both}
.card>*:nth-child(1){animation-delay:.10s}.card>*:nth-child(2){animation-delay:.18s}
.card>*:nth-child(3){animation-delay:.26s}.card>*:nth-child(4){animation-delay:.34s}
.card>*:nth-child(5){animation-delay:.42s}.card>*:nth-child(6){animation-delay:.50s}
.card>*:nth-child(7){animation-delay:.58s}.card>*:nth-child(8){animation-delay:.66s}
.card>*:nth-child(9){animation-delay:.74s}.card>*:nth-child(10){animation-delay:.82s}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* بنر: گردی + روبان نور */
.auth-banner{border-radius:20px;overflow:hidden;position:relative}
.auth-banner::after{content:'';position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.16) 46%,transparent 62%);
 background-size:260% 100%;animation:bannerSheen 6.5s ease-in-out infinite}
@keyframes bannerSheen{0%,55%{background-position:130% 0}90%,100%{background-position:-30% 0}}
.auth-banner img{animation:kenBurns 16s ease-in-out infinite alternate}
@keyframes kenBurns{from{transform:scale(1)}to{transform:scale(1.07) translate(-1.5%,1%)}}

/* تیتر: درخشش + گرادیان متحرک (با پایهٔ جامد) */
.title{color:#f5dfae;font-size:clamp(29px,7vw,40px);letter-spacing:.4px;text-shadow:0 0 36px rgba(224,184,98,.28)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
 .title{background:linear-gradient(100deg,#fff8e8,#f5dfae 30%,#e0b862 55%,#6fe0cf 90%);background-size:200% 100%;
 -webkit-background-clip:text;background-clip:text;color:transparent;animation:titleShine 5s ease-in-out infinite}
}
@keyframes titleShine{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
.auth-status{animation:statusBreathe 3.4s ease-in-out infinite}
@keyframes statusBreathe{0%,100%{opacity:.85}50%{opacity:1;text-shadow:0 0 18px rgba(111,224,207,.35)}}

/* تب‌ها: ظرف مخملی + دکمه‌های شناور */
.auth-tabs{box-shadow:inset 0 1px rgba(255,255,255,.05),0 8px 22px rgba(0,0,0,.28)}
.auth-tabs button{transition:transform .25s,box-shadow .25s,filter .25s}
.auth-tabs button:hover{transform:translateY(-1px);filter:brightness(1.06)}
.auth-tabs button:active{transform:scale(.97)}

/* فیلدها: عمق شیشه‌ای + فوکوس طلایی */
input,select{border-radius:14px;transition:border-color .3s,box-shadow .3s,background .3s}
input:hover,select:hover{border-color:rgba(224,184,98,.3)}
.iw:focus-within{box-shadow:0 0 0 3px rgba(224,184,98,.14),0 0 26px rgba(224,184,98,.14);border-radius:15px}
.iw:focus-within .ic svg{stroke:#6fe0cf !important;transition:stroke .3s}
.iw .eye{transition:background .25s,transform .25s}
.iw .eye:hover{background:rgba(255,255,255,.07);transform:scale(1.08)}

/* دکمهٔ اصلی: طلای چهارلایه + جاروب + پرس */
.btn{position:relative;overflow:hidden;border-radius:16px;
 background:linear-gradient(135deg,#fff3c4 0%,#f0d189 28%,#e0b862 55%,#c99a3f 100%);
 color:#241703;text-shadow:0 1px 0 rgba(255,255,255,.35);
 box-shadow:0 16px 38px rgba(224,184,98,.26),inset 0 1px rgba(255,255,255,.5),inset 0 -2px 6px rgba(120,84,20,.25);
 animation:btnPulse 3.2s ease-in-out infinite;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 20px 48px rgba(224,184,98,.36),inset 0 1px rgba(255,255,255,.55)}
.btn:active{transform:translateY(0) scale(.98)}
.btn::after{content:'';position:absolute;top:0;bottom:0;left:-70%;width:45%;
 background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
 transform:skewX(-18deg);animation:btnSweep 3.6s ease-in-out infinite;pointer-events:none}
@keyframes btnSweep{0%,55%{left:-70%}85%,100%{left:130%}}
@keyframes btnPulse{0%,100%{box-shadow:0 16px 38px rgba(224,184,98,.26),inset 0 1px rgba(255,255,255,.5)}50%{box-shadow:0 18px 48px rgba(224,184,98,.42),inset 0 1px rgba(255,255,255,.5)}}

/* ثبت‌نام: قاب خط‌چین طلایی + اسلاید پیکان */
.reg{border:1px dashed rgba(224,184,98,.4);border-radius:16px;
 background:linear-gradient(135deg,rgba(224,184,98,.10),rgba(111,224,207,.04));transition:background .3s,box-shadow .3s,transform .2s}
.reg:hover{background:linear-gradient(135deg,rgba(224,184,98,.18),rgba(111,224,207,.07));box-shadow:0 12px 30px rgba(224,184,98,.15);transform:translateY(-1px)}
.reg::after{content:'←';position:absolute;left:16px;transition:transform .3s}
.reg:hover::after{transform:translateX(-6px)}

/* پاورقی */
.auth-foot a,.card small a{transition:color .25s,text-shadow .25s}
.auth-foot a:hover,.card small a:hover{color:#f7e4a8;text-shadow:0 0 14px rgba(224,184,98,.4)}
.home-link{animation:chipFloat 6s ease-in-out infinite}

/* خطا */
.err{animation:shake .5s ease}
@keyframes shake{0%,100%{transform:none}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}

@media (prefers-reduced-motion:reduce){
 .card::before,.card::after,.btn::after,.auth-banner img,.auth-banner::after,.chip,.title,.card,.card>*,body::after,.home-link,.auth-status{animation:none !important}
}