/* PayProTec Design System — global typography pass (docs/PayProTec-Design-System.md)
 * Loaded on every page in the portal (staff + partner + lead + public) via a
 * single <link> so brand type is uniform everywhere without editing each
 * page's own stylesheet. !important is deliberate: every page already has
 * its own conflicting font-family declarations (often directly on body or
 * via a reset), and this stylesheet is meant to win over all of them.
 *
 * Plus Jakarta Sans = reading (headings/body/buttons/nav/tables), per the
 * brand doc. Barlow Condensed is NOT applied here — it's a labels-only face
 * (eyebrows/section labels/table headers) that needs deliberate per-element
 * opt-in via .brand-label, not a blanket swap, since forcing it onto body
 * text or buttons would violate the brand system it's meant to express.
 * Monospace usage (serials, tracking numbers, codes) is explicitly
 * preserved below — that's a legibility/scanability choice, not styling.
 */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=Barlow+Condensed:wght@600;700&display=swap');

html, body, button, input, select, textarea, table, th, td,
div, span, p, h1, h2, h3, h4, h5, h6, a, li, label {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}

/* Opt-in label/eyebrow face — Barlow Condensed, uppercase only per the brand
 * doc ("never a headline, a button, a chip, body copy, or anything
 * lowercase"). Not applied automatically anywhere; pages adopt it deliberately. */
.brand-label {
    font-family: 'Barlow Condensed', 'Plus Jakarta Sans', sans-serif !important;
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: 700;
}

/* Preserve intentional monospace usage (serials, tracking/order numbers,
 * JSON/code displays) — legibility of exact codes matters more than brand
 * type consistency there, and this was already a deliberate choice on
 * every page that uses it. */
code, pre, kbd, samp, .font-mono,
[class*="mono"], [style*="monospace"], [style*="DM Mono"] {
    font-family: 'DM Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace !important;
}

/* Material Icons ligature font must never be overridden by the rule above —
 * doing so would turn every icon into literal text like "search" or "close". */
.material-icons, .material-icons-outlined, .material-icons-round,
.material-symbols-outlined, [class*="material-icon"] {
    font-family: 'Material Icons' !important;
}