/* ============================================================
   VADE — tasarım tokenları · "Defter" estetiği
   Sıcak kâğıt zemin, mürekkep metin, tabular mono rakamlar,
   editoryal serif başlıklar. Yalnız açık tema (color-scheme: only light).
   ============================================================ */
@import url('../fonts/fonts.css');

:root {
  color-scheme: only light;

  /* Zemin & mürekkep */
  --paper:   #F5F0E7;
  --paper-2: #EDE6D8;
  --paper-3: #E4DCCB;
  --paper-4: #DCD3BF;
  --white:   #FCFAF5;
  --ink:     #17150F;
  --ink-2:   #4A463D;
  --ink-3:   #66604F;   /* paper üzerinde 5.5:1 */
  --ink-4:   #A59E8E;
  --line:    #D8CFBE;
  --line-2:  #C7BCA6;
  --line-3:  #B3A78E;

  /* Anlam renkleri (SPEC §29 lejantı) — kırmızı METİN yok; renkler rozet/çubuk/nokta için */
  --in:            #1C6B4A;
  --in-soft:       #DBEBDF;
  --in-ink:        #124B34;
  --out:           #A8392D;
  --out-soft:      #F3DBD5;
  --out-ink:       #7A2820;
  --pending:       #8A5A0E;   /* metin/ikon için (5.2:1) */
  --pending-dot:   #B4761B;   /* yalnız nokta/çubuk/halka */
  --pending-soft:  #F6E7C7;
  --pending-ink:   #7C5011;
  --transfer:      #2D5BA3;
  --transfer-soft: #D9E3F3;
  --transfer-ink:  #1F3F73;
  --savings:       #6A3D8C;
  --savings-soft:  #E7DBEF;
  --savings-ink:   #4A2A62;
  --brand:         #1C6B4A;
  --brand-ink:     #124B34;
  --danger:        #A8392D;

  /* Tipografi */
  --font-display: 'Newsreader', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --font-ui:      'Golos Text', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:    'JetBrains Mono', 'SFMono-Regular', Menlo, Consolas, monospace;

  --fs-xs: 0.75rem;   /* 12 */
  --fs-sm: 0.8125rem; /* 13 */
  --fs-md: 0.9375rem; /* 15 */
  --fs-lg: 1.0625rem; /* 17 */
  --fs-xl: 1.375rem;  /* 22 */
  --fs-2xl: 1.75rem;  /* 28 */
  --fs-hero: clamp(2.4rem, 6vw, 3.6rem);

  /* Boşluk & şekil */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-7: 32px; --sp-8: 40px; --sp-9: 56px;
  --radius: 10px;
  --radius-sm: 6px;
  --radius-lg: 18px;
  --radius-pill: 999px;

  --shadow-1: 0 1px 2px rgba(23,21,15,.06), 0 1px 0 rgba(23,21,15,.04);
  --shadow-2: 0 6px 18px rgba(23,21,15,.10), 0 2px 4px rgba(23,21,15,.06);
  --shadow-sheet: 0 -12px 40px rgba(23,21,15,.18);
  --shadow-fab: 0 10px 24px rgba(23,21,15,.28);

  /* Yerleşim */
  --rail-w: 232px;
  --content-max: 1180px;
  --tabbar-h: 64px;
  --topbar-h: 56px;
  --sheet-w: 520px;

  --ease-out: cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(.34,1.4,.64,1);
  --dur-fast: 140ms;
  --dur: 220ms;
  --dur-slow: 380ms;
}

/* Dokular */
:root {
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --ruled: repeating-linear-gradient(to bottom, transparent 0 27px, rgba(23,21,15,.07) 27px 28px);
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100dvh;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--fs-md);
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
/* Doku yalnız hero/başlık şeritlerinde (mobil kaydırma performansı için tam sayfa overlay yok) */
.grain { position: relative; }
.grain::before { content: ""; position: absolute; inset: 0; background-image: var(--grain); opacity: .05; pointer-events: none; mix-blend-mode: multiply; border-radius: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.15; }
p { margin: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
img, svg { display: block; max-width: 100%; }
table { border-collapse: collapse; width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; border-radius: 4px; }
::selection { background: var(--in-soft); }

/* Rakamlar her zaman mono + tabular */
.num, .money, td.num, .mono {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.display { font-family: var(--font-display); font-weight: 500; letter-spacing: -0.01em; }
.display-i { font-family: var(--font-display); font-style: italic; font-weight: 500; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
