/* ============================================================================
   login.css — safahat-e vorud/sabtenam
   (Account/Login, Confirm, Password, Register, ForgotPassword)

   In file KHOD-KAFI ast. _SecondLayout digar style.css (108KB) va icon.css (40KB)
   ra load nemikonad, pas har chizi ke in safahat lazem darand bayad hamin ja bashad.
   Chizi ke hanuz az birun miayad: bootstrap-rtl (grid + utility) va base.css
   (font-e Anjoman + helper-haye .font-XX).

   Hameye class-haye ekhtesasi ba dz-login- shoru mishavand ta ba template ghati nashavand.
   ========================================================================== */

/* --- 0) token-ha ----------------------------------------------------------- */
.login-page {
    --dz-brand: #6023cf;
    --dz-brand-soft: #8b4dff;
    --dz-ink: #1b1930;
    --dz-ink-2: #4b4966;
    --dz-muted: #83819b;
    --dz-line: #e8e6f2;
    --dz-field: #fbfaff;
    --dz-radius: 1.4rem;
    --dz-ease: cubic-bezier(.4, 0, .2, 1);
}

/* --- 1) sahne --------------------------------------------------------------
   Ghablan style.css be .login-page «position: fixed + height: 100vh» dade bud va
   inja bayad ba overflow/margin dorostesh mikardim. Hala ke style.css az in masir
   birun amade, hamun avval dorost neveshte mishavad: yek container-e adi ba
   min-height ke khodesh scroll mishavad. */
.login-page {
    position: relative;
    min-height: 100vh;
    padding: 4rem 1.5rem;
    background: #f6f5fb;
    overflow: hidden;
    align-items: center;
}

/* do lakke-ye noor-e mat ke kheyli aheste harekat mikonand — tanha tazyin-e safhe */
.login-page::before,
.login-page::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    z-index: 0;
}

.login-page::before {
    width: 42rem;
    height: 42rem;
    top: -14rem;
    inset-inline-end: -12rem;
    background: rgba(96, 35, 207, .16);
    animation: dz-drift 18s var(--dz-ease) infinite alternate;
}

.login-page::after {
    width: 34rem;
    height: 34rem;
    bottom: -12rem;
    inset-inline-start: -10rem;
    background: rgba(139, 77, 255, .12);
    animation: dz-drift 22s var(--dz-ease) infinite alternate-reverse;
}

@keyframes dz-drift {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(3rem, 4rem, 0) scale(1.12); }
}

/* --- 2) card --------------------------------------------------------------- */
.login-page .login-box {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 43rem;
    min-height: auto;
    margin: auto;
    padding: 4.5rem 3.5rem;
    border: 1px solid var(--dz-line) !important;
    border-radius: 2rem;
    box-shadow: 0 2.4rem 6rem -2rem rgba(27, 25, 48, .18);
    animation: dz-rise .55s var(--dz-ease) both;
}

@keyframes dz-rise {
    from { opacity: 0; transform: translateY(1.8rem) scale(.985); }
    to   { opacity: 1; transform: none; }
}

/* vorud-e pelle-pelle-ye mohtava-ye card */
.login-page .login-box > * {
    animation: dz-fade-up .5s var(--dz-ease) both;
}

.login-page .login-box > *:nth-child(1) { animation-delay: .10s; }
.login-page .login-box > *:nth-child(2) { animation-delay: .16s; }
.login-page .login-box > *:nth-child(3) { animation-delay: .22s; }
.login-page .login-box > *:nth-child(4) { animation-delay: .28s; }

@keyframes dz-fade-up {
    from { opacity: 0; transform: translateY(1rem); }
    to   { opacity: 1; transform: none; }
}

/* --- 3) logo --------------------------------------------------------------- */
.login-page .logo {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 3rem !important;
}

.login-page .logo a {
    display: flex;
    width: 15rem;
    transition: transform .3s var(--dz-ease);
}

.login-page .logo a:hover {
    transform: scale(1.04);
}

.login-page .logo a img,
.login-page .logo img {
    width: 100%;
    height: auto;
}

/* --- 4) onvan -------------------------------------------------------------- */
.dz-login-title {
    display: block;
    font-size: 1.9rem !important;
    font-weight: 700 !important;
    color: var(--dz-ink);
    letter-spacing: -.02em;
}

.dz-login-subtitle {
    display: block;
    margin-top: 1rem;
    color: var(--dz-muted);
    line-height: 2.1;
}

/* --- 5) field-ha ----------------------------------------------------------- */
.dz-login-field {
    margin-top: 2.4rem;
}

.dz-login-field > label,
.dz-login-captcha > label {
    display: block;
    margin-bottom: .9rem;
    color: var(--dz-ink-2);
}

.login-page .form-control {
    height: 5.2rem;
    padding: 0 1.6rem;
    font-size: 1.6rem !important;
    color: var(--dz-ink);
    background-color: var(--dz-field);
    border: 1.5px solid var(--dz-line);
    border-radius: var(--dz-radius) !important;
    transition: border-color .22s var(--dz-ease), background-color .22s var(--dz-ease), box-shadow .22s var(--dz-ease);
}

.login-page .form-control::placeholder {
    color: #b3b1c6;
    font-size: 1.3rem !important;
}

.login-page .form-control:hover {
    border-color: #d6d2e8;
}

.login-page .form-control:focus {
    background-color: #fff;
    border-color: var(--dz-brand);
    box-shadow: 0 0 0 .4rem rgba(96, 35, 207, .12);
}

/* felesh-haye bala/payin-e input[type=number] roo desktop */
.login-page input[type="number"]::-webkit-inner-spin-button,
.login-page input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.login-page input[type="number"] {
    -moz-appearance: textfield;
}

/* kade code-e yekbar-masraf */
.dz-login-code {
    letter-spacing: .8rem;
    text-indent: .8rem;
    font-size: 2rem !important;
    font-weight: 700 !important;
}

/* payam-e khata: be ja-ye parididan, aheste miayad */
.login-page .text-danger:not(:empty) {
    display: block;
    margin-top: .7rem;
    font-size: 1.2rem !important;
    animation: dz-fade-up .25s var(--dz-ease) both;
}

/* --- 6) link-haye komaki --------------------------------------------------- */
.dz-login-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--dz-ink-2);
    padding: 1.3rem 0;
    border-bottom: 1px solid var(--dz-line);
    transition: color .22s var(--dz-ease);
}

.dz-login-link:last-of-type {
    border-bottom: 0;
}

.dz-login-link:hover,
.dz-login-link:focus {
    color: var(--dz-brand);
}

.dz-login-link .dz-icon {
    transition: transform .22s var(--dz-ease);
}

/* dir=rtl: felesh be chap eshare mikonad, pas «jelo raftan» yani chap */
.dz-login-link:hover .dz-icon {
    transform: translateX(-.4rem);
}

/* --- 7) timer + ersal-e dobare-ye code ------------------------------------- */
.timerLogin {
    margin-top: 1.6rem;
    color: var(--dz-muted);
    direction: ltr;
    font-variant-numeric: tabular-nums;
}

.dz-login-resend {
    display: block;
    margin-bottom: 1.6rem;
    color: var(--dz-ink-2);
    cursor: pointer;
    transition: color .22s var(--dz-ease), opacity .22s var(--dz-ease);
}

.dz-login-resend.d-block {
    animation: dz-fade-up .35s var(--dz-ease) both;
}

.dz-login-resend:hover {
    color: var(--dz-brand);
}

/* --- 8) captcha ------------------------------------------------------------ */
.dz-login-captcha {
    margin-top: 2.4rem;
}

.dz-login-captcha-row {
    display: flex;
    align-items: stretch;
    gap: 1rem;
}

.dz-login-captcha img {
    height: 5.2rem;
    width: auto;
    max-width: 100%;
    border: 1.5px solid var(--dz-line);
    border-radius: var(--dz-radius);
    background: #fff;
}

.dz-login-captcha-refresh {
    height: 5.2rem;
    width: 5.2rem;
    flex: 0 0 5.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: var(--dz-brand);
    background: var(--dz-field);
    border: 1.5px solid var(--dz-line);
    border-radius: var(--dz-radius);
    transition: background-color .22s var(--dz-ease), border-color .22s var(--dz-ease);
}

.dz-login-captcha-refresh:hover {
    background: #f2edfd;
    border-color: #d6c8f5;
}

.dz-login-captcha-refresh .dz-icon {
    transition: transform .5s var(--dz-ease);
}

/* JS in class ra hengam-e gereftan-e tasvir-e jadid ezafe mikonad */
.dz-login-captcha-refresh.is-spinning .dz-icon {
    transform: rotate(-360deg);
}

.dz-login-captcha input {
    margin-top: 1rem;
}

/* --- 9) checkbox ----------------------------------------------------------- */
.dz-login-check {
    display: flex;
    align-items: center;
    margin-top: 2rem;
}

.dz-login-check input[type="checkbox"] {
    width: 1.8rem;
    height: 1.8rem;
    margin: 0;
    accent-color: var(--dz-brand);
    cursor: pointer;
}

.dz-login-check label {
    margin: 0;
    padding-right: .9rem;
    color: var(--dz-ink-2);
    cursor: pointer;
}

/* --- 10) dokme-ye asli ----------------------------------------------------- */
.login-page .btn.dz-login-submit {
    position: relative;
    overflow: hidden;
    height: 5.2rem;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .9rem;
    border: 0;
    border-radius: var(--dz-radius);
    background: linear-gradient(135deg, var(--dz-brand) 0%, var(--dz-brand-soft) 100%);
    color: #fff;
    font-weight: 700 !important;
    box-shadow: 0 .8rem 2rem -.6rem rgba(96, 35, 207, .55);
    transition: transform .22s var(--dz-ease), box-shadow .22s var(--dz-ease), opacity .22s var(--dz-ease);
}

/* barghe-ye narm rooye hover */
.login-page .btn.dz-login-submit::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .28) 50%, transparent 70%);
    transform: translateX(-120%);
    transition: transform .7s var(--dz-ease);
}

.login-page .btn.dz-login-submit:hover:not(:disabled) {
    color: #fff;
    transform: translateY(-.2rem);
    box-shadow: 0 1.2rem 2.6rem -.6rem rgba(96, 35, 207, .6);
}

.login-page .btn.dz-login-submit:hover:not(:disabled)::before {
    transform: translateX(120%);
}

.login-page .btn.dz-login-submit:active:not(:disabled) {
    transform: translateY(0);
}

.login-page .btn.dz-login-submit:disabled {
    opacity: .75;
    cursor: progress;
    transform: none;
}

/* Halat-e «درحال پردازش»: ta zamani ke server javab bedahad yek spinner mimanad
   ta karbar bedanad chizi dar hal-e anjam ast — dokme-ye khamush-e bi-harekat
   hess-e hang midahad. */
.login-page .btn.dz-login-submit:disabled::after {
    content: "";
    width: 1.7rem;
    height: 1.7rem;
    border: .2rem solid rgba(255, 255, 255, .35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: dz-spin .7s linear infinite;
}

@keyframes dz-spin {
    to { transform: rotate(360deg); }
}

/* --- 11) matn-e ghavanin --------------------------------------------------- */
.login-page p.dz-login-terms {
    margin-top: 2.8rem !important;
    color: var(--dz-muted);
    line-height: 2.1;
    text-align: justify;
}

.dz-login-terms a {
    color: var(--dz-brand);
    border-bottom: 1px solid rgba(96, 35, 207, .3);
    transition: border-color .22s var(--dz-ease);
}

.dz-login-terms a:hover {
    border-bottom-color: var(--dz-brand);
}

/* --- 12) icon-haye SVG-e inline --------------------------------------------
   ja-ye <i class="icon-*"> ra gereftand ta icon.css (40KB) va font-e icomoon
   (~258KB baraye 2 icon) az masir-e login hazf shavad. */
.dz-icon {
    flex: 0 0 auto;
    display: inline-block;
    vertical-align: middle;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* --- 13) mobile ------------------------------------------------------------ */
@media (max-width: 575.98px) {
    .login-page {
        padding: 2.5rem 1.2rem;
    }

    .login-page .login-box {
        padding: 3.5rem 2.2rem;
        border-radius: 1.8rem;
    }

    .login-page .logo a {
        width: 13rem;
    }

    .dz-login-title {
        font-size: 1.7rem !important;
    }
}

/* --- 14) ehteram be tanzim-e sistem ---------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .login-page *,
    .login-page *::before,
    .login-page *::after {
        animation: none !important;
        transition: none !important;
    }
}

/* --- 15) typography-e ghat'i --------------------------------------------------
   Markup-e in safahat helper-haye .font-12/.font-13/.font-14 va .lead-e bootstrap
   ra hamrah darad ke hameshan font-size ra ba !important set mikonand. login.css
   ba'd az base.css/bootstrap load mishavad, pas hamin block harf-e akhar ra mizanad
   va andaze-ha be ja-ye 3 ja, faghat inja tanzim mishavand. */
.login-page .dz-login-title {
    font-size: 1.9rem !important;
}

.login-page .dz-login-subtitle {
    font-size: 1.35rem !important;
}

.login-page .dz-login-field > label,
.login-page .dz-login-captcha > label {
    font-size: 1.3rem !important;
}

.login-page .dz-login-link,
.login-page .dz-login-resend,
.login-page .timerLogin {
    font-size: 1.3rem !important;
    font-weight: normal !important;
}

.login-page .dz-login-check label {
    font-size: 1.3rem !important;
}

.login-page .btn.dz-login-submit {
    font-size: 1.5rem !important;
}

.login-page p.dz-login-terms {
    font-size: 1.2rem !important;
}

/* --- 16) alert-e khata dar bala-ye form ------------------------------------
   masalan vaghti panel-e SMS payam ra ghabul nakarde. */
.login-page .dz-login-alert {
    margin-top: 2rem;
    padding: 1.2rem 1.4rem;
    border: 1px solid #f3c9c9;
    border-radius: var(--dz-radius);
    background: #fdf2f2;
    color: #a12727;
    line-height: 1.9;
    font-size: 1.25rem !important;
    animation: dz-fade-up .3s var(--dz-ease) both;
}