/**
 * Base styles — reset + typography + form primitives
 * tokens.css'den sonra yüklenir.
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

/* ─── Reset (modern, minimal) ─── */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }

html, body { height: 100%; }
body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-base);
  color: var(--text-primary);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; font-size: inherit; }
a { color: var(--text-link); text-decoration: none; }
a:hover { color: var(--text-link-hover); }

/* Sayısal hizalama — finans uygulaması için kritik */
.tabular { font-variant-numeric: tabular-nums; }

/* ─── Typography utility ─── */
.heading-1 { font-size: var(--text-4xl); font-weight: var(--weight-extra); letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); }
.heading-2 { font-size: var(--text-3xl); font-weight: var(--weight-bold); letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); }
.heading-3 { font-size: var(--text-2xl); font-weight: var(--weight-bold); letter-spacing: var(--tracking-tight); line-height: var(--leading-snug); }
.heading-4 { font-size: var(--text-xl); font-weight: var(--weight-semibold); line-height: var(--leading-snug); }
.heading-5 { font-size: var(--text-lg); font-weight: var(--weight-semibold); }
.heading-6 { font-size: var(--text-base); font-weight: var(--weight-semibold); }

.eyebrow {
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
  color: var(--text-tertiary);
}

.text-muted     { color: var(--text-secondary); }
.text-soft      { color: var(--text-tertiary); }
.text-success   { color: var(--success-600); }
.text-warning   { color: var(--warning-600); }
.text-danger    { color: var(--danger-600); }
.text-info      { color: var(--info-600); }

/* Para birimi sayısı */
.amount {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
  font-weight: var(--weight-semibold);
}
.amount-xl { font-size: var(--text-3xl); letter-spacing: var(--tracking-tight); }
.amount-lg { font-size: var(--text-xl); }
.amount-sm { font-size: var(--text-sm); }
.amount-positive { color: var(--success-600); }
.amount-negative { color: var(--danger-600); }
.amount-neutral  { color: var(--text-primary); }

/* ─── Scrollbar (subtle) ─── */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--slate-300); border-radius: var(--radius-full); border: 2px solid var(--surface-page); }
::-webkit-scrollbar-thumb:hover { background: var(--slate-400); }

/* ─── Selection ─── */
::selection {
  background: var(--brand-100);
  color: var(--brand-900);
}

/* ─── Focus visible ─── */
:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-color: var(--border-focus);
}