:root {
    /* ── Legacy palette (dashboard pages) ─────────────────── */
    --color-primary:       #1E3A5F;
    --color-primary-dark:  #102A43;
    --color-primary-light: #2C4A7C;
    --color-accent:        #a98130;
    --color-accent-light:  #DCC68A;
    --color-success:       #10B981;
    --color-danger:        #EF4444;
    --color-warning:       #F59E0B;
    --color-white:         #ffffff;
    --color-bg:            #F9FAFB;
    --color-text:          #374151;
    --color-text-muted:    #6B7280;
    --color-border:        #E5E7EB;
    --color-card-bg:       #ffffff;

    /* ── Brand Navy ────────────────────────────────────────── */
    --navy-900: #0A1929;
    --navy-800: #102A43;
    --navy-700: #16294A;
    --navy-600: #1E3A5F;
    --navy-500: #2C4A7C;
    --navy-400: #3D5A8C;
    --navy-300: #5D7A9C;

    /* ── Brand Gold ────────────────────────────────────────── */
    --gold-100: #F4E4BC;
    --gold-200: #E8D5A3;
    --gold-300: #DCC68A;
    --gold-400: #a98130;
    --gold-500: #8B6B26;
    --gold-600: #6E541E;
    --gold-700: #4F3C15;

    /* ── Semantic ──────────────────────────────────────────── */
    --success: #10B981;
    --warning: #F59E0B;
    --error:   #EF4444;
    --info:    #3B82F6;

    /* ── Grays ─────────────────────────────────────────────── */
    --white:    #FFFFFF;
    --gray-50:  #F9FAFB;
    --gray-100: #F3F4F6;
    --gray-200: #E5E7EB;
    --gray-300: #D1D5DB;
    --gray-400: #9CA3AF;
    --gray-500: #6B7280;
    --gray-600: #4B5563;
    --gray-700: #374151;
    --gray-800: #1F2937;
    --gray-900: #111827;

    /* ── Typography ────────────────────────────────────────── */
    --font-heading: 'Cinzel', serif;
    --font-body:    'Montserrat', sans-serif;
    --font-arabic:  'Tajawal', sans-serif;
    --font-latin:   'Montserrat', sans-serif;
    --font-brand:   'Cinzel', serif;

    /* ── Gradients ─────────────────────────────────────────── */
    --grad-gold:     linear-gradient(135deg, var(--gold-400) 0%, var(--gold-600) 100%);
    --grad-navy:     linear-gradient(135deg, var(--navy-600) 0%, var(--navy-700) 100%);
    --grad-gold-btn: linear-gradient(135deg, #D4AF37 0%, #AA8C2C 100%);

    /* ── Shadows ───────────────────────────────────────────── */
    --shadow-gold:       0 4px 20px rgba(169,129,48,0.25);
    --shadow-gold-hover: 0 6px 25px rgba(169,129,48,0.35);
    --shadow-card:       0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
    --shadow-card-hover: 0 10px 35px rgba(0,0,0,0.08);
    --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
    --shadow-md:  0 4px 12px rgba(0,0,0,.12);
    --shadow-lg:  0 8px 24px rgba(0,0,0,.15);

    /* ── Radii ─────────────────────────────────────────────── */
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 20px;
    --radius-sm:  4px;
    --radius-md:  8px;
    --radius-lg:  16px;
    --radius-xl:  24px;

    --transition: all .25s ease;

    /* ── Layout ────────────────────────────────────────────── */
    --sidebar-w-expanded:  280px;
    --sidebar-w-collapsed: 72px;
    --sidebar-w: var(--sidebar-w-expanded);
    --header-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-latin);
    background: var(--color-bg);
    color: var(--color-text);
    line-height: 1.6;
    min-height: 100vh;
}

[lang="ar"] body,
[dir="rtl"] body {
    font-family: var(--font-arabic);
}

a { color: var(--color-primary); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--color-accent); }

img { max-width: 100%; height: auto; }