/* =========================================================
   FONT-FACE IMPORTS
   ========================================================= */

/* ------------------------ Tajawal Arabic ------------------------ */
@font-face {
  font-family: 'Tajawal';
  font-weight: 300;
  font-style: normal;
  src: url('https://fonts.gstatic.com/s/tajawal/v12/Iurf6YBj_oCad4k1l5qjHrFpiQ.woff2') format('woff2');
}

@font-face {
  font-family: 'Tajawal';
  font-weight: 400;
  font-style: normal;
  src: url('https://fonts.gstatic.com/s/tajawal/v12/Iura6YBj_oCad4k1nzGBCw.woff2') format('woff2');
}

@font-face {
  font-family: 'Tajawal';
  font-weight: 500;
  font-style: normal;
  src: url('https://fonts.gstatic.com/s/tajawal/v12/Iurf6YBj_oCad4k1l8KiHrFpiQ.woff2') format('woff2');
}

@font-face {
  font-family: 'Tajawal';
  font-weight: 700;
  font-style: normal;
  src: url('https://fonts.gstatic.com/s/tajawal/v12/Iurf6YBj_oCad4k1l4qkHrFpiQ.woff2') format('woff2');
}

@font-face {
  font-family: 'Tajawal';
  font-weight: 800;
  font-style: normal;
  src: url('https://fonts.gstatic.com/s/tajawal/v12/Iurf6YBj_oCad4k1l5anHrFpiQ.woff2') format('woff2');
}


/* ------------------------ Inter English ------------------------ */
@font-face {
  font-family: 'Inter';
  font-weight: 400;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-weight: 500;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-weight: 600;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-weight: 700;
  src: url('https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2') format('woff2');
}


/* ------------------------ Birthstone Decorative ------------------------ */
@font-face {
  font-family: 'Birthstone';
  font-weight: 400;
  src: url('https://fonts.gstatic.com/s/birthstone/v16/8AtsGs2xO4yLRhy87sv_LL7zjA.woff2') format('woff2');
}


/* =========================================================
   ROOT VARIABLES (Fonts + Colors)
   ========================================================= */

:root {
    --font-arabic: 'Tajawal', sans-serif;
    --font-english: 'Inter', sans-serif;
    --font-deco: 'Birthstone', cursive;

    /* Your colors stay the same */
    --color-primary: #1a2a4d;
    --color-primary-dark: #061838;
    --color-primary-medium: #2c3e70;
    --color-primary-light: #3e5392;
    --color-primary-lighter: #5067b5;
    --color-secondary: #eec540;
    --color-light: #eff0f2;
    --color-muted: #6b7280;
    --color-dark: #020617;
}


/* =========================================================
   BASE TYPOGRAPHY
   ========================================================= */

body {
    font-family: var(--font-english);
    color: var(--color-primary);
    background: #fff;
}

/* Arabic override */
html[lang="ar"] body {
    font-family: var(--font-arabic);
}

/* English headings */
html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] h4,
html[lang="en"] h5,
html[lang="en"] h6 {
    font-family: var(--font-english);
    font-weight: 700;
}

/* Arabic headings */
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6 {
    font-family: var(--font-arabic);
    font-weight: 700;
}


/* Paragraphs inherit automatically from body */


/* =========================================================
   DECORATIVE FONT CLASS
   ========================================================= */

.deco-text {
    font-family: var(--font-deco) !important;
}


/* =========================================================
   REMOVE ALL OLD FONT SYSTEM OVERRIDES
   (Alexandria, Armitage, NeueFrutigerWorld)
   ========================================================= */

[lang="ar"],
[lang="ar"] p,
[lang="ar"] span,
[lang="ar"] div,
[lang="ar"] li,
[lang="ar"] a,
[lang="ar"] label,
[lang="ar"] input,
[lang="ar"] textarea,
[lang="ar"] button {
    font-family: var(--font-arabic) !important;
}

[lang="en"],
[lang="en"] p,
[lang="en"] span,
[lang="en"] div,
[lang="en"] li,
[lang="en"] a,
[lang="en"] label,
[lang="en"] input,
[lang="en"] textarea,
[lang="en"] button {
    font-family: var(--font-english) !important;
}