/* ============================================================
   المنت لاگین - استایل فرم ورود (نسخه 2.0.0)
   قالب‌ها: default | digikala | split (دو ستونه) | elementfile
   بدون گرادینت؛ رنگ‌ها تخت و پاستلی
   ============================================================ */
.elementfile{box-sizing:border-box;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 16px;overflow:auto;font-family:var(--ef-font,inherit);color:#25223f;background:#fff}
.elementfile *,.elementfile *::before,.elementfile *::after{box-sizing:border-box}
.elementfile__wrapper{--c:var(--elementfile-button-color,#4a449a);--ch:var(--elementfile-button-color-hover,#e8194b);width:100%;max-width:420px;margin:0 auto;font-family:inherit}
.flex-1{flex:1}

/* ---------- سربرگ و لوگو ---------- */
.elementfile__wrapper-main-head{position:relative;height:70px;margin-bottom:12px}
.elementfile__wrapper-main-head a{display:block;width:max-content;margin:0 auto}
.elementfile__wrapper-main-head a img{display:block;margin:0 auto;height:70px;object-fit:contain}
.elementfile__wrapper-main-head svg{position:absolute;top:0;bottom:0;height:20px;margin:auto;cursor:pointer}

/* ---------- دکمه‌ی بازگشت به خانه (گرد، کوچک و مرتب) ---------- */
.elementfile .elementfile__home{display:inline-flex;align-items:center;gap:6px;flex:none;align-self:flex-start;width:auto;height:auto;margin:0 0 16px;padding:8px 16px 8px 14px;border-radius:50px;border:1px solid #e6e3f3;background:#fff;color:#5d5a7a;font-size:12.5px;line-height:1;text-decoration:none;transition:background .2s,border-color .2s,color .2s}
.elementfile .elementfile__home svg{flex:none}
.elementfile .elementfile__home:hover,.elementfile .elementfile__home:focus-visible{background:var(--ch);border-color:var(--ch);color:#fff}

/* ---------- تیتر و توضیح ---------- */
.elementfile__wrapper-main-box-title{display:block;margin-bottom:18px;font-size:20px;font-weight:700;color:#25223f}
.elementfile__wrapper-main-box-description{margin-bottom:16px;font-size:14px;line-height:2;color:#8a87a3}
.elementfile__wrapper-main-box-description p{margin:0}

/* ---------- فیلدها ---------- */
.elementfile__wrapper-main input[type=password],.elementfile__wrapper-main input[type=text]{all:unset}
.elementfile__wrapper-main-box-field{margin-bottom:14px}
.elementfile__wrapper-main-box-field input[type=password],.elementfile__wrapper-main-box-field input[type=text]{display:block;box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0;margin-right:0;height:54px;padding:0 16px;font-family:inherit;font-size:16px;color:#25223f;background:#f6f5fb;border:1.5px solid transparent!important;border-radius:16px!important;transition:border-color .2s,background .2s,box-shadow .2s}
.elementfile__wrapper-main-box-field input::placeholder{color:#a9a6c0}
.elementfile__wrapper-main-box-field input[type=password]:focus,.elementfile__wrapper-main-box-field input[type=text]:focus{background:#fff;border-color:var(--c)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 14%,transparent)}
.elementfile__wrapper-main-box-field-invalid{border-color:#ef4444!important}
.elementfile__wrapper-main-box-field-invalid~span{display:block;margin-top:7px;font-size:13px;color:#ef4444}
#elementfile__wrapper-main-otp input[name='elementfile__first_name'],#elementfile__wrapper-main-otp input[name='elementfile__last_name']{width:48%!important;margin-bottom:14px;text-align:center}
#elementfile__wrapper-main-otp input[name='elementfile__first_name']{float:right}
#elementfile__wrapper-main-otp input[name='elementfile__last_name']{float:left}
#elementfile__wrapper-main-otp input[name='elementfile__password_register'],#elementfile__wrapper-main-otp input[name='elementfile__email']{margin-bottom:14px;text-align:center}
#elementfile__wrapper-main-otp input[name='elementfile__otp'],#elementfile__wrapper-main-otp-reset input[name='elementfile__otp-reset']{letter-spacing:1rem;text-align:center}
#elementfile__wrapper-main-otp input[name='elementfile__otp']::placeholder,#elementfile__wrapper-main-otp-reset input[name='elementfile__otp-reset']::placeholder{letter-spacing:normal}
.clear{clear:both}
.elementfile__field-password{position:relative}
.elementfile__field-password input{padding-left:46px!important}
.elementfile__eye{position:absolute!important;left:10px;top:50%;transform:translateY(-50%);width:34px!important;height:34px!important;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#a9a6c0!important;cursor:pointer;display:flex!important;align-items:center;justify-content:center}
.elementfile__eye:hover,.elementfile__eye.is-on{color:var(--c)!important;background:#f1effa!important}

/* ---------- دکمه‌ی اصلی ---------- */
.elementfile .elementfile__wrapper-main button:not(.elementfile__tab):not(.elementfile__eye){display:flex;align-items:center;justify-content:center;width:100%;height:54px;padding:0 24px;border:0;border-radius:16px;font-family:inherit;font-size:15px;font-weight:700;color:#fff;background:var(--c);cursor:pointer;transition:background .2s,transform .15s}
.elementfile .elementfile__wrapper-main button:not(.elementfile__tab):not(.elementfile__eye):hover{background:var(--ch)}
.elementfile .elementfile__wrapper-main button:not(.elementfile__tab):not(.elementfile__eye):active{transform:scale(.985)}

/* ---------- لینک‌ها، تایمر ---------- */
.elementfile__wrapper-main-box-action{display:flex;flex-flow:column;justify-content:space-between;margin:14px 0}
.elementfile__wrapper-main-box-timer-resend,.elementfile__wrapper-main-box-action a{display:inline-flex;align-items:center;width:max-content;margin-bottom:10px;font-size:13px;color:var(--c);text-decoration:none;cursor:pointer}
.elementfile__wrapper-main-box-timer-resend{margin-bottom:0}
.elementfile__wrapper-main-box-timer-resend svg,.elementfile__wrapper-main-box-action a svg{display:inline-block;margin-right:4px;position:relative;top:.5px}
.elementfile__wrapper-main-box-action a:hover{color:var(--ch)}
.elementfile__wrapper-main-box-timer{display:flex;align-items:center;justify-content:center;margin:14px 0;font-size:14px}
.elementfile__wrapper-main-box-timer-countdown{color:#7b7897}
.elementfile__wrapper-main-box-timer-countdown span{display:inline-block;margin-left:5px}
.elementfile__terms{margin:10px 0;text-align:center;font-size:12px;color:#8a87a3}
.elementfile__terms p{margin:0}
.elementfile__terms a{text-decoration:none}

/* ---------- پیام‌ها ---------- */
.elementfile__wrapper-messages>div{display:flex;align-items:center;margin-top:14px;padding:14px 16px;border-radius:16px;font-size:14px}
.elementfile__wrapper-messages>div svg{display:inline-block;margin-left:10px}
.elementfile__wrapper-messages-success{background:#e7f7ee;color:#157a45;border:1px solid #c9ecd8}
.elementfile__wrapper-messages-error{background:#fdecef;color:#c4163b;border:1px solid #f7cdd6}

/* ---------- تب «کد یکبار مصرف / رمز عبور» ---------- */
.elementfile__tabs{display:flex;gap:4px;margin-bottom:18px;padding:4px;border-radius:50px;background:#f1effa}
.elementfile__tab{flex:1;padding:10px 6px;border:0;border-radius:50px;background:transparent;color:#6d6a8a;font-family:inherit;font-size:13px;cursor:pointer;transition:background .2s,color .2s}
.elementfile__tab.is-active{background:#fff;color:#25223f;font-weight:700;box-shadow:0 1px 4px rgba(37,34,63,.12)}

/* ---------- تاریخ تولد ---------- */
.elementfile__birthdate-wrap{margin-bottom:14px}
.elementfile__birthdate-wrap input.ef-birthdate{width:100%;cursor:pointer}

/* ---------- لودر ---------- */
.lds-ellipsis,.lds-ellipsis div{box-sizing:border-box}
.lds-ellipsis{display:flex;position:relative;width:80px;height:50px;margin:0 auto;align-items:center;justify-content:center}
.lds-ellipsis div{position:absolute;top:19.3px;width:12.3px;height:12.3px;border-radius:50%;background:currentColor;animation-timing-function:cubic-bezier(0,1,1,0)}
.lds-ellipsis div:nth-child(1){left:8px;animation:lds-ellipsis1 .6s infinite}
.lds-ellipsis div:nth-child(2){left:8px;animation:lds-ellipsis2 .6s infinite}
.lds-ellipsis div:nth-child(3){left:32px;animation:lds-ellipsis2 .6s infinite}
.lds-ellipsis div:nth-child(4){left:56px;animation:lds-ellipsis3 .6s infinite}
@keyframes lds-ellipsis1{0%{transform:scale(0)}100%{transform:scale(1)}}
@keyframes lds-ellipsis3{0%{transform:scale(1)}100%{transform:scale(0)}}
@keyframes lds-ellipsis2{0%{transform:translate(0,0)}100%{transform:translate(24px,0)}}

/* ============================================================
   کادرهای مربعی کد تایید (قالب «المنت لاگین» یا گزینه‌ی کادرهای جدا)
   ============================================================ */
.efo{display:flex;justify-content:center;gap:10px;direction:ltr;margin:4px 0}
.elementfile .efo .efo-box{all:unset;box-sizing:border-box;flex:1 1 0;min-width:0;max-width:62px;height:64px;text-align:center;font-family:inherit;font-size:26px;font-weight:700;color:#25223f;background:#fff;border:2px solid #e3e0f2;border-radius:16px;caret-color:var(--c);transition:border-color .15s,box-shadow .15s,background .15s,transform .15s}
.elementfile .efo .efo-box:focus{border-color:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 16%,transparent);transform:translateY(-1px)}
.elementfile .efo .efo-box.is-filled{border-color:var(--c);background:color-mix(in srgb,var(--c) 7%,#fff)}
.efo.is-invalid .efo-box,.efo.is-error .efo-box{border-color:#e11d48}
.efo.is-error{animation:efo-shake .4s}
@keyframes efo-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.elementfile--otpboxes input.efo-main{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden}
.elementfile--otpboxes .elementfile__wrapper-main-box-field{position:relative}

/* ============================================================
   قالب‌ها
   ============================================================ */
/* پیش‌فرض: کارت با سایه */
.elementfile-default .elementfile__wrapper-main .elementfile__wrapper-main-box{padding:35px;border-radius:20px;background:#fff;box-shadow:0 5px 25px rgba(37,34,63,.08)}
.elementfile-default .elementfile__wrapper-main>div:not(.elementfile__wrapper-main-head){padding:25px}

/* دیجی‌کالا: کادر مرزدار */
.elementfile-digikala .elementfile__wrapper-main{padding:35px;border:1px solid #cbd5e1;border-radius:15px;background:#fff}
.elementfile-digikala .elementfile__wrapper-main-box-field input[type=password],.elementfile-digikala .elementfile__wrapper-main-box-field input[type=text]{background:#fff;border-color:#cbd5e1!important}

/* دو ستونه (فرم + تصویر) */
.elementfile-split .elementfile__wrapper{display:flex;max-width:980px;min-height:580px;overflow:hidden;border:1px solid #ece9f7;border-radius:32px;background:#fff;box-shadow:0 24px 60px -32px rgba(74,68,154,.45)}
.elementfile-split .elementfile__wrapper-main-right{flex:0 0 480px;max-width:100%;display:flex;flex-direction:column;justify-content:center;padding:40px 46px}
.elementfile-split .elementfile__wrapper-main-left{position:relative;flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.elementfile-split .elementfile__wrapper-main-left img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.elementfile-split .elementfile__welcome{position:relative;z-index:1;display:flex;flex-direction:column;gap:12px;padding:40px;text-align:center;color:#fff}
.elementfile-split .elementfile__welcome strong{font-size:30px;line-height:1.5}
.elementfile-split .elementfile__welcome span{font-size:14px;line-height:2;opacity:.9}
.elementfile-split .elementfile__wrapper-main-left::before,.elementfile-split .elementfile__wrapper-main-left::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.12)}
.elementfile-split .elementfile__wrapper-main-left::before{width:340px;height:340px;top:-110px;left:-90px}
.elementfile-split .elementfile__wrapper-main-left::after{width:240px;height:240px;bottom:-80px;right:-60px}
.elementfile-split .elementfile__wrapper-main-left:has(img)::before,.elementfile-split .elementfile__wrapper-main-left:has(img)::after{display:none}
.elementfile-split .elementfile__wrapper-main button:not(.elementfile__tab):not(.elementfile__eye){border-radius:50px}
.elementfile-split .elementfile__wrapper-main-box-title{font-size:22px}

/* المنت لاگین: کارت گرد پاستلی */
.elementfile-elementfile .elementfile__wrapper{max-width:440px}
.elementfile-elementfile .elementfile__wrapper-main{padding:38px 34px;border:1px solid #ece9f7;border-radius:34px;background:#fff;box-shadow:0 24px 60px -32px rgba(74,68,154,.45)}
.elementfile-elementfile .elementfile__wrapper-main-box-title{text-align:center;font-size:22px}
.elementfile-elementfile .elementfile__wrapper-main-box-description{text-align:center}
.elementfile-elementfile .elementfile__wrapper-main button:not(.elementfile__tab):not(.elementfile__eye){border-radius:50px}
.elementfile-elementfile .elementfile__wrapper-main-box-field input[type=password],.elementfile-elementfile .elementfile__wrapper-main-box-field input[type=text]{border-radius:50px!important;padding:0 22px;text-align:center}
.elementfile-elementfile .elementfile__wrapper-main-box-action{align-items:center}
.elementfile-elementfile .elementfile__wrapper-main-box-action a{margin-bottom:8px}
.elementfile-elementfile .elementfile__field-password input{padding:0 46px!important}

/* ---------- واکنش‌گرا ---------- */
@media (max-width:860px){
  .elementfile-split .elementfile__wrapper{flex-direction:column;min-height:0;border-radius:28px}
  .elementfile-split .elementfile__wrapper-main-right{flex:1 1 auto;padding:28px 22px}
  .elementfile-split .elementfile__wrapper-main-left{display:none}
}
@media (max-width:480px){
  .elementfile{padding:20px 12px;align-items:flex-start}
  .elementfile-elementfile .elementfile__wrapper-main{padding:28px 20px;border-radius:28px}
  .efo{gap:7px}
  .elementfile .efo .efo-box{height:56px;font-size:22px;border-radius:14px}
}
@media (prefers-reduced-motion:reduce){.efo.is-error{animation:none}}