/* TT Task — tasarım token'ları
   Renkler `arayüz/01-05.png` referans ekranlarından piksel örneklemesi ile alınmıştır. */

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../fonts/pjs-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308,
    U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
    U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../fonts/pjs-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---------------------------------------------------------------- zemin */
  --bg-1: #D9F2FE;
  --bg-2: #EDF9FF;
  --bg-3: #E4F4FD;
  --surface: #FFFFFF;
  --surface-soft: #F7FBFE;

  /* ---------------------------------------------------------------- metin */
  --ink: #1B2732;
  --ink-2: #48535E;
  --muted: #6D7A88;
  --muted-2: #93A1AF;

  /* ---------------------------------------------------------------- mavi */
  --blue: #158DFD;
  --blue-600: #0B7BEE;
  --blue-700: #0068D6;
  --blue-link: #1D91FA;
  --blue-soft: #D6F3FE;
  --blue-track: #D1F1FE;
  --blue-ink: #2A8EE4;

  /* ---------------------------------------------------------------- durum */
  --green: #59D034;
  --green-soft: #E4F8DC;
  --green-ink: #3F872C;
  --mint: #C5F7E0;

  --yellow: #FEDC67;
  --yellow-ring: #FEC80A;
  --yellow-soft: #FEF4CC;
  --yellow-chip: #FEF4D2;
  --yellow-ink: #B88214;

  --coral: #FD8784;
  --red-chip: #FDE6E6;
  --red-ink: #B91F2D;

  --purple: #C6ACEE;
  --purple-soft: #EBE4FA;
  --purple-ink: #8B75C8;

  --orange: #FFA75C;

  /* ---------------------------------------------------------------- çizgi */
  --line: #EAF0F5;
  --line-2: #D9DDE3;
  --dash: #E3EAF0;

  /* ---------------------------------------------------------------- ölçü */
  --gutter: 20px;
  --card-pad: 16px;
  --stack: 14px;

  --r-card: 18px;
  --r-inner: 14px;
  --r-field: 14px;
  --r-sm: 10px;
  --r-pill: 999px;

  --shadow-card: 0 4px 16px rgba(16, 96, 156, .06), 0 1px 2px rgba(16, 96, 156, .04);
  --shadow-raised: 0 8px 24px rgba(16, 96, 156, .12);
  --shadow-blue: 0 8px 20px rgba(21, 141, 253, .32);
  --shadow-sheet: 0 -8px 40px rgba(16, 96, 156, .16);

  /* ---------------------------------------------------------------- tipografi */
  --font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    'Helvetica Neue', Arial, sans-serif;

  --t-h1: 22px;
  --t-h2: 17px;
  --t-h3: 15px;
  --t-body: 14px;
  --t-sm: 13px;
  --t-xs: 12px;
  --t-xxs: 11px;

  /* ---------------------------------------------------------------- katmanlar */
  --z-nav: 40;
  --z-sheet: 60;
  --z-toast: 80;

  --nav-h: 64px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}