/**
 * Shared font overrides — applies in BOTH admin and auth layouts.
 *
 * Replaces three previously-duplicated blocks:
 *  - resources/views/layouts/admin.blade.php (ar-only block ~1730-1798)
 *  - resources/views/layouts/auth.blade.php (ar-only block ~351-463)
 *  - resources/views/layouts/invoice-standalone.blade.php inline <style>
 *
 * Rules:
 *  1. In Arabic (html[lang="ar"]) the page body is Cairo.
 *  2. Font Awesome icons NEVER inherit Cairo — that would render the glyphs
 *     in the wrong font.
 *  3. Font Awesome selectors deliberately list each named class instead of
 *     `[class^="fa-"]` because the football-academy dashboard ships titles
 *     prefixed with `fa-dash-*` that would otherwise be hit.
 */

html[lang="ar"] body,
html[lang="ar"] body * {
    font-family: var(--font-sans, 'Cairo', 'Segoe UI Arabic', 'Tahoma', sans-serif) !important;
}

html[lang="ar"] body .fa,
html[lang="ar"] body .fas,
html[lang="ar"] body .far,
html[lang="ar"] body .fal,
html[lang="ar"] body .fab,
html[lang="ar"] body .fa-solid,
html[lang="ar"] body .fa-regular,
html[lang="ar"] body .fa-brands,
html[lang="ar"] body .svg-inline--fa {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
}

html[lang="ar"] body .fa,
html[lang="ar"] body .fas,
html[lang="ar"] body .fa-solid {
    font-weight: 900 !important;
}

html[lang="ar"] body .far,
html[lang="ar"] body .fal,
html[lang="ar"] body .fa-regular {
    font-weight: 400 !important;
}

html[lang="ar"] body .fab,
html[lang="ar"] body .fa-brands {
    font-weight: 400 !important;
}

/* Legacy DexTheme rule (public/theme-related/css/style.css ~14448) forces
 * every <i> inside the sidebar metismenu to use the Material Icons webfont:
 *
 *     .dlabnav .metismenu > li > a i { font-family: "Material Icons"; ... }
 *
 * Since Phase 4.4 of the design-system migration removed the Material Icons
 * <link> (we now map DB icon names to Font Awesome via the @icon directive),
 * Font Awesome glyphs were being drawn with a font that doesn't contain them
 * — producing empty "tofu" squares in the sidebar.
 *
 * Restore the Font Awesome font stack for FA classes anywhere inside the
 * sidebar so the @icon-generated <i class="fas fa-..."></i> tags render the
 * intended glyphs. */
.dlabnav .fa,
.dlabnav .fas,
.dlabnav .far,
.dlabnav .fal,
.dlabnav .fab,
.dlabnav .fa-solid,
.dlabnav .fa-regular,
.dlabnav .fa-brands,
.dlabnav .metismenu > li > a i.fa,
.dlabnav .metismenu > li > a i.fas,
.dlabnav .metismenu > li > a i.far,
.dlabnav .metismenu > li > a i.fal,
.dlabnav .metismenu > li > a i.fab,
.dlabnav .metismenu > li > a i.fa-solid,
.dlabnav .metismenu > li > a i.fa-regular,
.dlabnav .metismenu > li > a i.fa-brands {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
}

.dlabnav .fa,
.dlabnav .fas,
.dlabnav .fa-solid,
.dlabnav .metismenu > li > a i.fa,
.dlabnav .metismenu > li > a i.fas,
.dlabnav .metismenu > li > a i.fa-solid {
    font-weight: 900 !important;
}

.dlabnav .far,
.dlabnav .fal,
.dlabnav .fa-regular,
.dlabnav .fab,
.dlabnav .fa-brands,
.dlabnav .metismenu > li > a i.far,
.dlabnav .metismenu > li > a i.fal,
.dlabnav .metismenu > li > a i.fa-regular,
.dlabnav .metismenu > li > a i.fab,
.dlabnav .metismenu > li > a i.fa-brands {
    font-weight: 400 !important;
}

html[lang="ar"] body .fa::before,
html[lang="ar"] body .fas::before,
html[lang="ar"] body .far::before,
html[lang="ar"] body .fal::before,
html[lang="ar"] body .fab::before,
html[lang="ar"] body .fa-solid::before,
html[lang="ar"] body .fa-regular::before,
html[lang="ar"] body .fa-brands::before {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
}

html[lang="ar"] body .fa::before,
html[lang="ar"] body .fas::before,
html[lang="ar"] body .fa-solid::before {
    font-weight: 900 !important;
}

html[lang="ar"] body .far::before,
html[lang="ar"] body .fal::before,
html[lang="ar"] body .fa-regular::before {
    font-weight: 400 !important;
}

html[lang="ar"] body .fab::before,
html[lang="ar"] body .fa-brands::before {
    font-weight: 400 !important;
}