/* ==========================================================================
   App Platform — wspólny system wyglądu (platform-theme.css) v1
   Jedyne źródło tokenów kolorów dla wszystkich aplikacji platformy.
   Opis: docs/SYSTEM-WYGLADU.md. Zasady czytelności: docs/ZASADY-CZYTELNOSCI.md.
   Motyw ustawia platform-theme.js (atrybut data-theme na <html>: light | dark).
   Bez skryptu obowiązuje motyw ciemny.
   ========================================================================== */

/* ---- Ciemny (domyślny) ---- */
:root,
:root[data-theme="dark"],
[data-apf-scope="dark"] {
    color-scheme: dark;
    --bg-page: #0f172a;
    --bg-surface: #1e293b;
    --bg-surface-alt: #334155;
    --bg-surface-hover: #475569;
    --text-main: #f1f5f9;
    --text-muted: #cbd5e1;
    --text-placeholder: #94a3b8;
    --border-color: #334155;
    --border-strong: #8195ad;       /* obramowanie pól formularzy (≥ 3:1) */
    --overlay: rgba(0, 0, 0, 0.65);
    --shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
    --focus-ring: #38bdf8;
    --subtle-bg: rgba(51, 65, 85, 0.35);   /* delikatne tło paneli i bloków */
    --hover-tint: rgba(255, 255, 255, 0.12);

    /* statusy: tło + tekst (każda para ≥ 4,5:1, tekst czytelny też na --bg-surface) */
    --ok-bg: #14532d;   --ok-fg: #86efac;
    --warn-bg: #78350f; --warn-fg: #fde68a;
    --err-bg: #7f1d1d;  --err-fg: #fecaca;
    --info-bg: #1e3a8a; --info-fg: #bfdbfe;

    /* kolory pełne (tło przycisków); tekst na nich: --on-solid / --on-warning. Jako TEKST używaj --ok-fg / --warn-fg / --err-fg */
    --success-color: #15803d;
    --warning-color: #f59e0b;
    --danger-color: #b91c1c;
    --on-warning: #0f172a;
    --on-solid: #ffffff;           /* tekst na --success-color i --danger-color */
}

/* ---- Jasny ---- */
:root[data-theme="light"],
[data-apf-scope="light"] {
    color-scheme: light;
    --bg-page: #f1f5f9;
    --bg-surface: #ffffff;
    --bg-surface-alt: #e2e8f0;
    --bg-surface-hover: #cbd5e1;
    --text-main: #0f172a;
    --text-muted: #475569;
    --text-placeholder: #5b6b81;
    --border-color: #cbd5e1;
    --border-strong: #7a8799;
    --overlay: rgba(15, 23, 42, 0.55);
    --shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
    --shadow-lg: 0 25px 50px -12px rgba(15, 23, 42, 0.35);
    --focus-ring: #1d4ed8;
    --subtle-bg: rgba(226, 232, 240, 0.6);
    --hover-tint: rgba(15, 23, 42, 0.08);

    --ok-bg: #dcfce7;   --ok-fg: #166534;
    --warn-bg: #fef3c7; --warn-fg: #92400e;
    --err-bg: #fee2e2;  --err-fg: #991b1b;
    --info-bg: #dbeafe; --info-fg: #1e40af;
}

/* ---- Kolory firmowe: domyślne (platform-theme.js nadpisuje je kolorami klienta) ----
   --*-color   = kolor na TLE (przyciski, paski, kropki); tekst na nim: --on-*
   --*-text    = ten sam kolor jako TEKST lub obramowanie tekstu (JS dobiera czytelny wariant)
   Wartości --*-text i --on-* poniżej to tylko zapas na czas przed uruchomieniem skryptu. */
:root {
    --primary-color: #00AEEF;
    --secondary-color: #B364A4;
    --accent-color: #E91E8C;
    --primary-text: var(--primary-color);
    --secondary-text: var(--secondary-color);
    --accent-text: var(--accent-color);
    --on-primary: #0f172a;
    --on-secondary: #0f172a;
    --on-accent: #0f172a;
}

/* ---- Kolory stref na planie sali (M-21-UI): 6 stałych, nazwanych kolorów, NIEZALEŻNYCH od koloru firmowego i motywu.
   Te same wartości co DRAWING_COLORS w core/apps/pdf (plan na ekranie = plan w PDF). Zapisany klucz strefy (primary…danger) się nie zmienia. */
:root {
    --zone-blue: #00AEEF;     /* primary   „Niebieski” */
    --zone-purple: #B364A4;   /* secondary „Fioletowy” */
    --zone-pink: #E91E8C;     /* accent    „Różowy” */
    --zone-green: #15803d;    /* success   „Zielony” */
    --zone-yellow: #f59e0b;   /* warning   „Żółty” */
    --zone-red: #b91c1c;      /* danger    „Czerwony” */
}

/* ---- Baza ---- */
html { -webkit-text-size-adjust: 100%; }
body { font-size: 14px; line-height: 1.5; }   /* tekst bazowy ≥ 14 px */

::placeholder { color: var(--text-placeholder); opacity: 1; }

:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg-surface); }
::-webkit-scrollbar-thumb { background: var(--bg-surface-alt); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--bg-surface-hover); }

/* Pola formularzy: 16 px na telefonie (iPhone nie powiększa wtedy strony) */
@media (max-width: 600px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]),
    select,
    textarea { font-size: 16px !important; }
}

/* ---- Komponenty bazowe ---- */
.apf-btn-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    background: var(--primary-color); color: var(--on-primary);
    border: none; border-radius: 10px; padding: 10px 20px;
    font: inherit; font-weight: 600; cursor: pointer;
}
.apf-btn-primary:hover { filter: brightness(1.1); }
@media (max-width: 768px) { .apf-btn-primary { min-height: 44px; } }

.apf-theme-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 38px; height: 38px; padding: 0 8px;
    background: var(--bg-surface-alt); color: var(--text-main);
    border: none; border-radius: 10px; cursor: pointer; font-size: 16px; line-height: 1;
}
.apf-theme-toggle:hover { background: var(--bg-surface-hover); }
@media (max-width: 768px) { .apf-theme-toggle { min-width: 44px; height: 44px; } }

/* Wybór motywu w Ustawieniach (3 opcje) */
.apf-theme-choice { display: flex; gap: 10px; flex-wrap: wrap; }
.apf-theme-choice label {
    display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px;
    background: var(--bg-surface); color: var(--text-main);
    border: 1px solid var(--border-strong); border-radius: 10px; cursor: pointer;
}
.apf-theme-choice input { width: 18px; height: 18px; accent-color: var(--primary-color); }
.apf-theme-choice label:has(input:checked) { border-color: var(--primary-text); box-shadow: 0 0 0 1px var(--primary-text); }
