/* ══════════════════════════════════════════════════════════════════════════
   PrepsNext — Global Font System
   A unified, premium typographic identity across all pages and components.

   DISPLAY / HEADINGS: Oswald
   ├── Sporty, editorial, powerful — ideal for headlines, rankings, tags
   ├── Weights: 300 (light accent), 400 (mid), 600 (bold), 700 (ultra)
   └── Use for: hero titles, section headers, sport tags, numbered ranks

   BODY / UI TEXT: DM Sans
   ├── Geometric yet warm — clean, highly legible at any size
   ├── Weights: 300 (light), 400 (regular), 500 (medium), 600 (semibold), 700 (bold)
   └── Use for: body copy, nav, labels, captions, forms, buttons

   MONO / DATA: DM Mono
   └── Use for: stats, numbers, jersey numbers, scores
   ══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;600;700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=DM+Mono:wght@400;500&display=swap');

/* ── CSS Custom Properties — Single source of truth ─────────────────── */
:root {
  /* FONT FAMILIES */
  --pn-font-display:   'Oswald', sans-serif;
  --pn-font-body:      'DM Sans', sans-serif;
  --pn-font-mono:      'DM Mono', monospace;

  /* Aliases used across all CSS files — centralised here */
  --pn-font-heading:   var(--pn-font-display);
  --pn-font-ui:        var(--pn-font-body);
  --pn-font-label:     var(--pn-font-display);
  --pn-font-caption:   var(--pn-font-body);
  --pn-font-stat:      var(--pn-font-mono);

  /* FONT WEIGHTS */
  --pn-fw-light:       300;
  --pn-fw-regular:     400;
  --pn-fw-medium:      500;
  --pn-fw-semibold:    600;
  --pn-fw-bold:        700;

  /* LETTER SPACING — Oswald display use */
  --pn-ls-tight:       -0.01em;
  --pn-ls-normal:       0em;
  --pn-ls-wide:         0.06em;
  --pn-ls-xwide:        0.12em;
  --pn-ls-label:        0.08em;   /* uppercase sport tags, eyebrows */

  /* LINE HEIGHTS */
  --pn-lh-display:     1.05;      /* tight for big headlines */
  --pn-lh-heading:     1.15;
  --pn-lh-body:        1.60;      /* comfortable reading */
  --pn-lh-ui:          1.40;      /* compact UI elements */

  /* SCALE — fluid type sizes */
  --pn-text-xs:        10px;
  --pn-text-sm:        12px;
  --pn-text-base:      14px;
  --pn-text-md:        16px;
  --pn-text-lg:        18px;
  --pn-text-xl:        22px;
  --pn-text-2xl:       28px;
  --pn-text-3xl:       36px;
  --pn-text-4xl:       48px;
  --pn-text-5xl:       64px;

  /* Widget / profile / threads aliases — these map to the above */
  --pnx-font-display:  var(--pn-font-display);
  --pnx-font-body:     var(--pn-font-body);
  --pnx-font:          var(--pn-font-body);
  --pnt-font-display:  var(--pn-font-display);
  --pnt-font-body:     var(--pn-font-body);
  --pnw-font:          var(--pn-font-body);
  --pnf-font:          var(--pn-font-body);
}

/* ── Global Base Reset ───────────────────────────────────────────────── */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
body *,
input, textarea, select, button {
  font-family: var(--pn-font-body) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ── Display / Heading overrides ─────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.pn-lead-hero__title,
.pn-card__title,
.pn-section-title,
.pn-rank-name,
.pn-eyebrow,
.pn-tag,
.pn-sport-tag,
.pn-lead-hero__sport-tag,
.pn-lead-hero__eyebrow,
.pnx-name,
.pnx-sport,
.pnx-position,
.pnt-username,
.pn-prospect-rank,
.pn-trending-title,
[class*="__title"],
[class*="__heading"],
[class*="-title"],
[class*="-heading"],
[class*="-label"],
[class*="-tag"],
[class*="-eyebrow"],
[class*="rank"],
[class*="badge"] {
  font-family: var(--pn-font-display) !important;
}

/* ── Mono — stats, scores, numbers ──────────────────────────────────── */
.pnx-stat-val,
.pnx-gpa,
[class*="-stat"],
[class*="-score"],
[class*="-number"],
[class*="jersey"],
[class*="rank-num"] {
  font-family: var(--pn-font-mono) !important;
}
