/* =============================================================================
   m-auth.css — استایل مدرن صفحات احراز هویت (login, register, OTP)
   نسخه‌ی موبایل‌فرست با ظاهر premium
   ========================================================================== */

body.capati-auth-page {
    background: #07070b;
    color: var(--m-text);
    font-family: var(--m-font);
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
}

/* پس‌زمینه دکوراتیو با چند blob رنگی */
body.capati-auth-page .auth-page,
body.capati-auth-page .auth-page--login,
body.capati-auth-page .auth-page--cinema {
    background:
        radial-gradient(circle at 15% 15%, rgba(99,102,241,.22) 0%, transparent 45%),
        radial-gradient(circle at 85% 85%, rgba(139,92,246,.18) 0%, transparent 45%),
        radial-gradient(circle at 50% 50%, rgba(59,130,246,.10) 0%, transparent 60%),
        #07070b;
    min-height: 100vh;
    min-height: 100dvh;
    position: relative;
    overflow-x: hidden;
}
body.capati-auth-page .auth-page::before,
body.capati-auth-page .auth-page--cinema::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at top, rgba(99,102,241,.06), transparent 60%),
        linear-gradient(180deg, transparent 0%, rgba(0,0,0,.4) 100%);
    pointer-events: none;
    z-index: 0;
}

/* گرادیان دکوراتیو آبی-مشکی پایین صفحه */
body.capati-auth-page .auth-page::after,
body.capati-auth-page .auth-page--cinema::after {
    content: '';
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 42vh;
    background:
        radial-gradient(ellipse at 50% 100%, rgba(37,99,235,.35) 0%, rgba(29,78,216,.18) 35%, transparent 70%),
        linear-gradient(180deg, transparent 0%, rgba(8,12,28,.85) 55%, #03050d 100%);
    pointer-events: none;
    z-index: 0;
}
body.capati-auth-page .auth-login-split,
body.capati-auth-page .auth-page > * {
    position: relative;
    z-index: 1;
}

/* brand: لوگو بالا — بدون کادر، خود لوگو */
body.capati-auth-page .auth-login-brand {
    margin-bottom: 2rem;
    padding-top: 0;
}
body.capati-auth-page .auth-login-brand .navbar-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: none;
    border: 0;
}
body.capati-auth-page .auth-login-brand img,
body.capati-auth-page .auth-brand img {
    width: 96px;
    height: 96px;
    object-fit: contain;
    filter: drop-shadow(0 10px 28px rgba(99,102,241,.55));
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    border-radius: 0;
}

/* کارت اصلی فرم */
body.capati-auth-page .auth-login-card,
body.capati-auth-page .auth-card,
body.capati-auth-page .card {
    background: linear-gradient(180deg, rgba(28,28,38,.85) 0%, rgba(20,20,28,.85) 100%);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 22px;
    box-shadow:
        0 16px 48px rgba(0,0,0,.5),
        0 1px 0 rgba(255,255,255,.05) inset;
    padding: 1.5rem 1.25rem;
    color: var(--m-text);
    margin: 0;
}

/* عنوان کارت */
body.capati-auth-page .auth-login-title,
body.capati-auth-page .auth-title {
    background: linear-gradient(135deg, #ffffff 0%, #c7d2fe 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 .25rem;
    letter-spacing: -.02em;
}
body.capati-auth-page .auth-login-card .card-body > .text-center.text-muted,
body.capati-auth-page .auth-login-subtitle {
    color: rgba(255,255,255,.55) !important;
    font-size: .95rem;
    margin-bottom: 1.2rem;
}

body.capati-auth-page p,
body.capati-auth-page .text-muted {
    color: rgba(255,255,255,.6) !important;
}

/* فیلدها */
body.capati-auth-page .mb-2,
body.capati-auth-page .mb-3 {
    margin-bottom: 1rem !important;
}
body.capati-auth-page .form-label,
body.capati-auth-page label {
    color: rgba(255,255,255,.78) !important;
    font-weight: 500;
    font-size: .875rem;
    margin-bottom: .35rem !important;
    display: block;
}
body.capati-auth-page .form-control,
body.capati-auth-page input[type="text"],
body.capati-auth-page input[type="tel"],
body.capati-auth-page input[type="email"],
body.capati-auth-page input[type="password"],
body.capati-auth-page input[type="number"] {
    background-color: rgba(255,255,255,.04) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 14px;
    min-height: 52px;
    font-size: 16px; /* جلوگیری از iOS zoom */
    padding: .8rem 1rem;
    font-family: var(--m-font);
    transition: background .15s, border-color .15s, box-shadow .15s;
    width: 100%;
}
body.capati-auth-page .form-control:focus,
body.capati-auth-page input:focus {
    background-color: rgba(255,255,255,.06) !important;
    border-color: rgba(99,102,241,.55) !important;
    box-shadow: 0 0 0 4px rgba(99,102,241,.15) !important;
    color: #fff !important;
    outline: none;
}
body.capati-auth-page .form-control::placeholder {
    color: rgba(255,255,255,.35) !important;
}

/* دکمه‌ها */
body.capati-auth-page .btn {
    font-weight: 700;
    border-radius: 14px;
    min-height: 52px;
    font-family: var(--m-font);
    transition: transform .12s, box-shadow .18s, background .2s;
    font-size: 1rem;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
}
body.capati-auth-page .btn:active { transform: scale(.97); }

body.capati-auth-page .btn-primary,
body.capati-auth-page .auth-login-submit {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(99,102,241,.45);
    margin-top: .35rem;
}
body.capati-auth-page .btn-primary:hover,
body.capati-auth-page .auth-login-submit:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%) !important;
    box-shadow: 0 8px 28px rgba(99,102,241,.6);
}

body.capati-auth-page .btn-outline-secondary {
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    color: rgba(255,255,255,.85) !important;
}
body.capati-auth-page .btn-outline-secondary:hover {
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(255,255,255,.18) !important;
    color: #fff !important;
}

/* google button */
body.capati-auth-page .btn-light,
body.capati-auth-page .auth-google-btn,
body.capati-auth-page .btn-google {
    background: #fff !important;
    color: #1f2937 !important;
    border: 1px solid rgba(255,255,255,.85) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
body.capati-auth-page .btn-light:hover {
    background: #f3f4f6 !important;
    color: #111 !important;
}

/* لینک‌ها */
body.capati-auth-page a {
    color: #a5b4fc;
    text-decoration: none;
    font-weight: 600;
    transition: color .15s;
}
body.capati-auth-page a:hover { color: #c7d2fe; }

/* divider */
body.capati-auth-page .auth-login-divider,
body.capati-auth-page hr {
    border: 0 !important;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
    margin: 1.25rem 0;
    position: relative;
    opacity: 1;
}
body.capati-auth-page .auth-login-divider::before {
    content: 'یا';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #1a1a24;
    padding: 0 .75rem;
    color: rgba(255,255,255,.4);
    font-size: .8125rem;
    border-radius: 999px;
}

/* alert */
body.capati-auth-page .alert {
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    color: #fff;
    font-size: .95rem;
    padding: .75rem 1rem;
}
body.capati-auth-page .alert-danger {
    background: rgba(239,68,68,.12);
    border-color: rgba(239,68,68,.35);
    color: #fecaca;
}
body.capati-auth-page .alert-success {
    background: rgba(16,185,129,.12);
    border-color: rgba(16,185,129,.35);
    color: #a7f3d0;
}
body.capati-auth-page .alert-info {
    background: rgba(6,182,212,.12);
    border-color: rgba(6,182,212,.35);
    color: #a5f3fc;
}

/* OTP boxes */
body.capati-auth-page .otp-inputs,
body.capati-auth-page .otp-box {
    display: flex;
    gap: .5rem;
    justify-content: center;
    direction: ltr;
    margin: 1rem 0;
}
body.capati-auth-page .otp-inputs input,
body.capati-auth-page input.otp-digit {
    width: 48px;
    height: 56px;
    text-align: center;
    font-size: 1.4rem;
    font-weight: 700;
    padding: 0;
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 12px;
    color: #fff;
}
body.capati-auth-page input.otp-digit:focus {
    border-color: rgba(99,102,241,.6) !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,.15) !important;
}

/* لینک ثبت‌نام پایین کارت */
body.capati-auth-page .auth-login-register {
    margin-top: 1.25rem;
    text-align: center;
    font-size: .95rem;
    color: rgba(255,255,255,.65);
}
body.capati-auth-page .auth-login-register a {
    margin-inline-start: .3rem;
}

/* enamad کوچک‌تر و در پایین صفحه */
body.capati-auth-page .auth-page-enamad {
    margin-top: 1.5rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    opacity: .8;
}
body.capati-auth-page .auth-page-enamad img {
    max-width: 80px;
    height: auto;
}

/* لایه راست (hero/تصویر) — در موبایل مخفی */
@media (max-width: 991.98px) {
    body.capati-auth-page .auth-image-section,
    body.capati-auth-page .auth-login-hero-column { display: none !important; }

    body.capati-auth-page .auth-login-form-column {
        padding: calc(env(safe-area-inset-top, 0px) + .35rem) 1rem 0;
        flex: 1;
        max-width: 100%;
        min-height: 100dvh;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
    }
    body.capati-auth-page .auth-form-container {
        max-width: 420px;
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }
    body.capati-auth-page .auth-login-brand {
        margin-bottom: .5rem;
        padding-top: 0;
    }
    body.capati-auth-page .auth-login-brand img { width: 78px; height: 78px; }
    body.capati-auth-page .auth-login-card,
    body.capati-auth-page .auth-card,
    body.capati-auth-page .card {
        padding: 1.75rem 1.4rem;
    }
    body.capati-auth-page .auth-login-title {
        font-size: 1.4rem;
    }
    body.capati-auth-page .auth-login-split,
    body.capati-auth-page .row.min-vh-100 {
        min-height: 100dvh !important;
        padding-top: env(safe-area-inset-top, 0px);
        --bs-gutter-x: 0;
    }
}

/* روی صفحات بسیار کوچک */
@media (max-width: 380px) {
    body.capati-auth-page .auth-login-card { padding: 1.5rem 1.1rem; }
    body.capati-auth-page .auth-login-brand img { width: 72px; height: 72px; }
    body.capati-auth-page .auth-login-title { font-size: 1.3rem; }
}

/* دسکتاپ: hero با gradient زنده‌تر */
@media (min-width: 992px) {
    body.capati-auth-page .auth-form-container {
        max-width: 440px;
        margin: 0 auto;
        padding: 2rem 1rem;
    }
}
