/* Unified Font System for Yemen Youth Union Website */

/* Import Google Fonts - Exact weights as requested */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@700&family=Tajawal:wght@600&family=IBM+Plex+Sans+Arabic:wght@400&family=Noto+Sans+Arabic:wght@400&display=swap');

/* Font Variables */
:root {
    --font-heading: 'Cairo', sans-serif; /* Main headings - Bold (700) */
    --font-subheading: 'Tajawal', sans-serif; /* Side headings/sections - SemiBold (600) */
    --font-body: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif; /* News/Article text - Regular (400) */
    --font-fallback: Arial, sans-serif;
}

/* Arabic Pages - Default body font */
[dir="rtl"] {
    font-family: var(--font-body) !important;
}

[dir="ltr"] {
    font-family: 'Inter', Arial, sans-serif;
}

/* ============================================
   MAIN HEADINGS (h1, h2) - Cairo Bold
   ============================================ */
h1, h2,
.heading-main,
.text-heading-main,
.card-title,
.section-heading,
.hero-title {
    font-family: 'Cairo', sans-serif !important;
    font-weight: 700 !important; /* Cairo Bold */
}

/* ============================================
   SUBHEADINGS (h3, h4, h5, h6) - Tajawal SemiBold
   ============================================ */
h3, h4, h5, h6,
.heading-sub,
.text-heading-sub,
.section-title,
.card-subtitle,
.section-subheading,
.event-title,
.news-title {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important; /* Tajawal SemiBold */
}

/* ============================================
   BODY TEXT - News/Articles - IBM Plex Arabic / Noto Sans Arabic Regular
   ============================================ */
p, span, div, li, td, th,
.text-body,
.article-content,
.news-content,
.event-description,
.news-description,
article p,
article div,
.article-body,
.news-body,
.event-body {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important; /* Regular */
}

/* Navigation Menu - Cairo */
nav, .navbar, .menu,
.nav-link, .nav-item,
.navbar a,
.navbar span,
.navbar .nav-link {
    font-family: 'Cairo', sans-serif !important;
    font-weight: 500 !important;
}

/* Buttons - Cairo */
button, .btn, a.button,
button[type="submit"],
a.btn {
    font-family: 'Cairo', sans-serif !important;
    font-weight: 600 !important;
}

/* Form Labels - Tajawal */
label, .form-label {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 500 !important;
}

/* Form Inputs - IBM Plex / Noto Sans */
input, textarea, select {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}

/* Card Bodies - IBM Plex / Noto Sans */
.card-body, .section-content,
.card p, .card div {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}

/* Event Cards - Specific targeting */
.event-card h3,
.event-card .event-title {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
}

.event-card p,
.event-card .event-description {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}

/* News Cards - Specific targeting */
.news-card h3,
.news-card .news-title {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
}

.news-card p,
.news-card .news-description,
.news-card article {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}

/* Footer - Specific targeting */
footer h3,
footer h4 {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
}

footer p,
footer li,
footer span,
footer a,
footer ul {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}

footer .heading-main {
    font-family: 'Cairo', sans-serif !important;
    font-weight: 700 !important;
}

footer .heading-sub {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
}

footer .text-body {
    font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', sans-serif !important;
    font-weight: 400 !important;
}