/* ================================
   UNIFIED FONTS SYSTEM
   Poppins for English
   STC Forward for Arabic
   ================================ */

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

/* Root Variables */
:root {
    --font-english: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-arabic: 'STC Forward', 'STC Shared', 'Almarai', 'Cairo', 'Tahoma', sans-serif;
    --font-primary: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    
    /* Colors */
    --color-primary-dark: #1f2937;
    --color-secondary-dark: #374151;
    --color-text-light: #6b7280;
    --color-primary-light: #ffffff;
    --color-secondary-light: #f9fafb;
}

/* Default Font - English */
* {
    font-family: var(--font-english);
}

body {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
}

/* English Specific */
html[lang="en"] * {
    font-family: var(--font-english);
}

html[lang="en"] body {
    font-family: var(--font-english);
}

/* Arabic Specific */
html[lang="ar"] * {
    font-family: var(--font-arabic);
    letter-spacing: 0.3px;
}

html[lang="ar"] body {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
    font-weight: 700;
}

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);
    color: var(--color-primary-dark);
    font-weight: 800;
}

/* Section Titles */
.section-title,
.main-heading,
.page-title {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
    font-weight: 700;
}

html[lang="ar"] .section-title,
html[lang="ar"] .main-heading,
html[lang="ar"] .page-title {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
    font-weight: 800;
}

/* Sub Headings */
.subtitle,
.sub-heading {
    font-family: var(--font-english);
    color: var(--color-secondary-dark);
    font-weight: 600;
}

html[lang="ar"] .subtitle,
html[lang="ar"] .sub-heading {
    font-family: var(--font-arabic);
    color: var(--color-secondary-dark);
    font-weight: 700;
}

/* Description Text */
.description,
.desc-text,
p {
    font-family: var(--font-english);
    color: var(--color-secondary-dark);
    font-weight: 400;
}

html[lang="ar"] .description,
html[lang="ar"] .desc-text,
html[lang="ar"] p {
    font-family: var(--font-arabic);
    color: var(--color-secondary-dark);
    font-weight: 400;
}

/* Forms */
input, textarea, select, button, label {
    font-family: var(--font-english);
}

html[lang="ar"] input,
html[lang="ar"] textarea,
html[lang="ar"] select,
html[lang="ar"] button,
html[lang="ar"] label {
    font-family: var(--font-arabic);
}

/* Tables */
table, thead, tbody, tr, td, th {
    font-family: var(--font-english);
}

html[lang="ar"] table,
html[lang="ar"] thead,
html[lang="ar"] tbody,
html[lang="ar"] tr,
html[lang="ar"] td,
html[lang="ar"] th {
    font-family: var(--font-arabic);
}

/* Icon Fonts - prevent overriding Font Awesome */
.fa, .fas, .far, .fal, .fad, .fa-solid, .fa-regular, .fa-light, .fa-thin {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome", sans-serif !important;
    font-weight: 900;
}

.fab, .fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands", "Font Awesome", sans-serif !important;
    font-weight: 400;
}

/* Labels */
label {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
}

html[lang="ar"] label {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
}

/* Badges & Tags */
.badge, .tag {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
}

html[lang="ar"] .badge,
html[lang="ar"] .tag {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
}

/* Modals */
.modal-content, .modal-header, .modal-body, .modal-footer {
    font-family: var(--font-english);
}

html[lang="ar"] .modal-content,
html[lang="ar"] .modal-header,
html[lang="ar"] .modal-body,
html[lang="ar"] .modal-footer {
    font-family: var(--font-arabic);
}

/* Navigation */
.nav-link, .navbar {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
}

html[lang="ar"] .nav-link,
html[lang="ar"] .navbar {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
}

/* Admin Elements */
.admin-title,
.admin-heading,
.admin-subtitle {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
    font-weight: 700;
}

html[lang="ar"] .admin-title,
html[lang="ar"] .admin-heading,
html[lang="ar"] .admin-subtitle {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
    font-weight: 800;
}

/* Card Headers */
.card-header {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
    font-weight: 700;
}

html[lang="ar"] .card-header {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
    font-weight: 800;
}

/* Sidebar Elements */
.sidebar-link, .sidebar-title {
    font-family: var(--font-english);
    color: var(--color-primary-dark);
}

html[lang="ar"] .sidebar-link,
html[lang="ar"] .sidebar-title {
    font-family: var(--font-arabic);
    color: var(--color-primary-dark);
}

/* Button Text */
.btn, button {
    font-family: var(--font-english);
}

html[lang="ar"] .btn,
html[lang="ar"] button {
    font-family: var(--font-arabic);
}