/**
 * FSH public typography mappings.
 *
 * Token values come from config/fsh_typography.php (injected as :root vars
 * by the public layout). Edit THAT file to change fonts/sizes globally.
 * This stylesheet only wires Tailwind utilities + semantic helpers to those tokens.
 */

/* ---------- Font families ---------- */
body,
.font-sans,
.font-body {
  font-family: var(--font-body, var(--fsh-font-body)) !important;
}

h1, h2, h3, h4, h5, h6,
.font-heading {
  font-family: var(--font-heading, var(--fsh-font-heading)) !important;
}

body {
  font-size: var(--fsh-body-size);
  font-weight: var(--fsh-body-weight);
  line-height: var(--fsh-body-leading);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ---------- Weights ---------- */
.font-light { font-weight: var(--fsh-weight-light) !important; }
.font-normal { font-weight: var(--fsh-weight-normal) !important; }
.font-medium { font-weight: var(--fsh-weight-medium) !important; }
.font-semibold { font-weight: var(--fsh-weight-semibold) !important; }
.font-bold { font-weight: var(--fsh-weight-bold) !important; }
.font-extrabold { font-weight: var(--fsh-weight-extrabold) !important; }

/* ---------- Tracking ---------- */
.tracking-tight { letter-spacing: var(--fsh-tracking-tight) !important; }
.tracking-normal { letter-spacing: var(--fsh-tracking-normal) !important; }
.tracking-wide { letter-spacing: var(--fsh-tracking-wide) !important; }
.tracking-wider { letter-spacing: var(--fsh-tracking-wide) !important; }
.tracking-widest { letter-spacing: var(--fsh-tracking-widest) !important; }

/* ---------- Leading ---------- */
.leading-tight { line-height: var(--fsh-leading-tight) !important; }
.leading-snug { line-height: var(--fsh-leading-snug) !important; }
.leading-normal { line-height: var(--fsh-leading-normal) !important; }
.leading-relaxed { line-height: var(--fsh-leading-relaxed) !important; }

/* ---------- Size scale (base + common responsive prefixes) ---------- */
.text-xs { font-size: var(--fsh-text-xs) !important; line-height: var(--fsh-leading-normal) !important; }
.text-sm { font-size: var(--fsh-text-sm) !important; line-height: var(--fsh-leading-normal) !important; }
.text-base { font-size: var(--fsh-text-base) !important; line-height: var(--fsh-leading-normal) !important; }
.text-lg { font-size: var(--fsh-text-lg) !important; line-height: var(--fsh-leading-snug) !important; }
.text-xl { font-size: var(--fsh-text-xl) !important; line-height: var(--fsh-leading-snug) !important; }
.text-2xl { font-size: var(--fsh-text-2xl) !important; line-height: var(--fsh-leading-tight) !important; }
.text-3xl { font-size: var(--fsh-text-3xl) !important; line-height: var(--fsh-leading-tight) !important; }
.text-4xl { font-size: var(--fsh-text-4xl) !important; line-height: var(--fsh-leading-tight) !important; }
.text-5xl { font-size: var(--fsh-text-5xl) !important; line-height: var(--fsh-leading-tight) !important; }
.text-6xl { font-size: var(--fsh-text-6xl) !important; line-height: var(--fsh-leading-tight) !important; }
.text-7xl { font-size: var(--fsh-text-7xl) !important; line-height: var(--fsh-leading-tight) !important; }

@media (min-width: 640px) {
  .sm\:text-xs { font-size: var(--fsh-text-xs) !important; }
  .sm\:text-sm { font-size: var(--fsh-text-sm) !important; }
  .sm\:text-base { font-size: var(--fsh-text-base) !important; }
  .sm\:text-lg { font-size: var(--fsh-text-lg) !important; }
  .sm\:text-xl { font-size: var(--fsh-text-xl) !important; }
  .sm\:text-2xl { font-size: var(--fsh-text-2xl) !important; }
  .sm\:text-3xl { font-size: var(--fsh-text-3xl) !important; }
  .sm\:text-4xl { font-size: var(--fsh-text-4xl) !important; }
  .sm\:text-5xl { font-size: var(--fsh-text-5xl) !important; }
  .sm\:text-6xl { font-size: var(--fsh-text-6xl) !important; }
  .sm\:text-7xl { font-size: var(--fsh-text-7xl) !important; }
}

@media (min-width: 768px) {
  .md\:text-xs { font-size: var(--fsh-text-xs) !important; }
  .md\:text-sm { font-size: var(--fsh-text-sm) !important; }
  .md\:text-base { font-size: var(--fsh-text-base) !important; }
  .md\:text-lg { font-size: var(--fsh-text-lg) !important; }
  .md\:text-xl { font-size: var(--fsh-text-xl) !important; }
  .md\:text-2xl { font-size: var(--fsh-text-2xl) !important; }
  .md\:text-3xl { font-size: var(--fsh-text-3xl) !important; }
  .md\:text-4xl { font-size: var(--fsh-text-4xl) !important; }
  .md\:text-5xl { font-size: var(--fsh-text-5xl) !important; }
  .md\:text-6xl { font-size: var(--fsh-text-6xl) !important; }
  .md\:text-7xl { font-size: var(--fsh-text-7xl) !important; }
}

@media (min-width: 1024px) {
  .lg\:text-xs { font-size: var(--fsh-text-xs) !important; }
  .lg\:text-sm { font-size: var(--fsh-text-sm) !important; }
  .lg\:text-base { font-size: var(--fsh-text-base) !important; }
  .lg\:text-lg { font-size: var(--fsh-text-lg) !important; }
  .lg\:text-xl { font-size: var(--fsh-text-xl) !important; }
  .lg\:text-2xl { font-size: var(--fsh-text-2xl) !important; }
  .lg\:text-3xl { font-size: var(--fsh-text-3xl) !important; }
  .lg\:text-4xl { font-size: var(--fsh-text-4xl) !important; }
  .lg\:text-5xl { font-size: var(--fsh-text-5xl) !important; }
  .lg\:text-6xl { font-size: var(--fsh-text-6xl) !important; }
  .lg\:text-7xl { font-size: var(--fsh-text-7xl) !important; }
}

@media (min-width: 1280px) {
  .xl\:text-xs { font-size: var(--fsh-text-xs) !important; }
  .xl\:text-sm { font-size: var(--fsh-text-sm) !important; }
  .xl\:text-base { font-size: var(--fsh-text-base) !important; }
  .xl\:text-lg { font-size: var(--fsh-text-lg) !important; }
  .xl\:text-xl { font-size: var(--fsh-text-xl) !important; }
  .xl\:text-2xl { font-size: var(--fsh-text-2xl) !important; }
  .xl\:text-3xl { font-size: var(--fsh-text-3xl) !important; }
  .xl\:text-4xl { font-size: var(--fsh-text-4xl) !important; }
  .xl\:text-5xl { font-size: var(--fsh-text-5xl) !important; }
  .xl\:text-6xl { font-size: var(--fsh-text-6xl) !important; }
  .xl\:text-7xl { font-size: var(--fsh-text-7xl) !important; }
}

/* ---------- Semantic helpers (prefer these on new sections) ---------- */
.fsh-display {
  font-family: var(--font-heading, var(--fsh-font-heading));
  font-size: var(--fsh-text-7xl);
  font-weight: var(--fsh-weight-bold);
  line-height: var(--fsh-leading-tight);
  letter-spacing: var(--fsh-tracking-tight);
}

.fsh-h1 {
  font-family: var(--font-heading, var(--fsh-font-heading));
  font-size: var(--fsh-text-5xl);
  font-weight: var(--fsh-weight-bold);
  line-height: var(--fsh-leading-tight);
}

.fsh-h2 {
  font-family: var(--font-heading, var(--fsh-font-heading));
  font-size: var(--fsh-text-4xl);
  font-weight: var(--fsh-weight-bold);
  line-height: var(--fsh-leading-tight);
}

.fsh-h3 {
  font-family: var(--font-heading, var(--fsh-font-heading));
  font-size: var(--fsh-text-2xl);
  font-weight: var(--fsh-weight-bold);
  line-height: var(--fsh-leading-snug);
}

.fsh-h4 {
  font-family: var(--font-heading, var(--fsh-font-heading));
  font-size: var(--fsh-text-xl);
  font-weight: var(--fsh-weight-semibold);
  line-height: var(--fsh-leading-snug);
}

.fsh-lead {
  font-family: var(--font-body, var(--fsh-font-body));
  font-size: var(--fsh-text-lg);
  font-weight: var(--fsh-weight-light);
  line-height: var(--fsh-leading-relaxed);
}

.fsh-body {
  font-family: var(--font-body, var(--fsh-font-body));
  font-size: var(--fsh-text-base);
  font-weight: var(--fsh-weight-normal);
  line-height: var(--fsh-leading-normal);
}

.fsh-label {
  font-family: var(--font-body, var(--fsh-font-body));
  font-size: var(--fsh-text-xs);
  font-weight: var(--fsh-weight-bold);
  letter-spacing: var(--fsh-tracking-widest);
  text-transform: uppercase;
}

.fsh-caption {
  font-family: var(--font-body, var(--fsh-font-body));
  font-size: var(--fsh-text-sm);
  font-weight: var(--fsh-weight-normal);
  line-height: var(--fsh-leading-normal);
}