/* =====================================================================
   FileCenter Marketplace - Dark Mode overrides for hardcoded Tailwind
   utility classes (بخش‌هایی از هدر/فوتر که رنگشان مستقیم با کلاس‌های
   Tailwind مثل bg-white/text-slate-900 نوشته شده، نه با متغیرهای CSS در
   style.css). بقیه‌ی سایت (کارت‌ها، دکمه‌ها، فرم‌ها، صفحه محصول/حساب/سبد
   خرید) با همان متغیرهای رنگی در style.css به‌طور خودکار تاریک می‌شوند.
   این فایل بعد از tailwind.css لود می‌شود.
   ===================================================================== */

html[data-theme="dark"] body {
    background: var(--bg);
    color: var(--text);
}

/* پس‌زمینه‌ی body در header.php با کلاس دلخواه (arbitrary value) نوشته شده */
html[data-theme="dark"] .bg-\[\#f8fbff\] { background-color: var(--bg) !important; }
html[data-theme="dark"] .bg-\[\#f1f5f9\]\/90 { background-color: rgba(15, 23, 42, .92) !important; }
html[data-theme="dark"] .bg-\[\#f8fafc\] { background-color: var(--surface) !important; }
html[data-theme="dark"] .bg-\[\#f8fafc\]\/80 { background-color: rgba(30, 41, 59, .85) !important; }

html[data-theme="dark"] .bg-white { background-color: var(--surface) !important; }
html[data-theme="dark"] .bg-slate-50 { background-color: #263449 !important; }
html[data-theme="dark"] .bg-slate-900 { background-color: #020617 !important; }

html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-slate-800,
html[data-theme="dark"] .text-slate-700 { color: var(--text) !important; }
html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-slate-500 { color: var(--text-muted) !important; }
html[data-theme="dark"] .text-slate-400,
html[data-theme="dark"] .placeholder\:text-slate-400::placeholder { color: #64748b !important; }

html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-slate-200\/60 { border-color: var(--border) !important; }

html[data-theme="dark"] .hover\:bg-white:hover,
html[data-theme="dark"] .hover\:bg-slate-50:hover { background-color: #263449 !important; }
html[data-theme="dark"] .hover\:text-slate-900:hover,
html[data-theme="dark"] .hover\:text-slate-800:hover { color: var(--text) !important; }

/* منوهای کشویی (زیرمنوی دسته‌بندی‌ها، منوی حساب کاربری) */
html[data-theme="dark"] .fm-submenu .bg-white,
html[data-theme="dark"] #account-menu-dropdown.bg-white { background: var(--surface) !important; }

/* آیکون‌های دایره‌ای هدر (پشتیبانی/اعلان/سبد خرید) و دکمه منوی موبایل */
html[data-theme="dark"] a[title].bg-white,
html[data-theme="dark"] button.bg-white { background-color: #263449 !important; }

/* دکمه سوییچ تم */
.fm-theme-toggle svg.fm-icon-sun { display: none; }
.fm-theme-toggle svg.fm-icon-moon { display: inline-block; }
html[data-theme="dark"] .fm-theme-toggle svg.fm-icon-sun { display: inline-block; }
html[data-theme="dark"] .fm-theme-toggle svg.fm-icon-moon { display: none; }

/* ---------- اختصاصی قالب صفحه اصلی «ساویر» (assets/css/savir-home.css) ----------
   این قالب چند رنگ و پس‌زمینه‌ی مخصوص خودش دارد که override های عمومی بالا
   پوشش نمی‌دهند (چون این فایل بعد از dark-mode.css لود می‌شود ولی این
   کلاس‌ها اصلا در بالا override نشده بودند). */
html[data-theme="dark"] .savir-page-bg {
    background-color: var(--bg) !important;
    background-image: repeating-linear-gradient(135deg, rgba(148,163,184,.06) 0px, rgba(148,163,184,.06) 1px, transparent 1px, transparent 15px) !important;
}
html[data-theme="dark"] .glass {
    background: rgba(30, 41, 59, .75) !important;
}
html[data-theme="dark"] .bg-slate-100,
html[data-theme="dark"] .bg-slate-200,
html[data-theme="dark"] .bg-slate-300 { background-color: #334155 !important; }
html[data-theme="dark"] .text-slate-200,
html[data-theme="dark"] .text-slate-300 { color: var(--text) !important; }
html[data-theme="dark"] .border-slate-900 { border-color: var(--border) !important; }
html[data-theme="dark"] .hover\:border-slate-300:hover { border-color: #475569 !important; }
html[data-theme="dark"] .hover\:bg-black:hover { background-color: #000 !important; }
/* آکاردئون سوالات متداول ساویر وقتی باز است (details[open]) پس‌زمینه/رنگ تیره‌ی ثابت دارد؛
   در حالت تاریک با پس‌زمینه‌ی صفحه یکی می‌شد، پس رنگ روشن‌تری برایش گذاشته شده */
html[data-theme="dark"] details.group[open] > summary .group-open\:bg-slate-900 { background-color: #334155 !important; }