/* force-fonts.css */
/* IMPORTANT: Remove all previous font-face declarations */

/* Step 1: Clear any cached font declarations */
@font-face {
    font-family: 'Mulish';
    src: local('Arial');
    font-display: swap;
}

@font-face {
    font-family: 'mulish';
    src: local('Arial');
    font-display: swap;
}

/* Step 2: Define CSS variables */
:root {
    --bs-body-font-family: "Manrope", sans-serif;
    --title-font: "Encode Sans", sans-serif;
}

/* Step 3: Apply to ALL elements (brutal force method) */
*:not(i):not(.bi):not(.fi):not([class*="icon"]):not([class*="Icon"]) {
    font-family: var(--bs-body-font-family) !important;
}

/* Step 4: Apply Encode Sans to headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
[class*="title"], [class*="Title"],
.title-font,
.product__title,
.store-product h5,
.store-product h6,
.product-name,
.shop-name,
.brand-name,
.card-title,
.widget-title,
.section-title,
.main-title,
.primary-title,
.secondary-title {
    font-family: var(--title-font) !important;
    font-weight: 600 !important;
}

/* Step 5: Specific force for common classes */
h1, .h1 { font-weight: 700 !important; }
h2, .h2 { font-weight: 700 !important; }
h3, .h3 { font-weight: 600 !important; }
h4, .h4 { font-weight: 600 !important; }

/* Step 6: Body text explicitly */
body,
p,
span:not([class*="icon"]),
div:not([class*="icon"]),
a:not([class*="icon"]),
button:not([class*="icon"]),
input,
textarea,
select,
label,
.form-control,
.btn,
.breadcrumb,
.table,
.alert,
.footer *,
.header *,
.nav-link,
.dropdown-item {
    font-family: var(--bs-body-font-family) !important;
}

/* Step 7: Fix font weights for Manrope */
body,
p,
span,
div,
a {
    font-weight: 400 !important;
}

b,
strong,
.fw-bold,
.fw-semi-bold {
    font-weight: 600 !important;
}

.fw-bolder,
.fw-extra-bold {
    font-weight: 700 !important;
}

/* Step 8: Debug borders (temporary) */
.debug-font {
    border: 1px solid red !important;
}
