/*
 * MA-ZAL Theme Variables
 * file: assets/css/theme-vars.css
 * source: demo.readme [THEME] + head.css + full CSS audit
 *
 * RULE: Every CSS file in this demo imports this file.
 * No color value may be hardcoded anywhere else.
 */

:root {

	/* ═══════════════════════════════════════════
	   CORE BACKGROUND & SURFACE
	   ═══════════════════════════════════════════ */

	--mz-color-bg:          #1a1814;   /* خلفية الجسم الرئيسية */
	--mz-color-bg-dark:     #120e06;   /* أعمق — overlays، dropdowns */
	--mz-color-surface:     #1e1608;   /* surface — cards، panels */
	--mz-color-surface-2:   #221a08;   /* surface ثانوية أفتح */
	--mz-color-surface-3:   #2e2210;   /* surface للـ hover states */

	/* ═══════════════════════════════════════════
	   ACCENT — GOLD
	   ═══════════════════════════════════════════ */

	--mz-color-accent:       #C9A84C;  /* الذهبي الرئيسي */
	--mz-color-accent-hover: #A8924A;  /* hover على الذهبي */
	--mz-color-accent-dark:  #8D6C18;  /* ذهبي غامق — active، pressed */
	--mz-color-accent-light: #E8D9B8;  /* ذهبي فاتح — نص على خلفيات داكنة */
	--mz-color-accent-pale:  #F4E7C9;  /* ذهبي شاحب — خلفيات cards فاتحة */

	/* ═══════════════════════════════════════════
	   TEXT
	   ═══════════════════════════════════════════ */

	--mz-color-text:         #E8D9B8;  /* نص رئيسي على خلفية داكنة */
	--mz-color-text-muted:   #C4AC7A;  /* نص ثانوي / muted */
	--mz-color-text-dark:    #1a1814;  /* نص على خلفيات فاتحة */
	--mz-color-text-on-light:#1e1608;  /* نص داكن على الكروت البيضاء */

	/* ═══════════════════════════════════════════
	   BORDERS
	   ═══════════════════════════════════════════ */

	--mz-color-border:       #C9A84C;  /* border رئيسي */
	--mz-color-border-soft:  rgba(201, 168, 76, 0.22);  /* border خفيف */
	--mz-color-border-faint: rgba(201, 168, 76, 0.10);  /* border شبه شفاف */

	/* ═══════════════════════════════════════════
	   PORTAL — LIGHT SURFACES
	   (صفحات البوابة: account، consulting، coffee...)
	   ═══════════════════════════════════════════ */

	--mz-portal-bg:          #F4F1E8;  /* خلفية صفحات البوابة */
	--mz-portal-surface:     #ffffff;  /* cards / panels البيضاء */
	--mz-portal-surface-2:   #F7F3EA;  /* surface ثانوية فاتحة */
	--mz-portal-border:      #d7dce5;  /* borders البوابة */
	--mz-portal-border-2:    #e4e8ef;  /* borders خفيفة */
	--mz-portal-text:        #1e1608;  /* نص البوابة */
	--mz-portal-text-muted:  #667085;  /* نص ثانوي */

	/* ═══════════════════════════════════════════
	   STATUS COLORS
	   ═══════════════════════════════════════════ */

	--mz-color-success:      #6EE7A0;
	--mz-color-success-bg:   #DFF7E7;
	--mz-color-warning:      #E8C767;
	--mz-color-warning-bg:   #FFF8E6;
	--mz-color-error:        #D4888A;
	--mz-color-error-bg:     #FFF3CF;
	--mz-color-info:         #8AAED4;
	--mz-color-info-bg:      #DFE9FA;

	/* ═══════════════════════════════════════════
	   WELCOME SCREEN
	   (نسخة مخصصة لشاشة الترحيب)
	   ═══════════════════════════════════════════ */

	--mz-welcome-bg:         var(--mz-color-bg);
	--mz-welcome-surface:    var(--mz-color-surface);
	--mz-welcome-accent:     var(--mz-color-accent);
	--mz-welcome-text:       var(--mz-color-text);
	--mz-welcome-muted:      var(--mz-color-text-muted);
	--mz-welcome-border:     var(--mz-color-border);

	/* ═══════════════════════════════════════════
	   SHADOWS
	   ═══════════════════════════════════════════ */

	--mz-shadow-sm:  0 2px 8px  rgba(10, 6, 0, 0.30);
	--mz-shadow:     0 8px 32px rgba(10, 6, 0, 0.40);
	--mz-shadow-lg:  0 24px 80px rgba(10, 6, 0, 0.45);

	/* ═══════════════════════════════════════════
	   TYPOGRAPHY
	   ═══════════════════════════════════════════ */

	--mz-font-body:    "Inter", "Tajawal", system-ui, -apple-system, sans-serif;
	--mz-font-display: "Inter", "Segoe UI", Tahoma, Arial, sans-serif;

	/* ═══════════════════════════════════════════
	   LAYOUT
	   ═══════════════════════════════════════════ */

	--mz-radius:    20px;
	--mz-radius-sm: 12px;
	--mz-max-width: 1180px;
	--mz-header-h:  80px;
	--mz-footer-h:  20px;
}

/* ── RTL font override ── */
html[lang="ar"],
html[dir="rtl"] {
	--mz-font-body:    "Tajawal", Arial, sans-serif;
	--mz-font-display: "Tajawal", Arial, sans-serif;
}
