/**
 * ─────────────────────────────────────────────
 *  SPB Git — Personal Git Platform
 * ─────────────────────────────────────────────
 *  Author  : Simon-Pierre Boucher
 *  Contact : contact@spboucher.ai
 *  File    : src/web/assets/css/tokens.css
 *  Purpose : Design tokens — colors, radius, typography, themes
 *  License : MIT © Simon-Pierre Boucher
 * ─────────────────────────────────────────────
 */

@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/assets/fonts/inter-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/assets/fonts/jetbrains-mono-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/assets/fonts/jetbrains-mono-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root,
html[data-theme='dark'] {
  --bg: #0b0e14;
  --surface: #11151c;
  --surface-2: #161b24;
  --border: #1f2530;
  --border-strong: #2a3242;
  --text: #e6e9ef;
  --muted: #8b93a3;
  --accent: #4f8cff;
  --accent-soft: rgba(79, 140, 255, 0.14);
  --accent-2: #22d3aa;
  --danger: #ff5d5d;
  --success: #3fb950;
  --add-bg: rgba(63, 185, 80, 0.15);
  --add-text: #56d364;
  --del-bg: rgba(248, 81, 73, 0.15);
  --del-text: #ff7b72;
  --hunk-bg: rgba(79, 140, 255, 0.08);
  --code-bg: #0d1117;
  --chip-bg: rgba(79, 140, 255, 0.12);
  --heat-0: #161b24;
  --heat-1: #0e4429;
  --heat-2: #006d32;
  --heat-3: #26a641;
  --heat-4: #39d353;
  --radius: 10px;
  --font-ui: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --shadow-pop: 0 0 0 1px var(--border);
  color-scheme: dark;
}

html[data-theme='light'] {
  --bg: #f7f8fa;
  --surface: #ffffff;
  --surface-2: #f0f2f5;
  --border: #d9dee6;
  --border-strong: #c2cad6;
  --text: #1c2330;
  --muted: #57606e;
  --accent: #2f6fe0;
  --accent-soft: rgba(47, 111, 224, 0.1);
  --accent-2: #0d9e80;
  --danger: #d33636;
  --success: #1a7f37;
  --add-bg: rgba(26, 127, 55, 0.12);
  --add-text: #1a7f37;
  --del-bg: rgba(207, 34, 46, 0.12);
  --del-text: #cf222e;
  --hunk-bg: rgba(47, 111, 224, 0.07);
  --code-bg: #f6f8fa;
  --chip-bg: rgba(47, 111, 224, 0.1);
  --heat-0: #ebedf0;
  --heat-1: #9be9a8;
  --heat-2: #40c463;
  --heat-3: #30a14e;
  --heat-4: #216e39;
  color-scheme: light;
}

/* Shiki dual-theme switch */
html[data-theme='dark'] .shiki,
html[data-theme='dark'] .shiki span {
  color: var(--shiki-dark) !important;
  background-color: transparent !important;
}
html[data-theme='light'] .shiki,
html[data-theme='light'] .shiki span {
  color: var(--shiki-light) !important;
  background-color: transparent !important;
}