/* ==========================================================================
   Adım Adım Türkçe — Companion
   Design tokens. The visual language is original to this project; the brand
   colours of the source publisher (Dilset) are deliberately not reproduced.
   ========================================================================== */

:root {
  color-scheme: light;

  /* Palette: a warm Turkish-tile inspired red/teal pairing on paper neutrals */
  --paper:        #fbf9f6;
  --paper-2:      #f4f0ea;
  --surface:      #ffffff;
  --surface-2:    #f7f4ef;
  --border:       #e4ddd3;
  --border-2:     #d3c9bb;

  --ink:          #1e1b18;
  --ink-2:        #4a443d;
  --ink-3:        #7b736a;
  --ink-4:        #a79e94;

  --brand:        #b3272d;
  --brand-2:      #8f1c22;
  --brand-soft:   #fbeceb;
  --brand-tint:   #f6d9d8;

  --accent:       #10696b;
  --accent-2:     #0b4f51;
  --accent-soft:  #e2f1f1;

  --gold:         #b8860b;
  --gold-soft:    #fbf1d8;

  --ok:           #1f7a45;
  --ok-soft:      #e4f4ea;
  --bad:          #b3261e;
  --bad-soft:     #fdeceb;
  --warn:         #8a6100;
  --warn-soft:    #fdf3dd;

  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  --sh-1: 0 1px 2px rgba(30, 27, 24, .06), 0 1px 1px rgba(30, 27, 24, .04);
  --sh-2: 0 2px 6px rgba(30, 27, 24, .07), 0 1px 2px rgba(30, 27, 24, .05);
  --sh-3: 0 8px 24px rgba(30, 27, 24, .10), 0 2px 6px rgba(30, 27, 24, .06);
  --sh-4: 0 20px 48px rgba(30, 27, 24, .16);

  --sans: "Segoe UI", "Inter", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --serif: "Iowan Old Style", "Palatino Linotype", "Georgia", "Times New Roman", serif;
  --mono: "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", monospace;

  --header-h: 62px;
  --rail-w: 300px;
  --maxw: 1240px;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --paper:        #14120f;
  --paper-2:      #1a1714;
  --surface:      #201c18;
  --surface-2:    #272219;
  --border:       #352f28;
  --border-2:     #443c32;

  --ink:          #f3ede4;
  --ink-2:        #cec5b8;
  --ink-3:        #a0968a;
  --ink-4:        #7a7166;

  --brand:        #e2565c;
  --brand-2:      #f07a7f;
  --brand-soft:   #3a1d1f;
  --brand-tint:   #4a2427;

  --accent:       #4bb8ba;
  --accent-2:     #6fd0d1;
  --accent-soft:  #143334;

  --gold:         #dfae3a;
  --gold-soft:    #3a2f14;

  --ok:           #5cc98a;
  --ok-soft:      #14301f;
  --bad:          #f0796f;
  --bad-soft:     #3a1a18;
  --warn:         #e0b457;
  --warn-soft:    #362a12;

  --sh-1: 0 1px 2px rgba(0, 0, 0, .5);
  --sh-2: 0 2px 6px rgba(0, 0, 0, .5);
  --sh-3: 0 8px 24px rgba(0, 0, 0, .55);
  --sh-4: 0 20px 48px rgba(0, 0, 0, .7);
}

/* Respect a learner who wants larger text */
:root[data-fontscale="large"]  { font-size: 18px; }
:root[data-fontscale="xlarge"] { font-size: 20px; }