@font-face {
    font-family: "Mehr";
    src: url("/static/fonts/mehr.woff2") format("woff2");
    font-display: swap;
    font-weight: normal;
    font-style: normal;
}

/* --- Global Application --- */
body,
.font-smart {
    font-family: 'Mehr', serif;
}

/* --- Helper Classes --- */
.font-mehr,
.font-urdu {
    font-family: 'Mehr', serif;
}

.font-arabic {
    font-family: 'Amiri', serif;
    font-size: 1.1em;
}

.font-ruqaa {
    font-family: 'Aref Ruqaa Ink', serif;
}

.font-kufi {
    font-family: 'Reem Kufi Ink', sans-serif;
}

/* Force 'Mehr' font on all inputs globally or specifically for form containers */
input,
select,
textarea {
    font-family: 'Mehr', serif !important;
    background-color: transparent !important;
    /* Force transparent background */
    color: inherit !important;
    /* Inherit text color from parent (usually white in dark mode) */
}

/* Fix for Select Dropdown Options (The list itself) */
select option {
    background-color: #0f172a !important;
    /* Dark Slate 900 */
    color: white !important;
}

.mehr {
    font-family: 'Mehr', serif !important;
    line-height: 1.6;
}

/* --- English mode (html[lang="en"] is set by the language middleware) --- */
/* Mehr is an Urdu calligraphic face — switch UI text to a clean Latin font. */
html[lang="en"] body,
html[lang="en"] .font-smart,
html[lang="en"] .font-mehr,
html[lang="en"] .font-urdu,
html[lang="en"] .mehr,
html[lang="en"] input,
html[lang="en"] select,
html[lang="en"] textarea {
    font-family: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif !important;
    line-height: 1.45;
}
/* Arabic quote fonts (Amiri etc.) intentionally keep their face in EN mode. */