@font-face {
    font-family: 'Cairo';
    src: url(../fonts/cairo/Cairo-Regular.ttf) format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* ==========================================
   1. القيم الافتراضية (وضع اللايت - Light Mode)
   ========================================== */
:root,
[data-bs-theme="light"] {
    /* ألوان العناوين */
    --h1-color: #1a1a1a;
    --h2-color: #2c3e50;
    --h3-color: #34495e;
  
    /* ألوان النصوص والخلفية العامة */
    --body-bg: #ffffff;
    --body-color: #212529;
    --link-color: #0d6efd;
}

/* ==========================================
   2. ألوان وضع الدارك (Dark Mode)
   ========================================== */
[data-bs-theme="dark"] {
    /* ألوان العناوين في الدارك */
    --h1-color: #f8f9fa;
    --h2-color: #e9ecef;
    --h3-color: #dee2e6;
  
    /* ألوان النصوص والخلفية العامة */
    --body-bg: #121212;
    --body-color: #e0e0e0;
    --link-color: #6ea8fe;
}

/* ==========================================
   3. تطبيق المتغيرات على العناصر
   ========================================== */

body {
    font-family: 'Cairo', sans-serif !important;
}

.btn-gold {
    background-color: var(--brand-gold);
    color: #ffffff !important;
    border: none;
}
.btn-gold:hover {
    background-color: var(--brand-gold-hover);
    color: #ffffff !important;
}
.btn-outline-gold {
    border-color: var(--brand-gold);
    color: var(--brand-gold);
}
.btn-outline-gold:hover {
    background-color: var(--brand-gold);
    color: #ffffff !important;
}