/*
File: RafinaStudio/assets/css/theme-vars.css
متغیرهای مشترک رنگ (روشن/تاریک) و منطق نمایش لوگوی روشن/تاریک —
این فایل توسط هدر و فوتر هر دو به‌عنوان وابستگی (dependency) لود می‌شود
تا هیچ‌وقت این دو تکه‌ی حیاتی از هم جدا نیفتند.
*/

:root {
	--rafina-bg: #f6faf6;
	--rafina-bg-2: #eef4ee;
	--rafina-panel: #ffffff;
	--rafina-border: rgba(20, 40, 25, 0.09);
	--rafina-border-2: rgba(20, 40, 25, 0.16);
	--rafina-text: #152018;
	--rafina-text-dim: #4c5a51;
	--rafina-text-dimmer: #7c8b81;
	--rafina-accent: #1f8034;
	--rafina-accent-2: #19672a;
	--rafina-ghost-bg: rgba(20, 40, 25, 0.04);
	--rafina-ghost-bg-hover: rgba(20, 40, 25, 0.08);
	--rafina-header-bg: rgba(246, 250, 246, 0.72);
	--rafina-header-bg-solid: rgba(246, 250, 246, 0.96);
	--rafina-radius: 18px;
	--rafina-radius-sm: 12px;
	--rafina-container: 1220px;
}

html[data-rafina-theme="dark"] {
	--rafina-bg: #080b11;
	--rafina-bg-2: #0d121b;
	--rafina-panel: #121826;
	--rafina-border: rgba(255, 255, 255, 0.08);
	--rafina-border-2: rgba(255, 255, 255, 0.14);
	--rafina-text: #eef1f7;
	--rafina-text-dim: #9aa4b8;
	--rafina-text-dimmer: #6b7488;
	--rafina-accent-2: #49ca52;
	--rafina-ghost-bg: rgba(255, 255, 255, 0.04);
	--rafina-ghost-bg-hover: rgba(255, 255, 255, 0.08);
	--rafina-header-bg: rgba(8, 11, 17, 0.72);
	--rafina-header-bg-solid: rgba(8, 11, 17, 0.96);
}

body { background: var(--rafina-bg); color: var(--rafina-text); }
.rafina-container { max-width: var(--rafina-container); margin: 0 auto; padding-inline: 20px; }

/* --------------------------------------------------------------
   لوگوی روشن/تاریک — قانون واحد، همه‌جا (هدر، فوتر، صفحه بزودی) از
   همین استفاده می‌کنند. پیش‌فرض: فقط نسخه‌ی روشن نمایش داده می‌شود.
-------------------------------------------------------------- */
.rafina-logo-dark { display: none !important; }
.rafina-logo-light { display: inline-block !important; }
html[data-rafina-theme="dark"] .rafina-logo-light { display: none !important; }
html[data-rafina-theme="dark"] .rafina-logo-dark { display: inline-block !important; }

/* --------------------------------------------------------------
   سایز ثابت لوگو — صرف‌نظر از سایز فایل آپلودی، همیشه دقیقاً همین
   ابعاد است (نه کوچک‌تر، نه بزرگ‌تر). object-fit:contain تضمین
   می‌کند تصویر بدون کِش‌شدگی داخل این کادر جا بگیرد.
-------------------------------------------------------------- */
.rafina-logo-img,
.rafina-logo-fallback {
	width: 160px;
	height: 44px;
	object-fit: contain;
	object-position: right center;
	display: inline-block;
}
.rafina-logo-fallback {
	font-weight: 700;
	font-size: 19px;
	display: inline-flex;
	align-items: center;
}