/* sameQuizy - tokeny motywu (jasny + ciemny)
   Light = wartości domyślne (:root). Dark nadpisuje przy body.night.
   Respektujemy też systemowy tryb ciemny. Jeśli Wasz system używa innej
   klasy (.dark itd.) - zmień selektory na swoje, wartości zostają. */

:root{
  /* MARKA */
  --sq-teal:    #47CAB3;  /* brand - wypełnione przyciski, akcenty */
  --sq-teal-d:  #2E9482;  /* ciemniejszy - TEKST/LINKI na jasnym tle */
  --sq-teal-bg: #E2F6F1;  /* pastelowe tło sekcji/pigułek */
  --sq-teal-bd: #B4E6DC;  /* obrys w klimacie marki */

  /* AKCENTY REAKCJI */
  --sq-rose:    #E8476B;  /* "Super!" / lajk */
  --sq-rose-bg: #FCE9EE;
  --sq-amber:   #E89A2B;  /* "Ulubione" */

  /* NEUTRALNE */
  --sq-surface: #FFFFFF;  /* karta wyniku / powierzchnie */
  --sq-bg:      #F6F8F9;  /* tło strony */
  --sq-card2:   #F4F6F8;  /* subtelne tło (inputy, pola) */
  --sq-ink:     #13202B;  /* tekst główny */
  --sq-muted:   #677685;  /* tekst drugorzędny */
  --sq-line:    #E5E9ED;  /* obrysy, separatory */

  /* PROMIENIE / CIEŃ */
  --sq-r-lg: 5px;
  --sq-r-md: 5px;
  --sq-r-sm: 5px;
  --sq-shadow: 0 9px 20px -10px rgba(71,202,179,.55);

  --sq-on-teal: #FFFFFF;
}

/* CIEMNY - tryb nocny strony (body.night; ustawiany serwerowo z user_meta night_mode) */
body.night{
  --sq-teal:    #47CAB3;
  --sq-teal-d:  #5FD6C0;  /* na ciemnym "ciemniejszy" = JAŚNIEJSZY (czytelność) */
  --sq-teal-bg: rgba(71,202,179,.14);
  --sq-teal-bd: rgba(71,202,179,.40);

  --sq-rose:    #F2607F;
  --sq-rose-bg: rgba(242,96,127,.14);
  --sq-amber:   #E8A33B;

  --sq-surface: #26282B;  /* karta - grafit */
  --sq-bg:      #111315;
  --sq-card2:   #2E3034;
  --sq-ink:     #ECEEF0;
  --sq-muted:   #9097A0;
  --sq-line:    #383B40;

  --sq-shadow: 0 9px 22px -10px rgba(0,0,0,.5);
  --sq-on-teal: #06231D;
}

/* Tryb ciemny zależy WYŁĄCZNIE od trybu nocnego strony (body.night).
   Brak własnego przełącznika i brak auto z prefers-color-scheme - o wyglądzie
   decyduje ustawienie usera (night_mode), tak jak na reszcie serwisu. */

/* ZASADA: w komponentach nigdy nie wpisuj #fff / #47cab3 itd.
   Zawsze var(--sq-*). Wyjątek: karta do udostępniania (stories) -
   ma być stała niezależnie od motywu, tam kolory mogą być na sztywno. */