/* ============================================================
   LIGHT MODE — poprawki kontrastu strony glownej (WCAG AA)
   2026-06-29. Ladowany PO css/lightmode.css.
   Akcent-tekst na jasnym tle: #c2003f (>=4.5:1 na cream).
   Akcent-tlo z bialym tekstem: #e8004f (zamiast jasnego #ff005c).
   Wszystko !important — lightmode.css uzywa !important.
   ============================================================ */

/* ---------- 1. KARTY USLUG (svc-card) ----------
   Tlo bylo "zablokowane" na #020202 przez TRWAJACA CSS-transition (fill=
   backwards) — patrz sekcja 18 (transition:none). Po jej wylaczeniu dziala
   zaplanowane jasne tlo #ece8e2 z lightmode.css, wiec tekst = CIEMNY. */
body.light-mode .svc-card{ border:1px solid rgba(0,0,0,.10) !important; }
body.light-mode .svc-card-title,
body.light-mode .svc-price{ color:#0a0909 !important; }
body.light-mode .svc-card-desc,
body.light-mode .svc-feat-item{ color:#3a3838 !important; }
body.light-mode .svc-cat{ color:#5a5757 !important; }
body.light-mode .svc-card-line{ background:rgba(0,0,0,.12) !important; }
html.html-light-mode body.light-mode .svc-link{ color:#c2003f !important; transition:none !important; }
html.html-light-mode body.light-mode .svc-link *{ color:#c2003f !important; }

/* ---------- 2. TOPNAV (pasek gorny) ---------- */
body.light-mode #topnav-links a.tnl{ color:#0a0909 !important; }
body.light-mode #topnav-links a.tnl.is-active{ color:#c2003f !important; }

/* ---------- 3. SZABLONY (tmpl-*) ---------- */
body.light-mode .tmpl-tab-btn{ color:#0a0909 !important; }
body.light-mode .tmpl-tab-btn.is-active,
body.light-mode .tmpl-tab-btn.is-active span,
body.light-mode #tmpl-wf-count,
body.light-mode #tmpl-sh-count{ color:#c2003f !important; }
body.light-mode .tmpl-card-trigger{ color:#c2003f !important; }
body.light-mode .tmpl-more-btn{ color:#0a0909 !important; }
body.light-mode .tmpl-plat-badge{ background:rgba(255,255,255,.94) !important; color:#0a0909 !important; }
body.light-mode .tmpl-cat-badge{ background:rgba(10,9,9,.72) !important; color:#ffffff !important; }
body.light-mode #stc-title{ color:#0a0909 !important; text-shadow:none !important; }
body.light-mode .tmpl-card-overlay{ background:rgba(10,9,9,.58) !important; }
body.light-mode .tmpl-card-overlay-label{ color:#ffffff !important; }

/* ---------- 4. FILTRY (realizacje / case-study / szablony) ---------- */
body.light-mode #realizacje-filters .filter-btn,
body.light-mode #cs-filters .filter-btn,
body.light-mode #tmpl-cat-filters .filter-btn,
body.light-mode #rl-show-more{ color:#4a4747 !important; }
body.light-mode #realizacje-filters .filter-btn.is-active,
body.light-mode #cs-filters .filter-btn.is-active,
body.light-mode #tmpl-cat-filters .filter-btn.is-active{
  background:#e8004f !important; color:#ffffff !important; border-color:#e8004f !important;
}
body.light-mode #realizacje-filters .filter-btn.is-active span,
body.light-mode #cs-filters .filter-btn.is-active span{ color:#ffffff !important; }

/* ---------- 5. CENNIK — zakladki / tagi / karty ---------- */
body.light-mode .pricing-tab-btn{ color:#4a4747 !important; }
body.light-mode .pricing-tab-btn.is-active{ color:#c2003f !important; }
body.light-mode .pc-tag.tech{ color:#c2003f !important; }
body.light-mode .pc-kalc-btn{ color:#c2003f !important; }
body.light-mode .pc-discount{ color:#4a4747 !important; }
body.light-mode .pc-price-row span,
body.light-mode .pc-feature.muted span,
body.light-mode .pc-feature.muted{ color:#4a4747 !important; }

/* ---------- 6. KALKULATOR STAWKI ---------- */
body.light-mode .pricing-calc-title{ color:#c2003f !important; }
body.light-mode .calc-type-btn .calc-type-name,
body.light-mode .calc-type-btn .calc-type-rate{ color:#4a4747 !important; }
body.light-mode .calc-type-btn.is-active .calc-type-name,
body.light-mode .calc-type-btn.is-active .calc-type-rate{ color:#0a0909 !important; }

/* ---------- 7. REALIZACJE / CASE-STUDY — tagi i triggery ---------- */
body.light-mode .ww-process-trigger{ color:#c2003f !important; }
body.light-mode .ww-proj-trigger{ color:#c2003f !important; }
body.light-mode .project-tag.tag-cat{ color:#c2003f !important; }
body.light-mode .bold-text-60,
body.light-mode .bold-text-57{ color:#c2003f !important; }

/* ---------- 8. SEKCJA "ZATRUDNIJ" / DOSTEPNOSC ---------- */
body.light-mode .hire-contact-link{ color:#0a0909 !important; }
body.light-mode .hire-contact-link.primary{ background:#e8004f !important; color:#ffffff !important; }
body.light-mode #avail-status-text{ color:#c2003f !important; }
body.light-mode #hire-availability a{ color:#c2003f !important; }

/* ---------- 9. SEKCJA VIDEO-TESTIMONIALS ---------- */
body.light-mode .vtest-cta-btn{ color:#0a0909 !important; }
body.light-mode .vtest-cta-btn.primary{ background:#e8004f !important; color:#ffffff !important; }

/* ---------- 10. POROWNYWARKA (compare tabs) ---------- */
body.light-mode #cmp-tab-www,
body.light-mode #cmp-tab-shop{ color:#0a0909 !important; }

/* ---------- 11. KOPIUJ E-MAIL / TOGGLE MOTYWU ---------- */
body.light-mode #ww-copy-email span{ color:#0a0909 !important; }
body.light-mode .theme-toggle-btn .toggle-label{ color:#0a0909 !important; }

/* ---------- 12. FAQ ---------- */
body.light-mode #Cena .faq-q,
body.light-mode #Cena .faq-q span,
body.light-mode .faq-q,
body.light-mode .faq-q span{ color:#1e1c1c !important; }

/* ---------- 13. HERO / NAGLOWKI z akcentem ---------- */
body.light-mode .text-white.red-text,
body.light-mode .red-text{ color:#c2003f !important; }
body.light-mode .text-span-27{ color:#c2003f !important; }
body.light-mode ._0_informacje-2{ color:#c2003f !important; }

/* ---------- 14. BANER COOKIES ---------- */
body.light-mode #cc p a{ color:#c2003f !important; }
body.light-mode #cc .cc-btn-accept{ color:#c2003f !important; }

/* ---------- 15. POPUP — link polityki (ciemniejsze tlo) ---------- */
body.light-mode .checkbox-label .link-7,
body.light-mode .link-7{ color:#a8003c !important; }

/* ---------- 16. SKIP-LINK (widoczny przy fokusie) ---------- */
body.light-mode #ww-skip{ color:#ffffff !important; }

/* ============================================================
   17. NADPISANIA WYSOKO-SPECYFICZNE (oporne moduly)
   svc-card uzywa background:var(--_theme---background) — zmienna
   nie flipuje sie dla tego elementu, wiec nadpisujemy ZMIENNA.
   ============================================================ */
html.html-light-mode body.light-mode div.svc-card{ border:1px solid rgba(0,0,0,.10) !important; }
html.html-light-mode body.light-mode .svc-card-title,
html.html-light-mode body.light-mode .svc-price{ color:#0a0909 !important; }
html.html-light-mode body.light-mode .svc-card-desc,
html.html-light-mode body.light-mode .svc-feat-item{ color:#3a3838 !important; }
html.html-light-mode body.light-mode .svc-cat{ color:#5a5757 !important; }

/* ============================================================
   18. WYLACZENIE TRWAJACYCH CSS-TRANSITION (na kolorach)
   Webflow ma transition na background/color/border z fill=backwards,
   ktore "zamrazaja" stara (ciemna) wartosc i nadpisuja nawet !important.
   Wylaczamy je w light mode -> kaskada (nasze kolory) dziala normalnie.
   ============================================================ */
html.html-light-mode body.light-mode .svc-card,
html.html-light-mode body.light-mode .vtest-cta-btn,
html.html-light-mode body.light-mode .vtest-cta-btn.primary,
html.html-light-mode body.light-mode #cs-filters .filter-btn,
html.html-light-mode body.light-mode .benefit-pill,
html.html-light-mode body.light-mode .benefit-num,
html.html-light-mode body.light-mode .benefit-summary-bar .benefit-pill{ transition:none !important; }

/* benefit bar — kolory po wylaczeniu transition */
html.html-light-mode body.light-mode .benefit-pill{ color:#0a0909 !important; }
html.html-light-mode body.light-mode .benefit-num{ color:#c2003f !important; }

/* video-testimonials CTA */
html.html-light-mode body.light-mode .vtest-cta-btn{ color:#0a0909 !important; }
html.html-light-mode body.light-mode .vtest-cta-btn.primary{ background:#e8004f !important; color:#ffffff !important; }

/* filtry case-study */
html.html-light-mode body.light-mode #cs-filters .filter-btn{ color:#4a4747 !important; }
html.html-light-mode body.light-mode #cs-filters .filter-btn.is-active,
html.html-light-mode body.light-mode #cs-filters .filter-btn.is-active span{
  background:#e8004f !important; color:#ffffff !important; border-color:#e8004f !important;
}

/* filtry realizacje/szablony — aktywny stan z bialym tekstem (jasny akcent #ff005c nie wystarcza) */
html.html-light-mode body.light-mode #realizacje-filters .filter-btn.is-active,
html.html-light-mode body.light-mode #realizacje-filters .filter-btn.is-active span,
html.html-light-mode body.light-mode #tmpl-cat-filters .filter-btn.is-active{
  background:#e8004f !important; color:#ffffff !important; border-color:#e8004f !important;
}