/* ==========================================================================
   Skarbono - design tokens (jasny motyw, mobile-first)
   Przenoszone 1:1 do aplikacji. Zadnych zasobow zewnetrznych.
   Punkty graniczne (custom properties nie dzialaja w @media, wiec jako stale):
     --bp-sm: 640px   --bp-md: 900px   --bp-lg: 1120px
   ========================================================================== */
:root {
  /* --- Marka: stonowana, ciemna zieleń (przyciski, linki, aktywna zakładka, pasek postępu, "Rozliczone") --- */
  --c-brand-50:  #f0f7f3;
  --c-brand-100: #dcede3;
  --c-brand-200: #b5d8c4;
  --c-brand-500: #2e8b62;
  --c-brand-600: #1f7651;
  --c-brand-700: #17633f;   /* główny: biały tekst 7:1 */
  --c-brand-800: #114e33;
  --c-brand-900: #0c3b27;

  /* --- Rozróżnienie od zieleni marki: kwoty mają własne kolory --- */
  --c-income:      #1f4fa3;  /* wpływy / wpłaty = niebieski (nie zielony) */
  --c-income-soft: #edf2fb;
  --c-expense:      #a6401a; /* wydatki / wypłaty = ceglasty */
  --c-expense-soft: #fbefe9;
  --c-balance:      #1b1f24; /* saldo = neutralny, ciemny */

  /* --- Statusy --- */
  --c-ok:        var(--c-brand-800);  /* ✓ Rozliczone */
  --c-ok-soft:   var(--c-brand-50);
  --c-warn:      #7a5200;             /* Nierozliczone, braki */
  --c-warn-soft: #fdf5e1;
  --c-over:      #5b32b4;             /* nadpłata (tylko admin) */
  --c-over-soft: #f3effb;
  --c-danger:      #b42318;
  --c-danger-soft: #fdf0ef;

  /* --- Powierzchnie i tekst (neutralne, chłodne szarości) --- */
  --c-bg:         #f6f7f9;
  --c-surface:    #ffffff;
  --c-surface-2:  #f2f4f7;  /* tła sekcji, nagłówki tabel */
  --c-line:       #e3e6ea;
  --c-line-strong:#cdd2d9;
  --c-text:       #1b1f24;
  --c-text-muted: #5c6470;  /* 5,9:1 na białym */
  --c-on-brand:   #ffffff;
  --c-focus:      #1f4fa3;

  /* --- Tła awatarów (emoji pseudonimu): jedna stonowana szarość z lekkim odcieniem --- */
  --av-1: #eef1f5;
  --av-2: #eef1f5;
  --av-3: #f3f0ec;
  --av-4: #f3f0ec;
  --av-5: #edf3ef;
  --av-6: #edf3ef;

  /* --- Typografia (czcionki systemowe, bez pobierania) --- */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
               "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --fs-xs:  0.75rem;   /* 12 */
  --fs-sm:  0.875rem;  /* 14 */
  --fs-md:  1rem;      /* 16 - treść */
  --fs-lg:  1.125rem;  /* 18 */
  --fs-xl:  1.25rem;   /* 20 */
  --fs-2xl: 1.5rem;    /* 24 */
  --fs-3xl: 1.875rem;  /* 30 */
  --fs-hero: clamp(1.875rem, 5vw, 2.75rem);
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 650;
  --lh-tight: 1.25;
  --lh-base: 1.5;

  /* --- Odstępy (skala 4 px) --- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.75rem;
  --sp-7: 2.75rem;
  --sp-8: 4rem;

  /* --- Kształt --- */
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-md: 0 2px 8px rgba(16, 24, 40, .07);
  --shadow-lg: 0 10px 30px rgba(16, 24, 40, .12);

  /* --- Układ --- */
  --w-content: 72rem;   /* landing */
  --w-app: 56rem;       /* widok skarbca */
  --w-narrow: 30rem;    /* formularze, PIN */
  --page-top: var(--sp-5);        /* górny margines nad tytułem stron bez nagłówka z logo (skarbiec, PIN) */
  --gap-after-list: var(--sp-4);  /* odstęp między listą/tabelą a linkiem lub przyciskami pod nią */
  --tap: 2.75rem;       /* minimalny cel dotyku 44 px */
}
