/*
Theme Name: Safwat Al Khair Real Estate
Theme URI: https://safwatalkhair.com
Author: Safwat Al Khair
Author URI: https://safwatalkhair.com
Description: Premium dark real-estate marketing theme for صفوة الخير للتسويق العقاري — charcoal & gold, bilingual AR/EN, Bootstrap 5, mobile-first, Schema.org, WhatsApp CTA. Built for lead conversion in the Saudi market.
Version: 2.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
Text Domain: safwat-al-khair
Tags: real-estate, blog, custom-logo, custom-menu, rtl-language-support, translation-ready, featured-images, dark, one-column, two-columns, custom-colors, editor-style, sticky-post, threaded-comments
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ==========================================================================
   DESIGN TOKENS — Safwat Al Khair 2.0
   Premium Minimalist · Charcoal + Gold
   ========================================================================== */

:root {
	/* ── Brand Palette ─────────────────────────────────────────────── */
	--color-bg:          #383838;
	--color-bg-2:        #1F1F1F;
	--color-surface:     #2B2B2B;
	--color-gold:        #D2BA81;
	--color-gold-dark:   #B9A776;
	--color-gold-light:  #DDC390;
	--color-text:        #F4F1EA;
	--color-text-muted:  #CFC9BC;

	/* ── Semantic aliases ──────────────────────────────────────────── */
	--color-accent:      var(--color-gold);
	--color-accent-hover:var(--color-gold-light);
	--color-border:      rgba(210, 186, 129, .15);
	--color-border-subtle:rgba(255,255,255,.06);
	--color-overlay:     rgba(31, 31, 31, .85);
	--color-success:     #34D399;
	--color-error:       #F87171;
	--color-info:        #60A5FA;
	--color-whatsapp:    #25D366;

	/* ── Shadows ───────────────────────────────────────────────────── */
	--shadow-sm:   0 1px 3px rgba(0,0,0,.25);
	--shadow-md:   0 4px 16px rgba(0,0,0,.30);
	--shadow-lg:   0 12px 40px rgba(0,0,0,.40);
	--shadow-gold: 0 4px 24px rgba(210,186,129,.18);

	/* ── Radii ─────────────────────────────────────────────────────── */
	--radius-xs:  6px;
	--radius-sm:  10px;
	--radius-md:  14px;
	--radius-lg:  20px;
	--radius-xl:  28px;
	--radius-full:9999px;

	/* ── Spacing scale (8px base) ──────────────────────────────────── */
	--space-1:  .25rem;   /* 4px  */
	--space-2:  .5rem;    /* 8px  */
	--space-3:  .75rem;   /* 12px */
	--space-4:  1rem;     /* 16px */
	--space-5:  1.5rem;   /* 24px */
	--space-6:  2rem;     /* 32px */
	--space-7:  2.5rem;   /* 40px */
	--space-8:  3rem;     /* 48px */
	--space-9:  4rem;     /* 64px */
	--space-10: 5rem;     /* 80px */
	--space-11: 6rem;     /* 96px */
	--space-12: 8rem;     /* 128px */

	/* ── Typography ────────────────────────────────────────────────── */
	--font-ar:   'IBM Plex Sans Arabic', 'Cairo', 'Tajawal', system-ui, sans-serif;
	--font-en:   'Inter', system-ui, -apple-system, sans-serif;
	--font-mono: 'IBM Plex Mono', ui-monospace, monospace;

	/* Type scale (modular — 1.2 ratio) */
	--text-xs:   .75rem;    /* 12px */
	--text-sm:   .875rem;   /* 14px */
	--text-base: 1rem;      /* 16px */
	--text-md:   1.125rem;  /* 18px */
	--text-lg:   1.25rem;   /* 20px */
	--text-xl:   1.5rem;    /* 24px */
	--text-2xl:  1.875rem;  /* 30px */
	--text-3xl:  2.25rem;   /* 36px */
	--text-4xl:  3rem;      /* 48px */
	--text-5xl:  3.75rem;   /* 60px */

	--leading-tight:   1.2;
	--leading-normal:  1.6;
	--leading-relaxed: 1.8;

	/* ── Transitions ───────────────────────────────────────────────── */
	--ease-out:  cubic-bezier(.16,1,.3,1);
	--duration:  .25s;

	/* ── Focus ring ────────────────────────────────────────────────── */
	--focus-ring: 0 0 0 3px rgba(210,186,129,.40);

	/* ── Light-mode palette (for alternating sections) ─────────────── */
	--color-bg-light:    #F7F4EF;         /* warm cream */
	--color-dark-text:   #2D2D2D;
	--color-dark-heading:#1A1A1A;
	--color-dark-muted:  #6B6B6B;

	/* ── Z-index ───────────────────────────────────────────────────── */
	--z-dropdown:  100;
	--z-sticky:    200;
	--z-header:    1000;
	--z-overlay:   1100;
	--z-modal:     1200;
	--z-whatsapp:  1300;
}

/* Theme styles are loaded from assets/css/theme.css */