/*
  Tokeny designu ProstePosty (krok B.8).
  Jedno źródło prawdy dla panelu klienta i przyszłego landingu.
  Zasada: żaden kolor nie ma jedynej definicji w bloku motywu ciemnego.
  Paleta jasna siedzi na gołym :root, ciemna tylko nadpisuje.
*/

:root {
  /* Powierzchnie */
  --tlo: #f6f7f9;
  --powierzchnia: #ffffff;
  --powierzchnia-cicha: #f1f3f6;
  --obwodka: #e4e7ec;

  /* Tekst */
  --tekst: #101828;
  --tekst-cichy: #5b6472;
  --tekst-na-marce: #ffffff;

  /* Marka */
  --marka: #2f6bff;
  --marka-ciemna: #1e4fd8;
  --marka-tlo: #eaf0ff;

  /* Stany */
  --sukces: #0e9f6e;
  --sukces-tlo: #e6f6ef;
  --uwaga: #d98b00;
  --uwaga-tlo: #fdf3e2;
  --blad: #d64545;
  --blad-tlo: #fdecec;
  --neutralny: #8a94a6;
  --neutralny-tlo: #f0f2f5;

  /* Typografia */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-liczby: "Inter", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Odstępy */
  --o1: 4px;  --o2: 8px;  --o3: 12px; --o4: 16px; --o5: 24px; --o6: 32px; --o7: 48px;

  /* Promienie i cień */
  --r-karta: 12px;
  --r-przycisk: 10px;
  --r-plakietka: 999px;
  --cien: 0 1px 2px rgba(16, 24, 40, 0.06), 0 1px 3px rgba(16, 24, 40, 0.10);

  /* Minimalny cel dotykowy. Połowa wejść jest z telefonu. */
  --dotyk: 44px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tlo: #0e1218;
    --powierzchnia: #161b24;
    --powierzchnia-cicha: #1c222d;
    --obwodka: #262f3d;
    --tekst: #e8ebf0;
    --tekst-cichy: #98a2b3;
    --marka: #5b8bff;
    --marka-ciemna: #2f6bff;
    --marka-tlo: #16223c;
    --sukces: #34d399;
    --sukces-tlo: #10241d;
    --uwaga: #f0b429;
    --uwaga-tlo: #2a2110;
    --blad: #f87171;
    --blad-tlo: #2b1414;
    --neutralny: #8a94a6;
    --neutralny-tlo: #1c222d;
    --cien: 0 1px 2px rgba(0, 0, 0, 0.40), 0 1px 3px rgba(0, 0, 0, 0.30);
  }
}

:root[data-theme="dark"] {
  --tlo: #0e1218;
  --powierzchnia: #161b24;
  --powierzchnia-cicha: #1c222d;
  --obwodka: #262f3d;
  --tekst: #e8ebf0;
  --tekst-cichy: #98a2b3;
  --marka: #5b8bff;
  --marka-ciemna: #2f6bff;
  --marka-tlo: #16223c;
  --sukces: #34d399;
  --sukces-tlo: #10241d;
  --uwaga: #f0b429;
  --uwaga-tlo: #2a2110;
  --blad: #f87171;
  --blad-tlo: #2b1414;
  --neutralny: #8a94a6;
  --neutralny-tlo: #1c222d;
  --cien: 0 1px 2px rgba(0, 0, 0, 0.40), 0 1px 3px rgba(0, 0, 0, 0.30);
}