/* ==============================================
   WAI ADMIN - Global Styles
   ============================================== */

/* Apply Cairo font globally */
* {
    font-family: var(--font-family-base) !important;
}

body {
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
    color: var(--gray-800);
    background-color: var(--gray-50);
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-family-heading);
    font-weight: var(--font-weight-semibold);
    color: var(--gray-900);
}

/* Navigation and UI elements */
.navbar,
.sidebar,
.nav,
.btn,
.form-control,
.form-select,
.form-label,
.badge,
.alert,
.card,
.table,
.dropdown-menu {
    font-family: var(--font-family-base) !important;
}

/* Ensure font loads properly */
@supports (font-variation-settings: normal) {
    * {
        font-feature-settings: "kern" 1;
        font-kerning: auto;
    }
}

/* Arabic text support (if needed) */
[lang="ar"] {
    direction: rtl;
    text-align: right;
}

[lang="ar"] .sidebar {
    right: 0;
    left: auto;
}

[lang="ar"] .main-content {
    margin-right: var(--sidebar-width);
    margin-left: 0;
}

/* Remove autofill blue background globally */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px var(--white) inset !important;
    -webkit-text-fill-color: var(--gray-800) !important;
    background-color: var(--white) !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* For Firefox */
input:-moz-autofill {
    background-color: var(--white) !important;
    color: var(--gray-800) !important;
}