/**
 * local-fonts.css — FONT LOKAL (tanpa CDN / Google Fonts).
 *
 * ⚠️ Kenapa ada?
 *   `app.min.css` (Velzon) memuat font dari `fonts.googleapis.com`
 *   (Poppins / Public Sans / Nunito / IBM Plex / Inter / Montserrat) lewat @import.
 *   Pada jaringan yang memblokir CDN (kasus di server ini), font itu gagal dimuat.
 *   Lebih parah: `bootstrap.min.css` memakai `font-family: var(--vz-font-sans-serif)`
 *   yang menunjuk `--vz-font-family-secondary` — variabel itu hanya didefinisikan di
 *   `app.min.css`. Halaman yang memuat bootstrap TANPA app.min.css (mis. dokumentasi
 *   publik /api/docs) jadi punya `font-family` TIDAK VALID → browser jatuh ke
 *   font default (Times/serif).
 *
 * Solusi: definisikan variabel font + @font-face dari FILE LOKAL
 *   (`../fonts/hkgrotesk-*.woff2`, sudah ada di repo, same-origin → tidak kena CSP
 *   dan tidak butuh internet). Dimuat SETELAH bootstrap/app.min.css supaya menimpa.
 *
 * Pakai:
 *   <link href="/backend/assets/velzon/css/local-fonts.css?v=<%= appVersion %>" rel="stylesheet">
 *
 * Diperbarui (last update): 2026-09-17 18:35 WIT
 */

@font-face {
  font-family: "HK Grotesk";
  src: url(../fonts/hkgrotesk-light.woff2) format("woff2"),
       url(../fonts/hkgrotesk-light.woff) format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "HK Grotesk";
  src: url(../fonts/hkgrotesk-regular.woff2) format("woff2"),
       url(../fonts/hkgrotesk-regular.woff) format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "HK Grotesk";
  src: url(../fonts/hkgrotesk-medium.woff2) format("woff2"),
       url(../fonts/hkgrotesk-medium.woff) format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "HK Grotesk";
  src: url(../fonts/hkgrotesk-semibold.woff2) format("woff2"),
       url(../fonts/hkgrotesk-semibold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "HK Grotesk";
  src: url(../fonts/hkgrotesk-bold.woff2) format("woff2"),
       url(../fonts/hkgrotesk-bold.woff) format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Tumpukan font LOKAL (aman offline) — dipakai seluruh UI backend. */
  --vz-font-family-primary: "HK Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --vz-font-family-secondary: var(--vz-font-family-primary);
  --vz-font-sans-serif: var(--vz-font-family-primary);
  --vz-headings-font-family: var(--vz-font-family-primary);
  --vz-body-font-family: var(--vz-font-family-primary);
  --vz-font-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* Bootstrap 5.3 — dipakai bootstrap.min.css versi Velzon. */
  --bs-body-font-family: var(--vz-font-sans-serif);
  --bs-font-monospace: var(--vz-font-monospace);
  --bs-body-font-size: 0.875rem;
  --bs-body-line-height: 1.5;
}

/* Eksplisit: jalan juga bila variabel di atas tidak ikut terbaca. */
body,
h1, h2, h3, h4, h5, h6,
.table, .btn, .card, .badge, .alert, .form-control, .form-select, .nav-link,
.dropdown-menu, .modal-content, .toast, .swal2-popup {
  font-family: var(--vz-font-sans-serif);
}

/* Monospace: kode/config harus tetap monospace (bukan font UI). */
code, kbd, pre, samp, .font-monospace, .endpoint-code, .code-badge {
  font-family: var(--vz-font-monospace);
}
