/* ============================================================
   Salehan LMS - Modern Login (2026-11-14)
   هم‌سبک با لندینگ: فونت استعداد + کارت گلس + تم روشن/تاریه
   فقط روی صفحه لاگین اعمال می‌شود (body.pagelayout-login).
   تزریق از طریق تنظیم additionalhtmlhead مودل؛ برای حذف کامل،
   کافیست همان تنظیم به مقدار قبلی برگردد.
   ============================================================ */

/* ---------- فونت استعداد (همان URLهای نسخه‌دار لندینگ) ---------- */
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-Regular.woff2?v=20261115") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-Medium.woff2?v=20261115") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-SemiBold.woff2?v=20261115") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-Bold.woff2?v=20261115") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-ExtraBold.woff2?v=20261115") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Estedad"; src: url("/landing/fonts/Estedad-Black.woff2?v=20261115") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }

/* ---------- توکن‌های طراحی (مطابق لندینگ) ---------- */
body.pagelayout-login {
  --sh-navy-900: #0b2a4a;
  --sh-teal-600: #0d9488;
  --sh-teal-500: #14b8a6;
  --sh-teal-400: #2dd4bf;
  --sh-sky-400: #38bdf8;
  --sh-bg: #eef4fa;
  --sh-ink: #0d1b2e;
  --sh-ink-soft: #24374f;
  --sh-muted: #4e637e;
  --sh-glass-bg: rgba(255, 255, 255, 0.62);
  --sh-glass-border: rgba(255, 255, 255, 0.70);
  --sh-line: rgba(13, 27, 46, 0.10);
  --sh-grad-cta: linear-gradient(135deg, #0d9488 0%, #14b8a6 55%, #0b2a4a 130%);
  --sh-grad-cta-glow: 0 14px 34px -10px rgba(13, 148, 136, 0.55);
  --sh-shadow: 0 18px 44px -18px rgba(11, 42, 74, 0.28);
}
html[data-theme="dark"] body.pagelayout-login {
  --sh-bg: #060f1e;
  --sh-ink: #e9f1fa;
  --sh-ink-soft: #c8d8ea;
  --sh-muted: #93a9c2;
  --sh-glass-bg: rgba(16, 36, 60, 0.58);
  --sh-glass-border: rgba(148, 197, 236, 0.16);
  --sh-line: rgba(148, 197, 236, 0.12);
  --sh-shadow: 0 18px 44px -16px rgba(2, 8, 20, 0.65);
}

/* ---------- پس‌زمینه و فونت ---------- */
body.pagelayout-login {
  font-family: "Estedad", Tahoma, "Segoe UI", sans-serif !important;
  background: var(--sh-bg, #eef4fa) !important;
  color: var(--sh-ink, #0d1b2e) !important;
  overflow-x: hidden;
}
body.pagelayout-login::before,
body.pagelayout-login::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  z-index: 0;
}
body.pagelayout-login::before {
  width: 480px; height: 480px;
  top: -140px; inset-inline-start: -120px;
  background: radial-gradient(circle, rgba(20, 184, 166, 0.28) 0%, rgba(20, 184, 166, 0) 70%);
}
body.pagelayout-login::after {
  width: 520px; height: 520px;
  bottom: -180px; inset-inline-end: -140px;
  background: radial-gradient(circle, rgba(56, 189, 248, 0.20) 0%, rgba(11, 42, 74, 0.12) 60%, rgba(11, 42, 74, 0) 75%);
}
html[data-theme="dark"] body.pagelayout-login::before {
  background: radial-gradient(circle, rgba(13, 148, 136, 0.30) 0%, rgba(13, 148, 136, 0) 70%);
}
html[data-theme="dark"] body.pagelayout-login::after {
  background: radial-gradient(circle, rgba(56, 189, 248, 0.16) 0%, rgba(11, 42, 74, 0.30) 60%, rgba(11, 42, 74, 0) 75%);
}

/* ---------- اسکلت صفحه: شفاف + وسط‌چین عمودی ---------- */
body.pagelayout-login #page-wrapper { background: transparent !important; position: relative; z-index: 1; }
body.pagelayout-login #page { background: transparent !important; }
body.pagelayout-login #page-content,
body.pagelayout-login #region-main-box,
body.pagelayout-login #region-main,
body.pagelayout-login #region-main .row,
body.pagelayout-login #region-main > div { background: transparent !important; }
body.pagelayout-login #region-main .row.justify-content-center > div[class*="col-"] {
  max-width: 460px;
  width: 100%;
}
body.pagelayout-login #region-main > div[role="main"] { min-height: auto; }

/* فرم و ستون راهنما: پشت‌سرهم و تمام‌عرض داخل کارت */
body.pagelayout-login .card-body .row.justify-content-md-center > .col-md-5,
body.pagelayout-login .card-body .row.justify-content-md-center > [class*="col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
}
body.pagelayout-login .card-body .row.justify-content-md-center > [class*="col-"] + [class*="col-"] {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed var(--sh-line);
}
body.pagelayout-login .card-body .row.justify-content-md-center { margin: 0 !important; }
body.pagelayout-login .card-body .row.justify-content-md-center > [class*="col-"] { padding: 0 6px !important; }
body.pagelayout-login .card-body .row.justify-content-md-center > [class*="col-"] > .text-center,
body.pagelayout-login .card-body .row.justify-content-md-center > [class*="col-"] p {
  font-size: 0.86rem !important;
  color: var(--sh-muted) !important;
  margin-bottom: 0 !important;
}

/* ---------- کارت‌های گلس ---------- */
body.pagelayout-login .card {
  background: var(--sh-glass-bg) !important;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  border: 1px solid var(--sh-glass-border) !important;
  border-radius: 24px !important;
  box-shadow: var(--sh-shadow) !important;
  overflow: hidden;
}
body.pagelayout-login .card + .card { margin-top: 18px; }
body.pagelayout-login .card-body { padding: 26px 26px 28px !important; background: transparent !important; color: var(--sh-ink-soft) !important; }

/* ---------- سربرگ کارت: برند ---------- */
body.pagelayout-login .card-header {
  background: transparent !important;
  border-bottom: 0 !important;
  padding: 28px 22px 6px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  color: var(--sh-ink) !important;
}
body.pagelayout-login .card-header .h1,
body.pagelayout-login h1.card-header {
  font-size: 1.22rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
  margin: 0 !important;
  line-height: 1.3;
}
/* لوگوی رسمی سایت (توسط خود مودل رندر می‌شود): بدون باکس */
body.pagelayout-login .card-header img {
  display: block;
  max-height: 66px;
  width: auto;
  max-width: 100%;
}
/* تم تاریک: نسخه سفید تک‌رنگ لوگو برای خوانایی */
html[data-theme="dark"] body.pagelayout-login .card-header img { filter: brightness(0) invert(1); }

/* ---------- فرم لاگین ---------- */
body.pagelayout-login #login { margin-top: 18px !important; }
body.pagelayout-login #login .form-group { margin-bottom: 16px !important; }
body.pagelayout-login #login .form-control {
  font-family: "Estedad", Tahoma, sans-serif !important;
  font-size: 0.98rem !important;
  color: var(--sh-ink) !important;
  background: rgba(255, 255, 255, 0.65) !important;
  border: 1.5px solid var(--sh-line) !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  height: auto !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
html[data-theme="dark"] body.pagelayout-login #login .form-control { background: rgba(9, 22, 40, 0.55) !important; }
body.pagelayout-login #login .form-control::placeholder { color: var(--sh-muted) !important; opacity: 1; }
body.pagelayout-login #login .form-control:focus {
  border-color: var(--sh-teal-500) !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.16) !important;
  outline: none !important;
}
html[data-theme="dark"] body.pagelayout-login #login .form-control:focus { background: rgba(9, 22, 40, 0.75) !important; }
body.pagelayout-login #login .form-control:-webkit-autofill,
body.pagelayout-login #login .form-control:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.92) inset !important;
  -webkit-text-fill-color: var(--sh-ink) !important;
  caret-color: var(--sh-ink);
  transition: background-color 9999s ease-in-out 0s;
}
/* autofill در تم تاریک: بستر تیرهِ یکدست + متن روشن (متن سفید روی سفید نشود) */
html[data-theme="dark"] body.pagelayout-login #login .form-control:-webkit-autofill,
html[data-theme="dark"] body.pagelayout-login #login .form-control:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #0e2038 inset !important;
  -webkit-text-fill-color: #e9f1fa !important;
  caret-color: #e9f1fa;
  border-color: rgba(148, 197, 236, 0.25) !important;
}

/* ---------- دکمه ورود ---------- */
body.pagelayout-login #login .btn.btn-primary,
body.pagelayout-login #loginbtn {
  font-family: "Estedad", Tahoma, sans-serif !important;
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: var(--sh-grad-cta) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 14px !important;
  padding: 12px 20px !important;
  height: auto !important;
  box-shadow: var(--sh-grad-cta-glow) !important;
  text-shadow: none !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}
body.pagelayout-login #login .btn.btn-primary:hover,
body.pagelayout-login #loginbtn:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 44px -12px rgba(13, 148, 136, 0.65) !important;
  filter: brightness(1.04);
  background: var(--sh-grad-cta) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}
body.pagelayout-login #login .btn.btn-primary:focus,
body.pagelayout-login #loginbtn:focus {
  box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.28), var(--sh-grad-cta-glow) !important;
  outline: none !important;
  background: var(--sh-grad-cta) !important;
}

/* ---------- یادآوری نام کاربری ---------- */
body.pagelayout-login #login .custom-control,
body.pagelayout-login #login .form-check { color: var(--sh-muted) !important; font-size: 0.9rem !important; }
body.pagelayout-login #login input[type="checkbox"] {
  accent-color: var(--sh-teal-600);
  width: 17px; height: 17px;
  cursor: pointer;
  margin-inline-end: 8px;
  vertical-align: middle;
}
body.pagelayout-login #login .custom-control-input:focus ~ .custom-control-label::before,
body.pagelayout-login #login .form-check-input:focus { box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.16) !important; }

/* ---------- پیام خطا ---------- */
body.pagelayout-login .loginerrors,
body.pagelayout-login #loginerrormessage { margin: 0 0 14px !important; }
body.pagelayout-login .loginerrors .alert,
body.pagelayout-login #loginerrormessage .alert,
body.pagelayout-login .card-body .alert-danger {
  font-family: "Estedad", Tahoma, sans-serif !important;
  font-size: 0.9rem !important;
  color: #9f1239 !important;
  background: rgba(244, 63, 94, 0.12) !important;
  border: 1px solid rgba(244, 63, 94, 0.30) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body.pagelayout-login .loginerrors .alert,
html[data-theme="dark"] body.pagelayout-login .card-body .alert-danger {
  color: #fda4af !important;
  background: rgba(244, 63, 94, 0.14) !important;
}

/* ---------- لینک‌ها ---------- */
body.pagelayout-login .card a:not(.btn) {
  color: var(--sh-teal-600) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
body.pagelayout-login .card a:not(.btn):hover { color: var(--sh-teal-400) !important; text-decoration: underline !important; }

/* ---------- کارت راهنما (اولین بار) ---------- */
body.pagelayout-login .card:not(:has(#login)),
body.pagelayout-login .card + .card {
  background: rgba(255, 255, 255, 0.38) !important;
  border: 1px dashed var(--sh-line) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body.pagelayout-login .card:not(:has(#login)),
html[data-theme="dark"] body.pagelayout-login .card + .card { background: rgba(16, 36, 60, 0.40) !important; }
body.pagelayout-login .card:not(:has(#login)) .card-body {
  padding: 18px 20px !important;
  font-size: 0.88rem !important;
  color: var(--sh-muted) !important;
}
body.pagelayout-login .card:not(:has(#login)) h2,
body.pagelayout-login .card:not(:has(#login)) h3 {
  font-size: 0.98rem !important;
  font-weight: 700 !important;
  color: var(--sh-ink) !important;
  margin-bottom: 8px !important;
}
body.pagelayout-login .card:not(:has(#login)) .btn {
  border-radius: 12px !important;
  font-weight: 600 !important;
  font-family: "Estedad", Tahoma, sans-serif !important;
}

/* ---------- فوتر مودل: مخفی روی لاگین ---------- */
body.pagelayout-login #page-footer,
body.pagelayout-login .page-footer,
body.pagelayout-login footer { display: none !important; }

/* ---------- دکمه تغییر تم (همگام با لندینگ) ---------- */
#salehan-theme-toggle {
  position: fixed;
  top: 18px;
  inset-inline-end: 18px;
  z-index: 60;
  width: 44px; height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 13px;
  cursor: pointer;
  color: var(--sh-ink, #0d1b2e);
  background: rgba(255, 255, 255, 0.55);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 22px -12px rgba(11, 42, 74, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
#salehan-theme-toggle:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -12px rgba(11, 42, 74, 0.45); }
html[data-theme="dark"] #salehan-theme-toggle {
  color: #e9f1fa;
  background: rgba(16, 36, 60, 0.55);
  border-color: rgba(148, 197, 236, 0.18);
}
#salehan-theme-toggle .ic-sun { display: block; }
#salehan-theme-toggle .ic-moon { display: none; }
html[data-theme="dark"] #salehan-theme-toggle .ic-sun { display: none; }
html[data-theme="dark"] #salehan-theme-toggle .ic-moon { display: block; }

/* ---------- موبایل ---------- */
@media (max-width: 576px) {
  body.pagelayout-login #region-main .row.justify-content-center > div[class*="col-"] { max-width: none; }
  body.pagelayout-login .card { border-radius: 20px !important; }
  body.pagelayout-login .card-body { padding: 20px 18px 22px !important; }
  body.pagelayout-login .card-header { padding: 58px 14px 4px !important; }
  body.pagelayout-login::before { width: 300px; height: 300px; }
  body.pagelayout-login::after { width: 340px; height: 340px; }
  #salehan-theme-toggle { width: 38px; height: 38px; top: 10px; inset-inline-end: 10px; border-radius: 11px; }
}

/* ---------- دسترس‌پذیری ---------- */
body.pagelayout-login .sr-only { position: absolute; width: 1px; height: 1px; }
body.pagelayout-login :focus-visible { outline: 2px solid var(--sh-teal-500) !important; outline-offset: 2px; }
body.pagelayout-login ::selection { background: rgba(20, 184, 166, 0.30); }
