/*
 * De typografie van de schil.
 *
 * Drie letters, elk met een eigen taak:
 *   - Plus Jakarta Sans, licht (300): de gewone tekst in tabellen, knoppen en
 *     formulieren, op 13px met regelafstand 1,55. Kleine tekst (filters,
 *     veldnamen, kolomkoppen, hints, badges) op 12,5px.
 *   - Outfit: titels en grote cijfers.
 *   - JetBrains Mono: tijden, codes en e-mailadressen. Wélke kolommen dat zijn,
 *     beslist `Panel\Typography::monoFontFor()`; hier staat alleen de maat.
 *
 * Alle drie zelf gehost (resources/fonts, OFL). Bewust niet via een CDN: dan gaat
 * het IP-adres van elke gebruiker naar een derde, en dat is een GDPR-vraag die
 * niemand wil beantwoorden voor een lettertype.
 *
 * Dit bestand zit níét in panel.css. Het wordt als losse link in de <head>
 * gezet (`PanelsRenderHook::HEAD_END`), ná het thema van de applicatie en ná
 * Filaments eigen `:root`-regel. Daardoor wint het op volgorde, zonder
 * `!important` of opgeklopte selectors, en gaat het helemaal uit met
 * `admin.typography.enabled = false` — iets wat een @import in het thema niet
 * kan. Een applicatie die er iets aan wil veranderen, doet dat met een selector
 * die zwaarder weegt (bv. `:root:root` of `html body.fi-body`).
 *
 * De maten staan in px en niet in rem: de typografie noemt pixels, en in rem
 * hangen ze aan de wortelmaat (15px, of 16px met "Iets groter" uit het profiel),
 * zodat dezelfde tabel bij de ene gebruiker 13px en bij de andere 13,9px is.
 * De grotere tekstmaat rekt dus het raster mee (hoogtes, marges, het zijmenu),
 * maar niet deze letters.
 */

:root {
    /* Filament bouwt --font-sans en --font-mono uit --font-family en
       --mono-font-family; die zet `Preset` via ->font() en ->monoFont(). Een
       applicatie die een andere letter wil, zet ze daar — en dit bestand volgt. */
    --heading-font-family: "Outfit", var(--font-family), ui-sans-serif, system-ui, sans-serif;

    /* Filament zet bijna alle gewone tekst (tabelcellen, knoppen, invoervelden,
       menu) op text-sm en de kleine op text-xs. Die twee bijstellen raakt dus
       alles in één keer, ook in de pakketten. */
    --text-sm: 13px;
    --text-sm--line-height: 1.55;
    --text-xs: 12.5px;
    --text-xs--line-height: 1.5;
}

body.fi-body {
    font-size: 13px;
    font-weight: 300;
    line-height: 1.55;
}

/* panel.css zet tabeltekst en kolomkoppen op een eigen maat (`.fi-ta-text`
   0,875rem, `.fi-ta-header-cell` 0,8125rem), en de tabellen van de eigen
   schermen (systeem, back-ups) ook. Terug naar de gewone maat. */
.fi-ta-text,
.fi-admin-table table {
    font-size: 13px;
    line-height: 1.55;
    /* Medium, net als de labels in het zijmenu: de gewone tekst staat op 300
       (licht), maar in een tabel las dat dunner dan het menu ernaast. */
    font-weight: 500;
}

/* Kleine tekst: veldnamen, kolomkoppen, filters, hints, paginering, badges. */
.fi-fo-field .fi-fo-field-label-content,
.fi-ta-header-cell,
.fi-ta-filters,
.fi-ta-filters .fi-fo-field-label-content,
.fi-ta-filter-indicators,
.fi-fo-field .fi-sc-text,
.fi-pagination-overview,
.fi-ta-text-description,
.fi-admin-table th,
.fi-section-header-description,
.fi-badge {
    font-size: 12.5px;
}

/* Titels en grote cijfers in Outfit. Het gewicht van Filament blijft: dat
   draagt de hiërarchie. */
.fi-header-heading,
.fi-simple-header-heading,
.fi-section-header-heading,
.fi-modal-heading,
.fi-ta-header-heading,
.fi-ta-filters-heading,
.fi-wi-stats-overview-stat-value,
:is(.fi-wi, .fi-wi-widget) :is(.text-xl, .text-2xl, .text-3xl, .text-4xl),
.fi-wiki-body :is(h1, h2, h3),
.fi-dashboard-empty h2,
.fi-trash-bin-count {
    font-family: var(--heading-font-family);
}

/* Monoletter. JetBrains Mono oogt groter dan Jakarta op dezelfde px, dus een
   halve pixel kleiner in tabellen. Op één regel: een tekstkolom met `->wrap()`
   breekt een factuurnummer anders op elk streepje ("TEST-/261002-/1718") en een
   tijd onder zijn datum. Een code lees je als één geheel. */
.fi-ta-text-item.fi-font-mono {
    font-size: 12.5px;
    white-space: nowrap;
}

.fi-font-mono {
    font-variant-ligatures: none;
}

/* Waar de schil zelf een systeem-mono hardcodeert (kopieerbare velden, de
   stacktrace bij fouten, code in de wiki): dezelfde JetBrains Mono. */
.fi-input-copyable,
.fi-trace,
.fi-body :is(code, kbd, samp, pre) {
    font-family: var(--font-mono);
}