@import url("https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Barlow+Condensed:wght@500;600;700&family=Bebas+Neue&family=Bungee&family=IBM+Plex+Mono:wght@500;600;700&family=JetBrains+Mono:wght@500;600;700&family=Lilita+One&family=Merriweather:wght@400;700;900&family=Nunito:wght@500;600;700;800&family=Outfit:wght@400;500;600;700;800&family=Press+Start+2P&family=Source+Sans+3:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700;800&family=Teko:wght@500;600;700&family=VT323&display=swap");

:root {
  --font-body: "Outfit", "Segoe UI", sans-serif;
  --font-heading: "Space Grotesk", "Outfit", "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: -0.02em;
  --heading-transform: none;
}

body[data-font-preset="professional"] {
  --font-body: "Source Sans 3", "Segoe UI", sans-serif;
  --font-heading: "Merriweather", Georgia, serif;
  --font-mono: "IBM Plex Mono", Consolas, monospace;
  --heading-letter-spacing: -0.01em;
  --heading-transform: none;
}

body[data-theme="valorant"] {
  --font-body: "Barlow Condensed", "Outfit", "Segoe UI", sans-serif;
  --font-heading: "Bebas Neue", "Barlow Condensed", "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: 0.05em;
  --heading-transform: uppercase;
}

body[data-theme="apex-legends"] {
  --font-body: "Barlow Condensed", "Outfit", "Segoe UI", sans-serif;
  --font-heading: "Teko", "Barlow Condensed", "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: 0.03em;
  --heading-transform: uppercase;
}

body[data-theme="fortnite"] {
  --font-body: "Nunito", "Outfit", "Segoe UI", sans-serif;
  --font-heading: "Bungee", "Nunito", "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: 0.02em;
  --heading-transform: uppercase;
}

body[data-theme="minecraft"] {
  --font-body: "VT323", "JetBrains Mono", Consolas, monospace;
  --font-heading: "Press Start 2P", "VT323", monospace;
  --font-mono: "VT323", "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: 0.04em;
  --heading-transform: uppercase;
}

body[data-theme="clash-of-clans"] {
  --font-body: "Baloo 2", "Outfit", "Segoe UI", sans-serif;
  --font-heading: "Lilita One", "Baloo 2", "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", Consolas, monospace;
  --heading-letter-spacing: 0.015em;
  --heading-transform: uppercase;
}

* {
  font-family: var(--font-body);
}

h1,
h2,
h3,
h4,
.logo-text,
.nav-label,
.btn,
.auth-title,
.metric-value,
.page-title {
  font-family: var(--font-heading);
}

code,
.mono,
.pnl-value,
.metric-kicker,
.table-pill,
.calendar-day-link,
.stat-inline strong {
  font-family: var(--font-mono);
}

h1,
h2,
h3,
h4 {
  font-weight: 700;
  letter-spacing: var(--heading-letter-spacing);
  text-transform: var(--heading-transform);
}

body,
input,
select,
textarea,
button {
  font-weight: 500;
}

body[data-theme="valorant"] .nav-label,
body[data-theme="valorant"] .action-label,
body[data-theme="valorant"] .btn,
body[data-theme="apex-legends"] .nav-label,
body[data-theme="apex-legends"] .action-label,
body[data-theme="apex-legends"] .btn,
body[data-theme="fortnite"] .nav-label,
body[data-theme="fortnite"] .action-label,
body[data-theme="fortnite"] .btn,
body[data-theme="minecraft"] .nav-label,
body[data-theme="minecraft"] .action-label,
body[data-theme="minecraft"] .btn,
body[data-theme="clash-of-clans"] .nav-label,
body[data-theme="clash-of-clans"] .action-label,
body[data-theme="clash-of-clans"] .btn {
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

body[data-theme="minecraft"],
body[data-theme="minecraft"] input,
body[data-theme="minecraft"] select,
body[data-theme="minecraft"] textarea,
body[data-theme="minecraft"] button {
  font-weight: 400;
}