/* ============================================================
   ARMS — application typeface
   Manrope, self-hosted. Loaded before every other stylesheet.

   These are variable fonts: one file per subset covers the whole
   200–800 weight range, so the entire family costs ~40 KB rather
   than one request per weight.
   ============================================================ */

/* latin — covers English and most Western European text */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../vendor/fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                 U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
                 U+FFFD;
}

/* latin-ext — accented characters in European names */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../vendor/fonts/manrope-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
                 U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF,
                 U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ------------------------------------------------------------
   Apply application-wide.

   Bootstrap sets its own stack via --bs-body-font-family, so
   overriding that variable is what actually changes most of the UI —
   setting `body { font-family }` alone leaves buttons, form controls,
   tables and modals on the Bootstrap default.
   ------------------------------------------------------------ */

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
  --bs-body-font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI',
                         Roboto, 'Helvetica Neue', Arial, sans-serif;
  --arms-font: var(--bs-body-font-family);

  /* Global type scale.
     Almost every size in app.css and login.css is expressed in rem, so
     the root is the single lever for the whole interface — one number to
     tune instead of ~50 individual declarations.

     The SPA previously pinned body text to 14px while its surroundings
     resolved against the 16px browser default. 13px takes that effective
     baseline down one notch and pulls everything else with it. */
  --arms-root-size: 13px;
}

html {
  font-size: var(--arms-root-size);
}

html,
body {
  font-family: var(--arms-font);
}

/* Bootstrap's own base is 1rem, so it follows the root automatically.
   Stated explicitly so the intent survives a Bootstrap upgrade. */
body {
  font-size: 1rem;
}

/* Elements the browser renders with its own font unless told otherwise. */
button,
input,
optgroup,
select,
textarea,
.btn,
.form-control,
.form-select,
.input-group-text,
.dropdown-menu,
.modal,
.tooltip,
.popover,
.toast,
.table,
.nav,
.pagination,
.alert,
.card,
.badge {
  font-family: var(--arms-font);
}

/* Headings use the heavier end of the variable range. */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--arms-font);
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Manrope's digits are proportional by default; tabular alignment keeps
   currency columns and countdown timers from shifting as values change. */
.table td,
.table th,
.stat-value,
.otp-box,
#otp-countdown,
.text-end {
  font-variant-numeric: tabular-nums;
}

/* Bootstrap Icons and code samples keep their own faces. */
.bi,
[class^="bi-"],
[class*=" bi-"] {
  font-family: 'bootstrap-icons' !important;
}

code, kbd, pre, samp, .font-monospace {
  font-family: var(--bs-font-monospace,
                SFMono-Regular, Menlo, Monaco, Consolas, monospace);
}