/* ============================================================
   کوییزینو — تم «ماز» (biomaze.ir)
   بازطراحی کامل ظاهر پنل و سایت آزمون بر پایهٔ سبک پنل گروه آموزشی ماز:
     • رنگ اصلی آبی  #055AFF   (Maz primary-50)
     • سایدبار کارت سفید شناور با گوشه‌گرد (نه تمام‌قد تیره)
     • کارت سفید، گوشه ۱۲–۱۶px، سایهٔ نرم و حاشیهٔ بسیار روشن
     • دکمه‌های آبی گرد، جدول‌های تمیز، فیلدهای نرم
   این فایل باید آخرین لایهٔ CSS باشد تا همهٔ استایل‌های قبلی را override کند.
   ============================================================ */

:root {
  /* ---------- پالت مز ---------- */
  --mz-primary: #055AFF;
  --mz-primary-40: #2B7BFF;
  --mz-primary-60: #0048CC;
  --mz-primary-70: #003699;
  --mz-primary-80: #022466;
  --mz-primary-10: #C3DEFF;
  --mz-primary-4: #E1F2FF;
  --mz-primary-2: #EBF8FF;

  --mz-neutral-0: #FFFFFF;
  --mz-neutral-2: #FAFAFB;
  --mz-neutral-4: #F6F6F6;
  --mz-neutral-6: #F1F1F2;
  --mz-neutral-8: #EDEDEE;
  --mz-neutral-10: #E8E8E9;
  --mz-neutral-20: #D2D2D4;
  --mz-neutral-40: #A5A5A9;
  --mz-neutral-50: #8E8E93;
  --mz-neutral-60: #727276;
  --mz-neutral-70: #555558;
  --mz-neutral-90: #1C1C1D;

  --mz-success: #30D158;
  --mz-success-bg: #D6F6DE;
  --mz-success-fg: #1D7D35;
  --mz-error: #FF3C1E;
  --mz-error-bg: #FEE7E3;
  --mz-error-fg: #A41600;
  --mz-warning: #EFBF04;
  --mz-warning-bg: #FCF2CD;
  --mz-warning-fg: #8F7302;
  --mz-info: #055AFF;
  --mz-info-bg: #E7F0FF;
  --mz-info-fg: #0048CC;

  --mz-page: #F4F6F8;
  --mz-surface: #FFFFFF;
  --mz-line: #F1F1F2;
  --mz-line-2: #E8E8E9;
  --mz-ink: #0F172A;
  --mz-ink-soft: #4B5563;
  --mz-ink-muted: #8E8E93;

  --mz-r-sm: 8px;
  --mz-r: 12px;
  --mz-r-lg: 16px;
  --mz-r-xl: 20px;

  --mz-shadow-card: 0 0 2px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);
  --mz-shadow-menu: 0 0 2px rgba(0, 0, 0, .15), 0 8px 24px -6px rgba(0, 0, 0, .08);
  --mz-shadow-pop: 0 12px 32px -8px rgba(5, 90, 255, .22);

  --font: 'Vazirmatn', 'IRANSansX', 'Segoe UI', Tahoma, system-ui, sans-serif;
}

/* ---------- هم‌راستاسازی متغیرهای عمومی پنل با مز ---------- */
:root {
  --brand: #055AFF !important;
  --brand-dark: #0048CC !important;
  --brand-700: #003699 !important;
  --brand-light: #8FBDFF !important;
  --brand-rgb: 5, 90, 255 !important;
  --brand-on: #ffffff !important;

  --bg: #F4F6F8 !important;
  --surface: #FFFFFF !important;
  --surface-2: #FAFAFB !important;
  --border: #F1F1F2 !important;
  --border-2: #E8E8E9 !important;

  --text: #0F172A !important;
  --text-soft: #4B5563 !important;
  /* #8E8E93 روی سفید فقط ۳.۲۶:۱ می‌داد (زیر حد WCAG AA). اصلاح در مبدأ. */
  --text-muted: #667085 !important;

  --radius-sm: 8px !important;
  --radius: 12px !important;
  --radius-lg: 16px !important;
  --radius-xl: 20px !important;

  --shadow-sm: 0 0 2px rgba(0,0,0,.06) !important;
  --shadow: 0 0 2px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04) !important;
  --shadow-md: 0 0 2px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05) !important;
  --shadow-lg: 0 12px 32px -8px rgba(0,0,0,.14) !important;
  --shadow-brand: 0 6px 18px -4px rgba(5,90,255,.35) !important;

  --success: #30D158 !important; --success-bg: #D6F6DE !important; --success-fg: #1D7D35 !important; --success-border: #D6F6DE !important;
  --danger:  #FF3C1E !important; --danger-bg:  #FEE7E3 !important; --danger-fg:  #A41600 !important; --danger-border:  #FCA89B !important;
  --warning: #EFBF04 !important; --warning-bg: #FCF2CD !important; --warning-fg: #8F7302 !important; --warning-border: #F5D968 !important;
  --info:    #055AFF !important; --info-bg:    #E7F0FF !important; --info-fg:    #0048CC !important; --info-border:    #C3DEFF !important;
}

/* ---------- پایه ---------- */
html { scroll-behavior: smooth; }
body {
  font-family: var(--font) !important;
  background: var(--mz-page) !important;
  background-image: none !important;
  color: var(--mz-ink) !important;
  font-size: 14px;
  line-height: 1.7;
}
body::before { display: none !important; }
h1,h2,h3,h4,h5,h6 { color: var(--mz-ink); font-weight: 700; }
a { color: var(--mz-primary); }
a:hover { color: var(--mz-primary-60); }
::selection { background: rgba(5,90,255,.16); }

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--mz-neutral-20); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--mz-neutral-40); }

/* ============================================================
   نوار بالای پنل — آبی ماز (مثل نوار announcement ماز)
   ============================================================ */
.mz-announce {
  background: var(--mz-primary) !important;
  color: #fff !important;
  position: sticky; top: 0; z-index: 1300;
}
.mz-announce-in {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; min-height: 40px; padding: 6px 24px;
  max-width: 100%;
}
.mz-announce-msg { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }
.mz-announce-msg i { opacity: .9; }
.mz-announce-cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.16); color: #fff !important;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: var(--mz-r-sm); padding: 5px 14px;
  font-size: 12.5px; font-weight: 700; text-decoration: none;
  transition: background .18s;
}
.mz-announce-cta:hover { background: rgba(255,255,255,.28); color: #fff !important; }

/* ============================================================
   سایدبار → کارت سفید شناور (سبک ماز)
   ============================================================ */
.app-sidebar {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-left: 0 !important;
  border-radius: 0 var(--mz-r-lg) var(--mz-r-lg) 0 !important;
  box-shadow: var(--mz-shadow-menu) !important;
  color: var(--mz-ink-soft) !important;
  padding: 10px 8px !important;
  /* شناور: از بالا/پایین فاصله دارد و زیر نوار آبی شروع می‌شود */
  top: 52px !important; bottom: 12px !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.mz-announce ~ .app-shell .app-sidebar {
  top: 52px !important; bottom: 12px !important;
}
.app-sidebar::before { display: none !important; }
.app-sidebar .sidebar-head {
  border-bottom: 1px solid var(--mz-line) !important;
  padding: 10px 8px 14px !important;
  min-height: auto !important;
}
.app-sidebar .brand-logo {
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 0 !important;
  width: 38px !important; height: 38px !important;
  object-fit: contain !important;
}
.app-sidebar .brand-name { color: var(--mz-ink) !important; font-weight: 700 !important; }
.app-sidebar .brand-sub { color: var(--mz-ink-muted) !important; }
.sidebar-close { color: var(--mz-ink-muted) !important; border-radius: 8px !important; }
.sidebar-close:hover { background: var(--mz-neutral-6) !important; color: var(--mz-ink) !important; }

.sidebar-nav { padding: 12px 6px 16px !important; }
.sidebar-nav::-webkit-scrollbar-thumb { background: var(--mz-neutral-10) !important; }
.nav-group { margin-bottom: 12px !important; }
.sidebar-nav .nav-group-title {
  color: var(--mz-ink-muted) !important;
  font-size: 10.5px !important; font-weight: 700 !important;
  letter-spacing: .02em !important; text-transform: none !important;
  padding: 8px 12px 6px !important; opacity: 1 !important;
}
.sidebar-nav .nav-link {
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 10px 12px !important; border-radius: var(--mz-r) !important;
  color: var(--mz-ink-soft) !important; font-size: 13.5px !important; font-weight: 500 !important;
  border: 1px solid transparent !important;
  transition: all .16s ease !important; margin-bottom: 3px !important; position: relative !important;
}
.sidebar-nav .nav-link:hover {
  background: var(--mz-neutral-4) !important;
  color: var(--mz-ink) !important; border-color: var(--mz-line) !important;
}
.sidebar-nav .nav-link.active {
  background: var(--mz-primary-4) !important;
  color: var(--mz-primary-70) !important;
  font-weight: 700 !important;
  border-color: var(--mz-primary-10) !important;
}
.sidebar-nav .nav-link.active::before {
  content: '' !important; position: absolute !important;
  inset-inline-end: -7px !important; top: 50% !important;
  transform: translateY(-50%) !important;
  width: 0 !important; height: 0 !important;
  border-top: 6px solid transparent !important;
  border-bottom: 6px solid transparent !important;
  border-inline-start: 7px solid var(--mz-primary) !important;
  background: transparent !important; border-radius: 0 !important;
}
.sidebar-nav .nav-link .nav-icon { color: var(--mz-neutral-50) !important; font-size: 15px !important; width: 20px !important; opacity: 1 !important; }
.sidebar-nav .nav-link:hover .nav-icon { color: var(--mz-ink-soft) !important; }
.sidebar-nav .nav-link.active .nav-icon { color: var(--mz-primary) !important; }

.sidebar-foot { border-top: 1px solid var(--mz-line) !important; padding: 12px 8px !important; }
.sidebar-foot .user-card { background: var(--mz-neutral-2) !important; border: 1px solid var(--mz-line) !important; border-radius: var(--mz-r) !important; }
.sidebar-foot .user-avatar {
  background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important;
  color: #fff !important; border-radius: 10px !important;
}
.sidebar-foot .user-name { color: var(--mz-ink) !important; }
.sidebar-foot .user-role { color: var(--mz-ink-muted) !important; }
.sidebar-foot .signout { color: var(--mz-error) !important; }
.sidebar-foot .signout:hover { background: var(--mz-error-bg) !important; }

/* ============================================================
   تاپ‌بار
   ============================================================ */
.app-topbar {
  background: var(--mz-surface) !important;
  border-bottom: 1px solid var(--mz-line) !important;
  box-shadow: var(--mz-shadow-card) !important;
  height: 64px !important;
  top: 52px !important;
  border-bottom-left-radius: var(--mz-r-lg) !important;
  border-bottom-right-radius: var(--mz-r-lg) !important;
}
.topbar-title { color: var(--mz-ink) !important; font-weight: 700 !important; }
.icon-btn { color: var(--mz-ink-muted) !important; border-radius: 10px !important; }
.icon-btn:hover { background: var(--mz-neutral-4) !important; color: var(--mz-primary) !important; }
.panel-badge { border-radius: 999px !important; font-weight: 700 !important; }
.panel-badge-admin { background: var(--mz-primary-4) !important; color: var(--mz-primary-70) !important; border: 1px solid var(--mz-primary-10) !important; }
.panel-badge-user  { background: var(--mz-neutral-4) !important; color: var(--mz-ink-soft) !important; border: 1px solid var(--mz-line) !important; }

.topbar-stats .stat-chip {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r) !important;
}
.stat-chip:hover { border-color: var(--mz-primary-10) !important; box-shadow: var(--mz-shadow-card) !important; transform: translateY(-1px) !important; }
.stat-chip-icon {
  background: var(--mz-primary-4) !important;
  color: var(--mz-primary) !important;
  border-radius: 9px !important;
}
.stat-chip-label { color: var(--mz-ink-muted) !important; }
.stat-chip-value { color: var(--mz-ink) !important; }
.user-avatar {
  background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important;
  color: #fff !important; border-radius: 9px !important;
}

/* ============================================================
   محتوا + سرصفحه
   ============================================================ */
.app-content { padding: 24px !important; }
.pageTitle, .page-head { color: var(--mz-ink) !important; }
.page-head .page-title { color: var(--mz-ink) !important; }
.page-title { color: var(--mz-ink) !important; }
.page-title::before { display: none !important; }
.page-sub { color: var(--mz-ink-muted) !important; }
.page-head .page-icon {
  background: var(--mz-primary-4) !important;
  color: var(--mz-primary) !important;
  border-radius: var(--mz-r) !important;
  box-shadow: none !important;
}

/* ============================================================
   کارت‌ها
   ============================================================ */
.card, .fa-card {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-card) !important;
}
.card::after, .fa-card::before { display: none !important; }
.card:hover { box-shadow: 0 0 2px rgba(0,0,0,.08), 0 4px 14px -4px rgba(0,0,0,.08) !important; }
.card-head { border-bottom: 1px solid var(--mz-line) !important; }
.card-title { color: var(--mz-ink) !important; }
.card-header {
  background: var(--mz-neutral-2) !important;
  border-bottom: 1px solid var(--mz-line) !important;
  color: var(--mz-ink) !important;
}
#homePage .card { border-radius: var(--mz-r-lg) !important; }
#homePage .card:hover { transform: translateY(-3px) !important; }
#homePage .card .card-body h2:last-child { color: var(--mz-primary) !important; }

/* کارت‌های آماری رنگی داشبورد (اگر آیکون/بج دارند) */
.stat-card, .mini-card { border-radius: var(--mz-r-lg) !important; }

/* ============================================================
   دکمه‌ها
   ============================================================ */
.btn { border-radius: var(--mz-r) !important; font-weight: 700 !important; }
.btn:focus { box-shadow: 0 0 0 3px rgba(5,90,255,.18) !important; }
.btn-primary, .btn-default,
.btn-primary:not(:disabled):not(.disabled), .btn-primary.disabled, .btn-primary:disabled {
  background: var(--mz-primary) !important; border-color: var(--mz-primary) !important; color: #fff !important;
}
.btn-primary:hover, .btn-default:hover {
  background: var(--mz-primary-60) !important; border-color: var(--mz-primary-60) !important;
  box-shadow: var(--mz-shadow-brand) !important; color: #fff !important; transform: translateY(-1px) !important;
}
.btn-success, .btn-success:not(:disabled):not(.disabled) { background: var(--mz-success) !important; border-color: var(--mz-success) !important; color: #1D7D35 !important; }
.btn-success:hover { filter: brightness(.96); color: #1D7D35 !important; }
.btn-danger, .btn-danger:not(:disabled):not(.disabled) { background: var(--mz-error) !important; border-color: var(--mz-error) !important; color: #fff !important; }
.btn-danger:hover { filter: brightness(.95); color: #fff !important; }
.btn-warning, .btn-warning:not(:disabled):not(.disabled) { background: var(--mz-warning) !important; border-color: var(--mz-warning) !important; color: #4A3A00 !important; }
.btn-warning:hover { filter: brightness(.96); color: #4A3A00 !important; }
.btn-info, .btn-info:not(:disabled):not(.disabled) { background: var(--mz-info) !important; border-color: var(--mz-info) !important; color: #fff !important; }
.btn-secondary, .btn-secondary:not(:disabled):not(.disabled) { background: var(--mz-neutral-4) !important; border-color: var(--mz-line-2) !important; color: var(--mz-ink-soft) !important; }
.btn-secondary:hover { background: var(--mz-neutral-6) !important; color: var(--mz-ink) !important; }
.btn-light { background: var(--mz-surface) !important; border-color: var(--mz-line) !important; color: var(--mz-ink) !important; }
.btn-outline-primary, .btn-outline-primary:not(:disabled):not(.disabled) { background: transparent !important; border-color: var(--mz-primary) !important; color: var(--mz-primary) !important; }
.btn-outline-primary:hover { background: var(--mz-primary) !important; border-color: var(--mz-primary) !important; color: #fff !important; }
.btn-link { color: var(--mz-primary) !important; }
.btn-group > .btn:first-child { border-radius: 0 var(--mz-r) var(--mz-r) 0 !important; }
.btn-group > .btn:last-child { border-radius: var(--mz-r) 0 0 var(--mz-r) !important; }
.btn-group > .btn:only-child { border-radius: var(--mz-r) !important; }

/* ============================================================
   جدول‌ها
   ============================================================ */
table.table {
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r) !important;
  background: var(--mz-surface) !important;
}
.table thead th {
  background: var(--mz-neutral-2) !important;
  color: var(--mz-ink-muted) !important;
  border-bottom: 1px solid var(--mz-line) !important;
}
.table tbody td { border-bottom: 1px solid var(--mz-line) !important; color: var(--mz-ink-soft) !important; }
.table tbody tr:hover td { background: var(--mz-primary-2) !important; }
.table-striped tbody tr:nth-of-type(odd) td { background: var(--mz-neutral-2) !important; }
.table td .name, .table td .name b { color: var(--mz-ink) !important; }
.dataTables_wrapper { color: var(--mz-ink-soft) !important; }

/* ============================================================
   فرم‌ها
   ============================================================ */
.form-group label, form label { color: var(--mz-ink-soft) !important; }
.form-control, .custom-select, select.form-control {
  border: 1px solid var(--mz-line-2) !important;
  border-radius: var(--mz-r) !important;
  background: var(--mz-surface) !important;
  color: var(--mz-ink) !important;
}
.form-control:focus, .custom-select:focus {
  border-color: var(--mz-primary) !important;
  box-shadow: 0 0 0 3px rgba(5,90,255,.14) !important;
}
.form-control::placeholder { color: var(--mz-neutral-40) !important; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--mz-primary) !important; border-color: var(--mz-primary) !important; }
.select2-container--default .select2-selection--single {
  border: 1px solid var(--mz-line-2) !important; border-radius: var(--mz-r) !important; background: var(--mz-surface) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--mz-ink) !important; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single { border-color: var(--mz-primary) !important; }
/* .ms-choice — استایل در css/multiple-select.css */

/* ============================================================
   هشدارها / بج‌ها / مودال / dropdown / صفحه‌بندی
   ============================================================ */
.alert { border-radius: var(--mz-r) !important; }
.alert-success { background: var(--mz-success-bg) !important; color: var(--mz-success-fg) !important; border-color: #D6F6DE !important; }
.alert-danger  { background: var(--mz-error-bg) !important;  color: var(--mz-error-fg) !important;  border-color: #FCA89B !important; }
.alert-warning { background: var(--mz-warning-bg) !important; color: var(--mz-warning-fg) !important; border-color: #F5D968 !important; }
.alert-info    { background: var(--mz-info-bg) !important;    color: var(--mz-info-fg) !important;    border-color: #C3DEFF !important; }

.badge { border-radius: var(--mz-r-sm) !important; }
.badge-primary { background: var(--mz-primary-4) !important; color: var(--mz-primary-70) !important; }
.badge-success { background: var(--mz-success-bg) !important; color: var(--mz-success-fg) !important; }
.badge-danger  { background: var(--mz-error-bg) !important;  color: var(--mz-error-fg) !important; }
.badge-warning { background: var(--mz-warning-bg) !important; color: var(--mz-warning-fg) !important; }
.badge-info    { background: var(--mz-info-bg) !important;    color: var(--mz-info-fg) !important; }
.badge-secondary { background: var(--mz-neutral-4) !important; color: var(--mz-ink-soft) !important; }
.nav-badge { background: var(--mz-error) !important; color: #fff !important; }

.modal-content { border-radius: var(--mz-r-lg) !important; box-shadow: var(--mz-shadow-lg) !important; border: 1px solid var(--mz-line) !important; }
.modal-header { background: var(--mz-surface) !important; border-bottom: 1px solid var(--mz-line) !important; }
.modal-footer { border-top: 1px solid var(--mz-line) !important; }

.dropdown-menu { border: 1px solid var(--mz-line) !important; border-radius: var(--mz-r) !important; box-shadow: var(--mz-shadow-lg) !important; }
.dropdown-item { border-radius: var(--mz-r-sm) !important; color: var(--mz-ink-soft) !important; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--mz-primary-2) !important; color: var(--mz-primary-70) !important; }

.page-item .page-link { border: 1px solid var(--mz-line) !important; border-radius: var(--mz-r-sm) !important; color: var(--mz-ink-soft) !important; background: var(--mz-surface) !important; }
.page-item .page-link:hover { border-color: var(--mz-primary-10) !important; color: var(--mz-primary) !important; }
.page-item.active .page-link { background: var(--mz-primary) !important; border-color: var(--mz-primary) !important; color: #fff !important; box-shadow: var(--mz-shadow-brand) !important; }

.progress { background: var(--mz-neutral-6) !important; }
.progress-bar { background: linear-gradient(90deg, var(--mz-primary), var(--mz-primary-40)) !important; }

.iconEdit { color: var(--mz-warning-fg) !important; }
.iconDelete { color: var(--mz-error) !important; }
.tooltip-inner { background-color: var(--mz-ink) !important; border-radius: var(--mz-r-sm) !important; }

/* فوتر */
.footer-copy { background: var(--mz-surface) !important; border: 1px solid var(--mz-line) !important; color: var(--mz-ink-muted) !important; border-radius: 999px !important; }
.footer-copy i { color: var(--mz-primary) !important; }
.footer-copy b { color: var(--mz-primary-70) !important; }
.footer { color: var(--mz-ink-muted) !important; }

/* ============================================================
   ریسپانسیو — سایدبار در موبایل به کارت شناور تبدیل می‌شود
   ============================================================ */
@media (max-width: 991.98px) {
  .app-sidebar { border-radius: var(--mz-r-lg) 0 0 var(--mz-r-lg) !important; }
}
@media (min-width: 992px) {
  body.sidebar-collapsed .app-sidebar { transform: translateX(100%); }
}

/* چاپ */
@media print {
  body { background: #fff !important; }
  .card, table.table { box-shadow: var(--mz-shadow-card) !important; border: 1px solid var(--mz-line) !important; }
}


/* ============================================================
   حذف کامل هویت بصری قبلی (نقوش ایرانی/تذهیب/گره‌چینی)
   → همه‌چیز با زبان بصری «ماز» بازنویسی می‌شود.
   ============================================================ */

/* --- خاموش‌کردن همهٔ لایه‌های تزئینی قبلی --- */
.fa-girih::before, .fa-corners::before, .fa-corners::after,
.fa-shamse::before, .fa-header-tile, .fa-tazhib, .fa-side-tile,
.qz-girih-bg, .qz-tazhib, .qz-sh-orn, .qz-arch,
.qz-sec-kicker::before, .qz-sec-kicker::after,
.qz-feat::before, .qz-feat-ico::after, .qz-cta::before,
.qz-stats::after, .qz-step::after, .qz-h1 em::after,
.qz-mock-card::before, .qz-logo-mark::after, .qz-logo-mark::before,
.ex-blob, .ex-head::before, .ex-head::after, .exam-entry-body::before,
.rc-body::before, .rc-head::before, .rc-score-hero::before, .rc-card::before,
.modal.show .modal-body::before, .modal.show .modal-body::after,
.modal.show .modal-header::before, .modal.show .modal-header::after,
.modal.show .modal-footer::before, .qbw-head::before, .qbw-head::after,
.qb-modal-head::before, .qb-modal-head::after,
.acc-cover::after, .acc-form-card::before,
.card::after, .page-title::before, .app-sidebar::before, body::before {
  display: none !important;
  content: none !important;
  background: none !important;
}
.qz-girih-bg { background: transparent !important; }
.qz-tazhib, .qz-sh-orn { height: 0 !important; opacity: 0 !important; }
.qz-arch { border-radius: var(--mz-r-lg) !important; }

/* --- مودال‌ها: زبان بصری ماز (سرصفحهٔ ساده، بدون تذهیب) --- */
.modal.show .modal-content, .qb-modal-head {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-lg) !important;
}
.modal.show .modal-body { background: var(--mz-surface) !important; background-image: none !important; }
.modal.show .modal-header, .qb-modal-head {
  background: var(--mz-surface) !important;
  border-bottom: 1px solid var(--mz-line) !important;
  color: var(--mz-ink) !important;
}
.modal.show .modal-title, .qb-modal-head .modal-title { color: var(--mz-ink) !important; text-shadow: none !important; font-weight: 700 !important; }
.modal.show .modal-title i { color: var(--mz-primary) !important; }
.modal.show .modal-header .close, .qb-modal-head .close { color: var(--mz-ink-muted) !important; background: var(--mz-neutral-4) !important; border-radius: 8px !important; }
.modal.show .modal-header .close:hover { background: var(--mz-neutral-6) !important; }
.modal.show .modal-footer { background: var(--mz-neutral-2) !important; border-top: 1px solid var(--mz-line) !important; }

/* ============================================================
   بازنویسی صفحهٔ فرود (landing) با زبان بصری ماز
   ============================================================ */
.qz-landing { background: var(--mz-page) !important; }
.qz-nav { background: rgba(255,255,255,.92) !important; border-bottom: 1px solid var(--mz-line) !important; backdrop-filter: blur(10px) !important; }
.qz-nav-links a { color: var(--mz-ink-soft) !important; }
.qz-nav-links a:hover { color: var(--mz-primary) !important; }
.qz-logo-text { color: var(--mz-ink) !important; }
.qz-logo-text b { color: var(--mz-primary) !important; }

.qz-hero { background: linear-gradient(180deg, var(--mz-primary-2), var(--mz-page)) !important; }
.qz-h1 { color: var(--mz-ink) !important; }
.qz-h1 em { color: var(--mz-primary) !important; font-style: normal !important; }
.qz-lead { color: var(--mz-ink-soft) !important; }
.qz-eyebrow {
  background: var(--mz-primary-4) !important; color: var(--mz-primary-70) !important;
  border: 1px solid var(--mz-primary-10) !important; border-radius: 999px !important;
}

.qz-btn-primary { background: var(--mz-primary) !important; color: #fff !important; border-color: var(--mz-primary) !important; border-radius: var(--mz-r) !important; box-shadow: var(--mz-shadow-brand) !important; }
.qz-btn-primary:hover { background: var(--mz-primary-60) !important; color: #fff !important; }
.qz-btn-gold { background: var(--mz-primary) !important; color: #fff !important; border-color: var(--mz-primary) !important; border-radius: var(--mz-r) !important; box-shadow: var(--mz-shadow-brand) !important; }
.qz-btn-gold:hover { background: var(--mz-primary-60) !important; color: #fff !important; }
.qz-btn-ghost { background: var(--mz-surface) !important; color: var(--mz-primary) !important; border: 1px solid var(--mz-primary-10) !important; border-radius: var(--mz-r) !important; }
.qz-btn-ghost:hover { background: var(--mz-primary-2) !important; }

.qz-mock-card, .qz-feat, .qz-step, .qz-plan, .qz-faq-item, .qz-trust-item {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-card) !important;
}
.qz-feat:hover, .qz-plan:hover { box-shadow: 0 0 2px rgba(0,0,0,.08), 0 8px 24px -8px rgba(0,0,0,.10) !important; }
.qz-feat-ico { background: var(--mz-primary-4) !important; color: var(--mz-primary) !important; border-radius: var(--mz-r) !important; }
.qz-sec-kicker { color: var(--mz-primary) !important; }
.qz-h2, .qz-sec-head h2 { color: var(--mz-ink) !important; }
.qz-sec-sub { color: var(--mz-ink-muted) !important; }
.qz-step-num { background: var(--mz-primary) !important; color: #fff !important; }

.qz-stats { background: linear-gradient(135deg, var(--mz-primary-80), var(--mz-primary-70)) !important; }
.qz-stat b { color: #fff !important; }
.qz-stat span { color: rgba(255,255,255,.85) !important; }

.qz-plan-badge { background: var(--mz-primary) !important; color: #fff !important; }
.qz-plan-price b { color: var(--mz-primary) !important; }
.qz-plan-feats li i { color: var(--mz-primary) !important; }

.qz-cta { background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important; border-radius: var(--mz-r-xl) !important; }
.qz-cta h2 { color: #fff !important; }
.qz-cta p { color: rgba(255,255,255,.9) !important; }

.qz-foot { background: var(--mz-ink) !important; color: var(--mz-neutral-40) !important; }
.qz-foot a { color: var(--mz-neutral-20) !important; }
.qz-foot a:hover { color: #fff !important; }
.qz-foot-bottom { border-top: 1px solid rgba(255,255,255,.08) !important; }

/* ============================================================
   بازنویسی صفحهٔ ورود/ثبت‌نام (auth) با زبان بصری ماز
   ============================================================ */
.qz-auth { background: var(--mz-page) !important; }
.qz-auth-card {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-lg) !important;
  overflow: hidden !important;
}
.qz-auth-head {
  background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important;
  color: #fff !important;
}
.qz-auth-head .qz-auth-mark, .qz-auth-head img { filter: none !important; }
.qz-auth-body { background: var(--mz-surface) !important; }
.qz-field label { color: var(--mz-ink-soft) !important; }
.qz-input {
  border: 1px solid var(--mz-line-2) !important; border-radius: var(--mz-r) !important;
  background: var(--mz-surface) !important; color: var(--mz-ink) !important;
}
.qz-input:focus { border-color: var(--mz-primary) !important; box-shadow: 0 0 0 3px rgba(5,90,255,.14) !important; }
.qz-auth-links a { color: var(--mz-primary) !important; }
.qz-alert { border-radius: var(--mz-r) !important; }

/* ============================================================
   بازنویسی صفحهٔ ورود به آزمون (exam-entry) با زبان بصری ماز
   ============================================================ */
.exam-entry-body, .ex-bg { background: var(--mz-page) !important; }
.ex-shell, .ex-card {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-lg) !important;
}
.ex-head { background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important; color: #fff !important; }
.ex-head-icon { background: rgba(255,255,255,.16) !important; color: #fff !important; border-radius: var(--mz-r) !important; }
.ex-meta-item { background: var(--mz-neutral-2) !important; border: 1px solid var(--mz-line) !important; border-radius: var(--mz-r) !important; }
.ex-meta-label { color: var(--mz-ink-muted) !important; }
.ex-meta-value { color: var(--mz-ink) !important; }
.ex-field label { color: var(--mz-ink-soft) !important; }
.ex-input { border: 1px solid var(--mz-line-2) !important; border-radius: var(--mz-r) !important; background: var(--mz-surface) !important; color: var(--mz-ink) !important; }
.ex-input:focus { border-color: var(--mz-primary) !important; box-shadow: 0 0 0 3px rgba(5,90,255,.14) !important; }
.ex-btn-primary { background: var(--mz-primary) !important; color: #fff !important; border-color: var(--mz-primary) !important; border-radius: var(--mz-r) !important; }
.ex-btn-primary:hover { background: var(--mz-primary-60) !important; }
.ex-btn-ghost { background: var(--mz-primary-4) !important; color: var(--mz-primary-70) !important; border-color: var(--mz-primary-10) !important; border-radius: var(--mz-r) !important; }
.ex-warn { border-radius: var(--mz-r) !important; }
.ex-warn-info { background: var(--mz-info-bg) !important; color: var(--mz-info-fg) !important; border-color: #C3DEFF !important; }

/* ============================================================
   بازنویسی کارنامه (result-card) با زبان بصری ماز
   ============================================================ */
.rc-body { background: var(--mz-page) !important; }
.rc-card, .rc-mini, .rc-stat, .rc-plain, .rc-pending, .rc-chart-box {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-card) !important;
}
.rc-head { background: linear-gradient(135deg, var(--mz-primary), var(--mz-primary-60)) !important; color: #fff !important; }
.rc-head-avatar { background: rgba(255,255,255,.18) !important; color: #fff !important; border-radius: var(--mz-r) !important; }
.rc-name { color: #fff !important; }
.rc-head-meta { color: rgba(255,255,255,.85) !important; }
.rc-score-hero { background: linear-gradient(135deg, var(--mz-primary-4), var(--mz-primary-2)) !important; border: 1px solid var(--mz-primary-10) !important; border-radius: var(--mz-r-lg) !important; }
.rc-score-value { color: var(--mz-primary) !important; }
.rc-rank-num { color: var(--mz-primary) !important; }
.rc-stat-true { color: var(--mz-success-fg) !important; }
.rc-stat-false { color: var(--mz-error-fg) !important; }
.rc-mini-val { color: var(--mz-ink) !important; }
.rc-mini-lbl, .rc-rank-lbl { color: var(--mz-ink-muted) !important; }
.rc-btn-primary { background: var(--mz-primary) !important; color: #fff !important; border-radius: var(--mz-r) !important; }
.rc-table thead th { background: var(--mz-neutral-2) !important; color: var(--mz-ink-muted) !important; }
.rc-note { background: var(--mz-warning-bg) !important; color: var(--mz-warning-fg) !important; border-radius: var(--mz-r) !important; }

/* ============================================================
   عنوان‌ها: نشان آبی ماز
   ============================================================ */
.page-head .page-title::before, .page-title::before { display: none !important; }

/* ============================================================
   ایمنی موبایل — جلوگیری از سرریز افقی در همهٔ صفحات
   ============================================================ */
html, body { max-width: 100%; overflow-x: hidden; }
.app-shell, .app-main, .main-content, .container-fluid, .content-wrapper {
  max-width: 100% !important;
}
@media (max-width: 640px) {
  .app-topbar, .app-main { width: 100% !important; max-width: 100vw !important; }
  .container-fluid { padding-left: 12px !important; padding-right: 12px !important; }
  .table-responsive, table { max-width: 100%; }
  .qz-wrap, .bi-hero .qz-wrap { padding-left: 16px !important; padding-right: 16px !important; }
}

/* ============================================================
   وفاداری به ماز — ریزتنظیم فاصله‌ها، هدر، کارت‌ها، تایپوگرافی
   ============================================================ */
:root {
  --mz-topbar-h: 64px;
  --mz-announce-h: 48px;
}

/* پس‌زمینهٔ کل محتوا: خاکستری سرد ملایم ماز */
body { background: var(--mz-page) !important; }

/* هدر: کارت سفید گرد مثل ماز */
.app-topbar {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-top: 0 !important;
  box-shadow: var(--mz-shadow-card) !important;
  border-radius: 0 0 var(--mz-r-lg) var(--mz-r-lg) !important;
  padding: 0 20px !important;
}
.app-topbar .topbar-title, .app-topbar h1, .app-topbar h2 {
  font-size: 16px !important; font-weight: 800 !important;
  color: var(--mz-ink) !important;
}

/* سایدبار: فاصلهٔ داخلی و آیتم‌های درشت‌تر مثل ماز */
.app-sidebar { padding: 8px !important; }
.app-sidebar .sidebar-head { padding: 14px 12px 12px !important; }
.sidebar-nav { padding: 10px 6px 14px !important; }
.sidebar-nav .nav-link {
  padding: 11px 14px !important;
  border-radius: var(--mz-r) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  min-height: 44px !important;
}
.sidebar-nav .nav-link + .nav-link { margin-top: 3px !important; }
.sidebar-nav .nav-group-title {
  padding: 14px 14px 6px !important;
  font-size: 11px !important;
}

/* کارت‌ها: گردی و سایهٔ نرم ماز + پدینگ راحت‌تر */
.card, .fa-card, .stat-card, .mini-card, .panel-card {
  background: var(--mz-surface) !important;
  border: 1px solid var(--mz-line) !important;
  border-radius: var(--mz-r-lg) !important;
  box-shadow: var(--mz-shadow-card) !important;
}
.card { padding: 0 !important; }
.card .card-body, .card-body { padding: 18px 20px !important; }
.card .card-head, .card-head { padding: 16px 20px !important; }

/* دکمه‌ها: زبان ماز */
.btn { border-radius: var(--mz-r) !important; font-weight: 700 !important; }
.btn-primary, .btn-mz, .btn-brand {
  background: var(--mz-primary) !important; border-color: var(--mz-primary) !important;
  color: #fff !important; box-shadow: none !important;
}
.btn-primary:hover, .btn-mz:hover { background: var(--mz-primary-70) !important; }
.btn-outline-primary { color: var(--mz-primary) !important; border-color: var(--mz-primary-20) !important; background: var(--mz-primary-4) !important; }

/* جدول‌ها: ماز */
.table thead th, .table > thead > tr > th {
  background: var(--mz-neutral-2) !important;
  color: var(--mz-ink-muted) !important;
  font-weight: 700 !important;
  border-bottom: 1px solid var(--mz-line) !important;
}
.table td, .table th { border-color: var(--mz-line) !important; }

/* محتوای اصلی: فاصلهٔ ماز */
.main-content, .content-wrapper, .app-main > .container-fluid {
  padding-top: 22px !important;
}

/* موبایل: نوار آبی و سایدبار شناور جمع‌وجور */
@media (max-width: 980px) {
  .app-sidebar {
    top: 0 !important; bottom: 0 !important;
    border-radius: 0 !important;
    border-left: 0 !important; border-right: 1px solid var(--mz-line) !important;
  }
  .mz-announce-in { padding: 6px 14px !important; min-height: 44px !important; }
  .mz-announce-msg { font-size: 11.5px !important; }
  .mz-announce-cta { padding: 4px 10px !important; font-size: 11px !important; }
  .app-topbar { top: 0 !important; }
}

/* آواتار تصویری */
.user-avatar.is-img {
  background: #fff !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--mz-line) !important;
}
.user-avatar.is-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: inherit !important;
}

/* ── آواتار دانش‌آموز در پاسخ‌برگ (آیکون، نه حرف اول) ───────────────────── */
.as-avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-grid;
  place-items: center;
  background: #EEF4FF;
  color: #055AFF;
  font-size: 16px;
  flex: 0 0 auto;
}
.as-head-info {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.as-head-meta { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.as-head-meta strong { font-size: 15px; font-weight: 700; color: #0F172A; }
.as-head-meta small { font-size: 11.5px; color: #667085; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }