/* ============================================================
   Meettiz — Custom Theme Layer (v3, refined / softer)
   يُحمّل بعد style(.rtl).min.css فيتغلّب على شكل Sngine الافتراضي.
   ============================================================ */

:root {
  --mtz-primary: #6C5CE7;
  --mtz-primary-hover: #5A49D1;
  --mtz-grad: linear-gradient(135deg, #7E6EF0 0%, #9A7BF3 100%);
  --mtz-primary-soft: rgba(108, 92, 231, 0.08);
  --mtz-primary-soft2: rgba(108, 92, 231, 0.13);
  --mtz-primary-ring: rgba(108, 92, 231, 0.20);

  --mtz-bg: #F0F1F6;
  --mtz-card: #FFFFFF;
  --mtz-text: #23262F;
  --mtz-muted: #7A8194;
  --mtz-border: #ECEEF4;

  --mtz-radius: 16px;
  --mtz-radius-sm: 11px;
  --mtz-radius-pill: 999px;
  --mtz-shadow: 0 2px 12px rgba(24, 27, 50, 0.05);
  --mtz-shadow-hover: 0 6px 20px rgba(24, 27, 50, 0.07);
  --mtz-shadow-primary: 0 4px 12px rgba(108, 92, 231, 0.22);

  --mtz-font: 'Tajawal', 'Poppins', -apple-system, 'Segoe UI', sans-serif;
}

/* ---------- الأساسيات ---------- */
body {
  font-family: var(--mtz-font) !important;
  background: var(--mtz-bg) !important;
  color: var(--mtz-text);
  font-size: 15px;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 { font-family: var(--mtz-font) !important; font-weight: 700; }
a { color: var(--mtz-primary); }
a:hover { color: var(--mtz-primary-hover); }

/* ---------- الترويسة ---------- */
.main-header {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: saturate(160%) blur(12px);
  -webkit-backdrop-filter: saturate(160%) blur(12px);
  border-bottom: 1px solid var(--mtz-border) !important;
  box-shadow: none;
}
.logo-wrapper, .logo { font-family: var(--mtz-font) !important; font-weight: 800 !important; letter-spacing: -0.3px; }
.logo-wrapper a, .logo a, .logo-wrapper > a {
  background: var(--mtz-grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent !important;
}
.header-icon {
  width: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50% !important;
  color: #565b6e !important;
  transition: background-color .15s ease, color .15s ease;
}
.header-icon:hover { background: var(--mtz-primary-soft); color: var(--mtz-primary) !important; }
.main-header .search-wrapper .form-control {
  border-radius: var(--mtz-radius-pill) !important;
  background: #F1F2F7; border: 1px solid transparent; height: 44px;
}
.main-header .search-wrapper .form-control:focus {
  background: #fff; border-color: var(--mtz-primary);
  box-shadow: 0 0 0 3px var(--mtz-primary-ring);
}

/* ---------- البطاقات ---------- */
.card {
  border-radius: var(--mtz-radius) !important;
  border: 1px solid var(--mtz-border) !important;
  box-shadow: var(--mtz-shadow) !important;
  transition: box-shadow .2s ease;
}
.card:hover { box-shadow: var(--mtz-shadow-hover) !important; }
.card + .card, .mb15 { margin-top: 16px; }

/* ---------- الشريط الجانبي ---------- */
.main-side-nav-card { border-radius: var(--mtz-radius) !important; padding: 6px 4px; }
.main-side-nav > li { margin: 2px 0; }
.main-side-nav > li > a {
  border-radius: var(--mtz-radius-sm);
  padding: 8px 12px !important; margin: 0 6px;
  font-weight: 500; color: #414759;
  transition: background-color .15s ease, color .15s ease;
}
.main-side-nav > li > a:hover { background: var(--mtz-primary-soft); color: var(--mtz-primary); }
/* العنصر النشط: تظليل ناعم + نص بلون العلامة + شريط جانبي رفيع (بدل الحبة الصارخة) */
.main-side-nav > li.active > a,
.side-nav > li.active > a {
  background: var(--mtz-primary-soft2) !important;
  color: var(--mtz-primary) !important;
  font-weight: 700;
  box-shadow: none;
  position: relative;
}
.main-side-nav > li.active > a::before {
  content: ''; position: absolute; top: 50%; transform: translateY(-50%);
  right: 0; width: 3px; height: 22px; border-radius: 3px; background: var(--mtz-grad);
}
/* أيقونات القائمة داخل رقاقة خفيفة */
.main-side-nav .main-icon {
  background: rgba(108, 92, 231, 0.12);
  color: var(--mtz-primary) !important;
  border-radius: 9px;
  width: 34px !important; height: 34px !important;
  padding: 0 !important; box-sizing: border-box !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  vertical-align: middle;
  flex: 0 0 auto;
}
.main-side-nav .main-icon svg {
  width: 19px !important; height: 19px !important;
  color: var(--mtz-primary) !important; fill: var(--mtz-primary) !important;
}
.main-side-nav > li.active > a .main-icon,
.main-side-nav > li.active > a .main-icon * {
  background: var(--mtz-primary-soft2); color: var(--mtz-primary) !important; fill: var(--mtz-primary) !important;
}

/* ---------- الأزرار ---------- */
.btn { border-radius: var(--mtz-radius-sm); font-weight: 600; transition: filter .15s ease, box-shadow .15s ease; }
.btn-primary {
  background: var(--mtz-grad) !important; border: none !important;
  box-shadow: var(--mtz-shadow-primary);
}
.btn-primary:hover, .btn-primary:focus { filter: brightness(1.04); }
.btn-light, .btn-secondary { border-radius: var(--mtz-radius-sm); background: #F1F2F7; border-color: transparent; color: #414759; }
.btn-rounded { border-radius: var(--mtz-radius-pill); }

/* ---------- الحقول ---------- */
.form-control, .form-select {
  border-radius: var(--mtz-radius-sm);
  border: 1px solid var(--mtz-border);
  background: #F8F9FC;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.form-control:focus, .form-select:focus {
  border-color: var(--mtz-primary); background: #fff;
  box-shadow: 0 0 0 3px var(--mtz-primary-ring);
}

/* ---------- لمسات ---------- */
.text-primary { color: var(--mtz-primary) !important; }
.bg-primary { background: var(--mtz-grad) !important; }
.badge.bg-primary { background: var(--mtz-grad) !important; }
.dropdown-menu { border-radius: var(--mtz-radius-sm); border: 1px solid var(--mtz-border); box-shadow: var(--mtz-shadow-hover); }
.dropdown-menu .dropdown-item { border-radius: 9px; margin: 2px 6px; width: auto; }
.dropdown-menu .dropdown-item:hover { background: var(--mtz-primary-soft); color: var(--mtz-primary); }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active {
  color: var(--mtz-primary); border: none; background: var(--mtz-primary-soft2); border-radius: var(--mtz-radius-pill);
}

/* شريط تمرير رفيع */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #CBD0DE; border-radius: var(--mtz-radius-pill); border: 2px solid var(--mtz-bg); }
::-webkit-scrollbar-thumb:hover { background: var(--mtz-primary); }

/* ---------- الصفحات الثابتة (عن/الشروط/الخصوصية) ---------- */
.static-page-content { line-height: 1.9; color: #3a3f4d; text-align: justify; text-justify: inter-word; }
.static-page-content p, .static-page-content li { text-align: justify; }
.static-page-content h2, .static-page-content h3 { text-align: start; }
/* إظهار محتوى الصفحة حسب لغة الموقع: عربي لـ ar_*، وإنجليزي لبقية اللغات */
html[data-lang^="ar"] .static-page-content .mtz-en { display: none; }
html:not([data-lang^="ar"]) .static-page-content .mtz-ar { display: none; }
.static-page-content .lead {
  font-size: 1.12em; font-weight: 500; color: var(--mtz-text);
  background: var(--mtz-primary-soft); border-radius: var(--mtz-radius-sm);
  padding: 16px 18px; margin-bottom: 24px; border-inline-start: 4px solid var(--mtz-primary);
}
.static-page-content h2 {
  color: var(--mtz-primary); font-weight: 800; font-size: 1.35em;
  margin: 30px 0 12px; padding-bottom: 8px; border-bottom: 2px solid var(--mtz-primary-soft2);
}
.static-page-content h3 { color: var(--mtz-text); font-weight: 700; margin: 22px 0 10px; }
.static-page-content p { margin-bottom: 14px; }
.static-page-content ul { padding-inline-start: 22px; margin-bottom: 16px; }
.static-page-content li { margin-bottom: 8px; }
.static-page-content a { color: var(--mtz-primary); text-decoration: underline; text-underline-offset: 3px; }
body.night-mode .static-page-content { color: #cdd1de; }
body.night-mode .static-page-content h3 { color: #e6e8ef; }

/* ============================================================
   الوضع الليلي
   ============================================================ */
body.night-mode {
  --mtz-card: #1C1F29;
  --mtz-text: #E6E8EF;
  --mtz-border: #292D38;
  background: #15171F !important;
  color: var(--mtz-text);
}
body.night-mode .card, body.night-mode .main-side-nav-card {
  background: var(--mtz-card) !important; border-color: var(--mtz-border) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.30) !important;
}
body.night-mode .main-header { background: rgba(21, 23, 31, 0.9) !important; border-bottom-color: var(--mtz-border) !important; }
body.night-mode .header-icon { color: #cdd1de !important; }
body.night-mode .main-side-nav > li > a { color: #cdd1de; }
body.night-mode .form-control, body.night-mode .form-select,
body.night-mode .main-header .search-wrapper .form-control { background: #232733; border-color: var(--mtz-border); color: var(--mtz-text); }
body.night-mode .btn-light, body.night-mode .btn-secondary { background: #232733; color: #cdd1de; }
body.night-mode ::-webkit-scrollbar-thumb { background: #333846; border-color: #15171F; }
