/**
 * ==============================================================================
 * TRÓJKA ELECTRONICS - MOTYW SKLEPU PRESTASHOP v3.3.8 (DARK TECH - pilot.com.pl)
 * ==============================================================================
 * Dedykowany arkusz stylów CSS dla PrestaShop 1.7 / 8 / 9 (Motyw Classic / Child Theme)
  * Wersja v4.2.0:
 * - Pełna unifikacja wizualna modułu RODO (psgdpr): usunięcie podkreśleń linków, spójne białe nagłówki i czcionki
 * - Responsywność przycisków "Pobierz moje dane" (PDF / CSV) na mobile - eliminacja wychodzenia poza ramkę
 * - Eliminacja mignięcia białych pól (skeleton loader SVG / ContentLoader) na stronie listy życzeń (blockwishlist/lists)
 * - Pełna implementacja Dark Tech dla podstron blockwishlist i modali
* Wersja v3.3.8:
 * - Całkowite usunięcie nieaktywnego przycisku "Powrót do góry" pod paginacją na mobile
 * - Oczyszczenie kodu ze zbędnych i nieużywanych definicji kolorów w :root
 * - Wyrazisty i czytelny numer aktywnej strony w paginacji (pełna widoczność, kontrast AAA)
 * - Dynamiczny licznik pozycji i automatyczny balanser kolumn katalogu (Bootstrap col-xl-4)
 * - Typografia: Montserrat (Google Fonts)
 * ==============================================================================
 */

/* Optymalizacja wydajności v4.1.9: Czcionka Montserrat ładowana bezpośrednio przez nieblokujące tagi <link> w head.tpl, co eliminuje opóźnienie łańcucha żądań @import w CSS */
/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap'); */

:root {
  --trojka-bg-main: #090d16;
  --trojka-bg-card: #0f172a;
  --trojka-bg-card-hover: #1e293b;
  --trojka-bg-darkest: #090d16;
  --trojka-bg-elevated: #162032;
  
  --trojka-border: #334155;
  --trojka-border-subtle: #1e293b;
  
  --trojka-primary: #38bdf8;
  --trojka-primary-hover: #0284c7;
  --trojka-primary-light: #7dd3fc;
  --trojka-primary-dark: #0369a1;
  --trojka-primary-darker: #0369a1;
  
  --trojka-gold: #fbbf24;
  --trojka-emerald-light: #34d399;
  
  --trojka-text-main: #f8fafc;
  --trojka-text-muted: #cbd5e1; /* Bardzo czytelny, jasny odcień - identyczny jak CAME / SOMFY */
  --trojka-text-dim: #94a3b8;   /* Zwiększona jasność dla elementów drugorzędnych */
  --trojka-radius: 12px;
  --trojka-radius-sm: 8px;
}

/* --------------------------------------------------------------------------
   1. GLOBALNE TŁO I TYPOGRAFIA (ELIMINACJA BIAŁEGO BODY I TŁA STRONY)
   -------------------------------------------------------------------------- */
html,
body,
#page,
#wrapper,
section#wrapper,
main,
#content-wrapper,
#main,
#content,
section#content,
section.page_content,
.page-content,
.bg-white,
.bg-light,
#footer,
.footer-container,
footer#footer {
  background-color: var(--trojka-bg-main, #090d16) !important;
  background: var(--trojka-bg-main, #090d16) !important;
  color: var(--trojka-text-main) !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

#wrapper {
  background-color: var(--trojka-bg-main) !important;
  background-image: none !important;
  box-shadow: none !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
}

p, span, label, li, dt, dd {
  color: var(--trojka-text-muted);
}

strong, b {
  color: #ffffff !important;
}

/* ==========================================================================
   GLOBALNE USUNIĘCIE SYSTEMOWYCH RAMEK / OBWÓDEK PO KLIKNIĘCIU (FOCUS / ACTIVE)
   Eliminuje brzydkie białe ramki wokół linków, napisów, ikon i przycisków na całej stronie
   ========================================================================== */
*,
*::before,
*::after {
  -webkit-tap-highlight-color: transparent !important;
}

*:focus,
*:focus-visible,
*:active {
  outline: none !important;
  outline-style: none !important;
  outline-width: 0 !important;
}

a,
a:hover,
a:focus,
a:focus-visible,
a:active,
button,
button:focus,
button:focus-visible,
button:active,
.btn,
.btn:focus,
.btn:focus-visible,
.btn:active,
.header-nav a,
.header-nav a:focus,
.header-nav a:focus-visible,
.header-nav a:active,
.user-info a,
.user-info a:focus,
.user-info a:focus-visible,
.user-info a:active,
.top-menu a,
.top-menu a:focus,
.top-menu a:active,
.dropdown-item,
.dropdown-item:focus,
.dropdown-item:active,
.nav-link,
.nav-link:focus,
.nav-link:active {
  outline: none !important;
  outline-style: none !important;
  outline-width: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Przyjemne, nowoczesne zachowanie po naciśnięciu (subtelny fade zamiast twardej ramki) */
a:active,
button:active,
.btn:active {
  opacity: 0.85;
}

a {
  color: var(--trojka-primary-light);
  text-decoration: none !important;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

a:hover {
  color: #ffffff;
  text-decoration: none !important;
}

a:focus,
a:focus-visible,
a:active {
  color: var(--trojka-primary-light);
  text-decoration: none !important;
  outline: none !important;
}

hr {
  border-color: var(--trojka-border-subtle) !important;
}

/* --------------------------------------------------------------------------
   2. GÓRNY PASEK I NAGŁÓWEK SKLEPU (HEADER, TOP NAV, WYSZUKIWARKA)
   -------------------------------------------------------------------------- */
#header {
  background: var(--trojka-bg-darkest) !important;
  border-bottom: 1px solid var(--trojka-border-subtle);
  position: sticky;
  top: 0;
  z-index: 999;
}

.header-banner {
  background: var(--trojka-bg-darkest) !important;
}

.header-nav {
  background: rgba(9, 13, 22, 0.98) !important;
  border-bottom: 1px solid var(--trojka-border-subtle) !important;
  color: var(--trojka-text-muted) !important;
  font-size: 12px;
  padding: 8px 0;
}

.header-nav .right-nav,
.header-nav .left-nav {
  display: flex;
  align-items: center;
}

.header-nav a,
.header-nav .user-info a {
  color: var(--trojka-text-muted) !important;
}

.header-nav a:hover,
.header-nav .user-info a:hover {
  color: var(--trojka-primary-light) !important;
}

.header-nav .contact-link a,
.header-nav a[href^="tel:"] {
  color: var(--trojka-primary-light) !important;
  font-weight: 600;
}

.header-top {
  background: rgba(15, 23, 42, 0.98) !important;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--trojka-border-subtle);
}

#header .logo {
  max-height: 48px;
  filter: drop-shadow(0 2px 8px rgba(0, 234, 253, 0.25));
}

/* Wyszukiwarka produktów PrestaShop (Search Widget) - wyrównanie do prawej strony (zrównanie z prawą krawędzią 3. produktu) */
#_desktop_search_widget,
#search_widget,
.search-widgets,
.search-widget,
#header #_desktop_search_widget,
#header #search_widget,
.header-top #_desktop_search_widget,
.header-top #search_widget {
  position: relative !important;
  min-width: 280px !important;
  width: 320px !important;
  max-width: 380px !important;
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  vertical-align: middle !important;
  float: none !important;
  margin: 0 !important;
  margin-left: auto !important; /* Wyrównanie do prawej krawędzi: zrównanie z prawą krawędzią 3. produktu */
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  top: 0 !important;
  bottom: auto !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  box-sizing: border-box !important;
}

#search_widget form,
.search-widgets form,
.search-widget form,
#_desktop_search_widget form {
  display: flex !important;
  align-items: center !important;
  align-self: center !important;
  position: relative !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  box-sizing: border-box !important;
}

/* Lupka - ikona wyszukiwania (zarówno <i> jak i <button>) umieszczona precyzyjnie z lewej */
#search_widget .material-icons.search,
#search_widget i.search,
#search_widget i.material-icons:not(.clear),
.search-widgets .material-icons.search,
.search-widgets i.search,
.search-widgets i.material-icons:not(.clear),
.search-widget .material-icons.search,
.search-widget i.search,
#search_widget button[type="submit"],
.search-widgets button[type="submit"] {
  position: absolute !important;
  left: 14px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 21px !important;
  width: 22px !important;
  height: 22px !important;
  line-height: 22px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 4 !important;
  cursor: pointer !important;
}

/* Pole tekstowe wyszukiwarki: wysokość 40px idealnie dopasowana do klawisza OBUDOWY I AKCESORIA */
#search_widget input[type="text"],
.search-widgets form input[type="text"],
.search-widget form input[type="text"],
.header-top .search-widget form input[type="text"],
.header-top .search-widgets form input[type="text"],
#search_widget input[name="s"],
.search-widgets input[name="s"],
.search-widget input[name="s"],
input[name="s"] {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  color: #ffffff !important;
  padding: 0 42px 0 48px !important; /* 48px z lewej: lupka kończy się na 36px, co daje 12px czystego odstępu */
  font-size: 13.5px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  line-height: 38px !important;
  width: 100% !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

#search_widget input[type="text"]:focus,
.search-widget form input[type="text"]:focus,
.header-top .search-widgets form input[type="text"]:focus,
#search_widget input[name="s"]:focus {
  background: var(--trojka-bg-darkest) !important;
  border-color: var(--trojka-primary) !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.22) !important;
  outline: none !important;
  color: #ffffff !important;
}

#search_widget input::placeholder,
.search-widgets input::placeholder,
.search-widget input::placeholder,
input[name="s"]::placeholder {
  color: var(--trojka-text-muted) !important;
  opacity: 0.9 !important;
  font-size: 13.5px !important;
}

/* Ikona czyszczenia (clear / krzyżyk) - ukryta zgodnie z zaleceniem */
#search_widget .material-icons.clear,
#search_widget i.clear,
.search-widgets .material-icons.clear,
.search-widgets i.clear {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
}

#search_widget .material-icons.clear:hover,
.search-widgets .material-icons.clear:hover {
  color: #ffffff !important;
}

/* ==========================================================================
   2.1. AUTOCOMPLETE / WYNIKI WYSZUKIWARKI DYNAMICZNEJ (PO WPISANIU MODELU)
   Wyczerpująca definicja dla ps_searchbar, jQuery UI autocomplete i modułów wyszukiwania.
   Zapewnia 100% czytelności tekstu, modelu, kodu towaru, ceny i podświetlenia.
   ========================================================================== */
.ui-autocomplete,
ul.ui-autocomplete,
#search_widget .ui-autocomplete,
.search-widgets .ui-autocomplete,
.search-widget .ui-autocomplete,
.ui-menu.ui-widget-content,
.ui-front.ui-autocomplete,
.search-dropdown,
.search-results,
.autocomplete-suggestions {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.85), 0 0 25px rgba(56, 189, 248, 0.2) !important;
  padding: 6px 0 !important;
  margin-top: 6px !important;
  min-width: 280px !important;
  max-width: calc(100vw - 32px) !important;
  max-height: 480px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  z-index: 99999 !important;
  list-style: none !important;
}

/* Wiersz pojedynczego wyniku wyszukiwania - ZAWSZE STABILNY (zero skakania) */
.ui-autocomplete .ui-menu-item,
ul.ui-autocomplete li,
.ui-autocomplete li.ui-menu-item,
.ui-menu .ui-menu-item,
.search-dropdown .search-item,
.autocomplete-suggestion {
  display: block !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: transparent !important;
  background-color: transparent !important;
  cursor: pointer !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  width: 100% !important;
}

/* Wiersz LI nie zmienia rozmiaru ani marginesów ani paddingu na hover/active */
.ui-autocomplete .ui-menu-item:hover,
ul.ui-autocomplete li:hover,
.ui-autocomplete li.ui-menu-item:hover,
.ui-menu .ui-menu-item:hover,
.ui-autocomplete .ui-menu-item.ui-state-focus,
.ui-autocomplete .ui-menu-item.ui-state-active {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

.ui-autocomplete .ui-menu-item:last-child,
ul.ui-autocomplete li:last-child {
  border-bottom: none !important;
}

/* Link / wrapper pozycji w menu wyników */
.ui-autocomplete .ui-menu-item a,
.ui-autocomplete .ui-menu-item-wrapper,
.ui-autocomplete a.ui-corner-all,
.ui-menu .ui-menu-item-wrapper,
.ui-menu-item-wrapper,
.search-dropdown .search-item-link,
.autocomplete-suggestion-link {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 16px !important;
  color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-radius: 0 !important;
  margin: 0 !important;
  text-decoration: none !important;
  font-size: 13.5px !important;
  line-height: 1.35 !important;
  width: 100% !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color 0.12s ease, color 0.12s ease !important;
}

/* Miniatura produktu w wynikach wyszukiwania */
.ui-autocomplete .ui-menu-item img,
.ui-autocomplete img,
.search-dropdown img {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  object-fit: contain !important;
  background: #ffffff !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: 6px !important;
  padding: 2px !important;
  margin: 0 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  transform: none !important;
  transition: none !important;
}

/* Nazwa i model produktu w wynikach */
.ui-autocomplete .ui-menu-item .product,
.ui-autocomplete .ui-menu-item .product-name,
.ui-autocomplete .ui-menu-item .name,
.ui-autocomplete .ui-menu-item span:not(.price):not(.reference),
.search-dropdown .product-name {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
  display: block !important;
  flex: 1 !important;
  transition: color 0.12s ease !important;
}

/* Podświetlenie wpisanego ciągu znaków / modelu (np. RC, BN59, PILOT) */
.ui-autocomplete strong,
.ui-autocomplete b,
.ui-autocomplete mark,
.ui-autocomplete .highlight,
.ui-autocomplete .ui-menu-item strong,
.ui-autocomplete .ui-menu-item b {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  font-weight: 800 !important;
  background: transparent !important;
  text-shadow: 0 0 10px rgba(56, 189, 248, 0.45) !important;
}

/* Oznaczenie symbolu / numeru katalogowego / kategorii */
.ui-autocomplete .reference,
.ui-autocomplete .product-reference,
.ui-autocomplete .cat,
.ui-autocomplete .category {
  color: #94a3b8 !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  display: block !important;
  margin-top: 2px !important;
}

/* Cena produktu w wynikach wyszukiwania */
.ui-autocomplete .price,
.ui-autocomplete .product-price,
.search-dropdown .price {
  color: var(--trojka-gold, #fbbf24) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  white-space: nowrap !important;
  margin-left: auto !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6) !important;
}

/* Stan aktywny / zaznaczony (Hover / Focus / Strzałki) - ZMIANA JEDYNIE KOLORU NA JASNY NIEBIESKI, ZERO SKAKANIA */
.ui-autocomplete .ui-menu-item-wrapper:hover,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-focus,
.ui-autocomplete .ui-menu-item a:hover,
.ui-autocomplete .ui-menu-item a.ui-state-active,
.ui-autocomplete a.ui-corner-all:hover,
.ui-autocomplete a.ui-state-active,
.ui-autocomplete a.ui-state-focus,
.ui-autocomplete .ui-state-active,
.ui-autocomplete .ui-state-focus,
.ui-menu .ui-menu-item-wrapper:hover,
.ui-menu .ui-menu-item-wrapper.ui-state-active,
.ui-menu .ui-menu-item-wrapper.ui-state-focus,
.ui-menu a.ui-state-active,
.ui-menu a.ui-state-focus {
  /* Kolor tła: JASNY NIEBIESKI */
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  background-color: #0284c7 !important;
  color: #ffffff !important;

  /* Rygorystycznie identyczne wymiary jak stan spoczynku – ABSOLUTNY BRAK SKAKANIA */
  padding: 10px 16px !important;
  margin: 0 !important;
  border: none !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-radius: 0 !important;
  outline: none !important;
  outline-width: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  text-decoration: none !important;
}

/* Kolor tekstu nazwy produktu na jasnoniebieskim aktywnym tle: czysty biały */
.ui-autocomplete .ui-menu-item-wrapper:hover .product,
.ui-autocomplete .ui-menu-item-wrapper:hover .product-name,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active .product,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active .product-name,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-focus .product,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-focus .product-name,
.ui-autocomplete .ui-menu-item-wrapper:hover span,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active span {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* Wpisane wyszukiwane frazy (np. RC, PILOT) na aktywnym tle */
.ui-autocomplete .ui-menu-item-wrapper:hover strong,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active strong,
.ui-autocomplete .ui-menu-item-wrapper:hover b,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active b,
.ui-autocomplete .ui-menu-item-wrapper:hover mark,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active mark {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-shadow: none !important;
}

/* Oznaczenie referencji / kategorii na aktywnym tle */
.ui-autocomplete .ui-menu-item-wrapper:hover .reference,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active .reference,
.ui-autocomplete .ui-menu-item-wrapper:hover .cat,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active .cat {
  color: #e0f2fe !important;
}

/* Cena produktu na aktywnym tle: bardzo jasny złocisty */
.ui-autocomplete .ui-menu-item-wrapper:hover .price,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active .price,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-focus .price {
  color: #fef08a !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Informacja o braku wyników w okienku wyszukiwania */
.ui-autocomplete .no-results,
.ui-autocomplete .empty-result,
.search-dropdown .no-results {
  padding: 14px 18px !important;
  color: #cbd5e1 !important;
  font-size: 13px !important;
  text-align: center !important;
}

/* Klawisz "Pokaż wszystkie wyniki" na dole listy */
.ui-autocomplete .all-results,
.ui-autocomplete .view-all,
.ui-autocomplete .search-all {
  display: block !important;
  padding: 12px 16px !important;
  background: rgba(56, 189, 248, 0.08) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-align: center !important;
  text-decoration: none !important;
  border-top: 1px solid var(--trojka-border, #334155) !important;
  transition: all 0.2s ease !important;
}

.ui-autocomplete .all-results:hover,
.ui-autocomplete .view-all:hover {
  background: var(--trojka-primary, #38bdf8) !important;
  color: #020617 !important;
}

/* Czytelne nagłówki i treść na podstronie wyników wyszukiwania (body#search) */
#search .page-header h1,
body#search h1,
body#search .search-results-title,
.search-results-count {
  color: #ffffff !important;
}

body#search #content.page-content p,
body#search .page-not-found p,
body#search .page-not-found {
  color: #e2e8f0 !important;
  font-size: 15px !important;
}

/* Koszyk w nagłówku (#_desktop_cart) */
#_desktop_cart .blockcart,
.blockcart {
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  background: var(--trojka-primary-dark, #0284c7) !important;
  border: 1px solid rgba(56, 189, 248, 0.4) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 10px 16px !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.25);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

#_desktop_cart .blockcart:hover,
.blockcart:hover {
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  background: var(--trojka-primary-darker, #0369a1) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(2, 132, 199, 0.4);
}

#_desktop_cart .blockcart a,
.blockcart a {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.blockcart .cart-products-count {
  background: var(--trojka-gold) !important;
  color: #000000 !important;
  font-weight: 800 !important;
  font-size: 11px !important;
  border-radius: 9999px !important;
  padding: 2px 7px !important;
  min-width: 20px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

/* --------------------------------------------------------------------------
   3. MENU GŁÓWNE I ROZWIJANE KATEGORIE (TOP NAVIGATION & POPOVER SUBMENU)
   -------------------------------------------------------------------------- */
/* KROK 1: Jednolite tlo pod Logo i Menu (#0f172a / bez odciecia tlem czarnym i ramka) */
.header-top .container > .row,
.header-top .row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

.header-top-right,
#header .header-top-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  margin-left: auto !important;
}

.top-menu,
#_desktop_top_menu,
.menu.js-top-menu,
#header .top-menu,
#header #_desktop_top_menu,
#header .menu.js-top-menu,
#header .container,
#header .header-top .container,
#header .header-nav .container,
.header-top .container,
.header-nav .container {
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: none !important;
  margin-bottom: 0 !important;
}

/* --------------------------------------------------------------------------
   KLAWISZE MENU GŁÓWNEGO (Piloty RTV, Piloty do bram, Obudowy i akcesoria)
   Forma przycisków / pigułek z ramką, hoverem oraz jasnoniebieskim tłem i białą czcionką na aktywnej stronie
   -------------------------------------------------------------------------- */
#_desktop_top_menu,
#header #_desktop_top_menu {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

#_desktop_top_menu .top-menu[data-depth="0"] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#_desktop_top_menu .top-menu[data-depth="0"] > li {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

/* Stan spoczynku: Ciemny klawisz z ramką i białym napisem - wysokość 40px zrównana z wyszukiwarką */
#header .top-menu .category > a,
#header .top-menu a[data-depth="0"],
.top-menu .category > a,
.top-menu a[data-depth="0"] {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-top: 1px solid #334155 !important;
  border-right: 1px solid #334155 !important;
  border-bottom: 1px solid #334155 !important;
  border-left: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  line-height: 38px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 18px !important;
  margin: 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Hover: Rozjaśnienie, idealnie 1px błękitna ramka bez pogrubienia i bez skakania */
#header .top-menu .category > a:hover,
#header .top-menu a[data-depth="0"]:hover,
.top-menu .category > a:hover,
.top-menu a[data-depth="0"]:hover,
#header .top-menu a[data-depth="0"]:focus,
.top-menu a[data-depth="0"]:focus {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #1e293b !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Active / Kliknięcie klawisza menu (bez zmniejszania i bez drgania) */
#header .top-menu .category > a:active,
#header .top-menu a[data-depth="0"]:active,
.top-menu .category > a:active,
.top-menu a[data-depth="0"]:active {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #0f172a !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* AKTYWNA STRONA / KATEGORIA: JASNY NIEBIESKI (#38bdf8 / #0284c7) Z BIAŁĄ CZCIONKĄ (#ffffff) */
#header .top-menu li.current > a,
#header .top-menu li.active-parent > a,
#header .top-menu a[data-depth="0"].active,
.top-menu li.current > a,
.top-menu li.active-parent > a,
.top-menu a[data-depth="0"].active,
.top-menu a[aria-current="page"],
.menu.js-top-menu li.current > a,
.menu.js-top-menu a.active {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  cursor: default !important;
}

.top-menu a:focus,
.top-menu a:active {
  outline: none !important;
  box-shadow: none !important;
}

/* Całkowite usunięcie wyskakującego okna podkategorii (mega menu) po najechaniu myszką na pozycje menu górnego (np. PILOTY RTV) */
#_desktop_top_menu .sub-menu,
#_desktop_top_menu .popover.sub-menu,
#_desktop_top_menu .top-menu[data-depth="0"] li:hover .sub-menu,
#_desktop_top_menu .top-menu[data-depth="0"] li .sub-menu {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Rozwijane mega menu marek/kategorii (eliminacja białego tła popover) */
.top-menu .sub-menu,
.popover.sub-menu,
.popover,
.dropdown-menu {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.8) !important;
  color: var(--trojka-text-main) !important;
}

.top-menu .sub-menu ul,
.top-menu .sub-menu li {
  background: transparent !important;
}

.top-menu .sub-menu a,
.dropdown-item {
  color: var(--trojka-text-muted) !important;
  background: transparent !important;
}

.top-menu .sub-menu a:hover,
.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--trojka-primary-light) !important;
  background: rgba(56, 189, 248, 0.1) !important;
}

/* ==========================================================================
   WIDOK MOBILNY: CAŁKOWITE USUNIĘCIE NADMIAROWYCH STRZAŁEK Z KLAWISZY MENU
   (Klawisz PILOTY RTV, OBUDOWY I AKCESORIA oraz wszystkie pozostałe pozycje)
   ========================================================================== */

/* 1. Tło i obramowanie panelu menu mobilnego */
#mobile_top_menu_wrapper,
#mobile_top_menu_wrapper .top-menu,
#mobile_top_menu_wrapper .top-menu .sub-menu,
.js-top-menu.mobile {
  background: var(--trojka-bg-card, #0f172a) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  border-color: var(--trojka-border, #334155) !important;
}

/* 2. CAŁKOWITE USUNIĘCIE STRZAŁEK (expand_more, collapse-icons, arrows, float-xs-right) Z KLAWISZY */
#mobile_top_menu_wrapper .top-menu .float-xs-right,
#mobile_top_menu_wrapper .top-menu .navbar-toggler,
#mobile_top_menu_wrapper .top-menu .collapse-icons,
#mobile_top_menu_wrapper .top-menu .arrows,
#mobile_top_menu_wrapper .top-menu i.material-icons,
#mobile_top_menu_wrapper .top-menu i.add,
#mobile_top_menu_wrapper .top-menu i.remove,
#mobile_top_menu_wrapper .top-menu a .float-xs-right,
#mobile_top_menu_wrapper .top-menu a .navbar-toggler,
#mobile_top_menu_wrapper .top-menu a .collapse-icons,
#mobile_top_menu_wrapper .top-menu a .arrows,
#mobile_top_menu_wrapper .top-menu a i.material-icons,
#mobile_top_menu_wrapper .top-menu a i,
#_mobile_top_menu .float-xs-right,
#_mobile_top_menu .navbar-toggler,
#_mobile_top_menu .collapse-icons,
#_mobile_top_menu .arrows,
#_mobile_top_menu i.material-icons,
#_mobile_top_menu a i.material-icons,
.js-top-menu.mobile .float-xs-right,
.js-top-menu.mobile .navbar-toggler,
.js-top-menu.mobile .collapse-icons,
.js-top-menu.mobile .arrows,
.js-top-menu.mobile i.material-icons,
.top-menu a .float-xs-right,
.top-menu a .navbar-toggler,
.top-menu a .collapse-icons,
.top-menu a .arrows,
.top-menu a i.material-icons,
.top-menu a i,
.top-menu a::after,
.top-menu a:after,
.top-menu .dropdown-item::after,
.top-menu .dropdown-toggle::after {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
  pointer-events: none !important;
}

/* 3. Wyłączenie rozwijanych podkategorii (sub-menu) w mobilnym menu - klawisze są bezpośrednimi odnośnikami */
#mobile_top_menu_wrapper .top-menu .sub-menu,
#mobile_top_menu_wrapper .top-menu .popover.sub-menu,
#mobile_top_menu_wrapper .top-menu .collapse,
#_mobile_top_menu .sub-menu,
.js-top-menu.mobile .sub-menu {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
}

/* 4. Perfekcyjne formatowanie klawiszy w menu mobilnym */
#mobile_top_menu_wrapper .top-menu > li,
#_mobile_top_menu .top-menu > li,
.js-top-menu.mobile .top-menu > li {
  list-style: none !important;
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

#mobile_top_menu_wrapper .top-menu a,
#mobile_top_menu_wrapper .top-menu a[data-depth="0"],
#_mobile_top_menu .top-menu a,
#_mobile_top_menu .top-menu a[data-depth="0"],
.js-top-menu.mobile .top-menu a,
.js-top-menu.mobile .top-menu a[data-depth="0"] {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  line-height: 40px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
}

/* Aktywny klawisz w menu mobilnym (np. PILOTY RTV na podstronie /3-piloty-rtv) */
#mobile_top_menu_wrapper .top-menu li.current > a,
#mobile_top_menu_wrapper .top-menu li.active-parent > a,
#mobile_top_menu_wrapper .top-menu a.active,
#mobile_top_menu_wrapper .top-menu a[data-depth="0"].active,
#_mobile_top_menu .top-menu li.current > a,
#_mobile_top_menu .top-menu a.active,
.js-top-menu.mobile .top-menu li.current > a,
.js-top-menu.mobile .top-menu a.active {
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
}

#mobile_top_menu_wrapper a {
  color: var(--trojka-text-main) !important;
}

/* --------------------------------------------------------------------------
   4. BREADCRUMB (ŚCIEŻKA POWROTU)
   -------------------------------------------------------------------------- */
.breadcrumb {
  background: transparent !important;
  padding: 14px 0 !important;
  font-size: 12px !important;
}

/* Ukrycie paska breadcrumb na stronach CMS (spójność z widokiem głównym sklepu) */
body#cms .breadcrumb,
body#cms #wrapper .breadcrumb {
  display: none !important;
}

.breadcrumb ol,
.breadcrumb li {
  background: transparent !important;
}

.breadcrumb ol li a,
.breadcrumb li a,
.breadcrumb a {
  color: var(--trojka-text-muted) !important;
}

.breadcrumb ol li a:hover,
.breadcrumb a:hover {
  color: var(--trojka-primary-light) !important;
}

.breadcrumb ol li:last-child span,
.breadcrumb li:last-child {
  color: #ffffff !important;
  font-weight: 600;
}

.breadcrumb ol li::after,
.breadcrumb li::after {
  color: var(--trojka-border) !important;
}

/* --------------------------------------------------------------------------
   5. SIATKA, KAFELKI PRODUKTÓW I OPISY (.product-miniature - RÓWNA WYSOKOŚĆ, ODSTĘPY I SERDUSZKO)
   -------------------------------------------------------------------------- */
/* Siatka produktów - flex z równymi kolumnami i wyraźnymi przerwami zapobiegającymi sklejaniu */
#js-product-list .products.row,
.products.row {
  display: flex !important;
  flex-wrap: wrap !important;
  row-gap: 32px !important;
  margin-left: -14px !important;
  margin-right: -14px !important;
}

.products .product,
.js-product.product,
#js-product-list .product {
  display: flex !important;
  flex-direction: column !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  margin-bottom: 32px !important; /* Wyraźny odstęp pionowy eliminujący sklejanie się górnych i dolnych okien */
  box-sizing: border-box !important;
}

/* Karta miniatury produktu - pełna równa wysokość, zero skakania i stała 1px ramka */
.products .product-miniature,
.product-miniature,
.js-product-miniature {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-top: 1px solid var(--trojka-border) !important;
  border-right: 1px solid var(--trojka-border) !important;
  border-bottom: 1px solid var(--trojka-border) !important;
  border-left: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  flex-grow: 1 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 440px !important; /* Zwiększona, jednolita wysokość okna miniatury */
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  box-shadow: none !important;
  outline: none !important;
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  margin-bottom: 0 !important;
  transform: none !important;
}

/* Hover na liście produktów po prawej stronie: 0px przesunięcia, brak translateY, idealnie 1px ramka bez złudzenia pogrubienia */
.products .product-miniature:hover,
.product-miniature:hover,
.js-product-miniature:hover {
  border: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-top: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-right: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-bottom: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-left: 1px solid var(--trojka-primary, #38bdf8) !important;
  transform: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: var(--trojka-bg-card-hover) !important;
}

/* Wewnętrzny kontener miniatury */
.product-miniature .thumbnail-container {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  flex-grow: 1 !important;
  height: 100% !important;
  width: 100% !important;
  margin-bottom: 0 !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  position: relative !important;
}

/* Okno ze zdjęciem pilota - wyższe, wycentrowane z czystym tłem */
.product-miniature .thumbnail-top {
  position: relative !important;
  background: #ffffff !important; /* Czyste tło pod zdjęciem pilota */
  border-radius: var(--trojka-radius-sm, 8px) !important;
  padding: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 270px !important; /* Zwiększona wysokość okna ze zdjęciem */
  height: 270px !important;
  border: 1px solid var(--trojka-border-subtle, rgba(255, 255, 255, 0.08)) !important;
  margin-bottom: 14px !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.product-miniature .thumbnail-top a.product-thumbnail,
.product-miniature .thumbnail.product-thumbnail {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.product-miniature .thumbnail-top img,
.product-miniature .product-thumbnail img {
  border-radius: var(--trojka-radius-sm, 6px);
  max-height: 246px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  margin: auto !important;
  transition: none !important;
  transform: none !important;
  background: transparent !important;
}

.product-miniature:hover .thumbnail-top img,
.product-miniature:hover .product-thumbnail img {
  transform: none !important;
}

/* ==========================================================================
   PRZYCISK SERDUSZKA (LISTA ŻYCZEŃ / BLOCKWISHLIST) W PRAWYM GÓRNYM ROGU MINIATURY
   Spójny z kolorystyką Trójka Electronics (Dark Tech / Cyber Cyan)
   ========================================================================== */
.wishlist-button-add,
.products article .wishlist-button-add,
.product-miniature .wishlist-button-add,
button.wishlist-button-add,
div.wishlist-button button {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  background: rgba(11, 19, 43, 0.92) !important; /* Ciemny granat dopasowany do motywu Trójka */
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.5) !important; /* Subtelna ramka Cyber Cyan */
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45), 0 0 10px rgba(56, 189, 248, 0.2) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 10 !important;
  outline: none !important;
}

/* Ikona serduszka wewnątrz przycisku */
.wishlist-button-add i,
.products article .wishlist-button-add i,
.product-miniature .wishlist-button-add i,
button.wishlist-button-add i,
div.wishlist-button button i {
  color: var(--trojka-primary, #38bdf8) !important; /* Cyber Cyan serduszko */
  font-size: 20px !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
}

/* Stan najechania myszą (Hover) - stabilna pozycja bez skakania i bez aury */
.wishlist-button-add:hover,
.products article .wishlist-button-add:hover,
.product-miniature .wishlist-button-add:hover,
button.wishlist-button-add:hover,
div.wishlist-button button:hover {
  background: var(--trojka-primary, #38bdf8) !important;
  border-color: #38bdf8 !important;
  transform: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

.wishlist-button-add:hover i,
.products article .wishlist-button-add:hover i,
.product-miniature .wishlist-button-add:hover i,
button.wishlist-button-add:hover i,
div.wishlist-button button:hover i {
  color: #020617 !important; /* Ciemny kontrast wewnątrz świecącego cyjanu */
}

/* Stan aktywny / kliknięty (dodany do listy życzeń) */
.wishlist-button-add:active,
.wishlist-button-add.wishlist-button-active,
.wishlist-button-add.active,
.wishlist-button-add.has-wishlist,
.product-miniature .wishlist-button-add.wishlist-button-active,
.wishlist-button-product.wishlist-button-active,
.wishlist-button-product.active {
  transform: none !important;
  background: rgba(244, 63, 94, 0.18) !important;
  border-color: #f43f5e !important;
  box-shadow: none !important;
}

.wishlist-button-add.wishlist-button-active i,
.wishlist-button-add.active i,
.wishlist-button-add.has-wishlist i,
.wishlist-button-product.wishlist-button-active i,
.wishlist-button-product.active i {
  color: #f43f5e !important;
}

/* Przycisk listy życzeń na karcie produktu */
.wishlist-button-product {
  background: rgba(11, 19, 43, 0.92) !important;
  border: 1px solid rgba(56, 189, 248, 0.5) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  transition: all 0.2s ease !important;
}

.wishlist-button-product:hover {
  background: var(--trojka-primary, #38bdf8) !important;
  color: #020617 !important;
  box-shadow: 0 0 16px rgba(56, 189, 248, 0.6) !important;
}

/* Tło pod opisem produktu (PrestaShop domyślnie wymuszało tu #fff) */
.product-miniature .product-description,
.product-description {
  background-color: transparent !important;
  background: transparent !important;
  color: var(--trojka-text-muted) !important;
  padding: 8px 4px 4px 4px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  flex-grow: 1 !important;
  margin-top: auto !important;
  width: 100% !important;
  text-align: center !important;
}

.product-miniature:hover .product-description {
  background: transparent !important;
}

/* Pasek szybkiego podglądu (wysuwający się) */
.product-miniature .highlighted-informations,
.highlighted-informations {
  background-color: var(--trojka-bg-elevated) !important;
  background: var(--trojka-bg-elevated) !important;
  border-top: 1px solid var(--trojka-border-subtle) !important;
  color: var(--trojka-text-main) !important;
}

.product-miniature .highlighted-informations .quick-view {
  color: var(--trojka-primary-light) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.product-miniature .highlighted-informations .quick-view:hover {
  color: #ffffff !important;
  transform: none !important;
  box-shadow: none !important;
}

.product-miniature .variant-links,
.variant-links {
  background: transparent !important;
}

/* Nazwa i symbol produktu - stała rezerwa wysokości eliminująca różnice wysokości miniatur */
.product-title,
.product-title a,
.product-miniature .product-title,
.product-miniature .product-title a {
  text-decoration: none !important;
  border-bottom: none !important;
}

.product-miniature .product-title,
.product-title {
  min-height: 52px !important; /* Gwarantowana stała wysokość na 2-3 linijki tytułu */
  height: 52px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 0 0 6px 0 !important;
  padding: 0 4px !important;
  width: 100% !important;
}

.product-title a,
.product-miniature .product-title a {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-align: center !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
  transition: color 0.15s ease !important;
}

.product-title a:hover,
.product-miniature .product-title a:hover {
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

.product-title a:active,
.product-title a:focus,
.product-title a.active,
.product-miniature .product-title a:active {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* Ceny */
.product-price-and-shipping {
  margin-top: 10px !important;
}

.product-price-and-shipping .price,
.current-price .current-price-value,
.product-price {
  color: var(--trojka-primary) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.product-price-and-shipping .regular-price,
.regular-price {
  color: var(--trojka-text-dim) !important;
  text-decoration: line-through !important;
  font-size: 13px !important;
  margin-right: 6px;
}

.product-price-and-shipping .discount-percentage,
.discount-percentage {
  background: rgba(239, 68, 68, 0.15) !important;
  color: #f87171 !important;
  border: 1px solid rgba(239, 68, 68, 0.3) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

/* Flagi produktów (Nowość, Wyprzedaż) */
.product-flags .product-flag {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: 6px !important;
  color: var(--trojka-primary-light) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 3px 8px !important;
}

.product-flags .product-flag.on-sale {
  background: rgba(245, 158, 11, 0.15) !important;
  border-color: var(--trojka-gold) !important;
  color: var(--trojka-gold) !important;
}

/* Dostępność w magazynie / Pawilon 67 */
.product-availability,
.product-availability .material-icons {
  font-size: 12px !important;
}

.product-available,
.product-availability .product-available {
  color: var(--trojka-emerald-light) !important;
  background: rgba(16, 185, 129, 0.1) !important;
  border: 1px solid rgba(16, 185, 129, 0.25) !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  display: inline-flex;
  align-items: center;
  font-weight: 600;
}

.product-unavailable {
  color: #f87171 !important;
  background: rgba(239, 68, 68, 0.1) !important;
  border: 1px solid rgba(239, 68, 68, 0.25) !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  display: inline-flex;
  font-weight: 600;
}

/* Przycisk „Wszystkie produkty” */
.all-product-link {
  color: var(--trojka-primary-light) !important;
  font-weight: 600 !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
}

.all-product-link:hover {
  color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   6. BLOK TEKSTOWY NA STRONIE GŁÓWNEJ (#custom-text)
   -------------------------------------------------------------------------- */
#custom-text {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  color: var(--trojka-text-main) !important;
  padding: 32px 28px !important;
  margin: 32px 0 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

#custom-text h2,
#custom-text h3 {
  color: #ffffff !important;
  margin-bottom: 16px;
  font-weight: 700;
}

#custom-text p,
#custom-text span,
#custom-text strong {
  color: var(--trojka-text-muted) !important;
  line-height: 1.7;
}

#custom-text strong.dark {
  color: #ffffff !important;
}

#custom-text a,
#custom-text span a {
  color: var(--trojka-primary) !important;
  font-weight: 700 !important;
}

#custom-text a:hover {
  color: #ffffff !important;
}

/* Baner reklamowy */
.banner {
  border-radius: var(--trojka-radius);
  overflow: hidden;
  border: 1px solid var(--trojka-border);
  display: block;
  margin: 24px 0;
}

/* --------------------------------------------------------------------------
   7. BLOKI I KARTY BOOTSTRAP / PRESTASHOP (.card, .card-block)
   -------------------------------------------------------------------------- */
.card,
.card-block,
.card-header,
.card-footer,
.list-group-item,
.page-order-detail .box,
.page-my-account #content .links a span.link-item,
.page-addresses .address {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  color: var(--trojka-text-main) !important;
}

.card-header {
  border-bottom: 1px solid var(--trojka-border-subtle) !important;
}

/* Nagłówek kategorii (np. Piloty LG, dekodery) */
.block-category,
.block-category.card,
.block-category.card.card-block {
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 24px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.block-category h1,
.block-category .h1 {
  color: #ffffff !important;
}

.block-category p,
.block-category strong,
.block-category #category-description {
  color: var(--trojka-text-muted) !important;
}

/* Pasek sortowania i wyboru liczby produktów zdefiniowano w sekcji 13 (brak powielających się ramek) */

/* --------------------------------------------------------------------------
   8. TABELE I DANE TECHNICZNE (ELIMINACJA .table td/th background: #fff)
   -------------------------------------------------------------------------- */
table,
.table,
.table td,
.table th,
.table tbody tr,
.table thead tr,
.table-striped tbody tr:nth-of-type(odd),
.table-striped tbody tr:nth-of-type(even),
.table-product-discounts thead tr th,
.order-confirmation-table {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  color: var(--trojka-text-main) !important;
  border-color: var(--trojka-border) !important;
}

.table th {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   9. PRZYCISKI I FORMULARZE (BUTTONS & CONTROLS)
   -------------------------------------------------------------------------- */
/* Główny przycisk akcji (CTA: Dodaj do koszyka, Zamawiam, Subskrybuj) */
.btn-primary,
.add-to-cart,
button.btn-primary,
a.btn-primary,
input.btn-primary[type="submit"] {
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  background: var(--trojka-primary-dark, #0284c7) !important;
  color: #ffffff !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  font-weight: 700 !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

.btn-primary:hover,
.add-to-cart:hover,
button.btn-primary:hover,
a.btn-primary:hover,
input.btn-primary[type="submit"]:hover {
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  background: var(--trojka-primary-darker, #0369a1) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(56, 189, 248, 0.55) !important;
  transform: none !important;
  text-decoration: none !important;
}

/* Przycisk pomocniczy / kontynuuj zakupy */
.btn-secondary,
button.btn-secondary,
a.btn-secondary {
  background: var(--trojka-bg-card) !important;
  color: var(--trojka-primary-light) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  font-weight: 600 !important;
  padding: 10px 18px !important;
  transition: all 0.2s ease !important;
}

.btn-secondary:hover,
button.btn-secondary:hover,
a.btn-secondary:hover {
  background: var(--trojka-bg-card-hover) !important;
  border-color: var(--trojka-primary) !important;
  color: #ffffff !important;
}

/* Pola tekstowe formularzy, selecty */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
select,
.custom-select,
.input-group input {
  background-color: var(--trojka-bg-darkest) !important;
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius-sm) !important;
  color: #ffffff !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus,
.custom-select:focus {
  background-color: var(--trojka-bg-darkest) !important;
  border-color: var(--trojka-primary) !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.2) !important;
  outline: none !important;
  color: #ffffff !important;
}

.form-control-label {
  color: var(--trojka-text-main) !important;
  font-weight: 600;
}

/* Przycisk POKAŻ / UKRYJ hasło (Show Password) w polach formularzy logowania - CAŁKOWICIE OBRAMOWANY */
.input-group .input-group-btn > .btn[data-action="show-password"],
.btn-show-password,
button[data-action="show-password"],
.input-group-btn [data-action="show-password"] {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #38bdf8 !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  padding: 8px 14px !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  box-shadow: none !important;
  outline: none !important;
  margin-left: 4px !important;
}

.input-group .input-group-btn > .btn[data-action="show-password"]:hover,
.btn-show-password:hover,
button[data-action="show-password"]:hover,
.input-group .input-group-btn > .btn[data-action="show-password"]:focus,
.btn-show-password:focus,
button[data-action="show-password"]:focus {
  background: var(--trojka-bg-card-hover, #253349) !important;
  background-color: var(--trojka-bg-card-hover, #253349) !important;
  color: #ffffff !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
}

/* Wyrównanie pola hasła w grupie z przyciskiem */
.input-group input[type="password"],
.input-group input[data-action="show-password"] {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* --------------------------------------------------------------------------
   10. KARTA POJEDYNCZEGO PRODUKTU (PRODUCT DETAIL PAGE)
   -------------------------------------------------------------------------- */
.product-container,
.product-information,
.product-actions {
  background: transparent !important;
}

#product-description-short,
.product-description {
  color: var(--trojka-text-muted) !important;
  line-height: 1.7;
}

.product-features,
.product-features dl {
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 16px !important;
}

.product-features dt {
  color: #ffffff !important;
  font-weight: 600;
}

.product-features dd {
  color: var(--trojka-text-muted) !important;
}

/* --------------------------------------------------------------------------
   OPCJA A: Zakładki (Opis, Szczegóły produktu) jako PRAWDZIWE PRZYCISKI / KLAWISZE
   Solidne przyciski z ciemnym tłem, ramką, wyraźnym stanem aktywacji i poświatą
   -------------------------------------------------------------------------- */
.tabs,
.product-tabs {
  background: #0f172a !important;
  border: 1px solid #1e293b !important;
  border-radius: 12px !important;
  padding: 20px 22px !important;
  margin-top: 24px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
}

.tabs:empty,
.product-tabs:empty,
.tab-content:empty {
  display: none !important;
}

.tabs .nav-tabs,
.product-tabs .nav-tabs {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #1e293b !important;
  padding: 0 0 14px 0 !important;
  margin-bottom: 18px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.tabs .nav-tabs .nav-item,
.product-tabs .nav-tabs .nav-item {
  margin: 0 !important;
  padding: 0 !important;
}

/* Klawisz zakładki w stanie spoczynku: ciemny, solidny przycisk z wyraźną ramką */
.tabs .nav-tabs .nav-link,
.product-tabs .nav-tabs .nav-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 9px 18px !important;
  cursor: pointer !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-decoration: none !important;
}

/* Hover: rozjaśnienie przycisku, jasnoniebieski napis i ramka */
.tabs .nav-tabs .nav-link:hover,
.product-tabs .nav-tabs .nav-link:hover {
  color: #7dd3fc !important;
  background: #1e293b !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 3px 10px rgba(56, 189, 248, 0.25) !important;
  text-decoration: none !important;
}

/* Active: naciśnięcie klawisza */
.tabs .nav-tabs .nav-link:active,
.product-tabs .nav-tabs .nav-link:active {
  color: #7dd3fc !important;
  background: #0f172a !important;
  border-color: #38bdf8 !important;
  transform: scale(0.98) !important;
}

/* AKTYWNA / WYBRANA ZAKŁADKA: wyrazisty błękitny przycisk z poświatą */
.tabs .nav-tabs .nav-link.active,
.tabs .nav-tabs li.active .nav-link,
.product-tabs .nav-tabs .nav-link.active,
.product-tabs .nav-tabs li.active .nav-link {
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.45), 0 0 10px rgba(56, 189, 248, 0.3) !important;
  cursor: default !important;
}

/* Zawartość zakładek - bez jakichkolwiek wewnętrznych ramek ani podwójnych tłem */
.tabs .tab-content,
.product-tabs .tab-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: var(--trojka-text-main) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.tabs .tab-pane,
.product-tabs .tab-pane,
.product-description,
.product-features,
.data-sheet {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Wewnętrzne cechy produktu (data-sheet) - usunięcie podziałek tabelowych i ramek */
.product-features .data-sheet {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px 20px !important;
  margin-top: 8px !important;
}

.data-sheet dt.name {
  color: #94a3b8 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  margin-bottom: 2px !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

.data-sheet dd.value {
  color: #f1f5f9 !important;
  font-size: 13.5px !important;
  margin-bottom: 8px !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Zdjęcia i miniatury na karcie produktu - Pojedyncza ramka, zaokrąglone rogi, brak podwójnej ramki */
.images-container {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.product-cover {
  position: relative !important;
  background: var(--trojka-bg-darkest, #080e1a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: 14px !important;
  padding: 18px !important;
  overflow: hidden !important;
  margin-bottom: 1.25rem !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.product-cover:hover {
  border-color: rgba(56, 189, 248, 0.45) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 20px rgba(56, 189, 248, 0.12) !important;
}

/* Likwidacja wewnętrznej ramki ze zdjęcia (usunięcie podwójnej ramki) */
.images-container .js-qv-product-cover,
.product-cover img,
.product-cover .js-qv-product-cover {
  background: transparent !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 0 !important;
  box-shadow: none !important;
  display: block !important;
  margin: 0 auto !important;
  max-height: 480px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* Warstwa najechania z lupką - niebieskawy filtr zgodny ze stylem Trójki */
.product-cover .layer {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  background: linear-gradient(135deg, rgba(8, 47, 73, 0.72) 0%, rgba(15, 23, 42, 0.82) 100%) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  opacity: 0 !important;
  transition: opacity 0.28s ease-in-out !important;
  border-radius: inherit !important;
  z-index: 2 !important;
}

.product-cover:hover .layer {
  opacity: 1 !important;
}

.product-cover .layer .zoom-in,
.product-cover .layer i.material-icons {
  font-size: 2.2rem !important;
  color: #38bdf8 !important;
  background: rgba(15, 23, 42, 0.88) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.6) !important;
  border-radius: 50% !important;
  width: 62px !important;
  height: 62px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6), 0 0 20px rgba(56, 189, 248, 0.35) !important;
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.product-cover .layer:hover .zoom-in,
.product-cover .layer:hover i.material-icons {
  transform: scale(1.14) !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 10px 30px rgba(56, 189, 248, 0.55), 0 0 25px rgba(56, 189, 248, 0.4) !important;
  color: #ffffff !important;
}

.product-images img.thumb {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border-subtle) !important;
  border-radius: var(--trojka-radius-sm) !important;
}

.product-images img.thumb.selected {
  border-color: var(--trojka-primary) !important;
}

/* Moduł zaufania (Gwarancja, Wysyłka, Obsługa) */
.blockreassurance,
.blockreassurance_product {
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 16px !important;
  color: var(--trojka-text-main) !important;
}

.blockreassurance p,
.blockreassurance .block-title,
.blockreassurance_product p,
.blockreassurance_product .block-title,
.blockreassurance_product span,
.blockreassurance_product div {
  color: #ffffff !important;
}

.blockreassurance p,
.blockreassurance_product p {
  color: #cbd5e1 !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
}

.blockreassurance .block-title,
.blockreassurance_product .block-title {
  color: #38bdf8 !important;
  font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   11. FILTRY BOCZNE I KATEGORIE (FACETED SEARCH, BLOCK CATEGORIES & SUBCATEGORIES)
   -------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
   LEWA STRONA (PANEL BOCZNY): KLAWISZE KATEGORII I PODKATEGORII Z RAMKAMI
   Spoczynek: Ciemny klawisz z ramką, biała czcionka
   Hover: Rozjaśnienie, błękitna ramka, jasnobłękitny napis
   Aktywny: Jasnoniebieskie tło (#0284c7 / #38bdf8) z białą czcionką (#ffffff)
   -------------------------------------------------------------------------- */
#search_filters,
#search_filters_suppliers,
.block-categories,
#left-column .block-categories {
  background: #0f172a !important;
  border: 1px solid #1e293b !important;
  border-radius: 12px !important;
  padding: 18px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
}

/* ==============================================================================
   NAGŁÓWEK KATEGORII W LEWEJ BELCE (NP. PILOTY RTV NA STRONIE /3-piloty-rtv)
   Dziedziczy kolorystykę po klawiszu menu górnego, który go wywołał:
   Napis PILOTY RTV na jasnoniebieskim tle (#0284c7 -> #38bdf8), biała czcionka,
   stabilna ramka 1px, brak skakania przy najechaniu i kliknięciu
   ============================================================================== */
.block-categories .category-top-menu > li > a.h6,
.block-categories .category-top-menu > li > a:first-child,
.block-categories .category-top-menu > li:first-child > a,
.block-categories .h5,
.block-categories .h6,
.block-categories .title_block,
.block-categories > ul > li > a.h6,
.block-categories > ul > li > a:first-child,
#left-column .block-categories .category-top-menu > li > a.h6,
#left-column .block-categories .category-top-menu > li > a:first-child,
#left-column .block-categories .category-top-menu > li:first-child > a,
#left-column .block-categories .title_block,
#left-column .block-categories .h6,
#left-column .block-categories a[href*="piloty-rtv"].h6,
#left-column .block-categories a[href*="piloty-do-bram"].h6,
#left-column .block-categories a[href*="obudowy"].h6 {
  box-sizing: border-box !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  margin: 0 0 14px 0 !important;
  margin-bottom: 14px !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background 0.15s ease, opacity 0.15s ease !important;
  transform: none !important;
  animation: none !important;
  height: auto !important;
  min-height: 40px !important;
  max-height: none !important;
  overflow: visible !important;
  cursor: pointer !important;
}

.block-categories .category-top-menu > li > a.h6:hover,
.block-categories .category-top-menu > li > a:first-child:hover,
.block-categories .category-top-menu > li:first-child > a:hover,
.block-categories .h5:hover,
.block-categories .h6:hover,
.block-categories .title_block:hover,
.block-categories > ul > li > a.h6:hover,
.block-categories > ul > li > a:first-child:hover,
#left-column .block-categories .category-top-menu > li > a.h6:hover,
#left-column .block-categories .category-top-menu > li > a:first-child:hover,
#left-column .block-categories .category-top-menu > li:first-child > a:hover,
#left-column .block-categories .title_block:hover,
#left-column .block-categories .h6:hover {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%) !important;
  border: 1px solid #7dd3fc !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  margin: 0 0 14px 0 !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.5) !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Układ listy podkategorii jako kolumna nowoczesnych klawiszy */
.block-categories .category-sub-menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.block-categories .category-sub-menu li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Klawisze marek i podkategorii (ACER, AIWA, AKAI itd.) w stanie spoczynku - BEZ SKAKANIA */
.block-categories a,
.block-categories ul li a,
.block-categories .category-sub-menu a,
.block-categories .category-sub-menu li a,
.block-categories .category-sub-menu li[data-depth="0"] > a,
.block-categories .category-sub-link,
#left-column .block-categories a {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-top: 1px solid #334155 !important;
  border-right: 1px solid #334155 !important;
  border-bottom: 1px solid #334155 !important;
  border-left: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  line-height: 1.2 !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Hover: rozjaśnienie klawisza, idealnie 1px błękitna ramka bez pogrubienia i bez skakania */
.block-categories a:hover,
.block-categories ul li a:hover,
.block-categories .category-sub-menu a:hover,
.block-categories .category-sub-menu li a:hover,
.block-categories .category-sub-menu li[data-depth="0"] > a:hover,
.block-categories .category-sub-link:hover,
#left-column .block-categories a:hover,
#left-column .block-categories .category-sub-menu a:hover {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #1e293b !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Active: naciśnięcie klawisza (brak pomniejszania, brak skakania) */
.block-categories a:active,
.block-categories .category-sub-menu a:active,
.block-categories .category-sub-menu li a:active,
#left-column .block-categories a:active,
#left-column .block-categories .category-sub-menu a:active {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #0f172a !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* AKTYWNY KLAWISZ W LEWEJ KOLUMNIE (AKTUALNA KATEGORIA / MARKA):
   JASNONIEBIESKIE TŁO (#0284c7 / #38bdf8) Z BIAŁĄ CZCIONKĄ (#ffffff) */
.block-categories .category-sub-menu li.current > a,
.block-categories .category-sub-menu a.active,
.block-categories .category-sub-menu li.active > a,
.block-categories .category-sub-menu a[aria-current="page"],
.block-categories a.active,
.block-categories li.current > a,
.block-categories li.active > a,
#left-column .block-categories .category-sub-menu li.current > a,
#left-column .block-categories .category-sub-menu a.active,
#left-column .block-categories a.active,
#left-column .block-categories li.active > a,
#left-column .block-categories .current > a,
#left-column .block-categories .current a {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  cursor: default !important;
}

/* Ikony rozwijania kategorii (+ / - / strzałki) */
.block-categories .collapse-icons,
.block-categories .collapse-icons .material-icons,
.block-categories .collapse-icons .add,
.block-categories .collapse-icons .remove,
.block-categories .arrows,
.block-categories .arrows .arrow-right,
.block-categories .arrows .arrow-down {
  color: var(--trojka-text-muted) !important;
}

.block-categories .collapse-icons:hover,
.block-categories .arrows:hover {
  color: var(--trojka-primary-light) !important;
}

/* ==========================================================================
   UKRYCIE WIDOKU PODKATEGORII I NAGŁÓWKA KATEGORII W OKNIE GŁÓWNYM
   Podkategorie są dostępne i wybierane wyłącznie w lewym menu bocznym.
   W oknie głównym od razu pojawia się lista produktów i filtry.
   ========================================================================== */
#subcategories,
.subcategories,
#main #subcategories,
section#main #subcategories,
.card#subcategories,
.block-category,
.block-category.card,
.block-category.card.card-block,
#js-product-list-header .block-category,
#main .block-category,
section#main .block-category {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#search_filters .facet label,
#search_filters .facet .facet-label a,
#search_filters .facet a {
  color: #ffffff !important;
  font-size: 13.5px;
  text-decoration: none !important;
  border-bottom: none !important;
  transition: color 0.15s ease;
}

#search_filters .facet label:hover,
#search_filters .facet .facet-label a:hover,
#search_filters .facet a:hover {
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

#search_filters .facet label:active,
#search_filters .facet label.active,
#search_filters .facet .facet-label.active a,
#search_filters .facet a:active {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

.custom-checkbox input[type="checkbox"] + span {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: 4px;
}

.custom-checkbox input[type="checkbox"]:checked + span {
  background: var(--trojka-primary) !important;
  border-color: var(--trojka-primary) !important;
}

.active_filters .filter-block {
  background: var(--trojka-bg-elevated) !important;
  border: 1px solid var(--trojka-border) !important;
  color: #ffffff !important;
  border-radius: var(--trojka-radius-sm);
}

/* --------------------------------------------------------------------------
   12. STRONA KOSZYKA I KASA / ZAMÓWIENIE (CART & CHECKOUT)
   -------------------------------------------------------------------------- */
.cart-grid-body,
.cart-summary,
.checkout-step,
body#checkout section.checkout-step {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 22px !important;
  margin-bottom: 20px;
}

.cart-item {
  border-bottom: 1px solid var(--trojka-border-subtle) !important;
  padding: 14px 0 !important;
}

.cart-summary-line .value {
  color: #ffffff !important;
  font-weight: 600;
}

.cart-total .value {
  color: var(--trojka-primary) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
}

.checkout-step .step-title {
  color: #ffffff !important;
  font-weight: 700 !important;
  border-bottom: 1px solid var(--trojka-border-subtle);
  padding-bottom: 12px;
}

.checkout-step .step-number {
  background: var(--trojka-primary) !important;
  color: var(--trojka-bg-darkest) !important;
  font-weight: 800;
  border-radius: 9999px;
}

body#checkout section.checkout-step .address-item.selected {
  background: var(--trojka-bg-elevated) !important;
  border: 2px solid var(--trojka-primary) !important;
}

body#checkout #footer {
  background: var(--trojka-bg-main, #090d16) !important;
}

/* --------------------------------------------------------------------------
   13. PAGINACJA I LICZNIK STRON (PAGINATION & PAGE COUNTER)
   -------------------------------------------------------------------------- */
/* Główny pasek paginacji na dole listy produktów */
.pagination {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 16px 20px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 28px !important;
  margin-bottom: 28px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4) !important;
}

/* Tekst licznika stron ("Pokazano 1-12 z 961 pozycji" / "Wyświetlanie 1-12 z...") */
.pagination > div:first-child,
.pagination .col-md-4,
.products-selection .total-products p,
.total-products p,
.products-selection .showing,
.showing {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 2.4 !important;
  letter-spacing: 0.01em !important;
}

/* Kontener z listą stron */
.pagination .col-md-6.offset-md-2,
.pagination .col-md-8 {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.pagination .page-list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  background: transparent !important;
  border: none !important;
}

.pagination .page-list li {
  display: inline-flex !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Poszczególne kafelki / przyciski stron (1, 2, 3...) */
.pagination .page-list a,
.pagination a:not(.previous):not(.next),
.page-item .page-link,
.page-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 42px !important;
  height: 42px !important;
  padding: 0 12px !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

/* Ujednolicony efekt najechania (hover) na numer strony oraz na przyciski Poprzedni i Dalej */
.pagination .page-list a:hover:not(.disabled):not(.active),
.pagination .page-list li:not(.current) a:hover,
.page-link:hover,
.pagination .page-list a.previous:hover,
.pagination .page-list a.next:hover {
  background: rgba(56, 189, 248, 0.18) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: none !important;
  transform: none !important;
  text-decoration: none !important;
}

/* Aktywna / bieżąca strona w liczniku stron - MAKSYMALNA CZYTELNOŚĆ I WYRAZISTY KONTRAST */
.pagination .page-list li.current,
.pagination .page-list li.active,
.pagination .page-list li[class*="current"],
.pagination .page-list li[class*="active"] {
  opacity: 1 !important;
}

.pagination .page-list li.current a,
.pagination .page-list li.current a.disabled,
.pagination .page-list li.current a.js-search-link,
.pagination .page-list li.active a,
.pagination .page-list a.current,
.pagination .page-list a.active,
.pagination .page-list a[aria-current="page"],
.pagination .current a,
.page-item.active .page-link {
  background: var(--trojka-primary, #38bdf8) !important;
  background-color: #38bdf8 !important;
  color: #020617 !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  border: 1px solid #38bdf8 !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 0 16px rgba(56, 189, 248, 0.55), 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  text-decoration: none !important;
  pointer-events: none !important;
  cursor: default !important;
  transform: none !important;
}

/* Przyciski Poprzedni i Następny (DALEJ) */
.pagination .page-list a.previous,
.pagination .page-list a.next {
  min-width: auto !important;
  padding: 0 16px !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: var(--trojka-bg-darkest) !important;
  color: #ffffff !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  text-decoration: none !important;
}

.pagination .page-list a.previous i.material-icons,
.pagination .page-list a.next i.material-icons {
  font-size: 18px !important;
  line-height: 1 !important;
  color: var(--trojka-primary, #38bdf8) !important;
  transition: color 0.2s ease !important;
}

.pagination .page-list a.previous:hover i.material-icons,
.pagination .page-list a.next:hover i.material-icons {
  color: var(--trojka-primary, #38bdf8) !important;
}

/* Stan nieaktywny przycisków paginacji (TYLKO dla Poprzedni/Następny, nigdy dla aktywnej strony!) */
.pagination .page-list li:not(.current):not(.active) a.disabled,
.pagination .page-list a.disabled:not(.current):not(.active):not([aria-current="page"]),
.pagination .disabled:not(.current):not(.active),
.page-item.disabled:not(.active) .page-link {
  opacity: 0.35 !important;
  pointer-events: none !important;
  background: var(--trojka-bg-darkest) !important;
  border-color: var(--trojka-border-subtle) !important;
  color: var(--trojka-text-dim) !important;
}

/* Kropki (...) między stronami */
.pagination .spacer {
  color: var(--trojka-text-muted) !important;
  padding: 0 6px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* --------------------------------------------------------------------------
   PASEK GÓRNY KATALOGU: LICZNIK PRODUKTÓW I SORTOWANIE
   (Reguła czystego interfejsu: obramowanie występuje WYŁĄCZNIE przy zmianie
   tła z niebieskawego na czarny, zero zbędnych podwójnych ramek wewnątrz pola)
   -------------------------------------------------------------------------- */
#js-product-list-top,
#js-product-list-bottom,
.products-selection {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 12px 20px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 22px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  color: #ffffff !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35) !important;
}

/* Ukrycie pustych belek sortowania i paginacji, gdy brak produktów (np. pusty wynik wyszukiwania) */
#js-product-list-top:empty,
#js-product-list-bottom:empty,
.products-selection:empty,
#products:has(.search-empty-results) #js-product-list-top,
#products:has(.search-empty-results) #js-product-list-bottom {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  height: 0 !important;
  min-height: 0 !important;
}

#js-product-list-top > div,
.products-selection > div {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Informacja o liczbie produktów - czysty tekst bez żadnych ramek */
.products-selection .total-products,
.products-selection .total-products p,
.total-products,
.total-products p {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
}

/* Wiersz sortowania - transparentny, bez jakichkolwiek wewnętrznych ramek */
.products-selection .sort-by-row,
.sort-by-row,
#js-product-list-top .sort-by-row {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* Napis "Sortuj wg:" - czysty, czytelny tekst bezpośrednio na niebieskawym tle */
.products-selection .sort-by,
.products-selection span.sort-by,
.sort-by,
span.sort-by {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  margin: 0 12px 0 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  line-height: normal !important;
}

/* Kontener dropdowna - transparentny, bez obramowania */
.products-sort-order,
.products-selection .products-sort-order,
div.products-sort-order,
.brands-sort,
.suppliers-sort {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
}

/* JEDYNE obramowanie wewnątrz niebieskawego pola:
   Występuje TYLKO na przejściu koloru z niebieskawego tła na czarny (przycisk wyboru "Dostępne") */
.products-sort-order .select-title,
.products-selection .select-title,
.brands-sort .select-title,
.suppliers-sort .select-title,
button.select-title {
  background: var(--trojka-bg-darkest) !important; /* czarne tło #020617 */
  border: 1px solid var(--trojka-border) !important; /* pojedyncza ramka na granicy kolorów */
  border-radius: var(--trojka-radius-sm) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  padding: 8px 14px !important;
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  outline: none !important;
}

.products-sort-order .select-title:hover,
.products-selection .select-title:hover,
button.select-title:hover {
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: var(--trojka-primary-light, #7dd3fc) !important;
  box-shadow: none !important;
  transform: none !important;
}

.products-sort-order .select-title i.material-icons,
button.select-title i.material-icons {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 18px !important;
  margin-left: 8px !important;
  line-height: 1 !important;
}

/* Rozwijane menu z opcjami sortowania (czarne tło + ramka na granicy) */
.products-sort-order .dropdown-menu,
.brands-sort .dropdown-menu,
.suppliers-sort .dropdown-menu {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius-sm) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.65) !important;
  padding: 6px 0 !important;
  margin-top: 4px !important;
  min-width: 180px !important;
  z-index: 1050 !important;
}

.products-sort-order .dropdown-menu .select-list,
.dropdown-menu a.select-list {
  color: #ffffff !important;
  background: transparent !important;
  border: none !important;
  padding: 8px 16px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  display: block !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.products-sort-order .dropdown-menu .select-list:hover,
.dropdown-menu a.select-list:hover {
  background: rgba(56, 189, 248, 0.15) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
}

.products-sort-order .dropdown-menu .select-list.current,
.dropdown-menu a.select-list.current {
  background: rgba(56, 189, 248, 0.25) !important;
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* --------------------------------------------------------------------------
   14. OKNA POP-UP I MODALE (.modal-content, QUICKVIEW, DODANO DO KOSZYKA)
   ORAZ LISTA ŻYCZEŃ (BLOCKWISHLIST: OKNO LOGOWANIA, DODAWANIA, POWIADOMIENIA TOAST)
   Okno dialogowe posiada dokładnie JEDNĄ ramkę zewnętrzną (zero ramek wewnętrznych).
   Brak jakichkolwiek gradientów – wyłącznie jednolite, czytelne kolory.
   -------------------------------------------------------------------------- */
/* Główne okno dialogowe - JEDYNA zewnętrzna ramka całego okna */
.modal-content,
#blockcart-modal .modal-content,
#product-modal .modal-content,
.wishlist-modal .modal-content,
.modal.wishlist-modal .modal-content,
#wishlist-modal .modal-content,
.wishlist-login .modal-content,
.wishlist-add-to .modal-content,
.wishlist-create .modal-content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.9), 0 0 25px rgba(56, 189, 248, 0.15) !important;
  overflow: hidden !important;
}

/* Wnętrze okna dialogowego - ZERO wewnętrznych ramek (likwidacja potrójnej ramki) */
.modal-header,
.modal-body,
.modal-footer,
.modal-content .modal-header,
.modal-content .modal-body,
.modal-content .modal-footer,
.wishlist-modal .modal-header,
.wishlist-modal .modal-body,
.wishlist-modal .modal-footer,
#product-modal .modal-body .product-cover-modal,
#product-modal .modal-content .modal-body .image-caption {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-right: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

.modal-header {
  padding: 20px 24px 10px 24px !important;
}

.modal-body {
  padding: 10px 24px !important;
}

.modal-footer {
  padding: 10px 24px 20px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
}

/* Nagłówki okien modalnych (np. "Zaloguj się", "Dodaj do listy życzeń") */
.modal-title,
.modal-header .modal-title,
h5.modal-title,
.wishlist-modal .modal-title,
.wishlist-login .modal-title,
.wishlist-add-to .modal-title,
#wishlist-modal .modal-title {
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
}

/* ==========================================================================
   CZYTELNY TEKST PO KLIKNIĘCIU NA SERDUSZKO (KOMUNIKAT: "Musisz być zalogowany...")
   Eliminuje ciemnoniebieską / czarną czcionkę z modułu blockwishlist.
   ========================================================================== */
.wishlist-modal .modal-body,
.wishlist-modal .modal-text,
.wishlist-modal p,
.modal-text,
.wishlist-login .modal-text,
.wishlist-login p,
.wishlist-add-to p,
.modal-body p,
.modal-body span,
.modal-body div,
.wishlist-modal .modal-body p,
.wishlist-modal .modal-body span,
.wishlist-modal .modal-body div,
.wishlist-modal .modal-body label {
  color: #e2e8f0 !important; /* Bardzo czytelny, jasny odcień Slate */
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  background-color: transparent !important;
}

.wishlist-modal strong,
.wishlist-modal b,
.modal-body strong,
.modal-body b {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* Przycisk ANULUJ w oknie listy życzeń i modali */
.wishlist-modal .modal-footer .btn-secondary,
.modal-footer .btn-secondary,
.wishlist-login .btn-secondary,
.wishlist-add-to .btn-secondary,
button[data-dismiss="modal"]:not(.close) {
  background: var(--trojka-bg-darkest, #020617) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  color: #cbd5e1 !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  padding: 9px 22px !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

.wishlist-modal .modal-footer .btn-secondary:hover,
.modal-footer .btn-secondary:hover,
.wishlist-login .btn-secondary:hover,
button[data-dismiss="modal"]:not(.close):hover {
  background: #1e293b !important;
  border-color: #64748b !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6) !important;
  text-decoration: none !important;
}

/* Przycisk ZALOGUJ SIĘ / ZAPISZ / UTWÓRZ w oknie listy życzeń */
.wishlist-modal .modal-footer .btn-primary,
.modal-footer .btn-primary,
.wishlist-login .btn-primary,
.wishlist-add-to .btn-primary,
.wishlist-modal a.btn-primary,
.wishlist-login a.btn-primary {
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  background: var(--trojka-primary-dark, #0284c7) !important;
  border: 1px solid rgba(56, 189, 248, 0.5) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  padding: 9px 24px !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.wishlist-modal .modal-footer .btn-primary:hover,
.modal-footer .btn-primary:hover,
.wishlist-login .btn-primary:hover,
.wishlist-modal a.btn-primary:hover,
.wishlist-login a.btn-primary:hover {
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  background: var(--trojka-primary-darker, #0369a1) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(56, 189, 248, 0.6) !important;
  transform: none !important;
  text-decoration: none !important;
}

/* Lista życzeń klienta zalogowanego w modalu (np. popup serduszka "Dodaj do listy życzeń") */
.wishlist-modal .wishlist-list-item,
.wishlist-modal .wishlist-list .wishlist-list-item,
.wishlist-modal .wishlist-item {
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  padding: 12px 16px !important;
  margin-bottom: 8px !important;
  color: #ffffff !important;
  transition: all 0.2s ease !important;
}

.wishlist-modal .wishlist-list-item:hover {
  border-color: var(--trojka-primary, #38bdf8) !important;
  background: rgba(56, 189, 248, 0.1) !important;
}

.wishlist-list-item .custom-radio label,
.wishlist-list-item label {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
}

.wishlist-list-item .wishlist-list-item-title {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.wishlist-list-item .wishlist-list-item-count,
.wishlist-list-item small {
  color: #94a3b8 !important;
  font-size: 12px !important;
}

/* Pole tekstowe tworzenia nowej listy życzeń w modalu */
.wishlist-modal input[type="text"],
.wishlist-add-to-new input[type="text"],
.wishlist-create input[type="text"] {
  background: var(--trojka-bg-darkest, #020617) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  color: #ffffff !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

.wishlist-modal input[type="text"]:focus,
.wishlist-add-to-new input[type="text"]:focus {
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.25) !important;
  outline: none !important;
  color: #ffffff !important;
}

/* ==========================================================================
   POWIADOMIENIA TOAST PO DODANIU DO LISTY ŻYCZEŃ (.wishlist-toast)
   Wyświetlane gdy klient kliknie serduszko i produkt zostanie zapisany.
   ========================================================================== */
.wishlist-toast,
.wishlist-alert,
div.wishlist-toast {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-radius: var(--trojka-radius, 10px) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.85), 0 0 20px rgba(56, 189, 248, 0.35) !important;
  color: #ffffff !important;
  padding: 14px 20px !important;
  z-index: 99999 !important;
}

.wishlist-toast p,
.wishlist-toast span,
.wishlist-toast .wishlist-toast-text,
.wishlist-toast .toast-body {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  margin: 0 !important;
}

.wishlist-toast a,
.wishlist-toast .wishlist-toast-link {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
}

.wishlist-toast a:hover {
  color: #ffffff !important;
}

#blockcart-modal .cart-content p.product-total {
  background-color: var(--trojka-bg-darkest) !important;
  color: #ffffff !important;
  border-radius: var(--trojka-radius-sm);
  padding: 10px !important;
}

.close,
.modal-header .close,
.wishlist-modal .close,
button.close {
  color: #94a3b8 !important;
  opacity: 0.85 !important;
  text-shadow: none !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  transition: color 0.15s ease, opacity 0.15s ease !important;
}

.close:hover,
.modal-header .close:hover,
.wishlist-modal .close:hover,
button.close:hover {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* --------------------------------------------------------------------------
   15. LEKKI BANER COOKIE v3.0 (TRÓJKA ELECTRONICS / PILOT.COM.PL)
   -------------------------------------------------------------------------- */
.trojka-cb3-root {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  background-color: #090d16 !important;
  background: rgba(9, 13, 22, 0.97) !important;
  border-top: 1px solid #334155 !important;
  box-shadow: 0 -12px 35px rgba(0, 0, 0, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  z-index: 999999 !important;
  color: #cbd5e1 !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  box-sizing: border-box !important;
  animation: trojkaCbSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes trojkaCbSlideUp {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.trojka-cb3-container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 10px 16px !important;
  box-sizing: border-box !important;
}

.trojka-cb3-bar {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  align-items: stretch !important;
}

@media (min-width: 992px) {
  .trojka-cb3-bar {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
  }
}

.trojka-cb3-main {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.trojka-cb3-badge {
  background: rgba(56, 189, 248, 0.12) !important;
  border: 1px solid rgba(56, 189, 248, 0.35) !important;
  border-radius: 8px !important;
  color: #38bdf8 !important;
  padding: 7px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.trojka-cb3-text {
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: #94a3b8 !important;
}

.trojka-cb3-title {
  font-weight: 700 !important;
  color: #ffffff !important;
  margin-right: 4px !important;
}

.trojka-cb3-desc {
  color: #cbd5e1 !important;
}

.trojka-cb3-link-details {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  margin-left: 6px !important;
  background: transparent !important;
  border: none !important;
  color: #38bdf8 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  cursor: pointer !important;
  padding: 0 !important;
  transition: color 0.15s ease !important;
}

.trojka-cb3-link-details:hover {
  color: #7dd3fc !important;
}

#trojka-cb3-chevron {
  transition: transform 0.2s ease !important;
}

.trojka-cb3-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  flex-shrink: 0 !important;
}

.trojka-cb3-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 7px 13px !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.16s ease !important;
  border: 1px solid transparent !important;
  box-sizing: border-box !important;
}

.trojka-cb3-btn-necessary {
  background: #1e293b !important;
  color: #cbd5e1 !important;
  border-color: #334155 !important;
}
.trojka-cb3-btn-necessary:hover {
  background: #334155 !important;
  color: #ffffff !important;
}
.trojka-cb3-btn-necessary.is-selected {
  background: rgba(14, 165, 233, 0.2) !important;
  color: #7dd3fc !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.25) !important;
}

.trojka-cb3-btn-all {
  background: #0284c7 !important;
  color: #ffffff !important;
  border-color: #0369a1 !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 4px rgba(2, 132, 199, 0.35) !important;
}
.trojka-cb3-btn-all:hover {
  background: #0ea5e9 !important;
  border-color: #38bdf8 !important;
  color: #ffffff !important;
}
.trojka-cb3-btn-all.is-selected {
  background: #0ea5e9 !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 0 12px rgba(14, 165, 233, 0.45) !important;
}

.trojka-cb3-btn-save {
  background: #0284c7 !important;
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  color: #ffffff !important;
  border-color: #38bdf8 !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
}
.trojka-cb3-btn-save:hover {
  background: #0369a1 !important;
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  border-color: #7dd3fc !important;
  color: #ffffff !important;
}

.trojka-cb3-close {
  background: transparent !important;
  border: none !important;
  color: #64748b !important;
  padding: 6px !important;
  cursor: pointer !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.15s ease !important;
}
.trojka-cb3-close:hover {
  color: #ffffff !important;
  background: #1e293b !important;
}

/* Panel szczegółów */
.trojka-cb3-details {
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(51, 65, 85, 0.6) !important;
  animation: trojkaCbFadeIn 0.2s ease !important;
}

@keyframes trojkaCbFadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.trojka-cb3-cards-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

@media (min-width: 768px) {
  .trojka-cb3-cards-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

.trojka-cb3-card {
  background: #0f172a !important;
  border: 1px solid #1e293b !important;
  border-radius: 9px !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  transition: all 0.18s ease !important;
}

.trojka-cb3-card-interactive {
  cursor: pointer !important;
}
.trojka-cb3-card-interactive:hover {
  border-color: #38bdf8 !important;
  background: #131d35 !important;
}

.trojka-cb3-card-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 5px !important;
}

.trojka-cb3-card-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.trojka-cb3-card-icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.trojka-icon-emerald {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #34d399 !important;
  border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

.trojka-icon-sky {
  background: rgba(56, 189, 248, 0.12) !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
}

.trojka-cb3-card-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #f1f5f9 !important;
}

.trojka-cb3-card-desc {
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  color: #94a3b8 !important;
  margin: 0 !important;
}

.trojka-cb3-badge-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 9999px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}

.trojka-badge-locked {
  background: rgba(56, 189, 248, 0.15) !important;
  color: #7dd3fc !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
}

/* PROSTY PRZEŁĄCZNIK TOGGLE SWITCH */
.trojka-cb3-toggle-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.trojka-cb3-toggle-state {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #38bdf8 !important;
  user-select: none !important;
}
.trojka-cb3-toggle-state.is-off {
  color: #64748b !important;
}

.trojka-cb3-switch {
  position: relative !important;
  width: 38px !important;
  height: 20px !important;
  border-radius: 9999px !important;
  background-color: #334155 !important;
  border: 2px solid transparent !important;
  padding: 0 !important;
  cursor: pointer !important;
  outline: none !important;
  transition: background-color 0.2s ease !important;
  box-sizing: border-box !important;
}

.trojka-cb3-switch.is-active {
  background-color: #0284c7 !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.35) !important;
}

.trojka-cb3-switch-handle {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  background-color: #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
  transition: transform 0.2s ease !important;
  transform: translateX(0) !important;
}

.trojka-cb3-switch.is-active .trojka-cb3-switch-handle {
  transform: translateX(18px) !important;
}

/* Link w stopce do ponownego otwarcia ustawień */
.footer-legal-links a.js-open-cookie-settings {
  color: #ffffff !important;
  cursor: pointer !important;
  text-decoration: none !important;
  border-bottom: none !important;
  transition: none !important;
}
.footer-legal-links a.js-open-cookie-settings:hover,
.footer-legal-links a.js-open-cookie-settings:focus {
  color: #7dd3fc !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* --------------------------------------------------------------------------
   16. BLOK NEWSLETTERA I STOPKA (FOOTER)
   -------------------------------------------------------------------------- */
.block_newsletter,
#blockEmailSubscription_displayFooterBefore {
  background-color: var(--trojka-bg-card) !important;
  background: var(--trojka-bg-card) !important;
  border: 1px solid var(--trojka-border) !important;
  border-radius: var(--trojka-radius) !important;
  padding: 24px 20px !important;
  margin: 30px auto !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

.block_newsletter #block-newsletter-label {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 16px !important;
}

.block_newsletter p {
  color: var(--trojka-text-muted) !important;
}

.block_newsletter form input[type="email"] {
  background: var(--trojka-bg-darkest) !important;
  border: 1px solid var(--trojka-border) !important;
  color: #ffffff !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  height: 44px !important;
  padding: 10px 16px !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

.block_newsletter form input[type="email"]:focus {
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.22) !important;
  outline: none !important;
}

/* Przycisk SUBSKRYBUJ w formularzu newslettera */
.block_newsletter form input[type="submit"],
.block_newsletter form button[type="submit"],
.block_newsletter input.btn-primary[name="submitNewsletter"],
input[name="submitNewsletter"] {
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  background: var(--trojka-primary-dark, #0284c7) !important;
  color: #ffffff !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  font-weight: 700 !important;
  padding: 10px 22px !important;
  font-size: 14px !important;
  height: 44px !important;
  line-height: 22px !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
}

.block_newsletter form input[type="submit"]:hover,
.block_newsletter form button[type="submit"]:hover,
.block_newsletter input.btn-primary[name="submitNewsletter"]:hover,
input[name="submitNewsletter"]:hover {
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  background: var(--trojka-primary-darker, #0369a1) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(56, 189, 248, 0.55) !important;
  transform: none !important;
  text-decoration: none !important;
}

/* --------------------------------------------------------------------------
   16. JEDNOLITA KOLORYSTYKA I TYPOGRAFIA STOPKI (#footer)
   Wersja v3.2.6 - Precyzyjne sterowanie RWD: eliminacja dublowania
   nagłówków i strzałek na desktopie oraz płynny akordeon na smartfonach
   -------------------------------------------------------------------------- */
#footer {
  background-color: var(--trojka-bg-main, #090d16) !important;
  background: var(--trojka-bg-main, #090d16) !important;
  border-top: 1px solid var(--trojka-border-subtle, #1e293b) !important;
  padding-top: 40px !important;
  color: var(--trojka-text-main, #cbd5e1) !important;
  font-family: inherit !important;
}

.footer-container,
#footer .footer-container {
  background: transparent !important;
  background-color: transparent !important;
  border-top: none !important;
}

/* 1. Nagłówki kolumn stopki (Desktop / Bazowe) */
#footer p.h3,
#footer p.h4,
#footer .block-contact-title,
#footer .myaccount-title,
#footer .myaccount-title a,
#footer .blockcms-title,
#footer .blockcms-title a,
#footer .links > p.h3 {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  border-bottom: none !important;
  display: block !important;
  opacity: 1 !important;
}

#footer .myaccount-title a:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* 2. Linki w kolumnach stopki (Kontakt z nami, Sklepy, Śledzenie zamówienia...) */
#footer ul,
#footer .links ul,
#footer .account-list {
  padding-left: 0 !important;
  list-style: none !important;
  background-color: transparent !important;
  background: transparent !important;
  margin-bottom: 0 !important;
}

#footer ul li,
#footer .links ul > li,
#footer .account-list li {
  padding: 5px 0 !important;
  border: none !important;
  background-color: transparent !important;
  background: transparent !important;
}

#footer ul li a,
#footer .links ul > li a,
#footer .account-list li a,
#footer .links a {
  color: #cbd5e1 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  display: inline-block !important;
  text-decoration: none !important;
  border-bottom: none !important;
  transition: none !important;
  animation: none !important;
  transform: none !important;
}

#footer ul li a:hover,
#footer ul li a:focus,
#footer .links ul > li a:hover,
#footer .links ul > li a:focus,
#footer .account-list li a:hover,
#footer .account-list li a:focus,
#footer .links a:hover,
#footer .links a:focus {
  color: #7dd3fc !important;
  text-decoration: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* 3. Dane teleadresowe sklepu (INFORMACJA O SKLEPIE) */
#footer .block-contact,
#footer .block-contact #contact-infos,
#footer #contact-infos {
  color: #cbd5e1 !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  padding-left: 0 !important;
  padding-top: 0 !important;
}

/* Telefon w stopce - standardowa czcionka aktywnego linku */
#footer .block-contact a[href^="tel:"],
#footer #contact-infos a[href^="tel:"],
#footer a.btn-phone-footer,
#footer a.contact-phone-link {
  display: inline !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

#footer .block-contact a[href^="tel:"]:hover,
#footer #contact-infos a[href^="tel:"]:hover,
#footer a.btn-phone-footer:hover,
#footer a.contact-phone-link:hover {
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Email w stopce */
#footer .block-contact a[href^="mailto:"],
#footer #contact-infos a[href^="mailto:"],
#footer a.contact-email {
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  transition: color 0.15s ease !important;
}

#footer .block-contact a[href^="mailto:"]:hover,
#footer #contact-infos a[href^="mailto:"]:hover,
#footer a.contact-email:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* 4. RWD - DESKTOP (od 768px wzwyż) - CAŁKOWITE UKRYCIE MOBILNYCH DUBLI I STRZAŁEK */
@media (min-width: 768px) {
  #footer .hidden-md-up,
  #footer .title.hidden-md-up,
  #footer .links .title.hidden-md-up,
  #footer #block_myaccount_infos .title.hidden-md-up,
  #footer .block-contact .title.hidden-md-up,
  #footer .collapse-icons,
  #footer .navbar-toggler {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  #footer .hidden-sm-down,
  #footer p.h3.hidden-sm-down,
  #footer p.h4.hidden-sm-down,
  #footer .block-contact-title.hidden-sm-down,
  #footer .myaccount-title.hidden-sm-down {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
  }

  #footer .collapse,
  #footer ul.collapse,
  #footer #footer_account_list,
  #footer #contact-infos,
  #footer .links ul {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* 5. RWD - MOBILE (poniżej 768px) - INTERAKTYWNY AKORDEON STOPKI */
@media (max-width: 767px) {
  #footer .hidden-sm-down,
  #footer p.h3.hidden-sm-down,
  #footer p.h4.hidden-sm-down,
  #footer .block-contact-title.hidden-sm-down,
  #footer .myaccount-title.hidden-sm-down {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #footer .title.hidden-md-up,
  #footer .links .title,
  #footer #block_myaccount_infos .title,
  #footer .block-contact .title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    background: transparent !important;
  }

  #footer .title.hidden-md-up .h3,
  #footer .title.hidden-md-up h3,
  #footer .title.hidden-md-up span.h3 {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    margin: 0 !important;
    line-height: 1.2 !important;
  }

  #footer .collapse-icons {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #footer .collapse-icons .material-icons {
    font-size: 20px !important;
    color: #38bdf8 !important;
    line-height: 1 !important;
  }

  /* Zapewnienie, że w stanie zwiniętym widoczna jest tylko ikona "add", a "remove" jest ukryta */
  #footer .title .collapse-icons .add {
    display: inline-block !important;
  }
  #footer .title .collapse-icons .remove {
    display: none !important;
  }

  /* Po rozwinięciu akordeonu: zamiana ikon */
  #footer .title[aria-expanded="true"] .collapse-icons .add,
  #footer .title:not(.collapsed) .collapse-icons .add {
    display: none !important;
  }
  #footer .title[aria-expanded="true"] .collapse-icons .remove,
  #footer .title:not(.collapsed) .collapse-icons .remove {
    display: inline-block !important;
  }
}

/* 6. Kontener stopki i separator */
#footer .footer-container {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-bottom: 30px !important;
}

/* 7. Dolny pasek praw autorskich (Copyright) */
#footer .footer-after,
#footer .copyright,
#footer .text-sm-center,
#footer .text-sm-center a {
  color: #94a3b8 !important;
  font-size: 13px !important;
  text-align: center !important;
  text-decoration: none !important;
  border-bottom: none !important;
  transition: color 0.15s ease !important;
}

#footer .text-sm-center a:hover,
#footer .copyright a:hover {
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
}

/* --------------------------------------------------------------------------
   17. PASEK PRZEWIJANIA (CUSTOM SCROLLBARS)
   -------------------------------------------------------------------------- */
* {
  scrollbar-width: thin;
  scrollbar-color: #334155 #0b0f19;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #0b0f19;
}

::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 4px;
  border: 1px solid #334155;
}

::-webkit-scrollbar-thumb:hover {
  background: #38bdf8;
  border-color: #7dd3fc;
}


/* --------------------------------------------------------------------------
   18. PŁYNNE I POPRAWNE SKALOWANIE SLIDERA (ps_imageslider / #carousel)
   Wersja 2.0 - eliminuje błędy skalowania, zachowuje naturalne proporcje banera (1110x340)
   oraz płynną responsywność na desktopie, tabletach i telefonach (bez pustych przestrzeni)
   -------------------------------------------------------------------------- */
#carousel,
.carousel {
  background-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  margin-bottom: 2rem !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: var(--trojka-radius, 12px) !important;
}

#carousel .carousel-inner,
.carousel .carousel-inner {
  height: auto !important;
  max-height: 340px !important;
  background: transparent !important;
  border-radius: var(--trojka-radius, 12px) !important;
  overflow: hidden !important;
  width: 100% !important;
}

#carousel .carousel-item,
.carousel .carousel-item {
  height: auto !important;
  background: transparent !important;
  text-align: center;
}

#carousel .carousel-item figure,
.carousel .carousel-item figure {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  width: 100% !important;
  line-height: 0 !important;
}

#carousel .carousel-item img,
.carousel .carousel-item img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: var(--trojka-radius, 12px) !important;
}

/* Wygładzone strzałki nawigacji */
.carousel .carousel-control {
  opacity: 0.85 !important;
  transition: opacity 0.2s ease;
  z-index: 10 !important;
}

.carousel:hover .carousel-control {
  opacity: 1 !important;
}

.carousel .carousel-control .icon-prev i,
.carousel .carousel-control .icon-next i {
  color: var(--trojka-primary, #38bdf8) !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.9) !important;
  transition: transform 0.2s ease, color 0.2s ease;
}

.carousel .carousel-control:hover .icon-prev i {
  transform: translateX(-3px) scale(1.1);
  color: #ffffff !important;
}

.carousel .carousel-control:hover .icon-next i {
  transform: translateX(3px) scale(1.1);
  color: #ffffff !important;
}

/* Kropki / wskaźniki slajdów */
.carousel-indicators {
  bottom: 12px !important;
}

.carousel-indicators li {
  background-color: rgba(255, 255, 255, 0.35) !important;
  border: 1px solid rgba(0, 0, 0, 0.6) !important;
  border-radius: 9999px !important;
  width: 10px !important;
  height: 10px !important;
  margin: 0 4px !important;
  transition: all 0.25s ease !important;
}

.carousel-indicators li.active {
  background-color: var(--trojka-primary, #38bdf8) !important;
  width: 24px !important;
  border-radius: 9999px !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.7) !important;
}

/* Responsywność tablet (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
  #carousel .carousel-inner,
  .carousel .carousel-inner {
    max-height: 280px !important;
  }
}

/* Responsywność smartfony (< 768px) */
@media (max-width: 767px) {
  #carousel,
  .carousel {
    left: auto !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: var(--trojka-radius-sm, 8px) !important;
    background-color: transparent !important;
    padding-bottom: 0 !important;
  }

  #carousel .carousel-inner,
  .carousel .carousel-inner {
    height: auto !important;
    max-height: none !important;
    border-radius: var(--trojka-radius-sm, 8px) !important;
  }

  #carousel .carousel-item img,
  .carousel .carousel-item img {
    border-radius: var(--trojka-radius-sm, 8px) !important;
    width: 100% !important;
    height: auto !important;
  }

  .carousel-indicators {
    bottom: 6px !important;
  }
}


/* ==========================================================================
   19. GŁÓWNE TŁO I CZCIONKA POD OPISEM PRODUKTU
   Ustawienie głównego tła i czcionki pod całym opisem
   niezależnie od formatowania tekstu (np. z edytorów TinyMCE / Word)
   ========================================================================== */
.tab-content div.product-description,
#description div.product-description,
.page-product #description .product-description {
  background-color: var(--trojka-bg-card) !important;
  color: var(--trojka-text-main) !important;
  padding: 20px !important;
  border-radius: var(--trojka-radius, 12px) !important;
  line-height: 1.7 !important;
  border: 1px solid var(--trojka-border) !important;
}

/* Krótki opis pod ceną - nigdy nie wyświetla ramki ani tła karty */
.product-information div.product-description,
.product-information .product-description,
.product-description-short,
[id^="product-description-short"] {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Ochrona miniatur produktów w katalogu przed nadmiernym paddingiem */
.product-miniature div.product-description,
.product-miniature .product-description {
  background: transparent !important;
  background-color: transparent !important;
  padding: 8px 4px !important;
  border-radius: 0 !important;
}

/* Neutralizacja tła i dziedziczenie czcionki dla paragrafów oraz wszystkich znaczników wewnętrznych */
div.product-description p,
div.product-description span,
div.product-description div,
div.product-description ul,
div.product-description ol,
div.product-description li,
div.product-description table,
div.product-description thead,
div.product-description tbody,
div.product-description tr,
div.product-description td,
div.product-description th,
div.product-description font,
div.product-description strong,
div.product-description b,
div.product-description em,
div.product-description i,
div.product-description u,
div.product-description section,
div.product-description article {
  background: transparent !important;
  background-color: transparent !important;
  color: inherit !important;
}

/* Czytelne nagłówki wewnątrz opisu */
div.product-description h1,
div.product-description h2,
div.product-description h3,
div.product-description h4,
div.product-description h5,
div.product-description h6 {
  background-color: transparent !important;
  color: #ffffff !important;
}

/* Linki wewnątrz opisu (bez podkreśleń) */
div.product-description a {
  color: var(--trojka-primary, #38bdf8) !important;
  text-decoration: none !important;
}

div.product-description a:hover {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  text-decoration: none !important;
}

/* --------------------------------------------------------------------------
   19. GLOBALNE USUNIĘCIE WSZELKICH PODKREŚLEŃ LINKÓW I STANÓW AKTYWNYCH
   (Bez usuwania dolnych ramek przycisków, zapobiega skakaniu klawiszy)
   -------------------------------------------------------------------------- */
a,
a:hover,
a:focus,
a:active,
a:visited,
.product-title a,
.product-miniature a,
.breadcrumb a,
.subcategories a,
div.product-description a {
  text-decoration: none !important;
}


/* ==========================================================================
   SEO HOMEPAGE H1 HEADING (v3.1.1)
   ========================================================================== */
.page-home-title.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* ==========================================================================
   TRYB KATALOGU: PRZYCISK CTA ZAMÓW TELEFONICZNIE ORAZ UKRYCIE KOSZYKA (v3.1.2)
   ========================================================================== */

/* Ukrycie modułu koszyka w trybie katalogu */
body.catalog-mode #_desktop_cart,
body.catalog-mode #_mobile_cart,
body.catalog-mode .blockcart,
#header .blockcart.inactive,
#_desktop_cart.is-catalog-hidden,
#_mobile_cart.is-catalog-hidden {
  display: none !important;
  visibility: hidden !important;
}

/* Karta produktu - Wyrazisty przycisk CTA zamowienia telefonicznego */
.product-phone-order-cta {
  margin: 1.5rem 0 1.25rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.btn-phone-order,
a.btn-phone-order {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  color: #ffffff !important;
  padding: 10px 16px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  box-shadow: 0 4px 16px rgba(2, 132, 199, 0.35) !important;
  text-decoration: none !important;
  transition: all 0.2s ease-in-out !important;
  cursor: pointer !important;
  text-align: left !important;
  width: 100% !important;
  max-width: 440px !important;
  white-space: normal !important;
  box-sizing: border-box !important;
}

.btn-phone-order:hover,
.btn-phone-order:focus {
  background: linear-gradient(135deg, #0369a1 0%, #075985 100%) !important;
  transform: none !important;
  box-shadow: 0 6px 24px rgba(2, 132, 199, 0.5) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  border-color: rgba(56, 189, 248, 0.7) !important;
}

.btn-phone-order .phone-icon-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  color: #ffffff !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  transition: all 0.2s ease !important;
}

.btn-phone-order:hover .phone-icon-badge {
  background: rgba(255, 255, 255, 0.28) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  transform: scale(1.05);
}

.btn-phone-order .phone-svg-icon {
  width: 20px !important;
  height: 20px !important;
  stroke: #ffffff !important;
  stroke-width: 2.2 !important;
  fill: none !important;
  vertical-align: middle !important;
  display: block !important;
}

.btn-phone-order .phone-icon {
  font-size: 20px !important;
  color: #ffffff !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  flex-shrink: 0 !important;
}

/* Karta pustego wyniku wyszukiwania z CTA telefonicznym */
.search-empty-results {
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, rgba(56, 189, 248, 0.2)) !important;
  border-radius: var(--trojka-radius, 10px) !important;
  padding: 36px 24px !important;
  margin: 24px auto !important;
  max-width: 680px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
  text-align: center !important;
}

.search-empty-results h4 {
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin-bottom: 12px !important;
  line-height: 1.3 !important;
}

.search-empty-results .search-empty-hint {
  color: #cbd5e1 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  max-width: 580px !important;
  margin: 0 auto 22px auto !important;
}

.search-empty-results .btn-phone-order {
  margin: 0 auto !important;
  text-align: left !important;
}

.btn-phone-order .cta-label-wrapper {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  text-align: left !important;
  gap: 2px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Linia 1: SPYTAJ O DOSTĘPNOŚĆ */
.btn-phone-order .cta-main-text,
.btn-phone-order .cta-action-title {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

/* Linia 2: +48 22 669 99 23 */
.btn-phone-order .cta-phone-number,
.btn-phone-order .cta-phone-line {
  display: block !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  color: #ffffff !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}

.btn-phone-order .cta-sub-text {
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  color: #bae6fd !important;
  line-height: 1.2 !important;
}

.product-phone-order-cta .store-pickup-hint,
.store-pickup-hint {
  display: none !important;
  align-items: center !important;
  gap: 6px !important;
  color: #94a3b8 !important;
  font-size: 0.82rem !important;
  padding-left: 2px !important;
}

.product-phone-order-cta .store-pickup-hint .store-icon {
  font-size: 16px !important;
  color: #38bdf8 !important;
}

/* Wersja mobilna: precyzyjne dopasowanie bez wychodzenia poza okno */
@media (max-width: 767.98px) {
  .product-phone-order-cta {
    width: 100% !important;
    max-width: 100% !important;
    margin: 1rem 0 0.85rem 0 !important;
  }

  .btn-phone-order,
  a.btn-phone-order {
    padding: 8px 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 10px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
  }

  .btn-phone-order .phone-icon-badge {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
  }

  .btn-phone-order .phone-svg-icon {
    width: 18px !important;
    height: 18px !important;
  }

  .btn-phone-order .cta-main-text,
  .btn-phone-order .cta-action-title {
    font-size: 11.5px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
  }

  .btn-phone-order .cta-phone-number,
  .btn-phone-order .cta-phone-line {
    font-size: 14px !important;
    line-height: 1.2 !important;
    letter-spacing: 0.03em !important;
    white-space: nowrap !important;
  }
}


/* ==========================================================================
   MODALE INFORMACYJNE STOPKI: REGULAMIN, RODO I STOPKA (v3.2.0)
   ========================================================================== */

.footer-legal-bar {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-legal-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px 12px;
  font-size: 0.85rem;
  margin-bottom: 0.75rem;
}

.footer-legal-links a {
  color: #94a3b8 !important;
  text-decoration: none !important;
  transition: color 0.15s ease;
}

.footer-legal-links a:hover {
  color: #38bdf8 !important;
  text-decoration: underline !important;
}

.footer-legal-separator {
  color: #475569 !important;
  font-size: 0.75rem;
}

.footer-copyright-text {
  font-size: 0.8rem;
  color: #64748b;
  margin: 0;
}

.footer-copyright-text a {
  color: #38bdf8 !important;
  text-decoration: none !important;
}

/* Modale prawne */
.trojka-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.trojka-modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 23, 42, 0.8);
  backdrop-filter: blur(4px);
}

.trojka-modal-dialog {
  position: relative;
  z-index: 2;
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 12px;
  width: 100%;
  max-width: 650px;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
  color: #f1f5f9;
  overflow: hidden;
}

.trojka-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid #334155;
}

.trojka-modal-header h3 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: #ffffff;
}

.trojka-modal-close {
  background: transparent;
  border: none;
  font-size: 1.75rem;
  color: #94a3b8;
  cursor: pointer;
  line-height: 1;
  padding: 0;
}

.trojka-modal-close:hover {
  color: #ffffff;
}

.trojka-modal-body {
  padding: 1.5rem;
  overflow-y: auto;
  font-size: 0.9rem;
  line-height: 1.6;
  color: #cbd5e1;
}

.trojka-modal-body h4 {
  font-size: 0.95rem;
  font-weight: 700;
  color: #38bdf8;
  margin-top: 1rem;
  margin-bottom: 0.35rem;
}

.trojka-modal-body h4:first-child {
  margin-top: 0;
}

.trojka-modal-body p {
  margin-bottom: 0.75rem;
}

.trojka-modal-footer {
  padding: 1rem 1.5rem;
  border-top: 1px solid #334155;
  display: flex;
  justify-content: flex-end;
  background: #0f172a;
}

body.trojka-modal-open {
  overflow: hidden !important;
}


/* ==============================================================================
 * POPRAWKI AUDYTU WERSJI 2.4 (pilot.com.pl)
 * ============================================================================== */

/* 1. Naprawa kontrastu numeru telefonu pod slajderem i w blokach tekstu */
#custom-text a[href^="tel:"],
.page-home a[href^="tel:"],
.block-contact a[href^="tel:"] {
  color: #38bdf8 !important;
  font-weight: 700 !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(56, 189, 248, 0.12);
  padding: 10px 22px;
  border-radius: 9999px;
  border: 1px solid rgba(56, 189, 248, 0.3);
  text-decoration: none !important;
  transition: all 0.2s ease;
}
#custom-text a[href^="tel:"]:hover,
.page-home a[href^="tel:"]:hover {
  background: #38bdf8 !important;
  color: #090d16 !important;
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.4);
}

/* 2. Ukrycie zbednego paska breadcrumb na stronie glownej */
body#index .breadcrumb {
  display: none !important;
}

/* 3. Estetyka przyciskow kontaktu i WhatsApp na karcie produktu */
.btn-phone-call, .btn-whatsapp-help {
  font-weight: 700 !important;
  border-radius: 8px !important;
  padding: 12px 18px !important;
  transition: all 0.2s ease !important;
}
.btn-phone-call {
  background: #38bdf8 !important;
  color: #090d16 !important;
  border: none !important;
}
.btn-phone-call:hover {
  background: #0284c7 !important;
  color: #ffffff !important;
}
.btn-whatsapp-help {
  background: #10b981 !important;
  color: #ffffff !important;
  border: none !important;
}
.btn-whatsapp-help:hover {
  background: #059669 !important;
}

/* ============================================================================== *
 * USUNIĘCIE KOMENTARZY O PRODUKCIE I FORMULARZA OPINII (pilot.com.pl v3.2.8)    *
 * ============================================================================== */
#product-comments-list-header,
.product-comments-list-header,
#product-comments-list,
.product-comments-list,
.post-product-comment,
#post-product-comment-modal,
.product-comment-modal,
.product-list-reviews,
.product-comments-additional-info,
[data-module="productcomments"],
.comments_advices,
#productcomments-block-tab,
.post-comment-button,
a.post-product-comment,
button.post-product-comment {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ==============================================================================
 * ZMIANY WERSJI v3.2.9 (pilot.com.pl):
 * 1. Ujednolicenie karty /kontakt (jasna czcionka na ciemnym tle)
 * 2. Umieszczenie napisu Brutto przy cenie w tym samym kolorze
 * 3. Usunięcie ramki pod napisem brutto we wszystkich produktach
 * ============================================================================== */

/* --- 1. STRONA KONTAKT (PILOT.COM.PL/KONTAKT) --- */
body#contact,
.page-contact,
.page-contact #wrapper,
.page-contact #content-wrapper {
  background-color: var(--trojka-bg-main, #090d16) !important;
  background: var(--trojka-bg-main, #090d16) !important;
}

/* Lewa karta: Dane kontaktowe sklepu */
.page-contact #left-column .contact-rich,
.contact-rich,
.trojka-contact-card {
  background: var(--trojka-bg-card, #111827) !important;
  background-color: var(--trojka-bg-card, #111827) !important;
  border: 1px solid var(--trojka-border, #1e293b) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  padding: 24px !important;
  color: var(--trojka-text-main, #f1f5f9) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

.contact-rich h4,
.trojka-contact-title {
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  margin-bottom: 18px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--trojka-border, #1e293b) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.contact-rich .block,
.trojka-contact-block {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

.contact-rich .icon i {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 22px !important;
  line-height: 1.4 !important;
}

.contact-rich .data,
.trojka-contact-block .data {
  color: #e2e8f0 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.contact-rich .contact-label {
  color: #94a3b8 !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  font-weight: 600 !important;
  display: inline-block !important;
  margin-bottom: 2px !important;
}

.contact-rich a,
.contact-phone-link,
.contact-email-link {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

.contact-rich a:hover,
.contact-phone-link:hover,
.contact-email-link:hover {
  color: #7dd3fc !important;
  text-decoration: underline !important;
}

.contact-rich hr,
.trojka-contact-divider {
  border-color: var(--trojka-border, #1e293b) !important;
  border-top: 1px solid var(--trojka-border, #1e293b) !important;
  margin: 16px 0 !important;
  opacity: 0.7 !important;
}

/* Prawa karta: Formularz kontaktowy - Usunięcie podwójnej ramki */
body#contact #content,
body#contact #content.page-content,
body#contact #content-wrapper #content,
body#contact #content.card,
.page-contact #content,
.page-contact #content.page-content,
.page-contact #content.card,
.page-contact .card,
.page-contact .card-block,
.page-contact .trojka-contact-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Jedyna, estetyczna karta formularza kontaktowego */
.page-contact section.contact-form,
.trojka-contact-form {
  background: var(--trojka-bg-card, #111827) !important;
  background-color: var(--trojka-bg-card, #111827) !important;
  border: 1px solid var(--trojka-border, #1e293b) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  padding: 32px !important;
  color: var(--trojka-text-main, #f1f5f9) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

.trojka-contact-header,
.contact-form h3 {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  margin-bottom: 24px !important;
  letter-spacing: -0.02em !important;
}

.contact-form .form-control-label {
  color: #f1f5f9 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding-top: 10px !important;
}

.contact-form .form-control,
.contact-form select.form-control,
.contact-form textarea.form-control,
.contact-form input.form-control {
  background: var(--trojka-bg-darkest, #0b0f19) !important;
  background-color: var(--trojka-bg-darkest, #0b0f19) !important;
  color: #ffffff !important;
  border: 1px solid #334155 !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4) !important;
  transition: all 0.2s ease !important;
}

.contact-form .form-control:focus,
.contact-form select.form-control:focus,
.contact-form textarea.form-control:focus,
.contact-form input.form-control:focus {
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.25) !important;
  outline: none !important;
  color: #ffffff !important;
}

.contact-form .form-control::placeholder,
.contact-form textarea.form-control::placeholder,
.contact-form input.form-control::placeholder {
  color: #94a3b8 !important;
}

.contact-form select option {
  background-color: #0b0f19 !important;
  color: #ffffff !important;
  padding: 8px !important;
}

.contact-form .form-control-comment {
  color: #94a3b8 !important;
  font-size: 12px !important;
  padding-top: 10px !important;
}

/* Przycisk 'Wybierz plik' i pole załącznika w formularzu kontaktowym */
.contact-form .bootstrap-filestyle,
.bootstrap-filestyle {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
}

.contact-form .bootstrap-filestyle input.form-control,
.bootstrap-filestyle input.form-control {
  background: var(--trojka-bg-darkest, #0b0f19) !important;
  background-color: var(--trojka-bg-darkest, #0b0f19) !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
  border-right: none !important;
  border-radius: 8px 0 0 8px !important;
  height: 42px !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  flex: 1 1 auto !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

.contact-form .group-span-filestyle,
.group-span-filestyle {
  display: flex !important;
  flex: 0 0 auto !important;
}

.contact-form .group-span-filestyle .btn-default,
.contact-form .group-span-filestyle label,
.contact-form .bootstrap-filestyle .btn,
.group-span-filestyle .btn-default,
.group-span-filestyle label {
  background: var(--trojka-primary, #0284c7) !important;
  background-color: var(--trojka-primary, #0284c7) !important;
  color: #ffffff !important;
  border: 1px solid var(--trojka-primary, #0284c7) !important;
  border-radius: 0 8px 8px 0 !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 10px 20px !important;
  margin: 0 !important;
  height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(2, 132, 199, 0.3) !important;
}

.contact-form .group-span-filestyle .btn-default:hover,
.contact-form .group-span-filestyle label:hover,
.contact-form .bootstrap-filestyle .btn:hover,
.group-span-filestyle .btn-default:hover,
.group-span-filestyle label:hover {
  background: var(--trojka-primary-hover, #0369a1) !important;
  background-color: var(--trojka-primary-hover, #0369a1) !important;
  border-color: var(--trojka-primary-hover, #0369a1) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.5) !important;
}

/* Likwidacja czarnego pola przy przycisku WYŚLIJ (ukrycie pola honeypot url i reset tła stopki) */
.contact-form input[name="url"],
.contact-form input[name=url],
.page-contact input[name="url"],
.page-contact input[name=url],
input[name="url"],
.trojka-honeypot {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -9999px !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

.contact-form .form-footer,
.page-contact .form-footer,
.page-contact footer.form-footer,
footer.form-footer {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 10px 0 0 0 !important;
  margin: 16px 0 0 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.contact-form .btn-primary,
.contact-form .trojka-btn-submit {
  background: var(--trojka-primary, #0284c7) !important;
  background-color: var(--trojka-primary, #0284c7) !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 12px 32px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.35) !important;
}

.contact-form .btn-primary:hover,
.contact-form .trojka-btn-submit:hover {
  background: var(--trojka-primary-hover, #0369a1) !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.5) !important;
  transform: none !important;
}

/* --- 2. CENA PRODUKTU I BRUTTO W TYM SAMYM KOLORZE --- */
.product-prices .current-price {
  display: inline-flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 4px !important;
}

.product-prices .current-price-value,
.current-price .current-price-value {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}

/* Etykieta Brutto przy cenie - w tym samym kolorze co cena */
.current-price .tax-label-inline,
.current-price .current-price-tax-label,
.product-prices .tax-shipping-delivery-label,
.product-prices .tax-label-inline {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  border: none !important;
  border-bottom: none !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* --- 3. CAŁKOWITE USUNIĘCIE RAMKI POD NAPISEM BRUTTO WE WSZYSTKICH PRODUKTACH --- */
.product-prices,
.product-prices > div,
.product-prices .tax-shipping-delivery-label,
.product-information,
.product-information #product-description-short,
.product-information [id^="product-description-short"],
.product-information .product-description,
.product-description-short {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Ukrycie pustego kontenera opisu, jeśli produkt nie posiada opisu skróconego */
.product-information [id^="product-description-short"]:empty,
.product-information .product-description:empty,
.product-information #product-description-short:empty,
div#product-description-short:empty {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: transparent !important;
}

/* Wyczyszczenie stylizacji karty dla skróconego opisu w nagłówku produktu */
.product-information [id^="product-description-short"],
.product-information div.product-description,
.product-information .product-description {
  background: transparent !important;
  background-color: transparent !important;
  padding: 4px 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--trojka-text-muted, #94a3b8) !important;
}

/* ==========================================================================
   WERSJA v3.3.1: STOPKA (PAW. 67, TELEFON W CZCIONCE LINKU, EMAIL PONIŻEJ, BEZ PODKREŚLEŃ COOKIE, BANER WWW.TROJKA.PL)
   1. Stopka: Ustawienia cookie w jednej linii z danymi rejestrowymi (bez podkreśleń, paw. 67)
   2. Telefon w stopce w standardowej czcionce aktywnego linku, e-mail poniżej "Napisz do nas"
   3. Sekcja zachęty do sklepu stacjonarnego Trójka Electronics www.trojka.pl
   ========================================================================== */

/* --- 1. STOPKA: DANE FIRMY + USTAWIENIA COOKIE W JEDNEJ LINII --- */
.trojka-footer-legal-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
}

.trojka-footer-company-text {
  color: #e2e8f0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

.trojka-footer-cookie-wrapper {
  margin-left: auto !important;
  text-align: right !important;
}

.trojka-cookie-settings-link,
a.trojka-cookie-settings-link,
.js-open-cookie-settings {
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.trojka-cookie-settings-link i,
a.trojka-cookie-settings-link i,
.js-open-cookie-settings i {
  color: #38bdf8 !important;
  font-size: 15px !important;
}

.trojka-cookie-settings-link:hover,
.trojka-cookie-settings-link:hover span,
.trojka-cookie-settings-link:hover i,
a.trojka-cookie-settings-link:hover,
a.trojka-cookie-settings-link:hover span,
a.trojka-cookie-settings-link:hover i,
.trojka-cookie-settings-link:focus,
.trojka-cookie-settings-link:focus span,
.trojka-cookie-settings-link:focus i,
a.trojka-cookie-settings-link:focus,
a.trojka-cookie-settings-link:focus span,
a.trojka-cookie-settings-link:focus i,
.js-open-cookie-settings:hover,
.js-open-cookie-settings:hover span,
.js-open-cookie-settings:hover i {
  color: #7dd3fc !important;
  text-decoration: none !important;
  border-bottom: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.trojka-cookie-settings-link:active,
a.trojka-cookie-settings-link:active {
  color: #7dd3fc !important;
  text-decoration: none !important;
  border-bottom: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

@media (max-width: 767px) {
  .trojka-footer-legal-row {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }
  .trojka-footer-company-text,
  .trojka-footer-cookie-wrapper {
    margin-left: 0 !important;
    text-align: center !important;
  }
}

/* --- 2. WYŁĄCZENIE WSZELKICH ANIMACJI, PRZEJŚĆ I TRANSFORMACJI PRZYCISKÓW (CTA, SUBSKRYBUJ, PRZYCISKI) --- */
button,
.btn,
.btn-primary,
.btn-secondary,
.btn-tertiary,
.btn-phone-order,
.btn-phone-call,
.btn-whatsapp-help,
.add-to-cart,
.add-to-cart-btn,
input[type="submit"],
input[type="button"],
button[type="submit"],
.block_newsletter form input[type="submit"],
.block_newsletter form button[type="submit"],
.block_newsletter input.btn-primary[name="submitNewsletter"],
input[name="submitNewsletter"],
a.btn,
a.btn-primary,
a.btn-phone-order,
.contact-form .btn-primary,
.wishlist-modal .btn-primary,
.modal-footer .btn-primary,
#trojka-cb3-btn-all,
#trojka-cb3-btn-necessary,
#trojka-cb3-btn-save {
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

button:hover,
button:focus,
button:active,
.btn:hover,
.btn:focus,
.btn:active,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-phone-order:hover,
.btn-phone-order:focus,
.btn-phone-order:active,
.add-to-cart:hover,
.add-to-cart:focus,
.add-to-cart:active,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
button[type="submit"]:hover,
button[type="submit"]:focus,
button[type="submit"]:active,
.block_newsletter form input[type="submit"]:hover,
.block_newsletter form input[type="submit"]:focus,
.block_newsletter form input[type="submit"]:active,
a.btn:hover,
a.btn:focus,
a.btn:active,
a.btn-phone-order:hover,
a.btn-phone-order:focus,
a.btn-phone-order:active,
.contact-form .btn-primary:hover,
.contact-form .btn-primary:focus,
.contact-form .btn-primary:active,
.pagination .page-list a:hover,
.pagination .page-list a:focus,
.pagination .page-list a:active {
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* --- 3. JEDNOLITA KOLORYSTYKA KLAWISZY (BIAŁY NAPIS, NIEBIESKAWY PO NACIŚNIĘCIU, NIEBIESKI NA AKTYWNEJ STRONIE) --- */

/* A. Menu górne i kategorie (PILOTY RTV, PILOTY DO BRAM itd.) - Klawisze z ramkami, BEZ SKAKANIA I BEZ POGRUBIENIA */
.top-menu .category > a,
.top-menu a[data-depth="0"],
.menu.js-top-menu a {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-top: 1px solid #334155 !important;
  border-right: 1px solid #334155 !important;
  border-bottom: 1px solid #334155 !important;
  border-left: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

.top-menu .category > a:hover,
.top-menu a[data-depth="0"]:hover,
.top-menu .category > a:focus,
.top-menu a[data-depth="0"]:focus,
.menu.js-top-menu a:hover,
.menu.js-top-menu a:focus {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #1e293b !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc), brak drgania */
.top-menu .category > a:active,
.top-menu a[data-depth="0"]:active,
.menu.js-top-menu a:active {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #0f172a !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* Na aktywnej stronie: JASNY NIEBIESKI Z BIAŁĄ CZCIONKĄ */
.top-menu li.current > a,
.top-menu li.active-parent > a,
.top-menu a[data-depth="0"].active,
.top-menu a.active,
.menu.js-top-menu li.current > a,
.menu.js-top-menu a.active,
.top-menu a[aria-current="page"] {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  cursor: default !important;
}

/* B. Drzewo kategorii w panelu bocznym (Klawisze z ramkami, stabilne 1px bez skakania) */
.block-categories .category-sub-menu a,
.block-categories a {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-top: 1px solid #334155 !important;
  border-right: 1px solid #334155 !important;
  border-bottom: 1px solid #334155 !important;
  border-left: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  line-height: 1.2 !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

.block-categories .category-sub-menu a:hover,
.block-categories a:hover {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #1e293b !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.block-categories .category-sub-menu a:active,
.block-categories a:active {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #0f172a !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* Na aktywnej stronie: JASNONIEBIESKIE TŁO (#0284c7 / #38bdf8) Z BIAŁĄ CZCIONKĄ (#ffffff) */
.block-categories .category-sub-menu li.current > a,
.block-categories .category-sub-menu a.active,
.block-categories .category-sub-menu li.active > a,
.block-categories a.active,
.block-categories li.current > a {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 8px 14px !important;
  margin: 0 0 4px 0 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
  cursor: default !important;
}

/* Filtry wyszukiwania po lewej stronie (#search_filters) - usunięto jasną belkę i skakanie napisu */
#search_filters .facet label,
#search_filters .facet .facet-label a,
#search_filters .facet a,
.facet-label a {
  color: #ffffff !important;
  font-size: 13.5px !important;
  text-decoration: none !important;
  border: none !important;
  /* border-left: none removed */
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transform: none !important;
  animation: none !important;
  transition: color 0.15s ease !important;
}

#search_filters .facet label:hover,
#search_filters .facet .facet-label a:hover,
#search_filters .facet a:hover,
.facet-label a:hover {
  color: #38bdf8 !important;
  background: transparent !important;
  border: none !important;
  text-decoration: none !important;
}

#search_filters .facet label:active,
#search_filters .facet label.active,
#search_filters .facet .facet-label.active a,
.facet-label.active a,
#search_filters .facet a:active,
#search_filters .facet a.active {
  color: #38bdf8 !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  /* border-left: none removed */
  box-shadow: none !important;
  transform: none !important;
  animation: none !important;
  font-weight: 700 !important;
}

/* C. Zakładki w karcie produktu (OPCJA A: Klawisze stabilne bez skakania) */
.nav-tabs .nav-link,
.nav-tabs a {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid #334155 !important;
  border-top: 1px solid #334155 !important;
  border-right: 1px solid #334155 !important;
  border-bottom: 1px solid #334155 !important;
  border-left: 1px solid #334155 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  transform: none !important;
  animation: none !important;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #1e293b !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.nav-tabs .nav-link:active {
  box-sizing: border-box !important;
  color: #7dd3fc !important;
  background: #0f172a !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  outline-width: 0 !important;
  transform: none !important;
  animation: none !important;
}

/* Aktywna zakładka: wyrazisty błękitny klawisz z poświatą */
.nav-tabs .nav-link.active,
.nav-tabs li.active .nav-link {
  box-sizing: border-box !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 9px 18px !important;
  margin: 0 !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.45), 0 0 10px rgba(56, 189, 248, 0.3) !important;
  outline: none !important;
  outline-width: 0 !important;
  cursor: default !important;
}

/* D. Paginacja stron katalogu */
.pagination .page-list a {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  transition: none !important;
  animation: none !important;
  transform: none !important;
}

.pagination .page-list a:hover {
  color: #7dd3fc !important;
  border-color: #38bdf8 !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.pagination .page-list a:active {
  color: #7dd3fc !important;
  border-color: #38bdf8 !important;
}

/* Aktywna strona w paginacji: maksymalnie czytelny kontrast (jasny błękit #38bdf8 z ciemną cyfrą #020617) */
.pagination .page-list li.current,
.pagination .page-list li.active {
  opacity: 1 !important;
}

.pagination .page-list li.current a,
.pagination .page-list li.current a.disabled,
.pagination .page-list li.current a.js-search-link,
.pagination .page-list a.active,
.pagination .page-list a.current,
.pagination .page-list a[aria-current="page"] {
  color: #020617 !important;
  border-color: #38bdf8 !important;
  border: 1px solid #38bdf8 !important;
  background: #38bdf8 !important;
  background-color: #38bdf8 !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 0 16px rgba(56, 189, 248, 0.55), 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  pointer-events: none !important;
  cursor: default !important;
}

/* E. Klawisz CTA "Spytaj o dostępność ..." w karcie produktu */
.btn-phone-order,
a.btn-phone-order {
  color: #ffffff !important;
  background: #0284c7 !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.3) !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.btn-phone-order .cta-main-text {
  color: #ffffff !important;
}

.btn-phone-order:hover,
.btn-phone-order:focus {
  color: #ffffff !important;
  background: #0284c7 !important;
  border-color: rgba(56, 189, 248, 0.7) !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.btn-phone-order:active {
  color: #7dd3fc !important;
  background: #0369a1 !important;
  border-color: #38bdf8 !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.btn-phone-order:active .cta-main-text {
  color: #7dd3fc !important;
}

/* F. Przycisk SUBSKRYBUJ i formularz newslettera */
.block_newsletter form input[type="submit"],
.block_newsletter form button[type="submit"],
.block_newsletter input.btn-primary[name="submitNewsletter"],
input[name="submitNewsletter"] {
  color: #ffffff !important;
  background: #0284c7 !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.block_newsletter form input[type="submit"]:hover,
.block_newsletter form button[type="submit"]:hover,
.block_newsletter input.btn-primary[name="submitNewsletter"]:hover,
input[name="submitNewsletter"]:hover {
  color: #ffffff !important;
  background: #0284c7 !important;
  border-color: #38bdf8 !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.block_newsletter form input[type="submit"]:active,
.block_newsletter form button[type="submit"]:active,
.block_newsletter input.btn-primary[name="submitNewsletter"]:active,
input[name="submitNewsletter"]:active {
  color: #7dd3fc !important;
  background: #0369a1 !important;
  border-color: #38bdf8 !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* G. Ogólne przyciski (.btn-primary, .btn, przyciski formularzy) */
.btn-primary,
.btn,
button.btn-primary,
button.btn,
a.btn-primary,
a.btn,
.contact-form .btn-primary {
  color: #ffffff !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.btn-primary:hover,
.btn:hover,
button.btn-primary:hover,
button.btn:hover,
a.btn-primary:hover,
a.btn:hover,
.contact-form .btn-primary:hover {
  color: #ffffff !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Po naciśnięciu: niebieskawy (#7dd3fc) */
.btn-primary:active,
.btn:active,
button.btn-primary:active,
button.btn:active,
a.btn-primary:active,
a.btn:active,
.contact-form .btn-primary:active {
  color: #7dd3fc !important;
  border-color: #38bdf8 !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Przyciski w stanie aktywnym / wybranym (.active, .selected, .is-active, .is-selected) */
.btn.active,
.btn.selected,
.btn.is-active,
.btn.is-selected,
.btn-primary.active,
button.active,
.trojka-cb3-action-btn.is-selected {
  color: #38bdf8 !important;
  border-color: #38bdf8 !important;
  font-weight: 700 !important;
}

/* ==========================================================================
   H. JEDNOLITY NIEBIESKAWY KOLOR DLA WSZYSTKICH AKTYWNYCH LINKÓW PO NAJECHANIU
   (Identyczny jak w napisie PILOTY RTV: #7dd3fc)
   ========================================================================== */
/* Ustawienia cookie */
.trojka-cookie-settings-link:hover,
a.trojka-cookie-settings-link:hover,
.js-open-cookie-settings:hover,
.footer-legal-links a:hover,
.footer-legal-links a.js-open-cookie-settings:hover {
  color: #7dd3fc !important;
  text-decoration: none !important;
}

/* Śledzenie zamówienia, Zaloguj się, Utwórz konto, Twoje konto w stopce */
#block_myaccount_infos a:hover,
#block_myaccount_infos a:focus,
#footer .account-list li a:hover,
#footer .account-list li a:focus,
#footer .account-list a:hover,
#footer .account-list a:focus,
#footer .links ul > li a:hover,
#footer .links ul > li a:focus,
#footer ul li a:hover,
#footer ul li a:focus,
#footer .links a:hover,
#footer .links a:focus,
#footer a:not(.btn):hover,
#footer a:not(.btn):focus {
  color: #7dd3fc !important;
  text-decoration: none !important;
}

/* Linki w nagłówku i pasku użytkownika (Zaloguj się, Moje konto, Koszyk, Kontakt) */
.header-nav a:hover,
.header-nav .user-info a:hover,
#_desktop_user_info a:hover,
#_mobile_user_info a:hover,
#contact-link a:hover,
#_desktop_contact_link a:hover {
  color: #7dd3fc !important;
  text-decoration: none !important;
}

/* Linki w okruszkach chleba, kartach i blokach tekstowych */
.breadcrumb a:hover,
.product-description a:hover,
.page-footer a:hover {
  color: #7dd3fc !important;
  text-decoration: none !important;
}

/* ==========================================================================
   I. CAŁKOWITE USUNIĘCIE NIEAKTYWNEGO KLAWISZA "POWRÓT DO GÓRY" W WERSJI MOBILNEJ
   ========================================================================== */
.up,
#js-product-list .up,
.back-to-top,
a[href="#header"].btn,
.pagination + .up {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ==========================================================================
   II. CAŁKOWITE WYŁĄCZENIE ZAPISU NA NEWSLETTER (MODUŁ PS_EMAILSUBSCRIPTION)
   ========================================================================== */
.block_newsletter,
#blockEmailSubscription_displayFooterBefore,
#blockEmailSubscription_displayLeftColumn,
#blockEmailSubscription_displayRightColumn,
.ps-emailsubscription,
.block_newsletter_column {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* ==========================================================================
   III. GLOBALNE KOMUNIKATY I ALERTY PRESTASHOP (DARK TECH - CONTRAST AAA)
   Rozwiązuje problem jasnych alertów z niewidocznym tekstem (wcag 2.1 AAA)
   ========================================================================== */
.alert,
#notifications .alert,
aside#notifications .alert,
.trojka-alert {
  border-radius: var(--trojka-radius, 12px) !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  padding: 16px 20px !important;
  margin-bottom: 20px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
  border: 1px solid transparent !important;
}

/* Alerty sukcesu (.alert-success) */
.alert-success,
#notifications .alert-success,
aside#notifications .alert-success,
.trojka-alert-success {
  background-color: rgba(6, 78, 59, 0.85) !important;
  background: linear-gradient(135deg, rgba(6, 78, 59, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: #10b981 !important;
  color: #ecfdf5 !important;
}

.alert-success ul,
.alert-success li,
.alert-success p,
.alert-success span,
#notifications .alert-success li,
#notifications .alert-success span {
  color: #ecfdf5 !important;
  font-weight: 500 !important;
}

/* Alerty błędów (.alert-danger) */
.alert-danger,
#notifications .alert-danger,
aside#notifications .alert-danger,
.trojka-alert-danger {
  background-color: rgba(127, 29, 29, 0.85) !important;
  background: linear-gradient(135deg, rgba(127, 29, 29, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: #ef4444 !important;
  color: #fef2f2 !important;
}

.alert-danger ul,
.alert-danger li,
.alert-danger p,
.alert-danger span,
#notifications .alert-danger li,
#notifications .alert-danger span {
  color: #fef2f2 !important;
  font-weight: 500 !important;
}

/* Alerty ostrzeżeń (.alert-warning) */
.alert-warning,
#notifications .alert-warning,
aside#notifications .alert-warning {
  background-color: rgba(120, 53, 15, 0.85) !important;
  background: linear-gradient(135deg, rgba(120, 53, 15, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: #f59e0b !important;
  color: #fffbeb !important;
}

.alert-warning ul,
.alert-warning li,
.alert-warning p,
.alert-warning span {
  color: #fffbeb !important;
  font-weight: 500 !important;
}

/* Alerty informacyjne (.alert-info) */
.alert-info,
#notifications .alert-info,
aside#notifications .alert-info {
  background-color: rgba(12, 74, 110, 0.85) !important;
  background: linear-gradient(135deg, rgba(12, 74, 110, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  border-color: #0284c7 !important;
  color: #f0f9ff !important;
}

.alert-info ul,
.alert-info li,
.alert-info p,
.alert-info span {
  color: #f0f9ff !important;
  font-weight: 500 !important;
}

.alert ul {
  margin: 0 !important;
  padding-left: 20px !important;
}

/* ==========================================================================
   IV. DEDYKOWANA KARTA POTWIERDZENIA FORMULARZA KONTAKTOWEGO (.trojka-contact-success-card)
   "Twoja wiadomość została pomyślnie wysłana do obsługi"
   ========================================================================== */
.trojka-contact-success-card {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.98) 0%, rgba(9, 13, 22, 0.98) 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.4) !important;
  border-radius: 16px !important;
  padding: 40px 32px !important;
  margin: 20px 0 35px 0 !important;
  box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.7), 0 0 25px rgba(16, 185, 129, 0.12) !important;
  text-align: center !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  animation: trojkaFadeIn 0.35s ease-out;
}

@keyframes trojkaFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.trojka-success-icon-wrap {
  width: 72px;
  height: 72px;
  margin: 0 auto 20px auto;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(16, 185, 129, 0.25) 0%, rgba(16, 185, 129, 0.05) 70%);
  border: 2px solid #10b981;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px rgba(16, 185, 129, 0.35);
}

.trojka-success-icon-wrap .material-icons {
  font-size: 42px !important;
  color: #34d399 !important;
  line-height: 1;
}

.trojka-success-title {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 12px !important;
}

.trojka-success-msg-box {
  background: rgba(6, 78, 59, 0.35) !important;
  border: 1px solid rgba(52, 211, 153, 0.35) !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  display: inline-block !important;
  margin-bottom: 16px !important;
}

.trojka-success-msg {
  color: #a7f3d0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  margin: 0 !important;
}

.trojka-success-info {
  color: #cbd5e1 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  max-width: 640px;
  margin: 0 auto 20px auto !important;
}

.trojka-success-contact-hint {
  background: rgba(15, 23, 42, 0.6) !important;
  border: 1px solid var(--trojka-border-subtle, #1e293b) !important;
  border-radius: 10px !important;
  padding: 14px 20px !important;
  max-width: 680px;
  margin: 0 auto 26px auto !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.trojka-hint-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: #94a3b8;
}

.trojka-hint-item .material-icons {
  font-size: 18px;
  color: var(--trojka-primary, #38bdf8);
  flex-shrink: 0;
}

.trojka-hint-item strong {
  color: #f8fafc !important;
}

.trojka-success-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
}

.trojka-btn-new-msg {
  background: rgba(30, 41, 59, 0.8) !important;
  color: #e2e8f0 !important;
  border: 1px solid #475569 !important;
  border-radius: 8px !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
}

.trojka-btn-new-msg:hover {
  background: #334155 !important;
  color: #ffffff !important;
  border-color: #64748b !important;
}

.trojka-btn-home {
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 22px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
}

.trojka-btn-home:hover {
  background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%) !important;
  color: #0f172a !important;
}

/* ==========================================================================
   V. GŁÓWNE TŁO I CZCIONKA DLA TREŚCI STRON CMS I NOWYCH STRON TREŚCIOWYCH
   (pilot.com.pl/content/..., regulamin, RODO, zwroty i reklamacje oraz nowe podstrony)
   Bezwzględne wymuszenie ciemnego tła (#0f172a) i czcionki Montserrat dla treści CMS (#content.page-cms)
   Wzorowane na regułach neutralizacji opisu produktu (Sekcja 19)
   UWAGA: Reguły są ściśle ograniczone do kontenera #content.page-cms, aby NIE ingerować w nagłówek, menu ani stopkę!
   ========================================================================== */

/* Karta kontenera wyłącznie dla bloku treści strony CMS (#content) */
#main #content.page-cms,
#main section.page-cms,
#main .page-content.page-cms,
body#cms #main #content,
body#cms section#content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  color: #cbd5e1 !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  border: 1px solid var(--trojka-border, #1e293b) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  padding: 32px 40px !important;
  margin-top: 10px !important;
  margin-bottom: 35px !important;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.5) !important;
}

/* Górny nagłówek strony CMS spójny z motywem sklepu */
body#cms .page-header,
#main .page-header {
  margin-top: 10px !important;
  margin-bottom: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

@media (max-width: 767px) {
  #main #content.page-cms,
  #main section.page-cms,
  #main .page-content.page-cms,
  body#cms #main #content,
  body#cms section#content {
    padding: 20px 16px !important;
  }
}

/* --------------------------------------------------------------------------
   NEUTRALIZACJA FORMATOWANIA EDYTORA WYSIWYG / WORD / TINYMCE W TREŚCI CMS
   Usuwa wszelkie wklejone białe/szare tła (background/background-color),
   cienie i wymusza czcionkę Montserrat wyłącznie wewnątrz #content.page-cms
   -------------------------------------------------------------------------- */
#main #content.page-cms p,
#main #content.page-cms span,
#main #content.page-cms div,
#main #content.page-cms ul,
#main #content.page-cms ol,
#main #content.page-cms li,
#main #content.page-cms table,
#main #content.page-cms thead,
#main #content.page-cms tbody,
#main #content.page-cms tfoot,
#main #content.page-cms tr,
#main #content.page-cms td,
#main #content.page-cms th,
#main #content.page-cms font,
#main #content.page-cms strong,
#main #content.page-cms b,
#main #content.page-cms em,
#main #content.page-cms i:not(.material-icons),
#main #content.page-cms u,
#main #content.page-cms s,
#main #content.page-cms strike,
#main #content.page-cms del,
#main #content.page-cms section,
#main #content.page-cms article,
#main #content.page-cms blockquote,
#main #content.page-cms pre,
#main #content.page-cms code,
#main #content.page-cms aside,
#main #content.page-cms small,
#main #content.page-cms sub,
#main #content.page-cms sup,
#main #content.page-cms label,
#main #content.page-cms dt,
#main #content.page-cms dd,
#main #content.page-cms dl,
body#cms #main #content p,
body#cms #main #content span,
body#cms #main #content div,
body#cms #main #content ul,
body#cms #main #content ol,
body#cms #main #content li,
body#cms #main #content td,
body#cms #main #content th,
body#cms #main #content tr,
body#cms #main #content font,
body#cms #main #content strong,
body#cms #main #content b {
  background: transparent !important;
  background-color: transparent !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Wymuszenie czytelnego koloru tekstu Dark Tech w treści CMS */
#main #content.page-cms p,
#main #content.page-cms div,
#main #content.page-cms span,
#main #content.page-cms li,
#main #content.page-cms font,
#main #content.page-cms dt,
#main #content.page-cms dd,
body#cms #main #content p,
body#cms #main #content div,
body#cms #main #content span,
body#cms #main #content li,
body#cms #main #content font {
  color: #cbd5e1 !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
}

/* Nagłówki na stronach CMS - zawsze czysta biel i brak tła */
#main #content.page-cms h1,
body#cms #main h1,
body#cms .page-header h1 {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 24px !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid rgba(56, 189, 248, 0.3) !important;
}

#main #content.page-cms h2,
body#cms #main #content h2 {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  margin-top: 32px !important;
  margin-bottom: 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(51, 65, 85, 0.6) !important;
}

#main #content.page-cms h3,
body#cms #main #content h3 {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #38bdf8 !important;
  background: transparent !important;
  background-color: transparent !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin-top: 26px !important;
  margin-bottom: 10px !important;
}

#main #content.page-cms h4,
#main #content.page-cms h5,
#main #content.page-cms h6,
body#cms #main #content h4,
body#cms #main #content h5,
body#cms #main #content h6 {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #f8fafc !important;
  background: transparent !important;
  background-color: transparent !important;
  font-weight: 600 !important;
  margin-top: 20px !important;
  margin-bottom: 8px !important;
}

/* Pogrubienia w CMS - zawsze czysta biel i brak tła */
#main #content.page-cms strong,
#main #content.page-cms b,
body#cms #main #content strong,
body#cms #main #content b {
  color: #ffffff !important;
  font-weight: 700 !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Listy punktowane i numerowane w CMS */
#main #content.page-cms ul,
body#cms #main #content ul {
  padding-left: 24px !important;
  margin-bottom: 18px !important;
  list-style-type: disc !important;
  background: transparent !important;
}

#main #content.page-cms ol,
body#cms #main #content ol {
  padding-left: 24px !important;
  margin-bottom: 18px !important;
  list-style-type: decimal !important;
  background: transparent !important;
}

#main #content.page-cms li,
body#cms #main #content li {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #cbd5e1 !important;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
  margin-bottom: 6px !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Linki w treści stron CMS (wyłącznie wewnątrz #content.page-cms) */
#main #content.page-cms a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]),
body#cms #main #content a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]) {
  color: var(--trojka-primary, #38bdf8) !important;
  background: transparent !important;
  background-color: transparent !important;
  text-decoration: none !important; /* Zgodnie z Sekcją 19 motywu - zero podkreśleń linków */
  font-weight: 600 !important;
  transition: color 0.15s ease !important;
}

#main #content.page-cms a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]):hover,
body#cms #main #content a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]):hover {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  text-decoration: none !important;
}

/* Po naciśnięciu / stan aktywny: niebieskawy (#7dd3fc) */
#main #content.page-cms a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]):active,
body#cms #main #content a:not(.btn):not(.btn-default):not(.btn-primary):not([href*=".pdf"]):not([download]):active {
  color: #7dd3fc !important;
  text-decoration: none !important;
}

/* Przyciski i formularze do pobrania na stronach CMS (np. formularz odstąpienia i reklamacji na pilot.com.pl/content/6-...)
   Zgodność z zasadą: BIAŁY NAPIS, NIEBIESKAWY PO NACIŚNIĘCIU, NIEBIESKI NA AKTYWNYM */
#main #content.page-cms a.btn,
#main #content.page-cms a.btn-default,
#main #content.page-cms a.btn-primary,
body#cms #main #content a.btn,
body#cms #main #content a.btn-default,
body#cms #main #content a.btn-primary,
body#cms #main #content a[href*=".pdf"],
body#cms #main #content a[download] {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  color: #ffffff !important; /* BIAŁY NAPIS */
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  line-height: 1.3 !important;
  padding: 12px 24px !important;
  margin: 8px 0 14px 0 !important;
  text-decoration: none !important; /* USUNIĘCIE PODKREŚLENIA */
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
  cursor: pointer !important;
  outline: none !important;
  white-space: normal !important;
  text-align: center !important;
}

/* Efekt hover dla przycisków / linków pobierania na stronach CMS */
#main #content.page-cms a.btn:hover,
#main #content.page-cms a.btn-default:hover,
#main #content.page-cms a.btn-primary:hover,
body#cms #main #content a.btn:hover,
body#cms #main #content a.btn-default:hover,
body#cms #main #content a.btn-primary:hover,
body#cms #main #content a[href*=".pdf"]:hover,
body#cms #main #content a[download]:hover {
  color: #ffffff !important;
  background: #0284c7 !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 6px 20px rgba(56, 189, 248, 0.45) !important;
  text-decoration: none !important;
}

/* Po naciśnięciu / stan aktywny: NIEBIESKAWY PO NACIŚNIĘCIU (#7dd3fc) */
#main #content.page-cms a.btn:active,
#main #content.page-cms a.btn-default:active,
#main #content.page-cms a.btn-primary:active,
body#cms #main #content a.btn:active,
body#cms #main #content a.btn-default:active,
body#cms #main #content a.btn-primary:active,
body#cms #main #content a[href*=".pdf"]:active,
body#cms #main #content a[download]:active {
  color: #7dd3fc !important; /* NIEBIESKAWY PO NACIŚNIĘCIU */
  background: #075985 !important;
  border-color: #38bdf8 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
}

/* ==========================================================================
   AKTYWNE LINKI W STOPCE I NAWIGACJI DLA STRON CMS (ZASADA: NIEBIESKI NA AKTYWNYM)
   Gdy użytkownik znajduje się na danej podstronie (np. /content/6-reklamacja-i-odstapienie-od-umowy)
   ========================================================================== */
body.cms-id-6 #footer a[href*="content/6"],
body.cms-id-6 #footer a[href*="reklamacja"],
body#cms.cms-id-6 #footer a[href*="content/6"],
body#cms.cms-id-6 #footer a[href*="reklamacja"],
body.cms-id-6 .footer-container a[href*="content/6"],
body.cms-id-6 .footer-container a[href*="reklamacja"] {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid var(--trojka-primary, #38bdf8) !important;
  padding-bottom: 2px !important;
}

body.cms-id-3 #footer a[href*="content/3"],
body.cms-id-3 #footer a[href*="regulamin"],
body#cms.cms-id-3 #footer a[href*="content/3"] {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid var(--trojka-primary, #38bdf8) !important;
  padding-bottom: 2px !important;
}

body.cms-id-2 #footer a[href*="content/2"],
body.cms-id-2 #footer a[href*="polityka-prywatnosci"],
body#cms.cms-id-2 #footer a[href*="content/2"] {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid var(--trojka-primary, #38bdf8) !important;
  padding-bottom: 2px !important;
}

body#contact #footer a[href*="kontakt"],
body.page-contact #footer a[href*="kontakt"] {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 700 !important;
  border-bottom: 2px solid var(--trojka-primary, #38bdf8) !important;
  padding-bottom: 2px !important;
}

/* Neutralizacja znacznika <font> z dawnych edytorów TinyMCE */
#main #content.page-cms font,
body#cms #main #content font {
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Tabele na stronach CMS (usuwanie wklejonych białych teł tabel z Excela / Worda) */
#main #content.page-cms table,
body#cms #main #content table {
  width: 100% !important;
  background-color: #090d16 !important;
  background: #090d16 !important;
  border: 1px solid #1e293b !important;
  border-radius: 8px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  margin: 20px 0 !important;
  overflow: hidden !important;
}

#main #content.page-cms th,
body#cms #main #content th {
  background-color: #162032 !important;
  background: #162032 !important;
  color: #ffffff !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #334155 !important;
  border-top: none !important;
  /* border-left: none removed */
  border-right: none !important;
  text-align: left !important;
}

#main #content.page-cms td,
body#cms #main #content td {
  padding: 12px 16px !important;
  border-top: 1px solid #1e293b !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-right: none !important;
  color: #cbd5e1 !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  background-color: transparent !important;
  background: transparent !important;
}

#main #content.page-cms tr:hover td,
body#cms #main #content tr:hover td {
  background-color: rgba(30, 41, 59, 0.4) !important;
}

/* Cytaty / ramki wyróżnione w CMS */
#main #content.page-cms blockquote,
body#cms #main #content blockquote {
  background: rgba(15, 23, 42, 0.8) !important;
  border-left: 4px solid var(--trojka-primary, #38bdf8) !important;
  border-radius: 0 8px 8px 0 !important;
  padding: 14px 20px !important;
  margin: 20px 0 !important;
  color: #94a3b8 !important;
  font-style: italic !important;
}

/* Bloki kodu / preformatowane w CMS */
#main #content.page-cms pre,
#main #content.page-cms code,
body#cms #main #content pre,
body#cms #main #content code {
  background: #090d16 !important;
  color: #38bdf8 !important;
  border: 1px solid #1e293b !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  border-radius: 6px !important;
}

/* Separatory w CMS */
#main #content.page-cms hr,
body#cms #main #content hr {
  border: none !important;
  height: 1px !important;
  background: #1e293b !important;
  margin: 28px 0 !important;
}

/* ==========================================================================
   VI. BEZWZGLĘDNA OCHRONA I CZYTELNOŚĆ STOPKI (NA WSZYSTKICH STRONACH I CMS)
   Gwarantuje, że żadne style z podstron ani edytora nie rozjadą stopki
   ========================================================================== */
#footer,
.footer-container {
  background: var(--trojka-bg-main, #090d16) !important;
  background-color: var(--trojka-bg-main, #090d16) !important;
  color: #cbd5e1 !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  border-top: 1px solid var(--trojka-border-subtle, #1e293b) !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 10 !important;
}

#footer .footer-container,
.footer-container {
  border-top: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Usunięcie przymusowych podkreśleń ze wszystkich linków w stopce */
#footer a,
footer a,
.footer-container a,
.trojka-footer-legal-links a,
.trojka-footer-promo-store a,
.trojka-cookie-settings-link,
.trojka-cookie-settings-link:hover,
.trojka-cookie-settings-link:focus {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Pasek linków prawnych w stopce */
.trojka-footer-legal-links {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px 16px !important;
  font-size: 12.5px !important;
  margin-bottom: 14px !important;
}

.trojka-footer-legal-links a {
  color: #94a3b8 !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border-bottom: none !important;
  transition: color 0.2s ease !important;
}

.trojka-footer-legal-links a:hover {
  color: #38bdf8 !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* Baner sklepu stacjonarnego (www.trojka.pl) */
.trojka-footer-promo-store {
  margin-top: 10px !important;
  margin-bottom: 16px !important;
  padding: 14px 18px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 8px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.trojka-footer-promo-store-text {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: #e2e8f0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  flex: 1 1 500px !important;
}

.trojka-footer-promo-store a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #38bdf8 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border-bottom: none !important;
  padding: 7px 15px !important;
  background: rgba(56, 189, 248, 0.12) !important;
  border: 1px solid rgba(56, 189, 248, 0.35) !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
}

.trojka-footer-promo-store a:hover {
  background: rgba(56, 189, 248, 0.22) !important;
  border-color: #38bdf8 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* Wiersz danych firmy i linku cookies */
.trojka-footer-legal-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  padding-top: 8px !important;
}

.trojka-footer-company-text {
  color: #cbd5e1 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.trojka-footer-company-text strong {
  color: #ffffff !important;
  font-weight: 700 !important;
}

.trojka-cookie-settings-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #38bdf8 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border-bottom: none !important;
  cursor: pointer !important;
  transition: color 0.15s ease !important;
}

.trojka-cookie-settings-link:hover {
  color: #7dd3fc !important;
  text-decoration: underline !important;
}

/* Ochrona czcionki Material Icons w całym szablonie */
.material-icons,
i.material-icons,
span.material-icons {
  font-family: 'Material Icons' !important;
  font-weight: normal !important;
  font-style: normal !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  display: inline-block !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  direction: ltr !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
  -moz-osx-font-smoothing: grayscale !important;
}






/* ==========================================================================
   NAPRAWA MODALA POWIĘKSZENIA PRODUKTU (#product-modal)
   - Likwidacja obcinania zdjęcia (usunięcie ujemnego margin-left: -35%)
   - Prawidłowe skalowanie (max-width: 100%, object-fit: contain)
   - Wyśrodkowanie okna, zaokrąglenie rogów i styl Trójka (Dark / Cyan)
   - Przycisk zamknięcia (krzyżyk) i podświetlenie miniaturek
   ========================================================================== */
#product-modal.modal {
  z-index: 10050 !important;
  padding: 0 !important;
}

#product-modal .modal-dialog {
  max-width: 960px !important;
  width: 94vw !important;
  margin: 1.5rem auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: calc(100vh - 3rem) !important;
}

#product-modal .modal-content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: 16px !important;
  box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.85), 0 0 35px rgba(56, 189, 248, 0.18) !important;
  padding: 24px 20px 20px 20px !important;
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 960px !important;
}

#product-modal .modal-content .modal-body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 0 !important; /* KLUCZOWE: usunięcie ujemnego marginesu -35% z theme.css który obcinał zdjęcie */
  margin-right: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  gap: 16px !important;
}

@media (min-width: 768px) {
  #product-modal .modal-content .modal-body {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

#product-modal figure {
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
  max-width: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

#product-modal .modal-content .modal-body .product-cover-modal {
  max-width: 100% !important;
  max-height: 72vh !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important; /* ZAPOBIEGA JAKIEMUKOLWIEK OBCINANIU ZDJĘCIA */
  border-radius: 12px !important;
  background: #ffffff !important; /* Jasne tło pod powiększony produkt dla doskonałego kontrastu */
  padding: 12px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45) !important;
  display: block !important;
  margin: 0 auto !important;
  border: 1px solid var(--trojka-border, #334155) !important;
}

#product-modal .image-caption {
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  padding: 12px 0 0 0 !important;
  color: #cbd5e1 !important;
  text-align: center !important;
}

#product-modal .image-caption p,
#product-modal .image-caption div {
  color: #94a3b8 !important;
  font-size: 14px !important;
}

#product-modal aside#thumbnails {
  flex: 0 0 auto !important;
  margin-top: 10px !important;
  position: relative !important;
}

#product-modal .product-images img {
  border-radius: 8px !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  background: #ffffff !important;
  padding: 4px !important;
  transition: all 0.2s ease !important;
}

#product-modal .product-images img:hover,
#product-modal .product-images img.selected {
  border-color: #38bdf8 !important;
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.45) !important;
}

#product-modal .modal-close-btn,
#product-modal button.close {
  position: absolute !important;
  top: 14px !important;
  right: 18px !important;
  z-index: 100 !important;
  color: #94a3b8 !important;
  font-size: 32px !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  outline: none !important;
  line-height: 1 !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
  opacity: 0.8 !important;
}

#product-modal .modal-close-btn:hover,
#product-modal button.close:hover {
  color: #38bdf8 !important;
  transform: scale(1.15) !important;
  opacity: 1 !important;
}


/* ==============================================================================
   18. PERSONALIZACJA MOJE KONTO I PIKTOGRAMY (pilot.com.pl/moje-konto)
   Zero skakania na 4 kaflach: brak translateY, brak powiększania ikon, stała 1px ramka
   ============================================================================== */
.page-my-account #content .links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}

.page-my-account #content .links a {
  display: block !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  text-decoration: none !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--trojka-text-muted, #cbd5e1) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  transform: none !important;
}

.page-my-account #content .links a:hover {
  color: var(--trojka-text-main, #f8fafc) !important;
  text-decoration: none !important;
  transform: none !important;
}

/* 4 kafle nawigacyjne w Moje Konto - stan spoczynkowy */
.page-my-account #content .links a span.link-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  min-height: 150px !important;
  padding: 1.5rem 1rem !important;
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-top: 1px solid var(--trojka-border, #334155) !important;
  border-right: 1px solid var(--trojka-border, #334155) !important;
  border-bottom: 1px solid var(--trojka-border, #334155) !important;
  border-left: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  text-align: center !important;
  box-shadow: none !important;
  outline: none !important;
  box-sizing: border-box !important;
  transform: none !important;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
}

/* 4 kafle nawigacyjne w Moje Konto - stan najechania (Hover): 0px skakania, brak translateY, idealnie stała 1px ramka */
.page-my-account #content .links a:hover span.link-item,
.page-my-account #content .links a:focus span.link-item {
  background-color: var(--trojka-bg-card-hover, #1e293b) !important;
  background: var(--trojka-bg-card-hover, #1e293b) !important;
  border: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-top: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-right: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-bottom: 1px solid var(--trojka-primary, #38bdf8) !important;
  border-left: 1px solid var(--trojka-primary, #38bdf8) !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
}

/* Kolor piktogramów w Moje Konto - pilot.com.pl (brak drżenia i brak powiększania) */
.page-my-account #content .links a i,
.page-my-account #content .links a i.material-icons,
.page-my-account #content .links a span.link-item i,
.page-my-account #content .links a span.link-item .material-icons,
#identity-link i,
#addresses-link i,
#address-link i,
#history-link i,
#order-slips-link i,
#discounts-link i,
#returns-link i,
#psgdpr-link i,
#alerts-link i,
#wishlist-link i {
  display: block !important;
  width: auto !important;
  padding-bottom: 1.25rem !important;
  font-size: 2.75rem !important;
  line-height: 1 !important;
  color: var(--trojka-primary, #38bdf8) !important;
  text-shadow: none !important;
  transform: none !important;
  transition: color 0.15s ease !important;
}

/* Stan najechania na piktogramy - zmiana koloru na jaśniejszy, zero skoku i zero powiększania (scale: none) */
.page-my-account #content .links a:hover i,
.page-my-account #content .links a:hover i.material-icons,
.page-my-account #content .links a:hover span.link-item i,
.page-my-account #content .links a:hover span.link-item .material-icons,
#identity-link:hover i,
#addresses-link:hover i,
#address-link:hover i,
#history-link:hover i,
#order-slips-link:hover i,
#discounts-link:hover i,
#returns-link:hover i,
#psgdpr-link:hover i,
#alerts-link:hover i,
#wishlist-link:hover i {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  transform: none !important;
  text-shadow: none !important;
}

/* Usunięcie wyłącznie czerwonego klawisza "WYLOGUJ SIĘ" pod kafelkami na podstronie Moje Konto (/moje-konto) - TYLKO TEN JEDEN */
.page-my-account .page-footer,
.page-my-account footer.page-footer,
body#my-account .page-footer,
body#my-account footer.page-footer,
.page-my-account .page-footer .text-sm-center,
body#my-account .page-footer .text-sm-center,
.page-my-account .page-footer a[href*="mylogout"],
body#my-account .page-footer a[href*="mylogout"],
.page-my-account #content ~ .page-footer,
body#my-account #content ~ .page-footer {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
}

/* ==============================================================================
   19. MODUŁ RODO / GDPR (pilot.com.pl/module/psgdpr/gdpr) - SPÓJNY CIEMNY MOTYW
   Zgodność kolorystyki, brak podkreśleń linków, responsywne przyciski w ramce
   ============================================================================== */

/* Globalne ciemne tło strony modułu GDPR */
body#module-psgdpr-gdpr,
body#module-psgdpr-export,
.page-customer-account.page-module-psgdpr-gdpr,
body#module-psgdpr-gdpr #page,
body#module-psgdpr-gdpr #wrapper,
body#module-psgdpr-gdpr #content-wrapper,
body#module-psgdpr-gdpr #main,
body#module-psgdpr-gdpr #content,
body#module-psgdpr-gdpr #wrapper .container,
body#module-psgdpr-gdpr section#content,
body#module-psgdpr-gdpr section.page_content,
body#module-psgdpr-gdpr .page-content {
  background-color: var(--trojka-bg-main, #090d16) !important;
  background: var(--trojka-bg-main, #090d16) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
}

/* KARTY MODUŁU RODO - spójne z kartami sklepu (Dark Tech) */
.psgdprinfo17,
.psgdprinfo16,
div.psgdprinfo17,
div.psgdprinfo16,
[class*="psgdprinfo"],
body#module-psgdpr-gdpr .psgdprinfo17,
body#module-psgdpr-gdpr .psgdprinfo16,
body#module-psgdpr-gdpr div.psgdprinfo17,
body#module-psgdpr-gdpr div.psgdprinfo16,
body#module-psgdpr-gdpr #content .psgdprinfo17,
body#module-psgdpr-gdpr .page_content .psgdprinfo17,
body#module-psgdpr-gdpr .col-xs-12.psgdprinfo17,
body#module-psgdpr-gdpr #content,
body#module-psgdpr-gdpr .psgdpr-content,
body#module-psgdpr-gdpr .card,
body#module-psgdpr-gdpr .card-block,
body#module-psgdpr-gdpr .box,
body#module-psgdpr-gdpr .page-content.card,
body#module-psgdpr-gdpr section#content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  padding: 24px 28px !important;
  margin-top: 16px !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4) !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

body#module-psgdpr-gdpr .psgdprinfo17:hover {
  border-color: rgba(56, 189, 248, 0.5) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5), 0 0 15px rgba(56, 189, 248, 0.1) !important;
}

/* Nagłówki w modułach RODO - spójne z nagłówkami na stronie głównej (czysta biel #ffffff) */
.psgdprinfo17 h2,
.psgdprinfo16 h2,
div.psgdprinfo17 h2,
body#module-psgdpr-gdpr h1,
body#module-psgdpr-gdpr h2,
body#module-psgdpr-gdpr h3,
body#module-psgdpr-gdpr h4,
body#module-psgdpr-gdpr .page-header h1,
body#module-psgdpr-gdpr .psgdpr-bold {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--trojka-border-subtle, #1e293b) !important;
  letter-spacing: -0.01em !important;
}

/* Teksty wewnątrz kart RODO - identyczne z typografią strony głównej */
.psgdprinfo17 p,
.psgdprinfo16 p,
div.psgdprinfo17 p,
body#module-psgdpr-gdpr #wrapper p,
body#module-psgdpr-gdpr #wrapper label,
body#module-psgdpr-gdpr #wrapper li,
body#module-psgdpr-gdpr #wrapper span:not(.material-icons) {
  color: var(--trojka-text-muted, #cbd5e1) !important;
  font-size: 0.9375rem !important;
  line-height: 1.65 !important;
}

/* Linki wewnątrz tekstu RODO - bez podkreśleń, w spójnym kolorze strony głównej */
.psgdprinfo17 a,
.psgdprinfo16 a,
div.psgdprinfo17 a,
body#module-psgdpr-gdpr #wrapper a,
body#module-psgdpr-gdpr #wrapper p a,
body#module-psgdpr-gdpr #wrapper a:not(.btn) {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.psgdprinfo17 a:hover,
.psgdprinfo16 a:hover,
div.psgdprinfo17 a:hover,
body#module-psgdpr-gdpr #wrapper a:hover,
body#module-psgdpr-gdpr #wrapper p a:hover,
body#module-psgdpr-gdpr #wrapper a:not(.btn):hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Piktogramy i ikony w module GDPR */
body#module-psgdpr-gdpr .material-icons,
body#module-psgdpr-gdpr i {
  color: var(--trojka-primary, #38bdf8) !important;
}

/* Kontener przycisków akcji */
.psgdpr-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  margin-top: 18px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Przyciski pobierania danych PDF i CSV - Desktop: spójne z .btn-primary sklepu z wyraźnym rozsunięciem */
#exportDataToCsv,
#exportDataToPdf,
.psgdprgetdatabtn17,
.psgdprgetdatabtn16,
a.psgdprgetdatabtn17,
a.psgdprgetdatabtn16,
body#module-psgdpr-gdpr .btn-primary,
body#module-psgdpr-gdpr .btn.btn-primary,
body#module-psgdpr-gdpr button[type="submit"],
body#module-psgdpr-gdpr a.btn-primary {
  background-color: var(--trojka-primary-dark, #0284c7) !important;
  background: var(--trojka-primary-dark, #0284c7) !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  color: #ffffff !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  padding: 10px 22px !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
  margin-top: 4px !important;
  margin-right: 18px !important;
  margin-bottom: 12px !important;
  margin-left: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Wymuszone rozsunięcie klawiszy gdy leżą obok siebie */
#exportDataToPdf + #exportDataToCsv,
#exportDataToCsv + #exportDataToPdf,
.psgdprgetdatabtn17 + .psgdprgetdatabtn17,
a.psgdprgetdatabtn17 + a.psgdprgetdatabtn17,
.psgdprinfo17 a.btn + a.btn,
.psgdpr-actions a + a {
  margin-left: 0 !important;
  margin-right: 18px !important;
}

#exportDataToCsv:hover,
#exportDataToPdf:hover,
.psgdprgetdatabtn17:hover,
.psgdprgetdatabtn16:hover,
a.psgdprgetdatabtn17:hover,
a.psgdprgetdatabtn16:hover,
body#module-psgdpr-gdpr .btn-primary:hover,
body#module-psgdpr-gdpr button[type="submit"]:hover,
body#module-psgdpr-gdpr a.btn-primary:hover {
  background-color: var(--trojka-primary-darker, #0369a1) !important;
  background: var(--trojka-primary-darker, #0369a1) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(56, 189, 248, 0.55) !important;
  transform: none !important;
  text-decoration: none !important;
}

/* Przyciski drugorzędne */
body#module-psgdpr-gdpr .btn-secondary,
body#module-psgdpr-gdpr .btn-default,
body#module-psgdpr-gdpr a.btn-secondary {
  background-color: var(--trojka-bg-elevated, #162032) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  padding: 10px 20px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

body#module-psgdpr-gdpr .btn-secondary:hover,
body#module-psgdpr-gdpr .btn-default:hover,
body#module-psgdpr-gdpr a.btn-secondary:hover {
  background-color: var(--trojka-bg-card-hover, #1e293b) !important;
  border-color: var(--trojka-primary, #38bdf8) !important;
  color: #ffffff !important;
}

body#module-psgdpr-gdpr hr {
  border-color: var(--trojka-border-subtle, #1e293b) !important;
  margin: 20px 0 !important;
  opacity: 0.7 !important;
}

body#module-psgdpr-gdpr .alert,
body#module-psgdpr-gdpr .alert-info,
body#module-psgdpr-gdpr .alert-warning {
  background-color: rgba(15, 23, 42, 0.95) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  color: var(--trojka-text-muted, #cbd5e1) !important;
}

/* Responsywność RODO Mobile - zapobieganie wychodzeniu klawiszy "Pobierz moje dane" poza ramkę */
@media (max-width: 767.98px) {
  body#module-psgdpr-gdpr .container,
  body#module-psgdpr-gdpr .psgdpr-container {
    padding-left: 10px !important;
    padding-right: 10px !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .psgdprinfo17,
  .psgdprinfo16,
  div.psgdprinfo17,
  body#module-psgdpr-gdpr .psgdprinfo17,
  body#module-psgdpr-gdpr .card {
    padding: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .psgdpr-actions {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 10px !important;
    margin-top: 16px !important;
  }

  #exportDataToCsv,
  #exportDataToPdf,
  .psgdprgetdatabtn17,
  .psgdprgetdatabtn16,
  a.psgdprgetdatabtn17,
  a.psgdprgetdatabtn16,
  body#module-psgdpr-gdpr .btn-primary {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 12px !important;
    padding: 12px 14px !important;
    font-size: 0.8125rem !important;
    white-space: normal !important;
    text-align: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    word-break: break-word !important;
    line-height: 1.35 !important;
  }
}

/* ==============================================================================
   20. MODUŁ LISTY ŻYCZEŃ (BLOCKWISHLIST) - pilot.com.pl/module/blockwishlist/lists
   Eliminacja mignięcia białych pól (ContentLoader SVG / Card), pełny Dark Tech
   ============================================================================== */

/* Globalne ciemne tło dla podstron modułu blockwishlist */
body#module-blockwishlist-lists,
body#module-blockwishlist-view,
.page-customer-account.page-module-blockwishlist-lists,
body#module-blockwishlist-lists #page,
body#module-blockwishlist-lists #wrapper,
body#module-blockwishlist-lists #content-wrapper,
body#module-blockwishlist-lists #main,
body#module-blockwishlist-lists #content,
body#module-blockwishlist-lists #wrapper .container {
  background-color: var(--trojka-bg-main, #090d16) !important;
  background: var(--trojka-bg-main, #090d16) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
}

/* Nagłówek i link dodawania nowej listy */
.wishlist-container-header h1,
body#module-blockwishlist-lists h1,
body#module-blockwishlist-lists .page-header h1 {
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

.wishlist-add-to-new,
.wishlist-container-header .wishlist-add-to-new {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: color 0.2s ease, opacity 0.2s ease !important;
}

.wishlist-add-to-new:hover {
  color: var(--trojka-primary-light, #7dd3fc) !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

.wishlist-add-to-new i {
  color: var(--trojka-primary, #38bdf8) !important;
  vertical-align: middle !important;
}

/* Główna karta listy życzeń - eliminacja białego tła, podwójnych krawędzi i dziwnej dolnej ramki */
.wishlist-container .page-content,
.wishlist-container .page-content.card,
.wishlist-container .card.page-content,
#main .wishlist-container .card.page-content,
body#module-blockwishlist-lists .page-content.card,
body#module-blockwishlist-lists #content,
body#module-blockwishlist-lists #main > #content.card {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0 !important; /* Likwidacja wewnętrznego paddingu tworzącego podwójną ramkę i ciemną szczelinę */
  margin-bottom: 24px !important;
}

/* Wewnętrzna lista w kontenerze życzeń */
body#module-blockwishlist-lists .wishlist-list,
.wishlist-container .wishlist-list,
.wishlist-list-container .wishlist-list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ==========================================================================
   ELIMINACJA MIGNIĘCIA BIAŁYCH PÓL: SKELETON LOADER (ContentLoader SVG)
   ========================================================================== */
/* Całkowite wygaszenie białych pól podczas ładowania */
.wishlist-list-loader,
svg.wishlist-list-loader {
  background: transparent !important;
  background-color: transparent !important;
  padding: 1.25rem !important;
  box-sizing: border-box !important;
}

/* Zastąpienie domyślnego białego wypełnienia (#f9f9f9 / #ecebeb) ciemnymi odcieniami motywu */
.wishlist-list-loader rect,
svg.wishlist-list-loader rect {
  fill: var(--trojka-bg-card-hover, #1e293b) !important;
}

.wishlist-list-loader stop,
svg.wishlist-list-loader stop {
  stop-color: var(--trojka-bg-card-hover, #1e293b) !important;
}

.wishlist-list-loader stop:nth-child(2),
svg.wishlist-list-loader stop:nth-child(2) {
  stop-color: var(--trojka-bg-elevated, #162032) !important;
}

/* Elegancka, ciemna animacja pulsowania zamiast białego błysku */
@keyframes trojka-dark-skeleton {
  0%, 100% {
    opacity: 0.6;
    fill: #1e293b;
  }
  50% {
    opacity: 0.25;
    fill: #334155;
  }
}

.wishlist-list-loader rect {
  animation: trojka-dark-skeleton 1.6s ease-in-out infinite !important;
}

/* Elementy listy życzeń na podstronie - pełne dopasowanie do karty bez własnych ramek */
body#module-blockwishlist-lists .wishlist-list-item,
.wishlist-container .wishlist-list-item,
.wishlist-list-container .wishlist-list-item {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-top: none !important;
  /* border-left: none removed */
  border-right: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease !important;
}

/* Separator między pozycjami (wyłącznie jeśli jest więcej pozycji) */
body#module-blockwishlist-lists .wishlist-list-item:not(:last-child),
.wishlist-container .wishlist-list-item:not(:last-child) {
  border-bottom: 1px solid var(--trojka-border-subtle, #1e293b) !important;
}

/* Ostatnia pozycja i pozycja domyślna bez ramki dolnej - zero podwójnych kresek na dole */
body#module-blockwishlist-lists .wishlist-list-item:last-child,
.wishlist-container .wishlist-list-item:last-child,
body#module-blockwishlist-lists .wishlist-list-item-default,
.wishlist-container .wishlist-list-item-default {
  border-bottom: none !important;
  margin-bottom: 0 !important;
}

/* Hover na wiersz listy */
body#module-blockwishlist-lists .wishlist-list-item:hover,
.wishlist-container .wishlist-list-item:hover {
  background-color: var(--trojka-bg-card-hover, #1e293b) !important;
}

/* Klikalny obszar całego wiersza */
body#module-blockwishlist-lists .wishlist-list-item-link,
.wishlist-container .wishlist-list-item-link {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 18px 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.wishlist-list-item-title {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.wishlist-list-item-title span {
  color: var(--trojka-primary, #38bdf8) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

.wishlist-list-empty {
  color: var(--trojka-text-muted, #cbd5e1) !important;
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  padding: 2.5rem 1.5rem !important;
  margin: 0 !important;
  border: none !important;
}

/* Przyciski akcji (kropki, udostępnij, usuń) */
.wishlist-list-item-right {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.wishlist-list-item-right > button {
  background: transparent !important;
  border: none !important;
  padding: 6px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.15s ease !important;
}

.wishlist-list-item-right > button i {
  color: var(--trojka-text-dim, #94a3b8) !important;
  font-size: 20px !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
}

.wishlist-list-item-right > button:hover i {
  color: var(--trojka-primary, #38bdf8) !important;
  transform: scale(1.1) !important;
}

/* Menu kontekstowe (Zmień nazwę / Usuń / Udostępnij) */
.wishlist-list-item-right .dropdown-menu {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6) !important;
}

.wishlist-list-item-right .dropdown-menu > button {
  color: var(--trojka-text-main, #f8fafc) !important;
  font-weight: 500 !important;
  background: transparent !important;
}

.wishlist-list-item-right .dropdown-menu > button:hover {
  background-color: var(--trojka-bg-card-hover, #1e293b) !important;
  color: var(--trojka-primary, #38bdf8) !important;
}

/* Modale modułu Wishlist (Tworzenie / Zmiana nazwy / Udostępnianie) */
.wishlist-modal .modal-content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  color: var(--trojka-text-main, #f8fafc) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.7) !important;
}

.wishlist-modal .modal-header h5 {
  color: #ffffff !important;
  font-weight: 700 !important;
}

.wishlist-modal .modal-text {
  color: var(--trojka-text-muted, #cbd5e1) !important;
}

.wishlist-modal .modal-body .form-control {
  background-color: var(--trojka-bg-main, #090d16) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  color: #ffffff !important;
  padding: 10px 14px !important;
}

.wishlist-modal .modal-body .form-control:focus {
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.25) !important;
}

.wishlist-modal .close {
  color: var(--trojka-text-dim, #94a3b8) !important;
  opacity: 0.8 !important;
}

.wishlist-modal .close:hover {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Linki powrotu w stopce listy życzeń */
.wishlist-footer-links {
  margin-top: 24px !important;
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.wishlist-footer-links a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--trojka-primary-light, #7dd3fc) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.wishlist-footer-links a:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

.wishlist-footer-links a i {
  color: var(--trojka-primary, #38bdf8) !important;
}

/* ==============================================================================
   20.1. PODSTRONA WIDOKU PRODUKTÓW LISTY ŻYCZEŃ (/module/blockwishlist/view)
   Dopasowanie do motywu Dark Tech / Trójka Electronics & Usunięcie dolnej belki
   ============================================================================== */

/* Całkowite wycięcie pustej dolnej belki (paginacji) na widoku listy życzeń */
body#module-blockwishlist-view .wishlist-pagination,
body#module-blockwishlist-view nav.wishlist-pagination,
body#module-blockwishlist-view .pagination,
body#module-blockwishlist-view nav.pagination,
.wishlist-products-container + .wishlist-pagination,
.wishlist-products-container + nav.pagination,
.wishlist-pagination:empty {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

/* Wyczyszczenie ewentualnej dolnej ramki w stopce strony */
body#module-blockwishlist-view .page-footer {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Tytuł listy życzeń i licznik produktów */
.wishlist-products-container-header h1,
body#module-blockwishlist-view .wishlist-products-container-header h1 {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 12px !important;
}

.wishlist-products-count,
.wishlist-products-container-header .wishlist-products-count {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  margin-left: 8px !important;
}

/* Sortowanie na liście produktów */
.wishlist-products-container .sort-by-row .sort-by {
  color: var(--trojka-text-muted, #94a3b8) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.wishlist-products-container .select-title {
  background: var(--trojka-bg-card, #0f172a) !important;
  color: #ffffff !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 6px) !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
}

.wishlist-products-container .dropdown-menu {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius-sm, 8px) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6) !important;
}

.wishlist-products-container .dropdown-menu .select-list {
  color: var(--trojka-text-main, #f8fafc) !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
}

.wishlist-products-container .dropdown-menu .select-list:hover {
  background-color: var(--trojka-bg-card-hover, #1e293b) !important;
  color: var(--trojka-primary, #38bdf8) !important;
}

/* Główna karta z produktami na podstronie widoku */
body#module-blockwishlist-view #content.card,
body#module-blockwishlist-view .card.page-content,
#main .wishlist-products-container .card.page-content {
  background-color: var(--trojka-bg-card, #0f172a) !important;
  background: var(--trojka-bg-card, #0f172a) !important;
  border: 1px solid var(--trojka-border, #334155) !important;
  border-radius: var(--trojka-radius, 12px) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
  box-sizing: border-box !important;
}

/* Siatka listy produktów */
.wishlist-products-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.wishlist-products-item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  flex: 0 1 calc(33.333% - 14px) !important;
  max-width: calc(33.333% - 14px) !important;
  box-sizing: border-box !important;
}

@media screen and (max-width: 991px) {
  .wishlist-products-item {
    flex: 0 1 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
  }
}

@media screen and (max-width: 575px) {
  .wishlist-products-item {
    flex: 0 1 100% !important;
    max-width: 100% !important;
  }
}

/* Karta pojedynczego produktu na liście życzeń (Dark Tech) */
.wishlist-product {
  max-width: 100% !important;
  width: 100% !important;
  height: 100% !important;
  background: var(--trojka-bg-elevated, #111827) !important;
  border: 1px solid var(--trojka-border-subtle, #1e293b) !important;
  border-radius: 12px !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  position: relative !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3) !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.wishlist-product:hover {
  border-color: var(--trojka-primary, #38bdf8) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45), 0 0 12px rgba(56, 189, 248, 0.2) !important;
}

/* Link produktu */
.wishlist-product-link {
  text-decoration: none !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.wishlist-product-link:hover,
.wishlist-product-link:focus {
  text-decoration: none !important;
}

/* Okno ze zdjęciem pilota - białe tło z delikatną ramką (tak jak na stronie głównej) */
.wishlist-product-image {
  width: 100% !important;
  height: 210px !important;
  max-height: 210px !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px !important;
  margin-bottom: 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-sizing: border-box !important;
}

.wishlist-product-image img {
  max-width: 95% !important;
  max-height: 95% !important;
  object-fit: contain !important;
  position: static !important;
  transform: none !important;
  transition: transform 0.25s ease !important;
  margin: auto !important;
}

.wishlist-product-link:hover .wishlist-product-image img {
  transform: scale(1.05) !important;
}

/* Przycisk usuwania z listy życzeń (kosz w rogu zdjęcia) */
.wishlist-product .wishlist-button-add,
.wishlist-button-add {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  background: rgba(15, 23, 42, 0.9) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.5) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 5 !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
  transition: all 0.2s ease !important;
  padding: 0 !important;
}

.wishlist-product .wishlist-button-add i,
.wishlist-button-add i {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 19px !important;
  line-height: 1 !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
}

.wishlist-product .wishlist-button-add:hover {
  background: #e11d48 !important;
  border-color: #f43f5e !important;
  box-shadow: 0 0 14px rgba(244, 63, 94, 0.6) !important;
  transform: none !important;
}

.wishlist-product .wishlist-button-add:hover i {
  color: #ffffff !important;
  transform: scale(1.1) !important;
}

/* Nazwa / Tytuł produktu - wysoki kontrast i czytelność */
.wishlist-product-title {
  color: #ffffff !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  min-height: 36px !important;
  margin-top: 4px !important;
  margin-bottom: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transition: color 0.2s ease !important;
}

.wishlist-product-link:hover .wishlist-product-title {
  color: var(--trojka-primary, #38bdf8) !important;
}

/* Cena produktu - Cyber Cyan (identyczna z katalogiem) */
.wishlist-product-price {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  margin-top: 2px !important;
  margin-bottom: 10px !important;
}

.wishlist-product-price-promo {
  color: var(--trojka-text-dim, #64748b) !important;
  font-size: 13.5px !important;
  text-decoration: line-through !important;
  font-weight: 600 !important;
  margin-right: 8px !important;
}

/* Informacja o ilości i ikona edycji */
.wishlist-product-combinations {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 14px !important;
  padding-top: 8px !important;
  border-top: 1px solid var(--trojka-border-subtle, #1e293b) !important;
}

.wishlist-product-combinations-text {
  color: var(--trojka-text-muted, #94a3b8) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  min-height: auto !important;
  margin: 0 !important;
}

.wishlist-product-combinations a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--trojka-primary, #38bdf8) !important;
  padding: 4px 6px !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.wishlist-product-combinations a i {
  font-size: 18px !important;
  color: var(--trojka-primary, #38bdf8) !important;
  transition: color 0.2s ease !important;
}

.wishlist-product-combinations a:hover {
  background: rgba(56, 189, 248, 0.15) !important;
  color: #ffffff !important;
}

.wishlist-product-combinations a:hover i {
  color: #ffffff !important;
}

/* Przycisk akcji („Dostosuj” / „Dodaj do koszyka”) - styl CTA Dark Tech */
.wishlist-product-bottom {
  margin-top: auto !important;
  width: 100% !important;
}

.wishlist-product-addtocart,
.wishlist-product-bottom button.btn {
  width: 100% !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border: 1px solid #38bdf8 !important;
  border-radius: 8px !important;
  padding: 11px 16px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  outline: none !important;
  text-decoration: none !important;
}

.wishlist-product-addtocart:hover,
.wishlist-product-bottom button.btn:hover {
  background: #0284c7 !important;
  border-color: #7dd3fc !important;
  box-shadow: 0 6px 18px rgba(56, 189, 248, 0.45) !important;
  color: #ffffff !important;
  transform: none !important;
}

.wishlist-product-addtocart:active,
.wishlist-product-bottom button.btn:active {
  background: #075985 !important;
  border-color: #38bdf8 !important;
  color: #7dd3fc !important;
}

.wishlist-product-addtocart i.material-icons,
.wishlist-product-bottom button.btn i.material-icons {
  font-size: 18px !important;
  color: #ffffff !important;
  margin-right: 4px !important;
}

/* ==============================================================================
   TRYB KATALOGU (CATALOG MODE): JEDNOLITE KLAWISZE I CZYSTE TŁO BEZ PRZEBIĆ
   Zgodność z zasadą: BIAŁY NAPIS, NIEBIESKAWY PO NACIŚNIĘCIU, NIEBIESKI NA AKTYWNYM
   ============================================================================== */
body.catalog-mode .product-actions,
.page-product.catalog-mode .product-actions {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Klawisz CTA zamówienia telefonicznego w trybie katalogu */
.btn-phone-order,
a.btn-phone-order {
  color: #ffffff !important;
  background: #0284c7 !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.3) !important;
  animation: none !important;
  transition: all 0.2s ease !important;
  transform: none !important;
}

.btn-phone-order .cta-main-text,
.btn-phone-order .cta-action-title,
.btn-phone-order .cta-phone-number,
.btn-phone-order .cta-label-wrapper span {
  color: #ffffff !important;
}

.btn-phone-order:hover,
a.btn-phone-order:hover,
.btn-phone-order:focus,
a.btn-phone-order:focus {
  color: #ffffff !important;
  background: #0369a1 !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 6px 18px rgba(2, 132, 199, 0.45) !important;
}

.btn-phone-order:active,
a.btn-phone-order:active {
  color: #7dd3fc !important;
  background: #075985 !important;
  border-color: #38bdf8 !important;
}

.btn-phone-order:active .cta-main-text,
.btn-phone-order:active .cta-action-title,
.btn-phone-order:active .cta-phone-number {
  color: #7dd3fc !important;
}

/* Klawisze filtrów i sortowania w katalogu */
#search_filters .btn,
.js-search-filters-clear-all,
.filter-block .btn {
  color: #ffffff !important;
  background: #162032 !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}

#search_filters .btn:hover,
.js-search-filters-clear-all:hover,
.filter-block .btn:hover {
  color: #7dd3fc !important;
  border-color: #38bdf8 !important;
  background: #1e293b !important;
}

#search_filters .btn:active,
.js-search-filters-clear-all:active,
.filter-block .btn:active {
  color: #7dd3fc !important;
  background: #0f172a !important;
}

/* ==============================================================================
   CZYTELNOŚĆ ZAWARTOŚCI ZAKŁADEK (#description oraz #product-details)
   ============================================================================== */
/* Neutralizacja stylów edytora z białym tłem i czarnym fontem */
.product-description,
.product-description p,
.product-description span,
.product-description div,
.product-description li {
  background-color: transparent !important;
  color: #cbd5e1 !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
}

.product-description strong,
.product-description b {
  color: #ffffff !important;
}

.product-description a {
  color: #38bdf8 !important;
  text-decoration: underline !important;
}

/* Szczegóły produktu: Indeks, Producent, Cechy */
#product-details {
  padding: 8px 0 !important;
  color: #f1f5f9 !important;
}

#product-details .product-reference,
#product-details .product-quantities,
#product-details .product-manufacturer,
#product-details .product-condition,
#product-details .product-availability-date {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: #131d2e !important;
  border: 1px solid #1e293b !important;
  border-radius: 8px !important;
  padding: 10px 16px !important;
  margin: 0 12px 12px 0 !important;
}

#product-details .label,
#product-details label {
  color: #94a3b8 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  margin: 0 !important;
}

#product-details span,
#product-details .product-reference span,
#product-details .product-quantities span {
  color: #38bdf8 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  background: #090d16 !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
  padding: 4px 12px !important;
  border-radius: 6px !important;
}

#product-details .product-manufacturer a {
  color: #38bdf8 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

#product-details .product-manufacturer a:hover {
  color: #7dd3fc !important;
  text-decoration: underline !important;
}

/* ==============================================================================
   DEFINITYWNA POPRAWKA DLA WIDOKU MOBILNEGO: USUNIĘCIE NADMIAROWYCH STRZAŁEK
   Eliminacja ikon expand_more (add/remove), collapse-icons i strzałek na klawiszach menu
   ============================================================================== */
@media (max-width: 991.98px) {
  /* Usunięcie strzałek z klawiszy menu (PILOTY RTV, OBUDOWY I AKCESORIA itd.) */
  #mobile_top_menu_wrapper .top-menu .float-xs-right,
  #mobile_top_menu_wrapper .top-menu .navbar-toggler,
  #mobile_top_menu_wrapper .top-menu .collapse-icons,
  #mobile_top_menu_wrapper .top-menu .arrows,
  #mobile_top_menu_wrapper .top-menu i.material-icons,
  #mobile_top_menu_wrapper .top-menu i.add,
  #mobile_top_menu_wrapper .top-menu i.remove,
  #mobile_top_menu_wrapper .top-menu a .float-xs-right,
  #mobile_top_menu_wrapper .top-menu a .navbar-toggler,
  #mobile_top_menu_wrapper .top-menu a .collapse-icons,
  #mobile_top_menu_wrapper .top-menu a .arrows,
  #mobile_top_menu_wrapper .top-menu a i.material-icons,
  #mobile_top_menu_wrapper .top-menu a i,
  #_mobile_top_menu .float-xs-right,
  #_mobile_top_menu .navbar-toggler,
  #_mobile_top_menu .collapse-icons,
  #_mobile_top_menu .arrows,
  #_mobile_top_menu i.material-icons,
  #_mobile_top_menu a i.material-icons,
  .js-top-menu.mobile .float-xs-right,
  .js-top-menu.mobile .navbar-toggler,
  .js-top-menu.mobile .collapse-icons,
  .js-top-menu.mobile .arrows,
  .js-top-menu.mobile i.material-icons,
  .top-menu a .float-xs-right,
  .top-menu a .navbar-toggler,
  .top-menu a .collapse-icons,
  .top-menu a .arrows,
  .top-menu a i.material-icons,
  .top-menu a i,
  .top-menu a::after,
  .top-menu a:after,
  .top-menu .dropdown-item::after,
  .top-menu .dropdown-toggle::after {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    font-size: 0 !important;
    line-height: 0 !important;
    pointer-events: none !important;
  }

  /* Usunięcie rozwijanych mega menu/sub-menu na mobile - klawisz jest bezpośrednim odnośnikiem */
  #mobile_top_menu_wrapper .top-menu .sub-menu,
  #mobile_top_menu_wrapper .top-menu .popover.sub-menu,
  #mobile_top_menu_wrapper .top-menu .collapse,
  #_mobile_top_menu .sub-menu,
  .js-top-menu.mobile .sub-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
  }

  /* Klawisze menu mobilnego: jednolite, stabilne bez skakania */
  #mobile_top_menu_wrapper .top-menu > li,
  #_mobile_top_menu .top-menu > li,
  .js-top-menu.mobile .top-menu > li {
    list-style: none !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  #mobile_top_menu_wrapper .top-menu a,
  #mobile_top_menu_wrapper .top-menu a[data-depth="0"],
  #_mobile_top_menu .top-menu a,
  #_mobile_top_menu .top-menu a[data-depth="0"],
  .js-top-menu.mobile .top-menu a,
  .js-top-menu.mobile .top-menu a[data-depth="0"] {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 40px !important;
    padding: 0 16px !important;
    margin: 0 !important;
    color: #ffffff !important;
    background: #162032 !important;
    border: 1px solid #334155 !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    cursor: pointer !important;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
    transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease !important;
  }

  /* Aktywny klawisz kategorii w menu mobilnym: jasny niebieski gradient z białym napisem */
  #mobile_top_menu_wrapper .top-menu li.current > a,
  #mobile_top_menu_wrapper .top-menu li.active-parent > a,
  #mobile_top_menu_wrapper .top-menu a.active,
  #mobile_top_menu_wrapper .top-menu a[data-depth="0"].active,
  #_mobile_top_menu .top-menu li.current > a,
  #_mobile_top_menu .top-menu a.active,
  .js-top-menu.mobile .top-menu li.current > a,
  .js-top-menu.mobile .top-menu a.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%) !important;
    border: 1px solid #38bdf8 !important;
    box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4) !important;
  }

  /* Wyszukiwarka w widoku mobilnym: pełna szerokość */
  #_desktop_search_widget,
  #search_widget,
  .search-widgets,
  .search-widget,
  #header #_desktop_search_widget,
  #header #search_widget,
  .header-top #_desktop_search_widget,
  .header-top #search_widget {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}



/* ==============================================================================
   UJEDNOLICENIE STOPKI PODSTRON I CAŁKOWITE USUNIĘCIE ZBĘDNYCH POZIOMYCH LINII
   (Eliminacja podwójnych kresek oraz szarej ramki PrestaShop Classic .page-footer)
   ============================================================================== */
.page-footer,
#main .page-footer,
footer.page-footer,
#content-wrapper .page-footer,
.page-customer-account .page-footer {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 16px 0 8px 0 !important;
  margin-top: 24px !important;
  margin-bottom: 16px !important;
}

/* Usunięcie nadmiarowych poziomych kresek <hr> przed stopką na podstronach */
#wrapper hr,
#content-wrapper hr,
#main hr,
.page-footer hr {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  height: 0 !important;
  background: transparent !important;
  margin: 16px 0 !important;
}

/* Estetyczne linki nawigacji dolnej (Wróć do Twojego konta, Strona główna) */
.page-footer .account-link,
.account-link,
a.account-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-right: 28px !important;
  padding: 6px 0 !important;
  border-bottom: none !important;
  box-shadow: none !important;
  transition: color 0.15s ease !important;
}

.page-footer .account-link:hover,
.account-link:hover,
a.account-link:hover {
  color: #ffffff !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

.page-footer .account-link i,
.account-link i,
.page-footer .account-link .material-icons,
.account-link .material-icons {
  color: var(--trojka-primary, #38bdf8) !important;
  font-size: 18px !important;
  vertical-align: middle !important;
  transition: color 0.15s ease !important;
}

.page-footer .account-link:hover i,
.account-link:hover i,
.page-footer .account-link:hover .material-icons,
.account-link:hover .material-icons {
  color: #ffffff !important;
}


/* ==========================================================================
   20. OCHRONA PRZED LITERÓWKAMI W E-MAILACH ORAZ OCHRONA ANTYBOTOWA (v4.3.0)
   ========================================================================== */
.trojka-email-typo-hint {
  margin-top: 8px;
  margin-bottom: 4px;
  animation: fadeInTypo 0.25s ease-in-out;
}

@keyframes fadeInTypo {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.typo-alert-inner {
  background: rgba(245, 158, 11, 0.15) !important;
  border: 1px solid #f59e0b !important;
  color: #fbbf24 !important;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 13px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.typo-email-suggested {
  color: #ffffff !important;
  font-weight: 700;
  text-decoration: underline;
}

.btn-apply-email-fix {
  background: #f59e0b !important;
  color: #0f172a !important;
  border: none !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  margin-left: 6px;
  transition: all 0.2s ease;
}

.btn-apply-email-fix:hover {
  background: #fbbf24 !important;
  transform: translateY(-1px);
}

.email-confirm-group {
  margin-top: 14px;
}

.email-hint-subtext {
  font-size: 11px !important;
  color: #94a3b8 !important;
  margin-top: 4px;
  display: block;
}

.email-mismatch-msg {
  color: #f87171 !important;
  font-size: 12px;
  font-weight: 600;
  margin-top: 6px;
  padding: 4px 8px;
  background: rgba(239, 68, 68, 0.1);
  border-radius: 4px;
  border-left: 3px solid #ef4444;
}

.email-paste-hint {
  color: #38bdf8 !important;
  font-size: 11px;
  margin-top: 4px;
}

input.has-typo-error {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 1px #ef4444 !important;
}

.trojka-honeypot-trap {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
  width: 0 !important;
  height: 0 !important;
}


/* CAŁKOWITE USUNIĘCIE WSZELKICH ZBĘDNYCH RAMEK W STOPCE */
.trojka-footer-promo-store {
  border: none !important;
  box-shadow: none !important;
}
.trojka-footer-promo-store a {
  border: none !important;
  box-shadow: none !important;
}
#footer,
#footer *,
.footer-container,
.footer-container * {
  outline: none !important;
  outline-style: none !important;
  outline-width: 0 !important;
  box-shadow: none !important;
}


/* ==========================================================================
   21. WYMUSZENIE STANDARDOWYCH CZARNYCH PÓL EMAIL I HASŁO ORAZ AUTOFILL
   Eliminuje białe tło z pól E-mail i Hasło (w tym przy autouzupełnianiu przeglądarki Chrome/Edge)
   ========================================================================== */
input[name="email"],
input[type="email"],
input[name="password"],
input[type="password"],
input[name="email_confirmation"],
input.js-visible-password,
input.js-child-focus,
.input-group input,
.form-control {
  background-color: #090d16 !important;
  background: #090d16 !important;
  color: #ffffff !important;
  border: 1px solid #334155 !important;
}

/* Obsługa autouzupełniania przeglądarki (Chrome/Edge/Firefox autofill), która domyślnie wymusza białe tło */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active,
input:-internal-autofill-selected {
  -webkit-box-shadow: 0 0 0 1000px #090d16 inset !important;
  box-shadow: 0 0 0 1000px #090d16 inset !important;
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
  caret-color: #ffffff !important;
  background-color: #090d16 !important;
  transition: background-color 5000s ease-in-out 0s;
}

input[name="email"]:focus,
input[type="email"]:focus,
input[name="password"]:focus,
input[type="password"]:focus,
input[name="email_confirmation"]:focus,
.form-control:focus {
  background-color: #090d16 !important;
  background: #090d16 !important;
  color: #ffffff !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.25) !important;
  outline: none !important;
}

/* ==========================================================================
   22. DEFINITYWNA LIKWIDACJA WSZELKICH RAMEK I ZAOKRĄGLEŃ W STOPCE (#footer)
   Usuwa niebieską/białą ramkę wokół bloków "TWOJE KONTO" i "INFORMACJA O SKLEPIE"
   ========================================================================== */
#footer,
#footer *,
.footer-container,
.footer-container *,
#footer .container,
#footer .row,
#footer .col-md-3,
#footer .col-xs-12,
#footer .links,
#footer .wrapper,
#footer .title,
#footer ul,
#footer li,
#footer .block-contact,
#footer #block_myaccount_infos,
.trojka-footer-promo-store,
.trojka-footer-promo-store * {
  border: none !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Pojedyncza, estetyczna pozioma linia oddzielająca stopkę od treści sklepu */
#footer {
  border-top: 1px solid #1e293b !important;
  padding-top: 30px !important;
}


/* ==========================================================================
   BEZWZGLĘDNE USUNIĘCIE NIEBIESKIEGO POLA I RAMEK W STOPCE (#footer)
   ========================================================================== */
#footer,
.footer-container,
#footer .footer-container,
#footer .container,
#footer .row,
#footer .links,
#footer .wrapper,
#footer #block_myaccount_infos,
#footer .block-contact,
#footer .trojka-footer-promo-store,
.trojka-footer-promo-store,
#block_myaccount_infos,
.block-contact {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  /* border-left: none removed */
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

#footer {
  background-color: #090d16 !important;
  background: #090d16 !important;
  border-top: 1px solid #1e293b !important;
  padding-top: 30px !important;
}

/* ==========================================================================
   CAŁKOWITE OBRAMOWANIE KLAWISZA "POKAŻ" / UKRYJ HASŁO
   ========================================================================== */
.input-group .input-group-btn > .btn[data-action="show-password"],
.btn-show-password,
button[data-action="show-password"],
[data-action="show-password"] {
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 4px !important;
  background-color: #1e293b !important;
  color: #ffffff !important;
}
.input-group .input-group-btn > .btn[data-action="show-password"]:hover,
.btn-show-password:hover,
button[data-action="show-password"]:hover,
[data-action="show-password"]:hover {
  border-color: #7dd3fc !important;
  background-color: #253349 !important;
  color: #ffffff !important;
}


/* ==========================================================================
   CAŁKOWITE 4-STRONNE OBRAMOWANIE KLAWISZA "POKAŻ" / UKRYJ HASŁO
   ========================================================================== */
.input-group .input-group-btn > .btn[data-action="show-password"],
.input-group .btn[data-action="show-password"],
.btn-show-password,
button[data-action="show-password"],
[data-action="show-password"] {
  border: 1px solid #38bdf8 !important;
  border-top: 1px solid #38bdf8 !important;
  border-right: 1px solid #38bdf8 !important;
  border-bottom: 1px solid #38bdf8 !important;
  border-left: 1px solid #38bdf8 !important;
  border-radius: 4px !important;
  border-top-left-radius: 4px !important;
  border-bottom-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
  margin-left: 6px !important;
  position: relative !important;
  z-index: 10 !important;
  background-color: #1e293b !important;
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 0 0 1px #38bdf8 !important;
}

.input-group .input-group-btn > .btn[data-action="show-password"]:hover,
.input-group .btn[data-action="show-password"]:hover,
.btn-show-password:hover,
button[data-action="show-password"]:hover,
[data-action="show-password"]:hover {
  border-color: #7dd3fc !important;
  box-shadow: 0 0 0 1px #7dd3fc, 0 0 10px rgba(56, 189, 248, 0.4) !important;
  background-color: #253349 !important;
  color: #ffffff !important;
}


/* ==========================================================================
   WERSJA 4.3.1 - PRZYWRÓCONE KLUCZOWE POPRAWKI SKLEPU TRÓJKA:
   1. Czarne / ciemne tło pól formularzy (email, hasło, tekst w rejestracji i logowaniu)
   2. Otoczki aktywnych linków (estetyczna błękitna ramka 1px, brak grubych czarnych obwódek)
   3. Podwójne pole potwierdzenia e-mail w rejestracji
   ========================================================================== */

/* 1. CZARNE / CIEMNE POLA EMAIL, HASŁO I FORMULARZY REJESTRACJI / LOGOWANIA */
#customer-form input[type="text"],
#customer-form input[type="email"],
#customer-form input[type="password"],
#login-form input[type="text"],
#login-form input[type="email"],
#login-form input[type="password"],
.js-customer-form input.form-control,
.js-customer-form input[type="email"],
.js-customer-form input[type="password"],
.register-form input.form-control,
.form-fields input[type="email"],
.form-fields input[type="password"],
input#field-email,
input#field-password,
input#field-email-confirm,
.js-confirm-email,
input[name="email"],
input[name="password"],
input[name="email_confirmation"] {
  background-color: #020617 !important;
  background: #020617 !important;
  color: #ffffff !important;
  border: 1px solid #334155 !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
}

#customer-form input:focus,
#login-form input:focus,
.js-customer-form input.form-control:focus,
input#field-email:focus,
input#field-password:focus,
input#field-email-confirm:focus,
.js-confirm-email:focus {
  background-color: #090d16 !important;
  background: #090d16 !important;
  color: #ffffff !important;
  border-color: #38bdf8 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.25) !important;
}

/* 2. OTOCZKI AKTYWNYCH LINKÓW (ELEGANCKA BŁĘKITNA OTOCZKA 1PX BEZ BRZYDKIEGO OUTLINE) */
a:focus,
a:active,
button:focus,
.btn:focus,
.nav-link:focus,
.page-link:focus {
  outline: none !important;
  outline-width: 0 !important;
}

/* Aktywne linki w nawigacji, liście kategorii i paginacji */
.top-menu a.active,
.category-top-menu a.active,
.block-categories a.active,
.page-item.active .page-link,
a.active-link,
.facet-label.active {
  border: 1px solid #38bdf8 !important;
  border-radius: 4px !important;
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.25) !important;
  outline: none !important;
}

/* 3. STYLIZACJA PODWÓJNEGO POLA EMAIL W REJESTRACJI */
.email-confirm-group {
  margin-top: 14px !important;
  margin-bottom: 14px !important;
}
.email-confirm-group label {
  color: #cbd5e1 !important;
  font-weight: 600 !important;
}
.email-hint-subtext {
  color: #94a3b8 !important;
  font-size: 11.5px !important;
  margin-top: 4px !important;
  display: block !important;
}
