/* ===========================================================================
   prospect-finder — tokeny projektowe
   JEDYNE wspólne źródło prawdy o wyglądzie. Konsumują je landing i panel.

   Nazwy zmiennych są kontraktem. Kod, który sięga po surowy kolor zamiast
   po token, wypada z tego kontraktu i rozjedzie się przy pierwszej zmianie.

   Paleta: granat jako kolor wiodący (poważny, ale nie korporacyjnie zimny),
   zieleń morska zarezerwowana WYŁĄCZNIE dla dowodu kwalifikacji — dzięki temu
   „skąd to wiadomo" ma w całym serwisie jeden, rozpoznawalny kolor.
   Neutralne są lekko ciepłe; przy gęstej tabeli czyta się je łagodniej
   niż czyste szarości.
   =========================================================================== */

:root {
  color-scheme: light dark;

  /* --- Skala bazowa: neutralne (lekko ciepłe) ---------------------------- */
  --pf-neutral-0:   #ffffff;
  --pf-neutral-50:  #f8f7f5;
  --pf-neutral-100: #efedea;
  --pf-neutral-200: #e2dfda;
  --pf-neutral-300: #c9c5be;
  --pf-neutral-500: #8b867d;
  --pf-neutral-700: #4d4941;
  --pf-neutral-900: #1f1d1a;

  /* --- Akcent marki: granat --------------------------------------------- */
  --pf-accent:        #1f3d7a;
  --pf-accent-hover:  #17305f;
  --pf-accent-subtle: #e8edf7;
  --pf-on-accent:     #ffffff;

  /* --- Powierzchnie i tekst --------------------------------------------- */
  --pf-surface:          var(--pf-neutral-0);
  --pf-surface-sunken:   var(--pf-neutral-50);
  --pf-surface-raised:   var(--pf-neutral-0);
  --pf-border:           var(--pf-neutral-200);
  --pf-border-strong:    var(--pf-neutral-300);
  --pf-text:             var(--pf-neutral-900);
  --pf-text-muted:       var(--pf-neutral-700);
  --pf-text-subtle:      var(--pf-neutral-500);

  /* --- Statusy leada (rozdz. 3.1–3.3, 10.4) ------------------------------
     Każdy status MUSI być rozróżnialny bez koloru — para tło/tekst plus
     osobny znacznik tekstowy. Klient triażuje szybko, często na laptopie
     o kiepskim kontraście.                                                 */
  --pf-status-new-bg:        #eef2ff;
  --pf-status-new-fg:        #26356e;
  --pf-status-accepted-bg:   #e7f5ec;
  --pf-status-accepted-fg:   #1c5433;
  --pf-status-rejected-bg:   #f3f0ee;
  --pf-status-rejected-fg:   #5a4b42;
  --pf-status-complained-bg: #fdf0e6;
  --pf-status-complained-fg: #7a441a;
  /* Duplikat MIĘKKI (7.2): sygnał do decyzji człowieka, nie werdykt.
     Wizualnie ma wołać o uwagę, ale nie wyglądać jak błąd.                 */
  --pf-status-dupe-bg:       #fff8e1;
  --pf-status-dupe-fg:       #6b5310;
  /* Domena wykluczająca bota (4.5) — rekord nietykalny, nie porażka.       */
  --pf-status-blocked-bg:    var(--pf-neutral-100);
  --pf-status-blocked-fg:    var(--pf-neutral-700);

  /* --- Dowód kwalifikacji (3.1.3) ----------------------------------------
     Komponent charakterystyczny całego produktu: każdy lead ma source_url.
     To jest element, po którym klient poznaje, że nie zmyślamy.            */
  --pf-evidence-fg:     #1f6f5c;   /* tekst na jasnym tle — musi być ciemny */
  --pf-evidence-bg:     #e6f4f0;
  --pf-evidence-border: #9fd4c6;
  /* Żywsza odmiana do znaku i ikon: #1f6f5c na granacie ma za mały kontrast. */
  --pf-evidence-bright: #2fa98a;

  /* --- Skarbonka (1.2) ---------------------------------------------------
     Trzy stany, bo rezerwacja środków przed przebiegiem jest widoczna
     dla klienta i musi być odróżnialna od salda dostępnego.                */
  --pf-wallet-available: #1c5433;
  --pf-wallet-reserved:  #7a5c17;
  --pf-wallet-empty:     #8c2f22;

  /* --- Typografia --------------------------------------------------------
     Panel jest gęsty; landing ma oddychać. Obie powierzchnie dzielą skalę,
     różnią się użyciem.                                                    */
  --pf-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pf-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --pf-text-xs:   0.75rem;
  --pf-text-sm:   0.875rem;
  --pf-text-base: 1rem;
  --pf-text-lg:   1.125rem;
  --pf-text-xl:   1.375rem;
  --pf-text-2xl:  1.75rem;
  --pf-text-3xl:  2.25rem;
  --pf-text-4xl:  3rem;

  --pf-leading-tight: 1.25;
  --pf-leading-base:  1.55;
  --pf-leading-loose: 1.7;

  --pf-weight-normal: 400;
  --pf-weight-medium: 500;
  --pf-weight-bold:   650;

  /* --- Odstępy (skala 4px) ----------------------------------------------- */
  --pf-space-1: 0.25rem;
  --pf-space-2: 0.5rem;
  --pf-space-3: 0.75rem;
  --pf-space-4: 1rem;
  --pf-space-6: 1.5rem;
  --pf-space-8: 2rem;
  --pf-space-12: 3rem;
  --pf-space-16: 4rem;
  --pf-space-24: 6rem;

  /* --- Krawędzie i cienie ------------------------------------------------ */
  --pf-radius-sm: 4px;
  --pf-radius-md: 8px;
  --pf-radius-lg: 14px;
  --pf-radius-pill: 999px;

  --pf-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06);
  --pf-shadow-md: 0 2px 8px rgb(0 0 0 / 0.08);

  /* --- Układ -------------------------------------------------------------- */
  --pf-width-prose: 68ch;   /* teksty landingu */
  --pf-width-page:  1200px; /* maks. szerokość kontenera */

  --pf-focus-ring: 0 0 0 3px var(--pf-accent-subtle), 0 0 0 1px var(--pf-accent);
}

/* --- Tryb ciemny ---------------------------------------------------------
   Panel bywa używany długo; tryb ciemny nie jest ozdobą. Podmieniamy tylko
   warstwę semantyczną, skala bazowa zostaje.                              */
@media (prefers-color-scheme: dark) {
  :root {
    --pf-surface:        #16161a;
    --pf-surface-sunken: #0f0f12;
    --pf-surface-raised: #1e1e24;
    --pf-border:         #2e2e36;
    --pf-border-strong:  #43434e;
    --pf-text:           #ececf1;
    --pf-text-muted:     #b4b4c0;
    --pf-text-subtle:    #85858f;
    --pf-accent-subtle:  #1b2743;
  }
}
