/* ===== صفحات ورود و تایید کد — امتداد استایل نیازینو ===== */

.auth-wrap{min-height:calc(100vh - 88px);display:flex;align-items:center;justify-content:center;padding:30px 8% 60px}

.auth-card{width:100%;max-width:420px;background:rgba(255,255,255,.09);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.16);border-radius:26px;padding:42px 36px 36px;text-align:center;box-shadow:0 30px 70px rgba(0,0,0,.3)}

.auth-icon{width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,#2563eb,#06b6d4);display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 22px}

.auth-card h1{font-size:24px;margin:0 0 8px}
.auth-card .sub{margin:0 0 30px;font-size:14.5px;opacity:.7;line-height:1.8}

.phone-field{position:relative;margin-bottom:18px}
.phone-field input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.94);border:0;border-radius:14px;padding:17px 18px 17px 50px;font-family:inherit;font-size:18px;letter-spacing:.5px;color:#0f172a;outline:none;text-align:center;direction:ltr}
.phone-field input:focus{box-shadow:0 0 0 3px #06b6d4}
.phone-field .flag{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:14px;color:#64748b;pointer-events:none}

.auth-btn{width:100%;border:0;cursor:pointer;background:linear-gradient(90deg,#2563eb,#06b6d4);color:#fff;padding:17px;border-radius:15px;font-size:16.5px;font-weight:700;font-family:inherit;box-shadow:0 16px 34px rgba(37,99,235,.32);transition:transform .15s;margin-top:4px}
.auth-btn:hover{transform:translateY(-2px)}
.auth-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

.auth-terms{margin-top:20px;font-size:12px;opacity:.55;line-height:1.9}
.auth-terms a{color:#7dd3fc;text-decoration:none}

.error-msg{color:#fb7185;font-size:13px;margin:-8px 0 16px;min-height:16px}

/* ===== صفحه تایید کد ===== */
.otp-phone{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:8px 16px;border-radius:999px;font-size:13.5px;margin-bottom:30px;direction:ltr}
.otp-phone button{border:0;background:none;color:#7dd3fc;font-family:inherit;font-size:12.5px;cursor:pointer;direction:rtl}

.otp-boxes{display:flex;justify-content:center;gap:10px;direction:ltr;margin-bottom:22px}
.otp-boxes input{width:48px;height:58px;border-radius:14px;border:0;background:rgba(255,255,255,.94);text-align:center;font-size:24px;font-weight:700;color:#0f172a;outline:none;font-family:inherit}
.otp-boxes input:focus{box-shadow:0 0 0 3px #06b6d4}
.otp-boxes input.filled{box-shadow:0 0 0 2px rgba(6,182,212,.5)}

.resend-row{font-size:13.5px;opacity:.75;margin-bottom:26px}
.resend-row button{border:0;background:none;color:#7dd3fc;font-family:inherit;font-size:13.5px;cursor:pointer;padding:0}
.resend-row button:disabled{color:inherit;opacity:.6;cursor:default}

.success-tick{width:64px;height:64px;border-radius:50%;background:rgba(34,197,94,.18);border:1px solid rgba(34,197,94,.4);display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 20px;color:#4ade80}

/* ===== ریسپانسیو موبایل ===== */
@media (max-width:480px){
  .auth-wrap{padding:20px 5% 40px}
  .auth-card{padding:30px 20px 28px;border-radius:22px}
  .auth-card h1{font-size:20px}
  .phone-field input{font-size:16px;padding:15px 16px 15px 44px}
  .otp-boxes{gap:6px}
  .otp-boxes input{width:40px;height:50px;font-size:20px}
}

.back-link{display:flex;align-items:center;gap:6px;color:#fff;opacity:.85;text-decoration:none;font-size:15px}
.back-link:hover{opacity:1}