/* =====================================================
   SAIRA FONT - FINAL OVERRIDE (MUST LOAD LAST!)
   ===================================================== */

@import url('https://fonts.googleapis.com/css2?family=Saira:wght@400;500;600;700;800&display=swap');

/* Override body and html - let text inherit naturally */
body,
html {
    font-family: 'Saira', sans-serif !important;
}

/* Headings - text only */
h1:not(.oi):not(.e-icons),
h2:not(.oi):not(.e-icons),
h3:not(.oi):not(.e-icons),
h4:not(.oi):not(.e-icons),
h5:not(.oi):not(.e-icons),
h6:not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Paragraphs and basic text - explicitly exclude icons */
p:not(.oi):not(.e-icons),
span:not(.oi):not(.e-icons):not(.e-btn-icon):not([class*="icon"]),
div:not(.oi):not(.e-icons):not(.e-btn-icon),
a:not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Labels - exclude toggle switches */
label:not(.toggle-switch):not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Lists - text only */
li:not(.oi):not(.e-icons),
ul:not(.oi):not(.e-icons),
ol:not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Table text */
td:not(.oi):not(.e-icons),
th:not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Form elements - exclude checkboxes and radios */
input:not([type="checkbox"]):not([type="radio"]):not(.oi):not(.e-icons),
textarea:not(.oi):not(.e-icons),
select:not(.oi):not(.e-icons),
option {
    font-family: 'Saira', sans-serif !important;
}

/* Buttons - only text, not icon buttons */
button:not(.oi):not(.e-icons):not(.e-btn-icon):not(.icon-btn),
.btn:not(.oi):not(.e-icons):not(.e-btn-icon):not(.icon-btn) {
    font-family: 'Saira', sans-serif !important;
}

/* Syncfusion text elements - carefully exclude icons */
.e-input:not(.e-icons),
.e-float-text:not(.e-icons),
.e-tab-text:not(.e-icons),
.e-tbar-btn-text:not(.e-icons),
.e-list-item:not(.e-icons),
.e-menu-item:not(.e-icons),
.e-dlg-content:not(.e-icons),
.e-card-content:not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* Grid cells - text only, not icons */
.e-grid td:not(.e-icons):not([class*="icon"]),
.e-grid th:not(.e-icons):not([class*="icon"]) {
    font-family: 'Saira', sans-serif !important;
}

/* Bootstrap text */
.form-control:not(.oi):not(.e-icons),
.form-label:not(.oi):not(.e-icons),
.card-text:not(.oi):not(.e-icons),
.modal-body:not(.oi):not(.e-icons),
.dropdown-item:not(.oi):not(.e-icons),
.nav-link:not(.oi):not(.e-icons) {
    font-family: 'Saira', sans-serif !important;
}

/* =====================================================
   EXPLICITLY PRESERVE ICONS - CRITICAL!
   ===================================================== */

/* Open Iconic - MUST use Icons font */
.oi,
.oi::before,
.oi::after,
span.oi,
i.oi,
.oi * {
    font-family: 'Icons' !important;
}

/* Syncfusion icons - MUST use e-icons font */
.e-icons,
.e-icons::before,
.e-icons::after,
span.e-icons,
i.e-icons,
.e-icons * {
    font-family: 'e-icons' !important;
}

/* Icon buttons - preserve icon fonts */
.e-btn-icon,
.e-btn-icon *,
.btn-icon,
.btn-icon *
.icon-btn,
.icon-btn *
button > .oi,
button > .e-icons,
button > i,
.e-tbar-btn-icon,
.e-tbar-btn-icon * {
    font-family: inherit !important;
}

/* Toolbar and button icons */
.e-toolbar .e-icons,
.e-btn .e-icons,
.e-dropdown-btn .e-icons {
    font-family: 'e-icons' !important;
}

/* Grid header icons (sort, filter, etc) */
.e-grid .e-icon-ascending,
.e-grid .e-icon-descending,
.e-grid .e-icon-filter,
.e-grid .e-filterbar .e-icons,
.e-grid .e-icon-grightarrow,
.e-grid .e-icon-gdownarrow {
    font-family: 'e-icons' !important;
}

/* Dialog icons */
.e-dlg-closeicon-btn,
.e-dlg-closeicon-btn *,
.e-dialog .e-icons {
    font-family: 'e-icons' !important;
}

/* Dropdown icons */
.e-ddl .e-icons,
.e-multiselect .e-icons,
.e-combobox .e-icons,
.e-input-group-icon,
.e-clear-icon {
    font-family: 'e-icons' !important;
}

/* Accordion expand/collapse icons */
.e-accordion .e-icons,
.e-acrdn-header .e-icons {
    font-family: 'e-icons' !important;
}

/* Other icon classes */
.bi, .bi *,
.iconify, .iconify *,
[class*="icon-"]:not([class*="btn-icon"]),
[class*="oi-"] {
    font-family: inherit !important;
}

/* SVG elements */
svg,
svg * {
    font-family: inherit !important;
}

/* Toggle switches and checkboxes */
.toggle-switch,
.toggle-switch *,
.slider,
.slider *,
.e-checkbox,
.e-checkbox *,
.e-radio,
.e-radio *,
.e-switch,
.e-switch * {
    font-family: inherit !important;
}

/* Remove Arial from anywhere it might appear */
*:not(.oi):not(.e-icons):not(.e-btn-icon):not(svg):not(i) {
    font-family: 'Saira', sans-serif !important;
}

/* But immediately restore icon fonts */
.oi, .oi *
.e-icons, .e-icons *
svg, svg *
i[class*="oi"], i[class*="e-icon"],
span[class*="oi"], span[class*="e-icon"] {
    font-family: inherit !important;
}