/**
 * Top Head Guess - Font Declarations
 * 
 * English: Poppins (headings), Inter (body), JetBrains Mono (timer)
 * Arabic: Tajawal (all text)
 */

/* ============================================
   ENGLISH FONTS
   ============================================ */

/* Poppins - Headings */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

/* Inter - Body Text */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* JetBrains Mono - Timer/Numbers */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');

/* ============================================
   ARABIC FONT
   ============================================ */

/* Tajawal - All Arabic Text */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800&display=swap');

/* ============================================
   FONT VARIABLES
   ============================================ */
:root {
    --font-heading-en: 'Poppins', sans-serif;
    --font-body-en: 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    --font-heading-ar: 'Tajawal', sans-serif;
    --font-body-ar: 'Tajawal', sans-serif;
}

/* Language-based font application */
html[lang="en"] {
    --font-heading: var(--font-heading-en);
    --font-body: var(--font-body-en);
}

html[lang="ar"] {
    --font-heading: var(--font-heading-ar);
    --font-body: var(--font-body-ar);
}

/* Apply fonts globally */
body {
    font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6,
.heading, .title, .team-name {
    font-family: var(--font-heading);
}

.timer, .score-number, .counter {
    font-family: var(--font-mono);
}