/* ==========================================================================
   Global typeface: Calibri
   --------------------------------------------------------------------------
   Loaded last, after every other stylesheet, so it wins over the per-file
   families ('Playfair Display', 'Manrope', 'Plus Jakarta Sans') and over the
   Tailwind font utilities used inline in the templates.

   Two things must survive the override:
     1. Icon fonts (Font Awesome, Bootstrap Icons) resolve glyphs by family, so
        they are restored explicitly at the bottom of this file.
     2. Calibri carries no Malayalam glyphs. Noto Sans Malayalam sits in the
        stack behind it, so Latin renders as Calibri while the ml-only spans
        fall through to a font that can actually draw them.
   ========================================================================== */

:root {
  --app-font: Calibri, Carlito, "Segoe UI", system-ui, -apple-system,
              "Noto Sans Malayalam", "Helvetica Neue", Arial, sans-serif;

  /* Re-point the existing custom properties so anything reading them agrees. */
  --font: var(--app-font);
  --font-body: var(--app-font);
  --font-display: var(--app-font);
}

html,
body,
h1, h2, h3, h4, h5, h6,
p, a, span, div, li, ul, ol, dl, dt, dd,
table, thead, tbody, tr, th, td, caption,
label, legend, fieldset, form,
input, select, textarea, button, optgroup, option,
blockquote, figcaption, figure, small, strong, b, em, i, u,
pre, code, kbd, samp,
header, footer, nav, main, section, article, aside, details, summary {
  font-family: var(--app-font) !important;
}

/* Tailwind utilities and the project's own display classes. */
.font-sans,
.font-serif,
.font-mono,
.hero-title,
.section-title,
.logo-name,
.logo-sub {
  font-family: var(--app-font) !important;
}

/* --------------------------------------------------------------------------
   Icon fonts — restored after the sweep above, otherwise every glyph renders
   as a fallback box.
   -------------------------------------------------------------------------- */
.fa, .fas, .fa-solid,
.fa-solid::before, .fas::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
}

.far, .fa-regular,
.far::before, .fa-regular::before {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 400 !important;
}

.fab, .fa-brands,
.fab::before, .fa-brands::before {
  font-family: "Font Awesome 6 Brands" !important;
  font-weight: 400 !important;
}

[class^="bi-"], [class*=" bi-"],
[class^="bi-"]::before, [class*=" bi-"]::before {
  font-family: "bootstrap-icons" !important;
}

/* The select caret in explore_css.css is drawn with a Font Awesome glyph. */
.select-wrap::after {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
}
