/* ==========================================
   تغییرات پایه و ارث‌بری فونت ایران یکان
========================================== */
.frlda-modal,
.frlda-dialog,
.frlda-dialog *,
.frlda-login-btn,
.frlda-login-btn *,
.frlda-user-btn {
  font-family: var(--mep-font, inherit) !important;
  box-sizing: border-box !important;
}

/* دکمه ورود در هدر: پیل سفید با آیکون دایره‌ای آبی، متن آبی و فلش (مطابق موکاپ) */
.frlda-login-btn {
  position: relative !important;
  display: inline-flex !important;
  flex-direction: row !important;
  direction: ltr !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  gap: 0 !important;
  height: 52px !important;
  min-width: 180px !important;
  padding: 0 18px 0 0 !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  background: linear-gradient(180deg, #ffffff 0%, #f2f6ff 100%) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12), inset 0 0 0 1px rgba(15, 23, 42, 0.05) !important;
  white-space: nowrap !important;
  max-width: 100% !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.frlda-login-btn:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.18), inset 0 0 0 1px rgba(15, 23, 42, 0.05) !important;
}
.frlda-login-btn-icon {
  order: 1 !important;
  position: relative !important;
  flex: none !important;
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #2f83ff, #0a4fe0) !important;
  box-shadow: 0 6px 14px rgba(10, 79, 224, 0.35) !important;
}
.frlda-login-btn-icon::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 22px !important;
  height: 22px !important;
  transform: translate(-50%, -50%) !important;
  background: #ffffff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.41 0-8 2-8 4.5V21h16v-2.5C20 16 16.41 14 12 14z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.41 0-8 2-8 4.5V21h16v-2.5C20 16 16.41 14 12 14z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
.frlda-login-btn-text {
  order: 2 !important;
  flex: 1 1 auto !important;
  text-align: center !important;
  padding: 0 10px !important;
  color: #0a58ff !important;
  font-weight: 800 !important;
  font-size: clamp(13px, 1.6vw, 15px) !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.frlda-login-btn-arrow {
  order: 3 !important;
  flex: none !important;
  width: 18px !important;
  height: 18px !important;
  background: #0a58ff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* آیکون کاربر لاگین شده */
.frlda-user-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: #f0f4ff !important;
  border: 2px solid #e2e8f0 !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.frlda-user-btn:hover {
  background: #e2e8f0 !important;
  border-color: #065aff !important;
  transform: scale(1.1) !important;
}
.frlda-user-icon {
  width: 22px !important;
  height: 22px !important;
  display: inline-block !important;
  background: #065aff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.41 0-8 2-8 4.5V21h16v-2.5C20 16 16.41 14 12 14z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.41 0-8 2-8 4.5V21h16v-2.5C20 16 16.41 14 12 14z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* آیکون کاربر لاگین‌شده اکنون مستقیماً به پنل کاربری لینک می‌شود
   (بدون منوی کشویی؛ خروج از حساب داخل خودِ پنل است). */

/* ==========================================
   ساختار پاپ‌آپ و مودال
========================================== */
/* مهم: به‌جای display:none از visibility/opacity استفاده می‌کنیم.
   چرا: ویجت ورود پیامکیِ شخص‌ثالث (اوتینو و مشابه) همراه با خودِ صفحه در
   HTML چاپ می‌شود و اسکریپت داخلیِ آن همان لحظه‌ی بارگذاریِ صفحه اجرا و
   مقداردهیِ اولیه می‌شود (مثلاً بستنِ دکمه «ارسال کد» به یک event، یا
   محاسبه‌ی اندازه برای تایمر). اگر آن لحظه داخلِ یک عنصرِ «display:none»
   باشد، ابعادش صفر است و مرورگر اصلاً چیزی «رندر» نکرده، و خیلی از
   اسکریپت‌های شخص‌ثالث در چنین حالتی درست مقداردهی نمی‌شوند یا اصلاً
   event خودشان را نمی‌بندند. «visibility:hidden» برخلاف «display:none»
   عنصر را از رندر خارج نمی‌کند، فقط از دیدِ چشم و از تعامل (با کمکِ
   pointer-events) پنهانش می‌کند؛ ابعاد و DOM آن برای اسکریپت‌ها کاملاً
   طبیعی و قابل‌محاسبه باقی می‌ماند. چون خودِ مودال «position:fixed» است،
   این تغییر هیچ فضای خالی/جابه‌جایی در چیدمانِ بقیه‌ی صفحه ایجاد نمی‌کند. */
.frlda-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: flex !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
}
.frlda-modal.is-open {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.frlda-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(10, 25, 60, 0.4) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  will-change: backdrop-filter;
}
.frlda-dialog {
  direction: rtl !important;
  position: relative !important;
  width: 100% !important;
  max-width: 440px !important; /* یک مقدار بازتر برای جلوگیری از شکستن فیلدهای پیامک */
  background: linear-gradient(180deg, #eef6fd 0%, #e3eefb 100%) !important;
  border-radius: 36px !important;
  padding: 32px 24px !important;
  box-shadow: 0 30px 60px -15px rgba(6, 90, 255, 0.18), 0 0 0 1px rgba(6, 90, 255, 0.05) !important;
  overflow: visible !important; /* اجازه رندر المان‌های جاوااسکریپتی فرزند خارج از کادر (مثلاً دراپ‌داون کد کشور) */
}
/* انیمیشنِ ورودِ دیالوگ را عمداً فقط به حالتِ «باز» مودال محدود کردیم؛
   چون خودِ مودال دیگر هرگز display:none نمی‌شود (بالا را ببینید)، اگر
   انیمیشن روی خودِ .frlda-dialog (بدون قید) تعریف می‌شد، همان یک‌بار در
   لحظه‌ی بارگذاریِ صفحه (وقتی مودال هنوز نامرئی است) اجرا و تمام می‌شد و
   دیگر موقع باز کردنِ واقعیِ مودال توسط کاربر، جلوه‌ی «بانس» دیده نمی‌شد. */
.frlda-modal.is-open .frlda-dialog {
  animation: frlda-bounce-in 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards !important;
}

/* در صفحه‌های کوتاه (اکثر گوشی‌ها)، اگر محتوای فرم (مخصوصاً با فیلدهای OTP
   عمودی) از ارتفاع صفحه بلندتر شود، کل مودال (نه فقط دیالوگ) قابل‌اسکرول
   می‌شود؛ این‌طوری دکمه‌هایی مثل «ارسال کد» هیچ‌وقت خارج از دسترسِ لمسی
   نمی‌مانند، بدون این‌که overflow:visible روی خودِ دیالوگ (لازم برای
   عناصر شناور مثل دراپ‌داون کد کشور) را از بین ببریم. */
@media (max-height: 760px) {
  .frlda-modal.is-open {
    align-items: flex-start !important;
    overflow-y: auto !important;
    padding: 16px !important;
  }
  .frlda-dialog {
    margin: 12px auto !important;
  }
}

/* دکمه دایره‌ای بستن مودال */
.frlda-close {
  position: absolute !important;
  top: 22px !important;
  left: 22px !important;
  border: 0px none transparent !important;
  outline: none !important;
  background: rgba(255, 255, 255, 0.75) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  font-size: 20px !important;
  cursor: pointer !important;
  color: #0a193c !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transition: all 0.25s ease !important;
  z-index: 10 !important;
}
.frlda-close:hover {
  background: #065aff !important;
  color: #ffffff !important;
  transform: rotate(90deg) !important;
}


/* ==========================================
   المان‌های انتخاب نقش
========================================== */
#frlda-title {
  font-size: 21px !important;
  font-weight: 800 !important;
  color: #0a193c !important;
  margin: 6px 0 26px 0 !important;
  text-align: center !important;
}
.frlda-roles {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}
.frlda-role {
  position: relative !important;
  padding: 26px 20px !important;
  border-radius: 26px !important;
  border: none !important;
  background: #ffffff !important;
  cursor: pointer !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  color: #0a193c !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  width: 100% !important;
}
.frlda-role-text {
  order: 1 !important;
}
.frlda-role-icon {
  order: 2 !important;
  width: 30px !important;
  height: 30px !important;
  flex: none !important;
  display: inline-block !important;
  background: #065aff !important;
  transition: all 0.2s ease !important;
}
.frlda-role-icon--academy {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2L2 8h2v11h16V8h2L12 2zm0 2.4L18.5 8h-13L12 4.4zM6 10h2v7H6v-7zm5 0h2v7h-2v-7zm5 0h2v7h-2v-7z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2L2 8h2v11h16V8h2L12 2zm0 2.4L18.5 8h-13L12 4.4zM6 10h2v7H6v-7zm5 0h2v7h-2v-7zm5 0h2v7h-2v-7z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
.frlda-role-icon--teacher {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 3h20v13H2V3zm2 2v9h16V5H4zm5 11h6v2H9v-2zm-3 4h12v2H6v-2z'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 3h20v13H2V3zm2 2v9h16V5H4zm5 11h6v2H9v-2zm-3 4h12v2H6v-2z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
.frlda-role-icon--student {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolygon points='12,3 22,8 12,13 2,8'/%3E%3Crect x='7' y='9.4' width='10' height='3' rx='1'/%3E%3Crect x='11' y='12.4' width='2' height='7' rx='1'/%3E%3C/svg%3E") no-repeat center / contain !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolygon points='12,3 22,8 12,13 2,8'/%3E%3Crect x='7' y='9.4' width='10' height='3' rx='1'/%3E%3Crect x='11' y='12.4' width='2' height='7' rx='1'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
.frlda-role:hover:not(:disabled) {
  background: #f0f5ff !important;
  color: #065aff !important;
  transform: scale(1.02) !important;
}
.frlda-role:hover:not(:disabled) .frlda-role-icon {
  background: #0044cc !important;
  transform: scale(1.08) !important;
}
.frlda-role:disabled {
  cursor: not-allowed !important;
  opacity: 0.5 !important;
}
.frlda-role.is-loading .frlda-role-text,
.frlda-role.is-loading .frlda-role-icon {
  opacity: 0 !important;
}
.frlda-role.is-loading::after {
  content: "" !important;
  position: absolute !important;
  width: 22px !important;
  height: 22px !important;
  top: calc(50% - 11px) !important;
  right: calc(50% - 11px) !important;
  border: 2px solid #065aff !important;
  border-radius: 50% !important;
  border-top-color: transparent !important;
  animation: frlda-spin 0.6s linear infinite !important;
}

/* ==========================================
   فرم‌ها و فیلدهای ورودی
========================================== */
.frlda-form-title {
  margin-top: 0 !important;
  margin-bottom: 24px !important;
  color: #0a193c !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  text-align: center !important;
}
.frlda-switch-link {
  display: block !important;
  width: 100% !important;
  margin-top: 16px !important;
  background: none !important;
  border: none !important;
  padding: 4px !important;
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-align: center !important;
  cursor: pointer !important;
  text-decoration: underline !important;
}
.frlda-switch-link:hover {
  color: #1e3a8a !important;
}
.frlda-input-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 20px !important;
}
.frlda-input-group label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  padding-right: 6px !important;
}
.frlda-input-group input {
  padding: 14px 20px !important;
  border-radius: 18px !important;
  border: 2px solid #e2e8f0 !important;
  background: #f8fafc !important;
  outline: none !important;
  font-size: 14px !important;
  color: #0a193c !important;
  transition: all 0.25s ease !important;
}
.frlda-input-group input:focus {
  border-color: #065aff !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 5px rgba(6, 90, 255, 0.12) !important;
}
.frlda-captcha-group {
  background: #f8fafc !important;
  border: 2px dashed #cbd5e1 !important;
  padding: 16px !important;
  border-radius: 20px !important;
}
.frlda-submit-btn {
  width: 100% !important;
  padding: 15px !important;
  border: none !important;
  border-radius: 18px !important;
  background: #065aff !important;
  color: white !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  font-size: 15px !important;
  box-shadow: 0 6px 16px rgba(6, 90, 255, 0.2) !important;
  transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}
.frlda-submit-btn:hover:not(:disabled) {
  background: #0044cc !important;
  box-shadow: 0 8px 24px rgba(6, 90, 255, 0.35) !important;
  transform: translateY(-1px) !important;
}
.frlda-submit-btn:disabled {
  cursor: not-allowed !important;
  opacity: 0.5 !important;
}

.frlda-error {
  background: #fff5f5 !important;
  color: #b91c1c !important;
  border: 2px solid #fee2e2 !important;
  padding: 14px 20px !important;
  border-radius: 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 20px !important;
  box-shadow: 0 4px 12px rgba(185, 28, 28, 0.05) !important;
}

.frlda-digits-wrap {
  margin-top: 10px !important;
  width: 100% !important;
  display: block !important;
}

/* پیام‌های حالتِ خالی/خطا برای زمانی که شورت‌کد پیامکی تنظیم نشده یا اجرایش خطا می‌دهد؛ نگاه کنید به get_digits_html در class-auth.php */
.frlda-digits-empty,
.frlda-digits-error {
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 4px 0 !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.8 !important;
  text-align: center !important;
}
.frlda-digits-empty {
  border: 2px dashed #cbd8f0 !important;
  background: #f4f8ff !important;
  color: #475569 !important;
}
.frlda-digits-error {
  border: 2px solid #fee2e2 !important;
  background: #fff5f5 !important;
  color: #b91c1c !important;
}

/* رفع تداخل فیلدهای داخلی افزونه ورود پیامکی (Otino/SMS.ir/مشابه) */
.frlda-digits-wrap input, 
.frlda-digits-wrap button, 
.frlda-digits-wrap select {
  max-width: 100% !important;
}

/* ==========================================
   انیمیشن‌ها
========================================== */
@keyframes frlda-bounce-in {
  from { opacity: 0; transform: scale(0.9) translateY(20px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes frlda-spin {
  to { transform: rotate(360deg); }
}

/* ==========================================
   بهینه‌سازی ویژه و اعمال قطعی تغییرات در موبایل
========================================== */
/* ==========================================
   ریسپانسیو کامل دکمه ورود هدر
   در تبلت و موبایل، دکمه ورود به همان آیکون دایره‌ای آبی (بدون متن و فلش) تبدیل می‌شود.
========================================== */
@media (max-width: 768px) {
  .frlda-login-btn {
    width: 52px !important;
    height: 52px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #2f83ff, #0a4fe0) !important;
    box-shadow: 0 8px 18px rgba(10, 79, 224, 0.35) !important;
  }
  .frlda-login-btn-text,
  .frlda-login-btn-arrow {
    display: none !important;
  }
  .frlda-login-btn-icon {
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 480px) {
  /* هماهنگی اندازه دکمه ورود و آیکون کاربر لاگین‌شده در موبایل */
  .frlda-login-btn,
  .frlda-user-btn {
    width: 46px !important;
    height: 46px !important;
  }
  .frlda-login-btn-icon::before {
    width: 19px !important;
    height: 19px !important;
  }

  /* ۲. اجبار به اعمال استایل‌های حبابی باکس اصلی در موبایل */
  .frlda-dialog {
    padding: 28px 20px !important;
    border-radius: 28px !important; 
    width: calc(100% - 10px) !important;
    margin: 0 auto !important;
  }
  
  /* ۳. استایل دکمه‌های نقش در موبایل */
  .frlda-role {
    padding: 22px 18px !important;
    font-size: 15.5px !important;
    border-radius: 22px !important;
    border: none !important;
  }
  .frlda-role-icon {
    width: 26px !important;
    height: 26px !important;
  }
  
  .frlda-input-group input {
    padding: 12px 16px !important;
    border-radius: 16px !important;
  }
}

@media (max-width: 360px) {
  .frlda-login-btn,
  .frlda-user-btn {
    width: 42px !important;
    height: 42px !important;
  }
  .frlda-login-btn-icon::before {
    width: 17px !important;
    height: 17px !important;
  }
}

/* ==========================================
   استایل اختصاصی و رفع تداخل نهایی با ویجت ورود پیامکی
========================================== */
/* همان استدلالِ بالا (visibility به‌جای display:none) این‌جا هم صادق است:
   خروجی شورت‌کد پیامکی (اوتینو) همراه با خودِ صفحه چاپ می‌شود؛ اگر گامِ
   آن با display:none مخفی باشد، اسکریپتِ آن روی یک عنصر با ابعادِ صفر
   اجرا می‌شود و تایمر/تعویضِ خودکارِ گام و کلیکِ دکمه‌ی «ارسال کد» ممکن
   است درست کار نکنند. برای اینکه position:absolute (حالتِ مخفی) باعثِ
   جابه‌جاییِ گام‌های دیگر داخلِ دیالوگ نشود، فقط در حالتِ مخفی از فلوی
   عادیِ صفحه خارجش می‌کنیم؛ در حالتِ نمایش، به فلوی عادی (static) برمی‌گردد. */
.frlda-sms-hidden {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  width: 100% !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.frlda-sms-visible {
  position: static !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* ==========================================
   ادغام بصری فرم ورود پیامکی با مودال احراز هویت
   Scoped فقط به شورت‌کد پیامکی تا با سایر فرم‌های سایت تداخل نداشته باشد.
========================================== */
.frlda-digits-wrap {
  direction: rtl !important;
  text-align: right !important;
  width: 100% !important;
  color: #0a193c !important;
  font-family: var(--mep-font, inherit) !important;
}

.frlda-digits-wrap form,
.frlda-digits-wrap .digits-form,
.frlda-digits-wrap .digits-form-container,
.frlda-digits-wrap .digits-login-container,
.frlda-digits-wrap .digits-register-container,
.frlda-digits-wrap .digits_form,
.frlda-digits-wrap .login-form,
.frlda-digits-wrap .register-form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.frlda-digits-wrap label {
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 6px !important;
  color: #475569 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.7 !important;
  text-align: right !important;
}

.frlda-digits-wrap input[type="text"],
.frlda-digits-wrap input[type="tel"],
.frlda-digits-wrap input[type="number"],
.frlda-digits-wrap input[type="email"],
.frlda-digits-wrap input[type="password"],
.frlda-digits-wrap select {
  width: 100% !important;
  min-height: 50px !important;
  box-sizing: border-box !important;
  padding: 14px 18px !important;
  margin: 0 0 16px !important;
  border: 2px solid #e2e8f0 !important;
  border-radius: 18px !important;
  background: #f8fafc !important;
  color: #0a193c !important;
  font-family: var(--mep-font, inherit) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color .25s ease, background-color .25s ease, box-shadow .25s ease !important;
}

.frlda-digits-wrap input[type="text"]:focus,
.frlda-digits-wrap input[type="tel"]:focus,
.frlda-digits-wrap input[type="number"]:focus,
.frlda-digits-wrap input[type="email"]:focus,
.frlda-digits-wrap input[type="password"]:focus,
.frlda-digits-wrap select:focus {
  border-color: #065aff !important;
  background: #fff !important;
  box-shadow: 0 0 0 5px rgba(6, 90, 255, .12) !important;
}

/* گروه‌های رایج فرم OTP */
.frlda-digits-wrap .form-group,
.frlda-digits-wrap .form-row,
.frlda-digits-wrap .field,
.frlda-digits-wrap .input-group,
.frlda-digits-wrap .digits-field,
.frlda-digits-wrap .digits-input-container {
  width: 100% !important;
  margin-bottom: 8px !important;
}

/* دکمه‌های ارسال کد، تأیید و ادامه */
.frlda-digits-wrap button[type="submit"],
.frlda-digits-wrap input[type="submit"],
.frlda-digits-wrap button:not([type="button"]),
.frlda-digits-wrap .button,
.frlda-digits-wrap .btn,
.frlda-digits-wrap .digits-button,
.frlda-digits-wrap .digits-btn,
.frlda-digits-wrap .login-button,
.frlda-digits-wrap .register-button {
  width: 100% !important;
  min-height: 52px !important;
  box-sizing: border-box !important;
  margin-top: 6px !important;
  padding: 14px 18px !important;
  border: 0 !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #065aff, #0044cc) !important;
  color: #fff !important;
  font-family: var(--mep-font, inherit) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  text-align: center !important;
  cursor: pointer !important;
  box-shadow: 0 6px 16px rgba(6, 90, 255, .20) !important;
  transition: transform .25s ease, box-shadow .25s ease, opacity .25s ease !important;
}

.frlda-digits-wrap button[type="submit"]:hover:not(:disabled),
.frlda-digits-wrap input[type="submit"]:hover:not(:disabled),
.frlda-digits-wrap button:not([type="button"]):hover:not(:disabled),
.frlda-digits-wrap .button:hover,
.frlda-digits-wrap .btn:hover,
.frlda-digits-wrap .digits-button:hover,
.frlda-digits-wrap .digits-btn:hover,
.frlda-digits-wrap .login-button:hover,
.frlda-digits-wrap .register-button:hover {
  background: linear-gradient(135deg, #065aff, #0044cc) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(6, 90, 255, .32) !important;
}

.frlda-digits-wrap button:disabled,
.frlda-digits-wrap input:disabled {
  opacity: .55 !important;
  cursor: not-allowed !important;
}

/* پیام‌های خطا/موفقیت */
.frlda-digits-wrap .error,
.frlda-digits-wrap .error-message,
.frlda-digits-wrap .digits-error,
.frlda-digits-wrap .alert-danger {
  margin: 8px 0 14px !important;
  padding: 12px 16px !important;
  border: 2px solid #fee2e2 !important;
  border-radius: 16px !important;
  background: #fff5f5 !important;
  color: #b91c1c !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.8 !important;
}

.frlda-digits-wrap .success,
.frlda-digits-wrap .success-message,
.frlda-digits-wrap .digits-success,
.frlda-digits-wrap .alert-success {
  margin: 8px 0 14px !important;
  padding: 12px 16px !important;
  border: 2px solid #dcfce7 !important;
  border-radius: 16px !important;
  background: #f0fdf4 !important;
  color: #166534 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.8 !important;
}

/* متن‌های راهنما و لینک‌ها */
.frlda-digits-wrap small,
.frlda-digits-wrap .help-text,
.frlda-digits-wrap .description,
.frlda-digits-wrap .digits-description {
  display: block !important;
  margin: 2px 4px 12px !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.8 !important;
}

.frlda-digits-wrap a {
  color: #065aff !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}
.frlda-digits-wrap a:hover {
  color: #0044cc !important;
  text-decoration: underline !important;
}

/* کنترل‌های OTP چندرقمی */
.frlda-digits-wrap input[class*="otp"],
.frlda-digits-wrap input[class*="code"],
.frlda-digits-wrap input[class*="pin"],
.frlda-digits-wrap .otp-input,
.frlda-digits-wrap .digits-otp-input {
  text-align: center !important;
  direction: ltr !important;
  letter-spacing: .18em !important;
  font-weight: 700 !important;
}

@media (max-width: 480px) {
  .frlda-dialog {
    max-width: calc(100vw - 24px) !important;
    padding: 28px 18px !important;
    border-radius: 28px !important;
  }
  .frlda-digits-wrap input[type="text"],
  .frlda-digits-wrap input[type="tel"],
  .frlda-digits-wrap input[type="number"],
  .frlda-digits-wrap input[type="email"],
  .frlda-digits-wrap input[type="password"],
  .frlda-digits-wrap select {
    min-height: 48px !important;
    padding: 12px 15px !important;
    border-radius: 16px !important;
  }
  .frlda-digits-wrap button[type="submit"],
  .frlda-digits-wrap input[type="submit"],
  .frlda-digits-wrap .button,
  .frlda-digits-wrap .btn,
  .frlda-digits-wrap .digits-button,
  .frlda-digits-wrap .digits-btn {
    min-height: 50px !important;
    border-radius: 16px !important;
  }
}

/* v1.15.3 — responsive hardening
   (box-sizing:border-box سراسری قبلاً توسط bootstrap.min.css روی کل صفحه
   اعمال می‌شود، تکرارش این‌جا زائد بود و حذف شد. دو قانون زیر هم که قبلاً
   بدون محدوده روی کل صفحه (از جمله ویجت‌های الیمنتور و بقیه‌ی پلاگین‌ها)
   اجرا می‌شدند، حالا فقط به کانتینرهای خودِ این پلاگین محدود شده‌اند تا با
   المنتور/تم/پلاگین‌های دیگر تداخل نداشته باشند.) */
:is(.mep-panel,.mep-exam-list,.mep-exam-wrapper,.mep-result-page,.mep-register-form,.mep-student-modal,.mep-onboarding-modal,.mep-videos-modal) :is(img,video,iframe){max-width:100%;height:auto}
:is(.mep-panel,.mep-exam-list,.mep-exam-wrapper,.mep-result-page,.mep-register-form,.mep-student-modal,.mep-onboarding-modal,.mep-videos-modal) :is(input,select,textarea,button){max-width:100%;font:inherit}
@media (max-width:782px){
    .mep-container,.mep-panel,.mep-panel-wrap,.mep-content,.frlda-modal-content{width:100%;max-width:100%}
    .mep-grid,.mep-form-grid,.mep-two-col,.mep-dashboard-grid{grid-template-columns:1fr!important}
    .mep-table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
    .mep-table{min-width:620px}
    .mep-panel-card{max-width:100%;overflow:hidden}
    .mep-panel-card-body{overflow-wrap:anywhere}
    .mep-panel-actions,.mep-actions,.mep-question-actions{flex-wrap:wrap}
    .mep-panel-actions>*{max-width:100%}
}
@media (max-width:480px){
    .mep-panel,.mep-container{padding-left:12px!important;padding-right:12px!important}
    .mep-panel-card-body{padding:12px!important}
    .mep-btn,.mep-panel-btn,.mep-button{width:100%;min-height:42px}
    .mep-question-actions .mep-btn,.mep-question-actions button{width:100%}
    .frlda-modal-content{margin:10px!important;border-radius:14px}
}


/* v1.15.3 — OTP inputs: force multi-digit code fields into a horizontal row.
 * Some SMS/OTP plugins render each digit as a separate input. The global
 * width:100% rules above must not turn those boxes into a vertical stack.
 */
.frlda-digits-wrap .otp-container:has(input + input),
.frlda-digits-wrap .otp-inputs:has(input + input),
.frlda-digits-wrap .otp-fields:has(input + input),
.frlda-digits-wrap .otp-field-group:has(input + input),
.frlda-digits-wrap .digits-otp-container:has(input + input),
.frlda-digits-wrap .digits-otp-inputs:has(input + input),
.frlda-digits-wrap [class*="otp-container"]:has(input + input),
.frlda-digits-wrap [class*="otp-input"]:has(input + input),
.frlda-digits-wrap [class*="otp-field"]:has(input + input),
.frlda-digits-wrap [class*="verification-code"]:has(input + input),
.frlda-digits-wrap [class*="verification_code"]:has(input + input),
.frlda-digits-wrap [class*="pin-input"]:has(input + input),
.frlda-digits-wrap [class*="code-input"]:has(input + input) {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  direction: ltr !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 4px 0 16px !important;
}

.frlda-digits-wrap .otp-container:has(input + input) > input,
.frlda-digits-wrap .otp-inputs:has(input + input) > input,
.frlda-digits-wrap .otp-fields:has(input + input) > input,
.frlda-digits-wrap .otp-field-group:has(input + input) > input,
.frlda-digits-wrap .digits-otp-container:has(input + input) > input,
.frlda-digits-wrap .digits-otp-inputs:has(input + input) > input,
.frlda-digits-wrap [class*="otp-container"]:has(input + input) input,
.frlda-digits-wrap [class*="otp-input"]:has(input + input) input,
.frlda-digits-wrap [class*="otp-field"]:has(input + input) input,
.frlda-digits-wrap [class*="verification-code"]:has(input + input) input,
.frlda-digits-wrap [class*="verification_code"]:has(input + input) input,
.frlda-digits-wrap [class*="pin-input"]:has(input + input) input,
.frlda-digits-wrap [class*="code-input"]:has(input + input) input {
  flex: 0 1 48px !important;
  width: 48px !important;
  min-width: 38px !important;
  max-width: 56px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 8px 4px !important;
  text-align: center !important;
  direction: ltr !important;
  letter-spacing: normal !important;
  border-radius: 14px !important;
}

/* Fallback for OTP plugins that expose a dedicated list wrapper. */
.frlda-digits-wrap .otp-inputs,
.frlda-digits-wrap .otp-fields,
.frlda-digits-wrap .digits-otp-inputs {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  direction: ltr !important;
}

@media (max-width: 480px) {
  .frlda-digits-wrap .otp-container:has(input + input),
  .frlda-digits-wrap .otp-inputs:has(input + input),
  .frlda-digits-wrap .otp-fields:has(input + input),
  .frlda-digits-wrap .otp-field-group:has(input + input),
  .frlda-digits-wrap .digits-otp-container:has(input + input),
  .frlda-digits-wrap .digits-otp-inputs:has(input + input),
  .frlda-digits-wrap [class*="otp-container"]:has(input + input),
  .frlda-digits-wrap [class*="otp-input"]:has(input + input),
  .frlda-digits-wrap [class*="otp-field"]:has(input + input),
  .frlda-digits-wrap [class*="verification-code"]:has(input + input),
  .frlda-digits-wrap [class*="verification_code"]:has(input + input),
  .frlda-digits-wrap [class*="pin-input"]:has(input + input),
  .frlda-digits-wrap [class*="code-input"]:has(input + input) {
    gap: 5px !important;
  }

  .frlda-digits-wrap .otp-container:has(input + input) > input,
  .frlda-digits-wrap .otp-inputs:has(input + input) > input,
  .frlda-digits-wrap .otp-fields:has(input + input) > input,
  .frlda-digits-wrap .otp-field-group:has(input + input) > input,
  .frlda-digits-wrap .digits-otp-container:has(input + input) > input,
  .frlda-digits-wrap .digits-otp-inputs:has(input + input) > input,
  .frlda-digits-wrap [class*="otp-container"]:has(input + input) input,
  .frlda-digits-wrap [class*="otp-input"]:has(input + input) input,
  .frlda-digits-wrap [class*="otp-field"]:has(input + input) input,
  .frlda-digits-wrap [class*="verification-code"]:has(input + input) input,
  .frlda-digits-wrap [class*="verification_code"]:has(input + input) input,
  .frlda-digits-wrap [class*="pin-input"]:has(input + input) input,
  .frlda-digits-wrap [class*="code-input"]:has(input + input) input {
    flex-basis: 42px !important;
    width: 42px !important;
    min-width: 32px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    border-radius: 13px !important;
  }
}


/* v1.15.3 — OTP hardening: مستقل از ساختار HTML افزونه پیامکی.
 * هر گروهی که شامل چند input با maxlength کوتاه/کد تأیید باشد توسط JS کلاس
 * می‌گیرد تا حتی اگر wrapperهای افزونه تغییر کنند، کد به‌صورت افقی بماند.
 */
.frlda-digits-wrap .mep-otp-detected-group {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  direction:ltr !important;
  gap:8px !important;
  width:100% !important;
  margin:8px 0 16px !important;
}
.frlda-digits-wrap .mep-otp-detected-group > *,
.frlda-digits-wrap .mep-otp-detected-group input {
  box-sizing:border-box !important;
}
.frlda-digits-wrap .mep-otp-detected-group input {
  flex:0 0 48px !important;
  width:48px !important;
  min-width:48px !important;
  max-width:48px !important;
  height:52px !important;
  min-height:52px !important;
  margin:0 !important;
  padding:6px 4px !important;
  text-align:center !important;
  direction:ltr !important;
  letter-spacing:normal !important;
  border-radius:14px !important;
}
@media (max-width:480px){
  .frlda-digits-wrap .mep-otp-detected-group{gap:5px !important}
  .frlda-digits-wrap .mep-otp-detected-group input{
    flex-basis:42px !important;width:42px !important;min-width:42px !important;max-width:42px !important;
    height:48px !important;min-height:48px !important;border-radius:12px !important;
  }
}


/* v2.2.6: manager panel tabs are fixed; no internal tab scrolling */
.academy-manager-panel .manager-tabs,.academy-manager-panel .manager-sidebar,.academy-manager-panel .academy-manager-tabs,.academy-manager-panel .academy-manager-sidebar{overflow:visible !important;height:auto !important;max-height:none !important;overflow-y:visible !important;}
@media (max-width:782px){.academy-manager-panel .manager-tabs,.academy-manager-panel .manager-sidebar,.academy-manager-panel .academy-manager-tabs,.academy-manager-panel .academy-manager-sidebar{overflow:visible !important;max-height:none !important;}}