/* =========================================
FOX custom styles
Nasze poprawki. Plików GTECH nie ruszamy.
========================================= */
/* ---------- Nagłówek: przyklejony (mobile + desktop) ---------- */
html.fx-on body { padding-top: var(--fx-hh, 0px); }
html.fx-on header.top1 {
position: fixed; top: 0; left: 0; right: 0; z-index: 1500;
background: #fff;
transition: box-shadow .2s ease;
}
html.fx-scrolled header.top1 { box-shadow: 0 2px 10px rgba(0,0,0,.12); }
header.top1 .fx-header::before,
header.top1 .fx-header::after { display: none; }
header.top1 div.logo,
header.top1 div.logo img { transition: all .25s ease; }
/* Wyszukiwarka w nagłówku */
header.top1 .top_search { margin: 0; border-radius: 0; }
header.top1 .top_search form { display: flex !important; width: 100%; margin: 0; box-sizing: border-box; }
header.top1 .top_search input[type="text"] { flex: 1 1 auto; width: auto; min-width: 0; }
header.top1 .top_search button.btn.btn-sm { flex: 0 0 auto; }
header.top1 .top_search button.btn.btn-sm i { color: #fff; font-size: inherit; margin-right: 6px; }
/* ---------- Liczniki: czarny tekst, ukryte gdy puste lub 0 ---------- */
.top1 .top_fav .top_icon2 .cnt,
.top1 .top_cart .top_icon .cnt { color: #212121; font-weight: 700; }
.top1 .cnt:empty,
.top1 #mcartItems:empty,
.top1 .fx-zero { display: none !important; }
/* ---------- Telefon ---------- */
.top_contact .fx-phone {
display: grid; grid-template-columns: auto auto;
grid-template-areas: "t icon" "l icon";
column-gap: 12px; align-items: center; text-align: right;
}
.top_contact .fx-phone .t { grid-area: t; font-size: 27px; line-height: 1.1; white-space: nowrap; }
.top_contact .fx-phone .l { grid-area: l; }
.top_contact .fx-phone .top_icon { grid-area: icon; float: none; margin: 0; }
.top_contact .fx-phone .top_icon .far { margin: 0; }
.top_contact .fx-phone .clear { display: none; }
.top_contact .fx-phone:hover .t { color: #f8c301; }
@keyframes fx-ring {
0%, 16%, 100% { transform: rotate(0); }
2%, 6%, 10%   { transform: rotate(-15deg); }
4%, 8%, 12%   { transform: rotate(15deg); }
}
/* Desktop: ikona telefonu na chwilę zapala się na żółto (razem z potrząśnięciem) */
@keyframes fx-flash {
0%, 18%, 100% { color: #212121; }
2%, 14%       { color: #f8c301; }
}
@keyframes fx-pulse {
0%   { box-shadow: 0 0 0 0 rgba(248,195,1,.75); }
70%  { box-shadow: 0 0 0 14px rgba(248,195,1,0); }
100% { box-shadow: 0 0 0 0 rgba(248,195,1,0); }
}
.top1 .fx-phone .top_icon .far,
.top1 .mobile-only a.tel .far {
display: inline-block; transform-origin: 50% 50%;
animation: fx-ring 5s ease-in-out infinite;
}
.top1 .fx-phone .top_icon .far {
animation: fx-ring 5s ease-in-out infinite, fx-flash 5s ease-in-out infinite;
}
/* ---------- Desktop (od 992 px) ----------
Rząd 1: logo | menu (O firmie, Serwis, Kontakt)
Rząd 2: logo | telefon, serce, koszyk, Moje konto
Rząd 3: wyszukiwarka na całą szerokość */
@media (min-width: 992px) {
header.top1 .fx-header {
display: grid;
grid-template-columns: auto 1fr;
grid-template-areas:
"logo   menu2"
"logo   actions"
"search search";
column-gap: 32px; row-gap: 4px; align-items: center;
padding-bottom: 12px;
}
header.top1 div.logo     { grid-area: logo; float: none; padding: 8px 0 4px; }
header.top1 .top_menu2   { grid-area: menu2; float: none; justify-self: end; align-self: start; }
header.top1 .top_search  { grid-area: search; float: none; }
header.top1 .fx-actions  { grid-area: actions; justify-self: end; display: flex; align-items: center; gap: 6px; }
header.top1 .fx-actions > div { float: none; clear: none; margin: 0; padding: 0; min-width: 0; }
header.top1 .top_menu    { display: none !important; }
/* Wszystkie ikony w jednej linii */
header.top1 .fx-actions .top_icon,
header.top1 .fx-actions .top_icon2 { padding: 0 12px; height: 52px; display: flex; align-items: center; }
header.top1 .fx-actions .top_icon > a,
header.top1 .fx-actions .top_icon2 > a { display: flex; align-items: center; }
header.top1 .fx-actions .top_icon i,
header.top1 .fx-actions .top_icon2 i { float: none; line-height: 1; }
header.top1 .fx-actions .ttt { padding-top: 0; }
header.top1 .fx-actions .top_cart .top_icon .cnt,
header.top1 .fx-actions .top_fav .top_icon2 .cnt { top: 4px; left: 32px; }
header.top1 .fx-actions .top_contact { padding-right: 8px; }
/* Serce i koszyk bez podpisów */
.top1 .top_fav .ttt,
.top1 .top_cart .ttt { display: none; }
/* Po przewinięciu: kompaktowy nagłówek */
html.fx-scrolled header.top1 .fx-header {
grid-template-areas: "logo actions" "search search";
padding-bottom: 10px;
}
html.fx-scrolled header.top1 div.logo { padding: 4px 0; }
html.fx-scrolled header.top1 div.logo img { max-width: 80px; }
html.fx-scrolled header.top1 .top_menu2 { display: none; }
}
/* ---------- Mobile i tablet (do 991 px): logo | telefon | koszyk | ☰, pod spodem wyszukiwarka ---------- */
@media (max-width: 991px) {
header.top1 .fx-header { display: flex; align-items: center; flex-wrap: wrap; padding-top: 0; }
header.top1 .mobile-only { display: contents; }
header.top1 .fx-actions,
header.top1 .top_menu2 { display: none !important; }
header.top1 .top_menu { position: absolute; width: 0; height: 0; overflow: visible; }
header.top1 div.logo { order: 1; float: none; width: auto; padding: 6px 0; text-align: left; }
header.top1 div.logo img { height: 52px; width: auto; max-width: none; }
/* Większe pola dotyku (48 px) i odstępy od krawędzi ekranu */
header.top1 .fx-header { width: auto; max-width: none; padding-left: 16px; padding-right: 16px; box-sizing: border-box; }
header.top1 .mobile-only a.tel,
header.top1 .mobile-only a.login,
header.top1 .mobile-only a.cart,
header.top1 .mobile-only a.cat {
display: flex; align-items: center; justify-content: center;
width: 48px; height: 48px; margin: 0; line-height: 1;
}
header.top1 .mobile-only a .far { font-size: 26px; line-height: 1; }
header.top1 .mobile-only a.tel  { order: 2; margin-left: auto; }
header.top1 .mobile-only a.login { order: 3; margin-left: 8px; }
header.top1 .mobile-only a.cart  { order: 4; position: relative; margin-left: 4px; }
header.top1 .mobile-only a.cat   { order: 5; margin-left: 4px; margin-right: -8px; }
.top1 .mobile-only a.tel .far {
width: 46px; height: 46px; line-height: 46px; font-size: 21px;
text-align: center; border-radius: 50%;
background: #f8c301; color: #212121;
animation: fx-ring 5s ease-in-out infinite, fx-pulse 2s ease-out infinite;
}
header.top1 #mcartItems {
position: absolute; top: 2px; right: 0;
min-width: 18px; height: 18px; line-height: 18px; padding: 0 4px;
font-size: 12px; font-weight: 700; text-align: center;
background: #f8c301; color: #212121; border-radius: 9px;
}
header.top1 .top_search {
order: 6; flex: 0 0 100%; display: block !important;
width: 100%; max-width: 100%; box-sizing: border-box; margin: 0 0 8px; padding: 0;
}
header.top1 .top_search .ss4 { width: auto; }
header.top1 .top_search input[type="text"] { font-size: 16px; padding: 12px 14px; }
header.top1 .top_search button.btn.btn-sm { padding: 8px 14px; font-size: 16px; }
/* ----- Menu boczne: wysuwa się z prawej, płynnie ----- */
.top_menu #navbar {
left: auto; right: 0;
width: min(340px, 88vw) !important;
padding-top: 64px; box-sizing: border-box; height: 100%;
overflow-y: auto; -webkit-overflow-scrolling: touch;
transform: translateX(105%); visibility: hidden;
box-shadow: 0 0 0 100vmax rgba(0,0,0,0);
transition: transform .38s cubic-bezier(.22,.61,.36,1), box-shadow .38s ease, visibility 0s linear .38s;
}
html.fx-menu-open .top_menu #navbar {
transform: none; visibility: visible;
box-shadow: 0 0 0 100vmax rgba(0,0,0,.55);
transition: transform .38s cubic-bezier(.22,.61,.36,1), box-shadow .38s ease, visibility 0s;
}
/* Zawartość menu pojawia się kaskadowo */
#navbar > .fx-nav-top,
#navbar > ul.nav,
#navbar > .fx-nav-links {
opacity: 0; transform: translateX(24px);
transition: opacity .3s ease, transform .3s ease;
}
html.fx-menu-open #navbar > .fx-nav-top   { opacity: 1; transform: none; transition-delay: .12s; }
html.fx-menu-open #navbar > ul.nav        { opacity: 1; transform: none; transition-delay: .18s; }
html.fx-menu-open #navbar > .fx-nav-links { opacity: 1; transform: none; transition-delay: .24s; }
.top1 #navbar .closebtn,
.top1 #navbar .closebtn i { color: #f8c301; }
#navbar .closebtn { top: 10px; right: 14px; font-size: 34px; line-height: 44px; padding: 0 6px; }
#navbar .fx-nav-call {
display: block; margin: 0 14px 4px; padding: 12px;
background: #f8c301; color: #212121; font-weight: 700; font-size: 17px;
text-align: center; border-radius: 6px;
}
#navbar .fx-nav-call i { color: #212121; margin-right: 8px; font-size: 18px; }
#navbar .fx-nav-hours { margin: 0 14px; color: #bdbdbd; font-size: 13px; text-align: center; }
#navbar .fx-nav-title {
padding: 18px 14px 6px; color: #f8c301; font-weight: 700; text-align: left;
font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
}
#navbar .fx-nav-links a { padding: 10px 14px; font-size: 16px; text-align: left; }
#navbar .fx-nav-links ul.nav { display: block !important; position: static; padding: 0; margin: 0; }
#navbar .fx-nav-links ul.nav > li { display: block; }
.fx-overlay { position: fixed; inset: 0; z-index: 1400; display: none; }
html.fx-menu-open .fx-overlay { display: block; }
html.fx-menu-open body { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
.top1 .fx-phone .top_icon .far,
.top1 .mobile-only a.tel .far { animation: none !important; }
}
/* ===== Плитки марок на головній (без блоку переваг home_boxes2) ===== */
.home_boxes:not(.home_boxes2) .box {
padding: 0; border: 0; background: #fff;
transition: box-shadow .25s ease, transform .25s ease;
}
.home_boxes:not(.home_boxes2) .box > a {
display: flex; align-items: center; justify-content: space-between;
gap: 12px; min-height: 120px; padding: 0 24px;
box-sizing: border-box; text-decoration: none;
}
.home_boxes:not(.home_boxes2) .box > a span {
padding-top: 0; font-size: clamp(16px, 1.7vw, 24px);
line-height: 1.1; letter-spacing: 0; color: #212121;
white-space: nowrap; overflow: visible;
}
.home_boxes:not(.home_boxes2) .box > a i { display: none; }
.home_boxes:not(.home_boxes2) .box > a::after {
content: ""; flex: 0 0 auto;
width: 120px; height: 80px;
background: no-repeat center / contain;
}
.home_boxes:not(.home_boxes2) .box1 > a::after { background-image: url(img/logo_mazda.png); }
.home_boxes:not(.home_boxes2) .box2 > a::after { background-image: url(img/logo_hyundai.png); }
.home_boxes:not(.home_boxes2) .box3 > a::after { background-image: url(img/logo_kia.png); }
.home_boxes:not(.home_boxes2) .box4 > a::after { background-image: url(img/logo_chevrolet.png); }
.home_boxes:not(.home_boxes2) .box:hover {
box-shadow: 0 0 0 1px rgba(0,0,0,.08), 0 6px 22px rgba(0,0,0,.45);
transform: translateY(-2px);
}
.home_boxes:not(.home_boxes2) .box > a:hover,
.home_boxes:not(.home_boxes2) .box > a:hover span { color: #212121; }
@media (min-width: 768px) and (max-width: 991px) {
.home_boxes:not(.home_boxes2) .box { width: calc(25% - 20px); float: left; }
.home_boxes:not(.home_boxes2) .box > a { justify-content: center; min-height: 130px; padding: 0 12px; }
.home_boxes:not(.home_boxes2) .box > a span {
position: absolute; width: 1px; height: 1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
}
@media (max-width: 767px) {
.home_boxes:not(.home_boxes2) .box { width: auto; float: none; margin: 10px; }
.home_boxes:not(.home_boxes2) .box > a { min-height: 96px; padding: 0 20px; }
.home_boxes:not(.home_boxes2) .box > a span { font-size: 22px; }
.home_boxes:not(.home_boxes2) .box > a::after { width: 105px; height: 70px; }
}
/* Планшет: тільки логотип по центру, 4 в ряд */
@media (min-width: 768px) and (max-width: 1240px) {
.home_boxes .box { width: calc(25% - 20px); float: left; }
.home_boxes .box > a { justify-content: center; min-height: 130px; padding: 0 12px; }
.home_boxes .box > a span {
position: absolute; width: 1px; height: 1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
}
/* Мобільний: на всю ширину, текст зліва, логотип справа */
@media (max-width: 767px) {
.home_boxes .box { width: auto; float: none; margin: 10px; }
.home_boxes .box > a { min-height: 96px; padding: 0 20px; }
.home_boxes .box > a span { font-size: 22px; }
.home_boxes .box > a::after { width: 105px; height: 70px; }
}
/* Іконки соцмереж у футері: однаковий стиль і один рівень */
.footer1 .contact > div:last-child {
display: flex; align-items: center;
}
.footer1 .contact a[href*="facebook.com"],
.footer1 .contact a[href*="instagram.com"] {
display: inline-flex; align-items: center; justify-content: center;
width: 40px; height: 40px; border-radius: 50%;
background: #fff; color: #212121;
text-decoration: none; line-height: 1;
transition: background-color .2s ease;
}
.footer1 .contact a[href*="facebook.com"] .fab {
font-size: 20px; margin: 0; color: inherit;
}
.footer1 .contact a[href*="facebook.com"] .fab:before { content: "\f39e"; }
.footer1 .contact a[href*="instagram.com"] img { display: none; }
.footer1 .contact a[href*="instagram.com"]:before {
content: "\f16d";
font-family: "Font Awesome 5 Brands"; font-weight: 400;
font-size: 21px;
}
.footer1 .contact a[href*="facebook.com"]:hover,
.footer1 .contact a[href*="instagram.com"]:hover {
background: #f8c301; color: #000;
}
.footer1 .contact a:hover .fab { color: inherit; }
header.top1 div.logo img {max-width: 150px; height: auto;}
/* logo ma stałe miejsce od pierwszej klatki (bez skoku nagłówka, gdy obrazek się wczyta) */
header.top1 div.logo img { width: 150px; aspect-ratio: 420 / 323; }
/* Фото товарів у списках: заповнюють весь блок, по центру, без спотворень */
.pdr .pImg { overflow: hidden; }
.pdr .pImg > a {
display: block; width: 100%; height: 100%;
line-height: 0;
}
.pdr .pImg > a > img {
display: block;
width: 100%; height: 100%;
max-width: none; max-height: none;
object-fit: cover; object-position: center;
}
.tos .channels.disabled {
display: none;
}
/* ---------- Strona O firmie (.fx-about) ---------- */
.textContent .fx-about { max-width: 1100px; margin: 0 auto; color: #212121; font-size: 15px; line-height: 1.65; }
.fx-about *, .fx-about *::before, .fx-about *::after { box-sizing: border-box; }
.fx-about img { display: block; max-width: 100%; height: auto; border-radius: 8px; }
.fx-about h2 { font-size: 24px; line-height: 1.3; margin: 0 0 12px; font-weight: 700; color: #212121; }
.fx-about h3 { font-size: 18px; margin: 0 0 8px; font-weight: 700; color: #212121; }
.fx-about p { margin: 0 0 12px; text-align: left; }
.fx-about-hero { position: relative; border-radius: 8px; overflow: hidden; margin-bottom: 24px; }
.fx-about-hero img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0; }
.fx-about-hero-txt { padding: 20px; background: #212121; color: #fff; }
.fx-about-hero-txt h2 { color: #fff; }
.fx-about-hero-txt p { color: #eee; }
.fx-about-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px !important; }
.fx-about .fx-btn { display: inline-block; padding: 12px 20px; background: #f8c301; color: #212121 !important; font-weight: 700; border-radius: 6px; text-decoration: none !important; border: 2px solid #f8c301; transition: filter .2s; }
.fx-about .fx-btn:hover { filter: brightness(.93); }
.fx-about .fx-btn-ghost { background: transparent; color: inherit !important; border-color: currentColor; }
.fx-about-hero .fx-btn-ghost { color: #fff !important; }
.fx-about-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 32px; }
.fx-fact { background: #f6f6f6; border-left: 4px solid #f8c301; border-radius: 6px; padding: 14px; }
.fx-fact strong { display: block; font-size: 18px; line-height: 1.25; }
.fx-fact span { display: block; font-size: 13px; color: #555; margin-top: 4px; }
.fx-about-sec { margin-bottom: 28px; }
.fx-brands { display: flex; flex-wrap: wrap; gap: 8px; }
.fx-brands span { padding: 6px 14px; border: 1px solid #bdbdbd; border-radius: 20px; font-weight: 700; font-size: 14px; }
.fx-about-cols { display: grid; gap: 12px; margin-bottom: 32px; }
.fx-about-card { border: 1px solid #e3e3e3; border-radius: 8px; padding: 18px; }
.fx-about-card p { margin: 0; }
.fx-about-split { display: grid; gap: 20px; align-items: center; margin-bottom: 32px; }
.fx-about-split img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.fx-about .fx-link { color: #212121; font-weight: 700; text-decoration: underline; text-decoration-color: #f8c301; text-decoration-thickness: 3px; text-underline-offset: 4px; }
.fx-about-cta { background: #f8c301; border-radius: 8px; padding: 24px 20px; text-align: center; }
.fx-about-cta p { text-align: center; }
.fx-about-cta .fx-about-btns { justify-content: center; }
.fx-about-cta .fx-btn { background: #212121; border-color: #212121; color: #fff !important; }
.fx-about-cta .fx-btn-ghost { background: transparent; color: #212121 !important; border-color: #212121; }
.fx-about-addr { font-size: 13px; margin: 12px 0 0 !important; }
@media (min-width: 768px) {
.fx-about h2 { font-size: 28px; }
.fx-about-hero img { aspect-ratio: 21 / 9; }
.fx-about-hero-txt { padding: 28px 32px; }
.fx-about-facts { grid-template-columns: repeat(4, 1fr); }
.fx-about-cols { grid-template-columns: repeat(3, 1fr); }
.fx-about-split { grid-template-columns: 1fr 1fr; gap: 32px; }
.fx-about-cta { padding: 36px; }
}
@media (min-width: 1100px) {
.fx-about-hero img { aspect-ratio: auto; height: 460px; }
.fx-about-hero-txt { position: absolute; left: 24px; bottom: 24px; max-width: 560px; background: rgba(33,33,33,.92); border-radius: 8px; }
}
.top1 i:hover {
color: #f8c301;
}
.top1 .top_cart .top_icon i:hover,
.top_contact .fx-phone .top_icon .far:hover {
color: #f8c301;
}
/* ---------- Produkty polecane na głównej: CSS Grid zamiast float ---------- */
.home_section .pdrs.pdrs-small {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
margin: 0 0 30px;
}
.home_section .pdrs.pdrs-small::before,
.home_section .pdrs.pdrs-small::after { content: none; display: none; }
.home_section .pdrs.pdrs-small > .pdr {
float: none; width: auto; clear: none !important;
display: flex; min-width: 0;
}
.home_section .pdrs.pdrs-small > .pdr .brd {
display: flex; flex-direction: column;
width: 100%; margin: 0; min-height: 0;
}
.home_section .pdrs.pdrs-small > .pdr .brd::after { content: none; display: none; }
.home_section .pdrs.pdrs-small > .pdr .pImg { height: auto; aspect-ratio: 3 / 2; }
.home_section .pdrs.pdrs-small > .pdr .pPrc { height: auto; }
.home_section .pdrs.pdrs-small > .pdr .brd .c { margin-top: auto; }
@media (max-width: 991px) {
.home_section .pdrs.pdrs-small { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 575px) {
.home_section .pdrs.pdrs-small { gap: 10px; }
.home_section .pdrs.pdrs-small > .pdr .pTxt > a { font-size: 13px; }
.home_section .pdrs.pdrs-small > .pdr .brd .pPrc { font-size: 18px; margin: 6px 10px; }
.home_section .pdrs.pdrs-small > .pdr .brd .c p a.btn.addBtn { font-size: 14px; padding: 10px 6px; }
}
/* ---------- Karta produktu, krok 1: ukrycie zbędnych elementów (12.10.2026) ---------- */
.product.pl .leftFoto .pFlags { display: none; }
.product.pl .manuf img { display: none; }
.product.pl .pStock .deliveryCost,
.product.pl .pStock a.compare { display: none; }
.product.pl .pStock p.availability:has(#avlName:empty) { display: none; }
/* =========================================================
Karta produktu FX: nowy wygląd (13.10.2026)
Dotyczy tylko nowego szablonu product_presentation_fx.html
(klasa .fxp) i bloku powiązanych (.fx-rel).
========================================================= */
.product.pl.fxp { --fy: #f8c301; --fyd: #d9aa00; --fink: #212121; --fmute: #7a7a7a; --fline: #e4e4e4; --fsoft: #f6f6f4; --fok: #1e8a4c; --fokbg: #e9f6ee; --fwarn: #9a5800; --fwarnbg: #fff4d6; --foff: #666; --foffbg: #f0f0f0; }
/* Układ: zdjęcie | szczegóły, niżej opis i parametry */
.product.pl.fxp > .row { display: block; margin: 0; }
.product.pl.fxp > .row > .clear { display: none; }
.product.pl.fxp .fx-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); column-gap: 28px; align-items: start; }
.product.pl.fxp .fx-top > .leftFoto { grid-column: 1; grid-row: 1; width: auto; float: none; margin: 0; padding: 12px; background: #fff; border: 1px solid var(--fline); border-radius: 8px; }
@supports (overflow: clip) {
body:has(.product.pl.fxp) .body-container { overflow: clip; }
.product.pl.fxp .fx-top > .leftFoto { position: sticky; top: var(--fx-pd-top, 150px); }
}
.product.pl.fxp .fx-top > .pDetails { grid-column: 2; grid-row: 1; width: auto; float: none; margin: 0; padding: 0; }
.product.pl.fxp .pDetails .brd3 { padding: 0; border: 0; margin: 0; }
/* Galeria */
.product.pl.fxp #prodFoto { width: 100%; margin: 0; }
.product.pl.fxp #prodFoto .slick-slide { height: auto; }
.product.pl.fxp #prodFoto a.slick-slide { display: flex !important; align-items: center; justify-content: center; aspect-ratio: 4 / 3; background: var(--fsoft); border-radius: 6px; overflow: hidden; }
.product.pl.fxp #prodFoto img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; margin: 0 auto; }
.product.pl.fxp #prodFoto > .fa-image { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; font-size: 54px; color: #c9c9c9; background: var(--fsoft); border-radius: 6px; width: 100%; }
.product.pl.fxp .miniatures { margin: 10px 0 0; padding: 0; width: 100%; }
.product.pl.fxp .miniatures .slick-arrow { display: none !important; }
.product.pl.fxp .miniatures .slick-list { overflow-x: auto; overflow-y: hidden; padding: 2px 0 4px; scrollbar-width: thin; }
.product.pl.fxp .miniatures .slick-track { display: flex !important; gap: 8px; width: max-content !important; transform: none !important; margin: 0; }
.product.pl.fxp .miniatures .slick-track::before, .product.pl.fxp .miniatures .slick-track::after { display: none; }
.product.pl.fxp .miniatures a.slick-slide { float: none; flex: 0 0 auto; width: 76px !important; height: 60px !important; margin: 0; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden; opacity: .65; background: var(--fsoft); transition: border-color .15s, opacity .15s; }
.product.pl.fxp .miniatures a.slick-slide:hover { border-color: var(--fy); opacity: 1; }
.product.pl.fxp .miniatures a.slick-current { border-color: var(--fink); opacity: 1; }
.product.pl.fxp .miniatures a.slick-slide img { display: block; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; margin: 0; border: 0; }
/* Producent i kod jako "chipy" */
.product.pl.fxp .fx-meta { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin: 0 0 10px; }
.product.pl.fxp .fx-meta > h3.small,
.product.pl.fxp .fx-meta > p.manuf { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 4px 10px; border: 1px solid var(--fline); border-radius: 6px; font-size: 13px; line-height: 1.3; float: none; background: #fff; }
.product.pl.fxp .fx-meta .t60 { color: var(--fmute); font-weight: 400; width: auto; min-width: 0; margin: 0; padding: 0; display: inline; }
.product.pl.fxp .fx-meta .mn { font-weight: 700; letter-spacing: .03em; color: var(--fink); }
.product.pl.fxp .fx-meta #prodCode { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 600; color: var(--fink); }
.product.pl.fxp .fx-copy { border: 0; background: none; padding: 1px 4px; margin-left: 2px; font-size: 12px; color: var(--fmute); border-radius: 3px; cursor: pointer; }
.product.pl.fxp .fx-copy:hover { background: var(--fy); color: var(--fink); }
/* Chipy: oryginalne float/width z style.css */
.product.pl.fxp .fx-meta .fx-chip { float: none; width: auto; }
.product.pl.fxp .fx-buy > .stockLevel { display: none; }
.product.pl.fxp .fx-note[hidden] { display: none; }
.product.pl.fxp .zakl.fx-lower > .clear { display: none; }
/* Tytuł */
.product.pl.fxp .pTitle { margin: 0; padding: 0; border: 0; }
.product.pl.fxp .pTitle h1 { font-size: 24px; line-height: 1.22; margin: 0; word-break: break-word; }
/* Opinie pod tytułem: tylko gdy są */
.product.pl.fxp .revv { margin: 8px 0 0; }
/* Uwaga z opisu */
.product.pl.fxp .fx-note { margin: 14px 0 0; padding: 10px 13px; border-radius: 8px; background: var(--fwarnbg); color: var(--fwarn); font-size: 14px; line-height: 1.45; }
.product.pl.fxp .fx-note b { color: var(--fwarn); }
/* Box zakupu */
.product.pl.fxp .w50xx.sidebar { width: auto; float: none; margin: 16px 0 0; padding: 0; border: 0; }
.product.pl.fxp .fx-buy { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--fline); border-radius: 8px; padding: 18px 18px 16px; margin: 0; }
.product.pl.fxp .fx-buy > .stockLevel { display: none; }
.product.pl.fxp .fx-buy > .pPrc { order: 1; margin: 0; padding: 0; float: none; width: auto; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.product.pl.fxp .fx-buy > .pPrc .mc { display: none; }
.product.pl.fxp .fx-buy .ps_price { font-size: 36px; line-height: 1.05; font-weight: 700; }
.product.pl.fxp .fx-buy .fx-vat { font-size: 12.5px; color: var(--fmute); }
.product.pl.fxp .fx-buy > * { order: 2; }
.product.pl.fxp .fx-buy > .fx-stock { order: 3; }
.product.pl.fxp .fx-buy > .grey3 { order: 4; }
.product.pl.fxp .fx-buy > .fx-ask { order: 5; }
.product.pl.fxp .fx-buy > .fx-deliv { order: 6; }
.product.pl.fxp .fx-buy > .pPrc { order: 1; }
/* Stan magazynowy */
.product.pl.fxp .fx-stock { display: flex; gap: 10px; align-items: flex-start; margin: 12px 0 14px; padding: 10px 12px; border-radius: 8px; font-size: 14px; line-height: 1.35; }
.product.pl.fxp .fx-stock > i { width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; flex: none; }
.product.pl.fxp .fx-stock b { display: block; }
.product.pl.fxp .fx-stock span { display: block; font-size: 12.5px; opacity: .9; }
.product.pl.fxp .fx-s-ok, .product.pl.fxp .fx-s-low { background: var(--fokbg); color: #14532d; }
.product.pl.fxp .fx-s-ok > i { background: var(--fok); box-shadow: 0 0 0 4px rgba(30, 138, 76, .15); }
.product.pl.fxp .fx-s-low > i { background: #e48a00; box-shadow: 0 0 0 4px rgba(228, 138, 0, .15); }
.product.pl.fxp .fx-s-ext { background: var(--fwarnbg); color: var(--fwarn); }
.product.pl.fxp .fx-s-ext > i { background: #e48a00; }
.product.pl.fxp .fx-s-off { background: var(--foffbg); color: var(--foff); }
.product.pl.fxp .fx-s-off > i { background: #a8a8a8; }
.fx-mbar .fx-c-ok { color: #1e8a4c; } .fx-mbar .fx-c-ext { color: #9a5800; } .fx-mbar .fx-c-off { color: #666; }
/* Ilość + przycisk */
.product.pl.fxp .grey3 { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; margin: 0; padding: 0; float: none; width: auto; }
.product.pl.fxp .grey3 > p.qty { display: flex; align-items: center; box-sizing: border-box; margin: 0; padding: 0 4px; height: 52px; border: 1px solid var(--fline); border-radius: 8px; background: #fff; float: none; width: auto; }
.product.pl.fxp .grey3 > p.qty[style*="none"] { display: none; }
.product.pl.fxp .grey3 > p.qty > label { display: none; }
.product.pl.fxp .grey3 > p.qty input[name="quantity"] { width: 38px; height: 40px; border: 0; padding: 0; margin: 0; text-align: center; font-size: 16px; font-weight: 500; background: transparent; -moz-appearance: textfield; }
.product.pl.fxp .grey3 > p.qty input::-webkit-inner-spin-button,
.product.pl.fxp .grey3 > p.qty input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.product.pl.fxp .grey3 > p.qty .unit { font-size: 12px; color: var(--fmute); text-transform: lowercase; margin: 0 4px 0 0; }
.product.pl.fxp .fx-q { width: 36px; height: 40px; border: 0; background: none; font-size: 20px; line-height: 1; color: #444; border-radius: 6px; cursor: pointer; transition: background .15s; }
.product.pl.fxp .fx-q:hover { background: var(--fy); color: var(--fink); }
.product.pl.fxp .grey3 > #pCart { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; float: none; width: auto; }
.product.pl.fxp #pCart .addBtn,
.product.pl.fxp #pCart .askBtn,
.product.pl.fxp #pCart .ask1 { flex: 1; display: flex !important; align-items: center; justify-content: center; gap: 9px; height: 52px; min-height: 0; line-height: 1.15; margin: 0; padding: 0 14px; border-radius: 8px; font-size: 18px; font-weight: 700; text-transform: none; white-space: normal; transition: background .15s, color .15s, border-color .15s; }
.product.pl.fxp #pCart .addBtn[style*="none"],
.product.pl.fxp #pCart .ask1[style*="none"] { display: none !important; }
.product.pl.fxp #pCart .addBtn,
.product.pl.fxp #pCart .askBtn { background: var(--fy); border: 0; color: var(--fink); box-shadow: inset 0 -2px 0 var(--fyd); }
.product.pl.fxp #pCart .addBtn i { color: var(--fink); }
.product.pl.fxp #pCart .addBtn:hover,
.product.pl.fxp #pCart .askBtn:hover { background: #ffd21f; color: var(--fink); }
.product.pl.fxp #pCart .ask1 { background: #fff; border: 2px solid var(--fink); color: var(--fink); cursor: pointer; }
.product.pl.fxp #pCart .ask1:hover { background: var(--fy); border-color: var(--fy); }
.product.pl.fxp #pCart .addWishlistBtn { min-height: 52px; width: 52px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--fline); border-radius: 8px; margin: 0; }
.product.pl.fxp #pCart .addWishlistBtn:hover { background: var(--fy); border-color: var(--fy); }
/* VIN / pytanie */
.product.pl.fxp .fx-ask { margin: 12px 0 0; font-size: 14px; color: #4b4b4b; }
.product.pl.fxp .fx-ask a { border: 0; background: none; padding: 0 1px; font-weight: 500; color: var(--fink); text-decoration: underline; text-decoration-color: var(--fy); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; border-radius: 2px; display: inline; }
.product.pl.fxp .fx-ask a:hover { background: var(--fy); text-decoration-color: var(--fink); box-shadow: 0 0 0 3px var(--fy); }
/* Dostawa, odbiór, zwrot, telefon */
.product.pl.fxp .fx-deliv { margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid var(--fline); display: grid; gap: 7px; font-size: 13.5px; color: #4b4b4b; }
.product.pl.fxp .fx-deliv > div { display: flex; gap: 9px; align-items: center; }
.product.pl.fxp .fx-deliv svg { flex: none; color: var(--fink); }
.product.pl.fxp .fx-deliv b { color: var(--fink); font-weight: 500; }
.product.pl.fxp .fx-deliv .fx-free { color: var(--fok); }
.product.pl.fxp .fx-deliv a,
.product.pl.fxp .fx-gpsr a { color: var(--fink); font-weight: 500; text-decoration: none; border-bottom: 1px dotted currentColor; border-radius: 2px; transition: background .15s; }
.product.pl.fxp .fx-deliv a:hover,
.product.pl.fxp .fx-gpsr a:hover { background: var(--fy); border-bottom-color: transparent; box-shadow: 0 0 0 3px var(--fy); }
/* Stare elementy, które zastępujemy */
.product.pl.fxp .grey > p:empty { display: none; }
/* Dół: opis i parametry jako karty */
.product.pl.fxp .zakl { margin: 28px 0 0; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.product.pl.fxp .zakl > .clear { display: none; }
.product.pl.fxp .zakl > .left.w50,
.product.pl.fxp .zakl > .right.w50 { width: auto; float: none; margin: 0; padding: 20px 22px; background: #fff; border: 1px solid var(--fline); border-radius: 8px; }
.product.pl.fxp .zakl .tabc { padding: 0; margin: 0; background: none; }
.product.pl.fxp .zakl h5.h { font-size: 18px; font-weight: 700; margin: 0 0 8px; padding: 0; border: 0; }
.product.pl.fxp .zakl .desc,
.product.pl.fxp .zakl .desc * { font-family: Roboto, Arial, sans-serif !important; font-size: 14.5px !important; line-height: 1.55 !important; color: #3d3d3d; }
.product.pl.fxp .zakl .desc table { width: 100% !important; }
.product.pl.fxp #pfea .fea { display: grid; grid-template-columns: minmax(110px, auto) 1fr; gap: 16px; margin: 0; padding: 7px 0; border-bottom: 1px solid #f0f0f0; font-size: 14px; }
.product.pl.fxp #pfea .fea:last-child { border-bottom: 0; }
.product.pl.fxp #pfea .fea .i { color: var(--fmute); text-align: left; width: auto; float: none; padding: 0; }
.product.pl.fxp #pfea .fea .v { font-weight: 500; width: auto; float: none; padding: 0; word-break: break-word; }
/* GPSR */
.product.pl.fxp .fx-gpsr { margin: 16px 0 0; border-top: 1px solid var(--fline); }
.product.pl.fxp .fx-gpsr > button { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 13px 0; border: 0; background: none; font-size: 14px; font-weight: 500; color: var(--fink); text-align: left; cursor: pointer; }
.product.pl.fxp .fx-gpsr > button i { font-style: normal; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 18px; color: var(--fmute); transition: transform .2s, background .15s; }
.product.pl.fxp .fx-gpsr > button:hover i { background: var(--fy); color: var(--fink); }
.product.pl.fxp .fx-gpsr.open > button i { transform: rotate(45deg); }
.product.pl.fxp .fx-gpsr .fx-gb { display: none; padding: 0 0 12px; font-size: 13px; line-height: 1.55; color: #4b4b4b; }
.product.pl.fxp .fx-gpsr.open .fx-gb { display: block; }
.product.pl.fxp .fx-gpsr .fx-gb p { margin: 0 0 6px; }
.product.pl.fxp .fx-gpsr .fx-gb .fx-gh { font-weight: 700; color: var(--fink); margin-top: 8px; }
/* Opinie: zwinięte */
.product.pl.fxp #prev { grid-column: 1 / -1; padding: 16px 22px; background: #fff; border: 1px solid var(--fline); border-radius: 8px; }
.product.pl.fxp #addrev { display: none; max-width: 520px; margin: 14px 0 0; }
.product.pl.fxp.fx-rev-open #addrev { display: block; }
.product.pl.fxp #addrev h3 { display: none; }
.product.pl.fxp #addrev .textCenter, .product.pl.fxp #addrev .ovrHdn { text-align: left; }
.product.pl.fxp #addrev .revBex i { font-size: 24px; margin: 0 2px 0 0; }
.product.pl.fxp #addrev input, .product.pl.fxp #addrev textarea { border-radius: 7px; }
.product.pl.fxp #addrev .addReview { width: auto; padding: 10px 18px; font-size: 14px; border-radius: 7px; text-transform: none; }
.product.pl.fxp #addrev .addReview:hover { background: var(--fy); color: var(--fink); }
.product.pl.fxp .fx-rev { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; }
.product.pl.fxp .fx-rev em { font-style: normal; color: var(--fmute); }
.product.pl.fxp .fx-ghost { border: 1.5px solid var(--fink); background: #fff; border-radius: 7px; padding: 8px 14px; font-weight: 500; font-size: 13.5px; color: var(--fink); cursor: pointer; transition: background .15s, border-color .15s; }
.product.pl.fxp .fx-ghost:hover { background: var(--fy); border-color: var(--fy); }
.product.pl.fxp .fx-revlist { margin: 12px 0 0; }
.product.pl.fxp .fx-revlist .review_desc { padding: 10px 0; border-top: 1px solid #f0f0f0; }
/* Inne części: siatka, max 8 */
.fx-rel .pdrs-list:not([style*="none"]) { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 14px 0 0; }
.fx-rel .pdrs-list > .pdr { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; border: 1px solid var(--fline, #e4e4e4); border-radius: 8px; overflow: hidden; background: #fff; transition: border-color .15s; }
.fx-rel .pdrs-list > .pdr:hover { border-color: #f8c301; }
.fx-rel .pdrs-list > .pdr:nth-child(n+9) { display: none; }
.fx-rel .pdr .brd { display: flex !important; flex-direction: column; height: 100%; padding: 0 !important; border: 0 !important; }
.fx-rel .pdr .pImg { width: 100% !important; height: auto !important; aspect-ratio: 4 / 3; margin: 0 !important; float: none !important; background: #f6f6f4; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.fx-rel .pdr .pImg a { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }
.fx-rel .pdr .pImg img { width: 100%; height: 100%; object-fit: cover; }
.fx-rel .pdr .pImg i { font-size: 36px; color: #c9c9c9; }
.fx-rel .pdr .z { width: auto !important; float: none !important; padding: 10px 12px 0 !important; }
.fx-rel .pdr .pTxt { margin: 0; font-size: 13px; line-height: 1.3; height: auto !important; }
.fx-rel .pdr .pTxt a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #212121; font-weight: 500; text-transform: none; }
.fx-rel .pdr .pTxt a:hover { background: #f8c301; }
.fx-rel .pdr .c { width: auto !important; float: none !important; margin-top: auto; padding: 8px 12px 12px !important; display: flex; flex-direction: column; gap: 8px; }
.fx-rel .pdr .pPrc { margin: 0 !important; font-size: 18px !important; font-weight: 700; text-align: left !important; height: auto !important; }
.fx-rel .pdr .pCart { margin: 0 !important; text-align: left !important; }
.fx-rel .pdr .pCart .btn { width: 100%; padding: 8px 10px !important; font-size: 14px !important; border-radius: 7px; white-space: normal; }
.fx-rel .pdr .pCart .btn:hover { background: #f8c301 !important; color: #212121 !important; }
.fx-rel .nav-pills { margin: 30px 0 0; display: flex; flex-wrap: wrap; gap: 8px; border: 0; justify-content: flex-start; }
.fx-rel .nav-pills > li { float: none; margin: 0; }
.fx-rel .nav-pills > li > a { font-size: 20px; font-weight: 700; padding: 6px 2px; border-radius: 0; border-bottom: 3px solid transparent; }
.fx-rel .nav-pills > li.active > a, .fx-rel .nav-pills > li > a:hover { background: none; color: #212121; border-bottom-color: #f8c301; }
.fx-rel .fx-more { display: inline-block; margin: 14px 0 0; padding: 9px 16px; border: 1.5px solid #212121; border-radius: 7px; color: #212121; font-weight: 500; text-decoration: none; }
.fx-rel .fx-more:hover { background: #f8c301; border-color: #f8c301; color: #212121; text-decoration: none; }
/* Pasek "do koszyka" na telefonie */
.fx-mbar { display: none; }
/* Fokus z klawiatury */
.product.pl.fxp :focus-visible, .fx-rel :focus-visible, .fx-mbar :focus-visible { outline: 3px solid #f8c301; outline-offset: 2px; }
@media (max-width: 991px) {
.product.pl.fxp #pCart .addBtn { font-size: 15px; gap: 6px; white-space: nowrap; padding: 0 10px; }
.product.pl.fxp #pCart .addBtn i { display: none; }
.product.pl.fxp .fx-top { column-gap: 20px; }
.fx-rel .pdrs-list:not([style*="none"]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fx-rel .pdrs-list > .pdr:nth-child(n+7) { display: none; }
}
@media (max-width: 400px) {
.product.pl.fxp #pCart .addBtn i { display: none; }
}
@media (max-width: 767px) {
.product.pl.fxp .fx-top { grid-template-columns: minmax(0, 1fr); }
.product.pl.fxp .fx-top > .leftFoto { position: relative !important; top: auto; }
.product.pl.fxp .fx-top > .pDetails { grid-column: 1; grid-row: 2; margin-top: 16px; }
.product.pl.fxp .pTitle h1 { font-size: 21px; }
.product.pl.fxp .zakl { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.product.pl.fxp .zakl > .left.w50, .product.pl.fxp .zakl > .right.w50 { padding: 16px; }
.product.pl.fxp .fx-buy { padding: 14px; }
.product.pl.fxp .ps_price { font-size: 32px; }
.product.pl.fxp #pCart .addBtn, .product.pl.fxp #pCart .ask1, .product.pl.fxp #pCart .askBtn { font-size: 16px; padding: 0 10px; }
.product.pl.fxp .fx-q { width: 30px; }
.product.pl.fxp #pCart .addBtn { white-space: nowrap; font-size: 15px; gap: 6px; }
.product.pl.fxp .grey3 > p.qty input[name="quantity"] { width: 30px; }
.fx-rel .pdrs-list:not([style*="none"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fx-rel .pdrs-list > .pdr:nth-child(n+7) { display: none; }
.fx-mbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 990; gap: 12px; align-items: center; background: #fff; border-top: 1px solid #e4e4e4; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); transform: translateY(110%); transition: transform .25s; }
.fx-mbar.show { transform: none; }
.fx-mbar .fx-mp { font-size: 20px; font-weight: 700; line-height: 1.1; white-space: nowrap; }
.fx-mbar .fx-mp small { display: block; font-size: 11px; font-weight: 400; }
.fx-mbar button { flex: 1; min-height: 46px; border: 0; border-radius: 8px; background: #f8c301; color: #212121; font-size: 16px; font-weight: 700; box-shadow: 0 2px 0 #d9aa00; }
.fx-mbar button.fx-alt { background: #fff; border: 2px solid #212121; box-shadow: none; }
.fx-mbar button:hover { background: #ffd21f; }
}
/* Karta produktu FX: poprawka wysokości zdjęcia (style.css GTECH ustawia .foto 300/323/430 px) */
.product.pl.fxp .leftFoto .foto,
.product.pl.fxp #prodFoto { height: auto !important; width: 100% !important; max-width: none !important; float: none !important; margin: 0 !important; padding: 0 !important; line-height: normal; }
.product.pl.fxp #prodFoto a { line-height: normal; }
.product.pl.fxp #prodFoto img { max-width: 100% !important; max-height: 100% !important; }
.product.pl.fxp #prodFoto > .fa-image { margin: 0 !important; line-height: 1; }
/* Karta produktu FX: poprawka 2, na tablecie .content ma overflow:hidden (psuło przyklejanie zdjęcia) */
@supports (overflow: clip) {
body:has(.product.pl.fxp) .content { overflow: clip; }
}
/* Karta produktu FX: poprawka 3, przycisk koszyka w wąskiej kolumnie (np. 992–1199 px) */
.product.pl.fxp .pDetails .w50xx.sidebar { container-type: inline-size; }
.product.pl.fxp #pCart .addBtn, .product.pl.fxp #pCart .askBtn { white-space: nowrap; }
.product.pl.fxp #pCart .addBtn, .product.pl.fxp #pCart .ask1, .product.pl.fxp #pCart .askBtn { box-sizing: border-box; }
@container (max-width: 360px) {
.product.pl.fxp .grey3 > p.qty { flex: 1 1 100%; justify-content: center; gap: 14px; }
.product.pl.fxp .grey3 > #pCart { flex: 1 1 100%; }
.product.pl.fxp #pCart .addBtn, .product.pl.fxp #pCart .askBtn { font-size: 17px; }
}
/* ---------- Bez flag "Towar polecany" itd. na listach produktów (rabat % zostaje) ---------- */
.pNewPr .fl:not(.black), .pNewPr > br { display: none !important; }
/* ---------- Kafelki marek na głównej: bez logotypów (znaki towarowe), tylko nazwa na środku ---------- */
.home_boxes:not(.home_boxes2) .box > a::after { content: none !important; display: none !important; background: none !important; }
.home_boxes:not(.home_boxes2) .box > a { justify-content: center !important; text-align: center; }
.home_boxes:not(.home_boxes2) .box > a span { position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important; white-space: normal; font-size: clamp(18px, 2vw, 26px); }
/* ---------- Baner "Serwis samochodowy" na głównej: zdjęcie + tekst + przycisk (zamiast obrazka) ---------- */
.fx-serwis-bnr { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; min-height: 360px; margin: 20px 0 10px; padding: 48px 24px; text-align: center; color: #fff; background: #1b1b1b; isolation: isolate; }
.fx-serwis-bnr-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; z-index: -2; }
.fx-serwis-bnr::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at center, rgba(0,0,0,.55) 0%, rgba(0,0,0,.72) 70%), linear-gradient(rgba(0,0,0,.15), rgba(0,0,0,.35)); }
.fx-serwis-bnr-in { max-width: 720px; }
.fx-serwis-bnr h2 { margin: 0 0 16px; color: #fff; font-size: clamp(30px, 4.2vw, 52px); line-height: 1.05; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; text-shadow: 0 2px 14px rgba(0,0,0,.45); }
.fx-serwis-bnr p { margin: 0 auto 26px; max-width: 600px; color: #f2f2f2; font-size: clamp(15px, 1.5vw, 18px); line-height: 1.55; text-shadow: 0 1px 8px rgba(0,0,0,.5); }
.fx-serwis-bnr-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 30px; border-radius: 8px; background: #f8c301; color: #212121 !important; font-size: 17px; font-weight: 700; text-decoration: none !important; box-shadow: inset 0 -2px 0 #d9aa00; transition: background .15s, transform .15s; }
.fx-serwis-bnr-btn:hover, .fx-serwis-bnr-btn:focus-visible { background: #ffd21f; color: #212121 !important; transform: translateY(-1px); }
.fx-serwis-bnr-btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 767px) {
.fx-serwis-bnr { min-height: 320px; padding: 40px 18px; margin: 14px 0 6px; }
.fx-serwis-bnr-btn { width: 100%; max-width: 320px; }
}
/* ---------- Pasek "do koszyka" na telefonie: ikonka cookies i "do góry" nad paskiem, długa cena się mieści ---------- */
@media (max-width: 767px) {
#fxcc-re, #moveTop { transition: bottom .25s; }
body:has(.fx-mbar.show) #fxcc-re, body:has(.fx-mbar.show) #moveTop { bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
.fx-mbar .fx-mp { flex: 0 1 auto; min-width: 0; font-size: clamp(16px, 5.2vw, 20px); }
.fx-mbar button { flex: 1 1 140px; min-width: 120px; padding: 0 10px; }
}
/* =========================================================
FOX: koszyk UX (dodać na koniec /css/fox-custom.css)
========================================================= */
/* 1. Podgląd koszyka w nagłówku już nie jest potrzebny */
.top_cart .list { display: none !important; }
/* 2. Toast "Dodano do koszyka" */
.fx-toast {
position: fixed; top: 96px; right: 24px; z-index: 1200001;
width: 380px; max-width: calc(100vw - 32px);
background: #fff; color: #212121; border-radius: 14px;
box-shadow: 0 18px 50px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.08);
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
overflow: hidden;
opacity: 0; transform: translateY(-12px) scale(.96);
transition: opacity .28s ease, transform .35s cubic-bezier(.2,.9,.3,1.2);
}
.fx-toast.is-in { opacity: 1; transform: none; }
.fx-toast.is-out { opacity: 0; transform: translateX(24px); transition-duration: .25s; }
.fx-toast__head {
display: flex; align-items: center; gap: 10px;
padding: 14px 44px 10px 16px; font-weight: 700; font-size: 15px;
}
.fx-toast__check {
flex: 0 0 26px; height: 26px; border-radius: 50%;
background: #2e9b4f; color: #fff; display: grid; place-items: center;
font-size: 13px; transform: scale(0);
animation: fxPop .4s .15s cubic-bezier(.2,.9,.3,1.4) forwards;
}
.fx-toast__close {
position: absolute; top: 10px; right: 10px; width: 30px; height: 30px;
border: 0; background: transparent; color: #888; font-size: 20px; line-height: 1;
cursor: pointer; border-radius: 8px;
}
.fx-toast__close:hover { background: #f2f2f2; color: #212121; }
.fx-toast__prod { display: flex; gap: 12px; padding: 4px 16px 14px; align-items: center; }
.fx-toast__img {
flex: 0 0 64px; height: 64px; border-radius: 10px; background: #f5f5f5;
object-fit: contain; border: 1px solid #eee;
}
.fx-toast__name {
font-size: 13px; line-height: 1.35; margin: 0 0 4px;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fx-toast__price { font-weight: 700; font-size: 15px; }
.fx-toast__btns { display: flex; gap: 8px; padding: 0 16px 16px; }
.fx-toast__btn {
flex: 1; text-align: center; padding: 11px 10px; border-radius: 10px;
font-size: 14px; font-weight: 700; text-decoration: none !important; cursor: pointer;
transition: transform .15s ease, background .15s ease;
}
.fx-toast__btn:active { transform: scale(.97); }
.fx-toast__btn--ghost { background: #f2f2f2; color: #212121 !important; border: 0; }
.fx-toast__btn--ghost:hover { background: #e7e7e7; }
.fx-toast__btn--main { background: #f8c301; color: #212121 !important; }
.fx-toast__btn--main:hover { background: #ffd43a; }
.fx-toast__bar { height: 3px; background: #f8c301; transform-origin: left; }
/* Ukryty element, na którym stary skrypt robi swoją animację */
.fx-tt-dummy { position: fixed; visibility: hidden; pointer-events: none; }
/* 3. Animacje ikony koszyka */
@keyframes fxPop { to { transform: scale(1); } }
@keyframes fxCartBump {
0% { transform: scale(1); } 30% { transform: scale(1.22) rotate(-8deg); }
60% { transform: scale(.95) rotate(4deg); } 100% { transform: scale(1); }
}
@keyframes fxBadge {
0% { transform: scale(1); } 40% { transform: scale(1.6); } 100% { transform: scale(1); }
}
.top_cart .top_icon.fx-bump i { display: inline-block; animation: fxCartBump .55s ease; }
.top_cart .top_icon.fx-bump .cnt { display: inline-block; animation: fxBadge .5s ease .1s; }
/* 4. Ładniejsze zwykłe komunikaty (błędy, ostrzeżenia) */
.tt {
border-radius: 12px !important; border: 0 !important;
box-shadow: 0 18px 50px rgba(0,0,0,.25) !important;
padding: 20px 24px !important; backdrop-filter: blur(4px);
}
/* 5. Okno "Towar został dodany" na karcie produktu */
#cart_tt_bg { background: rgba(20,20,20,.55) !important; opacity: 1 !important; animation: fxFade .25s ease; }
#cart_tt {
border-radius: 16px !important; box-shadow: 0 30px 80px rgba(0,0,0,.3) !important;
animation: fxModal .35s cubic-bezier(.2,.9,.3,1.15);
}
#cart_tt .info {
background: transparent !important; text-transform: none !important;
font-weight: 700; font-size: 20px; padding-left: 40px !important; position: relative;
}
#cart_tt .info:before {
content: "\2713"; position: absolute; left: 4px; top: 50%; margin-top: -14px;
width: 28px; height: 28px; border-radius: 50%; background: #2e9b4f; color: #fff;
font-size: 15px; line-height: 28px; text-align: center;
}
#cart_tt .t_img img { border-radius: 10px; }
#cart_tt .btns .btn {
border-radius: 10px !important; padding: 12px 20px !important; font-weight: 700;
font-size: 15px !important; transition: transform .15s ease, background .15s ease;
}
#cart_tt .btns .btn.close2 { background: #f2f2f2 !important; color: #212121 !important; }
#cart_tt .btns .btn:not(.close2) { background: #f8c301 !important; color: #212121 !important; }
#cart_tt .btns .btn:active { transform: scale(.97); }
@keyframes fxFade { from { opacity: 0; } }
@keyframes fxModal { from { opacity: 0; transform: translateY(20px) scale(.96); } }
/* Telefon: toast na dole ekranu */
@media (max-width: 767px) {
.fx-toast { top: auto; bottom: 12px; right: 12px; left: 12px; width: auto; max-width: none;
transform: translateY(20px); }
.fx-toast.is-out { transform: translateY(20px); }
}
@media (prefers-reduced-motion: reduce) {
.fx-toast, .fx-toast__check, #cart_tt, #cart_tt_bg,
.top_cart .top_icon.fx-bump i, .top_cart .top_icon.fx-bump .cnt { animation: none !important; transition: none !important; }
.fx-toast__check { transform: none; }
}
/* Kręciołek na przycisku "Dodaj do koszyka" podczas czekania na serwer (21.10.2026) */
.addBtn.fx-loading {
position: relative; pointer-events: none; cursor: progress;
color: transparent !important;
}
.addBtn.fx-loading * { visibility: hidden; }
.addBtn.fx-loading::after {
content: ""; position: absolute; left: 50%; top: 50%;
width: 18px; height: 18px; margin: -9px 0 0 -9px;
border: 2px solid rgba(255,255,255,.35); border-top-color: #f8c301;
border-radius: 50%; animation: fxSpin .7s linear infinite;
}
@keyframes fxSpin { to { transform: rotate(360deg); } }
/* Okno na karcie produktu: zielony ptaszek tuż przy tekście */
#cart_tt .info { text-align: left !important; }
/* Na żółtym przycisku (karta produktu) kręciołek ciemny, żeby był widoczny */
#pCart .addBtn.fx-loading::after, #fxMbar .addBtn.fx-loading::after {
border-color: rgba(0,0,0,.2); border-top-color: #212121;
}
/* ==========================================
Strona koszyka (krok 1) nowy układ (22.10.2026)
Wszystko pod .ord.fxc, inne kroki zamówienia bez zmian
========================================== */
/* Mapa paczkomatów i wybór punktu odbioru nad przyklejonym nagłówkiem */
.delivery-popup { z-index: 2000 !important; }
/* GTECH: overflow hidden w .body-container blokuje przyklejone podsumowanie */
@supports (overflow: clip) { body:has(.ord.fxc) .body-container { overflow: clip !important; } }
.ord.fxc { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; }
.ord.fxc .fxc-steps { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 18px; }
.ord.fxc .fxc-steps .label {
font-size: 13px; font-weight: 400; padding: 6px 12px; border-radius: 99px;
border: 1px solid var(--fx-l) !important; background: #fff !important; color: var(--fx-g) !important;
}
.ord.fxc .fxc-steps .label-success { background: var(--fx-d) !important; color: #fff !important; border-color: var(--fx-d) !important; font-weight: 700; }
.ord.fxc .fxc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.ord.fxc .fxc-main { display: grid; gap: 20px; min-width: 0; }
.ord.fxc .fxc-box { background: #fff; border: 1px solid var(--fx-l); border-radius: 14px; padding: 20px; }
.ord.fxc .fxc-h { font-size: 19px; font-weight: 700; margin: 0 0 14px; color: var(--fx-d); text-transform: none; }
.ord.fxc .fxc-h2 { margin-top: 22px; }
/* ---------- Produkty ---------- */
.ord.fxc table.table { margin: 0; border: 0; width: 100%; }
.ord.fxc table.table thead, .ord.fxc table.table tr.subtotal, .ord.fxc .mobile-span { display: none !important; }
.ord.fxc table.table tbody { display: grid; gap: 10px; }
.ord.fxc tr.fxc-row {
display: grid; grid-template-columns: 72px minmax(0,1fr) auto auto 36px;
grid-template-areas: "img name qty sum del"; align-items: center; gap: 4px 14px;
background: var(--fx-bg) !important; border-radius: 12px; padding: 10px 12px; position: relative;
border: 0 !important;
}
.ord.fxc tr.fxc-row > td { display: block; border: 0 !important; padding: 0 !important; background: none !important; }
.ord.fxc tr.fxc-row > td:nth-child(1) { display: none; }
.ord.fxc tr.fxc-row > td:nth-child(2) { grid-area: img; }
.ord.fxc tr.fxc-row > td:nth-child(3) { grid-area: name; font-size: 13px; color: var(--fx-g); line-height: 1.4; }
.ord.fxc tr.fxc-row > td:nth-child(4) { grid-area: name; align-self: end; display: none; }
.ord.fxc tr.fxc-row > td:nth-child(5) { grid-area: qty; }
.ord.fxc tr.fxc-row > td:nth-child(6) { grid-area: sum; font-weight: 700; font-size: 16px; white-space: nowrap; min-width: 92px; text-align: right; color: var(--fx-d); }
.ord.fxc tr.fxc-row > td:nth-child(7) { grid-area: del; text-align: center; }
.ord.fxc tr.fxc-row td.img img { width: 72px; height: 72px; object-fit: contain; background: #fff; border-radius: 10px; border: 1px solid var(--fx-l); }
.ord.fxc tr.fxc-row td a:not(.ordDel) { display: block; font-size: 14px; font-weight: 700; color: var(--fx-d); line-height: 1.35; margin-bottom: 3px; }
.ord.fxc tr.fxc-row .small { font-size: 12px; }
.ord.fxc tr.fxc-busy { opacity: .5; pointer-events: none; }
.ord.fxc .fxc-qty { display: inline-flex; align-items: center; border: 1px solid #d5d5d5; border-radius: 10px; background: #fff; overflow: hidden; }
.ord.fxc .fxc-qty input { width: 42px !important; height: 38px; border: 0 !important; text-align: center; font-weight: 700; padding: 0 !important; -moz-appearance: textfield; background: transparent; }
.ord.fxc .fxc-qty input::-webkit-outer-spin-button, .ord.fxc .fxc-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ord.fxc .fxc-qbtn { width: 34px; height: 38px; border: 0; background: transparent; font-size: 18px; cursor: pointer; color: var(--fx-d); }
.ord.fxc .fxc-qbtn:hover { background: #f0f0f0; }
.ord.fxc .ordDel { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; color: var(--fx-g) !important; font-size: 17px; text-decoration: none !important; }
.ord.fxc .ordDel:hover { background: #fde8e7; color: #c12e2a !important; }
.ord.fxc .fxc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
/* pasek darmowej dostawy */
.ord.fxc .fxc-free { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #fff8dc; font-size: 14px; }
.ord.fxc .fxc-free p { margin: 0 0 8px; }
.ord.fxc .fxc-free p small { color: var(--fx-g); font-size: 12px; }
.ord.fxc .fxc-free.is-ok { background: #e9f6ee; color: var(--fx-ok); }
.ord.fxc .fxc-free.is-ok p { margin: 0; }
.ord.fxc .fxc-bar { height: 8px; background: #fff; border-radius: 99px; overflow: hidden; }
.ord.fxc .fxc-bar i { display: block; height: 100%; background: var(--fx-y); border-radius: 99px; transition: width .5s ease; }
.ord.fxc .fxc-serwis {
display: block; margin-top: 10px; padding: 12px 14px; border-radius: 12px; border: 1px dashed #cfcfcf;
font-size: 13px; color: var(--fx-d) !important; text-decoration: none !important; line-height: 1.45;
}
.ord.fxc .fxc-serwis:hover { border-color: var(--fx-y); background: #fffdf3; }
/* ---------- Dostawa ---------- */
.ord.fxc .fxc-dcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.ord.fxc .fxc-dcard {
position: relative; text-align: left; display: grid; grid-template-columns: 22px 1fr auto; gap: 2px 8px; align-items: center;
padding: 14px; border: 2px solid var(--fx-l); border-radius: 12px; background: #fff; cursor: pointer;
font: inherit; color: var(--fx-d); transition: border-color .15s, background .15s;
}
.ord.fxc .fxc-dcard:hover { border-color: #bdbdbd; }
.ord.fxc .fxc-dcard.is-on { border-color: var(--fx-d); background: #fffdf3; }
.ord.fxc .fxc-dot { grid-column: 1; grid-row: 1 / span 2; box-sizing: border-box; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #bdbdbd; }
.ord.fxc .fxc-dcard.is-on .fxc-dot { border: 6px solid var(--fx-d); }
.ord.fxc .fxc-dname { grid-column: 2; grid-row: 1; font-weight: 700; font-size: 15px; }
.ord.fxc .fxc-dprice { grid-column: 3; grid-row: 1; text-align: right; font-weight: 700; font-size: 15px; white-space: nowrap; }
.ord.fxc .fxc-dprice.is-free { color: var(--fx-ok); }
.ord.fxc .fxc-dhint { grid-column: 2 / span 2; grid-row: 2; font-size: 12px; color: var(--fx-g); }
/* ---------- Płatności: tylko dla wybranej dostawy ---------- */
.ord.fxc .delivery { float: none !important; width: auto !important; }
.ord.fxc .delivery .d { display: none; border: 0 !important; padding: 0 !important; margin: 0 !important; width: auto !important; float: none !important; }
.ord.fxc .delivery .d.is-on { display: block; }
.ord.fxc .delivery .d > p.b { display: none; }
.ord.fxc .fxc-pays { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.ord.fxc .fxc-pay { margin: 0 !important; position: relative; }
.ord.fxc .fxc-pay input { position: absolute; opacity: 0; }
.ord.fxc .fxc-pay label {
display: flex; flex-direction: column; justify-content: center; min-height: 54px; margin: 0; cursor: pointer;
padding: 9px 12px 9px 40px; border: 2px solid var(--fx-l); border-radius: 12px; background: #fff; position: relative;
font-weight: 400; transition: border-color .15s, background .15s;
}
.ord.fxc .fxc-pay label:before {
content: ""; position: absolute; left: 13px; top: 50%; margin-top: -9px; width: 18px; height: 18px;
border-radius: 50%; border: 2px solid #bdbdbd; box-sizing: border-box;
}
.ord.fxc .fxc-pay label:hover { border-color: #bdbdbd; }
.ord.fxc .fxc-pay input:checked + label { border-color: var(--fx-d); background: #fffdf3; }
.ord.fxc .fxc-pay input:checked + label:before { border: 6px solid var(--fx-d); }
.ord.fxc .fxc-pay input:focus-visible + label { outline: 2px solid var(--fx-y); outline-offset: 2px; }
.ord.fxc .fxc-pname { font-weight: 700; font-size: 14px; color: var(--fx-d); }
.ord.fxc .fxc-phint { font-size: 12px; color: var(--fx-g); }
.ord.fxc .fxc-country { margin-top: 14px; font-size: 13px; color: var(--fx-g); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ord.fxc .fxc-country label { margin: 0; font-weight: 400; }
.ord.fxc .fxc-country select { height: 34px; border-radius: 8px; border: 1px solid #d5d5d5; }
.ord.fxc.fxc-busy .fxc-dcards, .ord.fxc.fxc-busy .delivery, .ord.fxc.fxc-busy .fxc-sum { opacity: .55; pointer-events: none; transition: opacity .15s; }
/* ---------- Podsumowanie ---------- */
.ord.fxc .fxc-side { position: sticky; top: calc(var(--fx-hh, 140px) + 16px); }
.ord.fxc .fxc-lines p { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 8px; font-size: 14px; color: var(--fx-g); }
.ord.fxc .fxc-lines b { color: var(--fx-d); white-space: nowrap; }
.ord.fxc .fxc-lines .fxc-total { border-top: 1px solid var(--fx-l); padding-top: 12px; margin-top: 12px; font-size: 16px; color: var(--fx-d); font-weight: 700; }
.ord.fxc .fxc-lines .fxc-total b { font-size: 24px; }
.ord.fxc .fxc-lines .fxc-vat { display: block; text-align: right; font-size: 12px; margin-top: -4px; }
.ord.fxc .fxc-details { margin: 6px 0 14px; padding: 10px 12px; background: var(--fx-bg); border-radius: 10px; font-size: 13px; }
.ord.fxc .fxc-details .short-info { float: none !important; width: auto !important; padding: 0 !important; margin: 0 !important; }
.ord.fxc .fxc-details p { margin: 0 0 4px; }
.ord.fxc .fxc-details br, .ord.fxc .fxc-details .delivery-desc, .ord.fxc .fxc-details p:empty,
.ord.fxc .fxc-details .delivery-name { display: none; }
.ord.fxc .fxc-details .delivery-date:before { content: "\1F69A  "; }
.ord.fxc .fxc-details button, .ord.fxc .fxc-details .btn { border-radius: 10px; }
.ord.fxc .button-section { display: grid; gap: 10px; margin: 0 !important; padding: 0 !important; text-align: left; }
.ord.fxc .go-to-2nd-step-button {
width: 100%; margin: 0 !important; padding: 13px 16px !important; border-radius: 12px !important;
background: var(--fx-y) !important; color: var(--fx-d) !important; border: 0 !important;
font-size: 17px !important; font-weight: 700; line-height: 1.2; display: flex; flex-direction: column; align-items: center;
transition: background .15s, transform .1s;
}
.ord.fxc .go-to-2nd-step-button:disabled, .ord.fxc .go-to-2nd-step-button.disabled {
background: #ececec !important; color: #8a8a8a !important; opacity: 1 !important; cursor: not-allowed;
}
.ord.fxc .fxc-need { margin: 0 0 12px; padding: 12px 14px; border-radius: 12px; background: #fff8dc; border: 1px solid #f3dc85; font-size: 14px; }
.ord.fxc .fxc-need p { margin: 0 0 8px; }
.ord.fxc .fxc-need button {
width: 100%; border: 0; border-radius: 10px; padding: 11px 14px; background: var(--fx-d); color: #fff;
font-weight: 700; font-size: 15px; cursor: pointer;
}
.ord.fxc .fxc-need button:hover { background: #000; }
.ord.fxc .go-to-2nd-step-button small { font-size: 12px; font-weight: 400; opacity: .8; margin-top: 2px; }
.ord.fxc .go-to-2nd-step-button:hover { background: #ffd43a !important; }
.ord.fxc .go-to-2nd-step-button:active { transform: scale(.98); }
.ord.fxc .login-and-registration-container { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 !important; }
.ord.fxc .fxc-acc-h { width: 100%; margin: 4px 0 0; font-size: 12px; color: var(--fx-g); text-align: center; }
.ord.fxc .login-and-registration-container > .no-acc { flex: 1; margin: 0 !important; }
.ord.fxc .login-and-registration-container > button.btn,
.ord.fxc .login-and-registration-container .no-acc > a.btn {
display: block; box-sizing: border-box; width: 100%; margin: 0 !important; padding: 9px 10px !important;
border-radius: 10px !important; font-size: 14px !important; text-align: center; line-height: 1.3;
background: #fff !important; color: var(--fx-d) !important; border: 1px solid #cfcfcf !important;
}
.ord.fxc .login-and-registration-container > button.btn { flex: 1; width: auto; }
.ord.fxc .login-and-registration-container .btn:hover { border-color: var(--fx-d) !important; }
.ord.fxc .fxc-coupon { margin-top: 14px; font-size: 14px; }
.ord.fxc .fxc-coupon summary { cursor: pointer; color: var(--fx-d); text-decoration: underline; list-style: none; }
.ord.fxc .fxc-coupon summary::-webkit-details-marker { display: none; }
.ord.fxc .fxc-coupon .coupon { float: none !important; width: auto !important; margin: 8px 0 0 !important; padding: 0 !important; }
.ord.fxc .fxc-coupon input#coupont { width: 100% !important; height: 40px; border-radius: 10px; border: 1px solid #cfcfcf; padding: 0 12px; }
.ord.fxc .fxc-trust { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--fx-l); font-size: 13px; color: var(--fx-g); }
.ord.fxc .fxc-trust li { position: relative; padding-left: 24px; margin-bottom: 8px; line-height: 1.4; }
.ord.fxc .fxc-trust li:before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--fx-ok); font-weight: 700; }
.ord.fxc .fxc-trust a { color: var(--fx-d); font-weight: 700; }
/* pasek na dole (telefon) */
#fxcMbar { display: none; }
/* ---------- Tablet i telefon ---------- */
@media (max-width: 991px) {
.ord.fxc .fxc-grid { grid-template-columns: 1fr; }
.ord.fxc .fxc-side { position: static; }
/* pasek na dole z kwotą i przyciskiem (telefon i tablet) */
html.fxc-page #fxcMbar {
display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1400;
align-items: center; justify-content: space-between; gap: 12px;
padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: #fff;
box-shadow: 0 -6px 20px rgba(0,0,0,.12);
}
html.fxc-page #fxcMbar small { display: block; font-size: 12px; color: #6b6b6b; }
html.fxc-page #fxcMbar b { font-size: 19px; }
html.fxc-page #fxcMbar button { border: 0; border-radius: 12px; background: #f8c301; color: #212121; font-weight: 700; font-size: 16px; padding: 12px 20px; }
html.fxc-page body { padding-bottom: 76px; }
html.fxc-page #fxcc-re { bottom: 88px !important; }
html.fxc-page #moveTop { display: none !important; }
}
@media (max-width: 767px) {
.ord.fxc .fxc-box { padding: 14px; border-radius: 12px; }
.ord.fxc .fxc-steps .label { font-size: 11px; padding: 5px 9px; }
.ord.fxc tr.fxc-row {
grid-template-columns: 64px minmax(0,1fr) 34px;
grid-template-areas: "img name del" "img qty sum";
}
.ord.fxc tr.fxc-row td.img img { width: 64px; height: 64px; }
.ord.fxc tr.fxc-row {
grid-template-columns: 64px minmax(0,1fr) auto;
grid-template-areas: "img name name" "img qty sum";
padding-right: 44px;
}
.ord.fxc tr.fxc-row > td:nth-child(6) { min-width: 0; }
.ord.fxc tr.fxc-row > td:nth-child(7) { position: absolute; top: 6px; right: 6px; }
.ord.fxc .fxc-dcards { grid-template-columns: 1fr; }
.ord.fxc .fxc-pays { grid-template-columns: 1fr 1fr; gap: 6px; }
.ord.fxc .fxc-pay label { min-height: 50px; padding: 8px 8px 8px 34px; }
.ord.fxc .fxc-pay label:before { left: 10px; }
.ord.fxc .fxc-pname { font-size: 13px; }
.ord.fxc .fxc-phint { font-size: 11px; }
}
/* ==========================================
Okna (logowanie, faktura) nad przyklejonym nagłówkiem
========================================== */
.ord .popup-dialog { z-index: 2000 !important; }
.ord .fxc-side:has(.popup-dialog:not(.hidden)) { z-index: 2001; }   /* okno logowania siedzi w przyklejonej kolumnie */
/* ==========================================
Okno wyboru punktu odbioru / paczkomatu
========================================== */
.delivery-popup { background: rgba(20,20,20,.55) !important; }
.delivery-popup .popup-content {
border-radius: 16px !important; border: 0 !important; box-shadow: 0 30px 80px rgba(0,0,0,.3) !important;
background: #fff !important; overflow: hidden;
}
.delivery-popup .main-title-popup { font-size: 20px !important; font-weight: 700; margin: 0 !important; padding: 20px 56px 14px 22px !important; color: #212121; text-transform: none; }
.delivery-popup .close-button {
width: 36px; height: 36px; line-height: 36px !important; text-align: center; border-radius: 10px;
top: 14px !important; right: 14px !important; font-size: 18px !important; color: #666; cursor: pointer;
}
.delivery-popup .close-button:hover { background: #f2f2f2; color: #212121; }
.delivery-popup .collection-points-list { list-style: none; margin: 0 !important; padding: 0 22px 22px !important; display: grid; gap: 10px; }
.delivery-popup li.choose-collection-point.fxp {
display: flex; align-items: center; gap: 14px; padding: 14px 16px !important; margin: 0 !important;
border: 2px solid #e6e6e6 !important; border-radius: 12px; background: #fff !important; cursor: pointer;
transition: border-color .15s, background .15s;
}
.delivery-popup li.choose-collection-point.fxp:hover { border-color: #212121 !important; background: #fffdf3 !important; }
.delivery-popup .fxp-ico { flex: 0 0 40px; height: 40px; border-radius: 50%; background: #f8c301; position: relative; }
.delivery-popup .fxp-ico:after {
content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -9px 0 0 -6px;
border: 3px solid #212121; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-sizing: border-box;
}
.delivery-popup .fxp-txt { flex: 1; display: flex; flex-direction: column; line-height: 1.35; }
.delivery-popup .fxp-txt b { font-size: 15px; color: #212121; }
.delivery-popup .fxp-txt small { font-size: 13px; color: #6b6b6b; }
.delivery-popup .fxp-go { padding: 8px 14px; border-radius: 10px; background: #212121; color: #fff; font-weight: 700; font-size: 14px; white-space: nowrap; }
/* ==========================================
KROK 2: Twoje dane
========================================== */
.ord.fxs2 { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; --fx-bad: #c12e2a; }
@supports (overflow: clip) { body:has(.ord.fxs2) .body-container { overflow: clip !important; } }
.ord.fxs2 .fxc-steps { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 18px; }
.ord.fxs2 .fxc-steps .label { font-size: 13px; font-weight: 400; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--fx-l) !important; background: #fff !important; color: var(--fx-g) !important; }
.ord.fxs2 .fxc-steps .label-success { background: var(--fx-d) !important; color: #fff !important; border-color: var(--fx-d) !important; font-weight: 700; }
.ord.fxs2 .fxc-steps .label.linked { color: var(--fx-d) !important; cursor: pointer; }
.ord.fxs2 .fxc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
.ord.fxs2 .fxc-main { min-width: 0; }
.ord.fxs2 .fxc-box { background: #fff; border: 1px solid var(--fx-l); border-radius: 14px; padding: 22px; }
.ord.fxs2 .fxc-h { font-size: 20px; font-weight: 700; margin: 0 0 6px; color: var(--fx-d); text-transform: none; }
.ord.fxs2 .delivery-address { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
.ord.fxs2 #delivery-address-data { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px 12px; }
.ord.fxs2 .fxs2-sub { grid-column: 1 / -1; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--fx-g); margin-top: 10px; }
.ord.fxs2 .fxs2-hide { display: none !important; }
.ord.fxs2 .input-group.fxs2-f { display: flex !important; flex-direction: column-reverse; justify-content: flex-end; width: auto !important; float: none !important; margin: 0 !important; position: relative; }
.ord.fxs2 .input-group.fxs2-s1 { grid-column: span 1; } .ord.fxs2 .input-group.fxs2-s2 { grid-column: span 2; }
.ord.fxs2 .input-group.fxs2-s3 { grid-column: span 3; } .ord.fxs2 .input-group.fxs2-s4 { grid-column: span 4; }
.ord.fxs2 .input-group.fxs2-s6 { grid-column: 1 / -1; }
.ord.fxs2 .input-group.fxs2-f label {
position: static !important; transform: none !important; font-size: 13px !important; font-weight: 700; color: var(--fx-d) !important;
margin: 0 0 6px !important; padding: 0 !important; top: auto !important; left: auto !important; opacity: 1 !important; pointer-events: none;
}
.ord.fxs2 .input-group.fxs2-f input {
width: 100% !important; height: 46px !important; padding: 0 14px !important; font-size: 16px !important;
border: 1px solid #cfcfcf !important; border-radius: 10px !important; background: #fff !important; color: var(--fx-d) !important;
box-shadow: none !important; transition: border-color .15s, box-shadow .15s; box-sizing: border-box;
}
.ord.fxs2 .input-group.fxs2-f input::placeholder { color: #b3b3b3; }
.ord.fxs2 .input-group.fxs2-f input:focus { border-color: var(--fx-d) !important; box-shadow: 0 0 0 3px rgba(248,195,1,.45) !important; outline: 0; }
.ord.fxs2 .input-group.fxs2-f > small { order: -1; font-size: 12px; color: var(--fx-g); margin-top: 5px; }
.ord.fxs2 .input-group.fxs2-f > .fxs2-err { color: var(--fx-bad); font-weight: 700; }
.ord.fxs2 .input-group.fxs2-f > .fxs2-err:empty { display: none; }
.ord.fxs2 .input-group.fx-bad input { border-color: var(--fx-bad) !important; background: #fff6f6 !important; }
.ord.fxs2 .input-group.fx-bad > .fxs2-hint { display: none; }
.ord.fxs2 .required-fields-info { grid-column: 1 / -1; font-size: 12px; color: var(--fx-g); margin: 0 !important; }
/* faktura */
.ord.fxs2 .fxs2-inv { margin-top: 18px; }
.ord.fxs2 .fxs2-inv .input-group2 { margin: 0; }
.ord.fxs2 .fxs2-inv label.switch { display: block; margin: 0; cursor: pointer; }
.ord.fxs2 .fxs2-inv .switch-name {
display: grid !important; grid-template-columns: 26px 1fr; gap: 0 10px; align-items: center; width: auto !important;
padding: 14px 16px; border: 2px solid var(--fx-l); border-radius: 12px; background: #fff; font-weight: 400;
}
.ord.fxs2 .fxs2-inv .switch-name > * { pointer-events: none; }   /* Comarch otwiera okno faktury tylko przy kliknięciu w sam .switch-name */
.ord.fxs2 .fxs2-inv .switch-name b { font-size: 15px; color: var(--fx-d); }
.ord.fxs2 .fxs2-inv .switch-name small { grid-column: 2; font-size: 12px; color: var(--fx-g); }
.ord.fxs2 .fxs2-box { grid-row: 1 / span 2; width: 22px; height: 22px; border: 2px solid #bdbdbd; border-radius: 6px; position: relative; box-sizing: border-box; }
.ord.fxs2 #invoicechk:checked + label .switch-name { border-color: var(--fx-d); background: #fffdf3; }
.ord.fxs2 #invoicechk:checked + label .fxs2-box { background: var(--fx-d); border-color: var(--fx-d); }
.ord.fxs2 #invoicechk:checked + label .fxs2-box:after { content: ""; position: absolute; left: 6px; top: 2px; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ord.fxs2 #invoicechk { position: absolute; opacity: 0; }
/* okno faktury */
.ord .popup-dialog { background: rgba(20,20,20,.55); }
.ord .popup-dialog .modal-box {
border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.3); padding: 22px !important; max-height: calc(100vh - 40px); overflow: auto;
width: 520px; max-width: calc(100vw - 24px); box-sizing: border-box;
}
.ord .popup-dialog .modal-box .input-group { width: auto !important; float: none !important; margin: 0 0 10px !important; display: flex; flex-direction: column-reverse; position: relative; }
.ord .popup-dialog .modal-box .input-group label { position: static !important; font-size: 13px !important; font-weight: 700; color: #212121 !important; margin: 0 0 5px !important; padding: 0 !important; }
.ord .popup-dialog .modal-box input, .ord .popup-dialog .modal-box select {
width: 100% !important; height: 44px !important; padding: 0 12px !important; border: 1px solid #cfcfcf !important; border-radius: 10px !important; font-size: 15px !important; box-sizing: border-box;
}
.ord .popup-dialog .close-button { width: 36px; height: 36px; line-height: 36px; text-align: center; border-radius: 10px; cursor: pointer; }
.ord .popup-dialog .close-button:hover { background: #f2f2f2; }
.ord.fxs2 .popup-dialog #invDataCopy { display: inline-block; margin: 0 0 14px; padding: 7px 12px; border-radius: 9px; background: #f2f2f2; font-size: 13px; font-weight: 700; cursor: pointer; }
.ord.fxs2 .popup-dialog #save-invoice-address { width: 100%; border-radius: 12px !important; padding: 12px !important; background: #f8c301 !important; color: #212121 !important; border: 0 !important; font-weight: 700; font-size: 16px !important; }
/* przyciski */
.ord.fxs2 .fxs2-nav { display: flex !important; gap: 10px; justify-content: space-between; align-items: center; margin: 22px 0 0 !important; padding: 0 !important; }
.ord.fxs2 .fxs2-nav #ordPrevStep {
width: auto !important; height: auto !important; padding: 12px 16px !important; border-radius: 12px !important; font-size: 15px !important;
background: #fff !important; color: #212121 !important; border: 1px solid #cfcfcf !important; margin: 0 !important;
}
.ord.fxs2 .fxs2-nav .save-delivery-address-data {
flex: 1; max-width: 340px; padding: 14px 18px !important; border-radius: 12px !important; margin: 0 !important;
background: #f8c301 !important; color: #212121 !important; border: 0 !important; font-size: 17px !important; font-weight: 700;
}
.ord.fxs2 .fxs2-nav .save-delivery-address-data:hover { background: #ffd43a !important; }
/* prawa kolumna */
.ord.fxs2 .fxc-side { position: sticky; top: calc(var(--fx-hh, 140px) + 16px); }
.ord.fxs2 .fxs2-items { list-style: none; margin: 8px 0 12px; padding: 0 0 12px; border-bottom: 1px solid var(--fx-l); }
.ord.fxs2 .fxs2-items li { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--fx-d); margin-bottom: 6px; line-height: 1.35; }
.ord.fxs2 .fxs2-items li b { white-space: nowrap; }
.ord.fxs2 .fxc-lines p { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 8px; font-size: 14px; color: var(--fx-g); }
.ord.fxs2 .fxc-lines b { color: var(--fx-d); text-align: right; }
.ord.fxs2 .fxc-lines .fxc-total { border-top: 1px solid var(--fx-l); padding-top: 12px; margin-top: 12px; font-size: 16px; color: var(--fx-d); font-weight: 700; }
.ord.fxs2 .fxc-lines .fxc-total b { font-size: 24px; }
.ord.fxs2 .fxs2-change { background: none; border: 0; padding: 0; margin: 4px 0 0; color: var(--fx-d); text-decoration: underline; font-size: 13px; cursor: pointer; }
.ord.fxs2 .fxc-trust { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--fx-l); font-size: 13px; color: var(--fx-g); }
.ord.fxs2 .fxc-trust li { position: relative; padding-left: 24px; margin-bottom: 8px; line-height: 1.4; }
.ord.fxs2 .fxc-trust li:before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--fx-ok); font-weight: 700; }
.ord.fxs2 .fxc-trust a { color: var(--fx-d); font-weight: 700; }
@media (max-width: 991px) {
.ord.fxs2 .fxc-grid { grid-template-columns: 1fr; }
.ord.fxs2 .fxc-side { position: static; }
}
@media (max-width: 767px) {
.ord.fxs2 .fxc-box { padding: 16px; }
.ord.fxs2 .fxc-steps .label { font-size: 11px; padding: 5px 9px; }
.ord.fxs2 #delivery-address-data { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ord.fxs2 .input-group.fxs2-s3, .ord.fxs2 .input-group.fxs2-s4, .ord.fxs2 .input-group.fxs2-s6 { grid-column: 1 / -1; }
.ord.fxs2 .input-group.fxs2-s1, .ord.fxs2 .input-group.fxs2-s2, .ord.fxs2 .input-group.fxs2-n-city { grid-column: span 1; }
.ord.fxs2 .fxs2-nav { flex-direction: column-reverse; align-items: stretch; }
.ord.fxs2 .fxs2-nav .save-delivery-address-data { max-width: none; }
.delivery-popup .popup-content { width: auto !important; left: 10px !important; right: 10px !important; margin-left: 0 !important; box-sizing: border-box; }
.tt { width: auto !important; left: 12px !important; right: 12px !important; margin-left: 0 !important; box-sizing: border-box; }
.delivery-popup .fxp-go { display: none; }
.delivery-popup .popup-content:has(.collection-points-list li) { height: auto !important; min-height: 0 !important; bottom: auto !important; top: 80px !important; max-height: calc(100vh - 100px); overflow: auto; }
}
/* przyciski w oknach (logowanie, rejestracja, faktura) */
.ord .popup-dialog .modal-box .btn, .ord .popup-dialog .modal-box button[type="submit"], .ord .popup-dialog .modal-box input[type="submit"] {
display: block; box-sizing: border-box; width: 100% !important; height: auto !important; margin: 6px 0 0 !important; padding: 12px 16px !important;
border-radius: 12px !important; border: 0 !important; background: #f8c301 !important; color: #212121 !important;
font-size: 16px !important; font-weight: 700; text-align: center; cursor: pointer;
}
.ord .popup-dialog .modal-box .btn:hover { background: #ffd43a !important; }
.ord .popup-dialog .modal-box .required-fields-info { font-size: 12px; color: #6b6b6b; margin: 4px 0 8px; }
/* ==========================================
KROK 3: Podsumowanie (23.10.2026)
========================================== */
.ord.fxs3 { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; --fx-bad: #c12e2a; }
@supports (overflow: clip) { body:has(.ord.fxs3) .body-container { overflow: clip !important; } }
.ord.fxs3 .fxs3-hide { display: none !important; }
.ord.fxs3 .fxc-steps { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 18px; }
.ord.fxs3 .fxc-steps .label { font-size: 13px; font-weight: 400; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--fx-l) !important; background: #fff !important; color: var(--fx-g) !important; }
.ord.fxs3 .fxc-steps .label-success { background: var(--fx-d) !important; color: #fff !important; border-color: var(--fx-d) !important; font-weight: 700; }
.ord.fxs3 .fxc-steps .label.linked { color: var(--fx-d) !important; }
.ord.fxs3 .leftw50, .ord.fxs3 .rightw50 { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
.ord.fxs3 .clear { display: none; }
.ord.fxs3 .fxc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; align-items: start; }
.ord.fxs3 .fxc-main { display: grid; gap: 20px; min-width: 0; }
.ord.fxs3 .fxc-box { background: #fff; border: 1px solid var(--fx-l); border-radius: 14px; padding: 20px; }
.ord.fxs3 .fxc-h { font-size: 19px; font-weight: 700; margin: 0 0 14px; color: var(--fx-d); text-transform: none; }
.ord.fxs3 .fxs3-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.ord.fxs3 .fxs3-edit { background: none; border: 0; padding: 2px 4px; color: var(--fx-d); text-decoration: underline; font-size: 13px; font-weight: 700; cursor: pointer; }
.ord.fxs3 .fxs3-edit:hover { color: #000; background: #fff8dc; border-radius: 6px; }
/* produkty */
.ord.fxs3 .fxs3-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ord.fxs3 .fxs3-item {
display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto; gap: 4px 16px; align-items: center;
background: var(--fx-bg); border-radius: 12px; padding: 10px 12px;
}
.ord.fxs3 .fxs3-item img { width: 64px; height: 64px; object-fit: contain; background: #fff; border-radius: 10px; border: 1px solid var(--fx-l); }
.ord.fxs3 .fxs3-iname a { display: block; font-size: 14px; font-weight: 700; color: var(--fx-d); line-height: 1.35; }
.ord.fxs3 .fxs3-iname small { font-size: 12px; color: var(--fx-g); }
.ord.fxs3 .fxs3-iqty { font-size: 13px; color: var(--fx-g); white-space: nowrap; }
.ord.fxs3 .fxs3-isum { font-size: 16px; color: var(--fx-d); white-space: nowrap; min-width: 90px; text-align: right; }
/* dostawa i płatność */
.ord.fxs3 .fxs3-blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ord.fxs3 .fxs3-block { background: var(--fx-bg); border-radius: 12px; padding: 14px 16px; font-size: 14px; line-height: 1.5; color: var(--fx-d); }
.ord.fxs3 .fxs3-bh { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--fx-g); margin-bottom: 4px; }
.ord.fxs3 .fxs3-bh + p, .ord.fxs3 .fxs3-block p { margin: 0 0 10px; }
.ord.fxs3 .fxs3-block p:last-child { margin: 0; }
.ord.fxs3 .fxs3-block p small { display: block; font-size: 12px; color: var(--fx-g); }
.ord.fxs3 .fxs3-addr { margin: 0; }
/* uwagi */
.ord.fxs3 .fxs3-note { padding: 0; }
.ord.fxs3 .fxs3-note summary { padding: 16px 20px; cursor: pointer; font-weight: 700; font-size: 15px; color: var(--fx-d); list-style: none; position: relative; }
.ord.fxs3 .fxs3-note summary::-webkit-details-marker { display: none; }
.ord.fxs3 .fxs3-note summary:after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 22px; font-weight: 400; }
.ord.fxs3 .fxs3-note[open] summary:after { content: "\2212"; }
.ord.fxs3 .fxs3-note summary small { font-weight: 400; color: var(--fx-g); }
.ord.fxs3 .fxs3-note textarea {
display: block; width: calc(100% - 40px) !important; margin: 0 20px 20px; min-height: 90px; padding: 12px 14px;
border: 1px solid #cfcfcf; border-radius: 10px; font-size: 15px; box-sizing: border-box; resize: vertical;
}
.ord.fxs3 .fxs3-note textarea:focus { border-color: var(--fx-d); box-shadow: 0 0 0 3px rgba(248,195,1,.45); outline: 0; }
/* prawa kolumna */
.ord.fxs3 .fxc-side { position: sticky; top: calc(var(--fx-hh, 140px) + 16px); }
.ord.fxs3 .fxc-lines p { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 8px; font-size: 14px; color: var(--fx-g); }
.ord.fxs3 .fxc-lines b { color: var(--fx-d); white-space: nowrap; }
.ord.fxs3 .fxc-lines b.is-free { color: var(--fx-ok); }
.ord.fxs3 .fxc-lines .fxc-total { border-top: 1px solid var(--fx-l); padding-top: 12px; margin-top: 12px; font-size: 16px; color: var(--fx-d); font-weight: 700; }
.ord.fxs3 .fxc-lines .fxc-total b { font-size: 24px; }
.ord.fxs3 .fxc-lines .fxc-vat { display: block; text-align: right; font-size: 12px; margin-top: -4px; }
/* zgody */
.ord.fxs3 .fxs3-cond { margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--fx-l); border-radius: 0; }
.ord.fxs3 .fxs3-cond .tos { display: grid; gap: 8px; }
.ord.fxs3 .fxs3-chk { position: relative; display: block; }
.ord.fxs3 .fxs3-chk input { position: absolute; left: 0; top: 0; width: 22px; height: 22px; margin: 0; opacity: 0; cursor: pointer; z-index: 1; }
.ord.fxs3 .fxs3-chk label {
display: block; margin: 0; padding: 1px 0 0 32px; font-weight: 400; font-size: 12px; line-height: 1.45; color: var(--fx-g); cursor: pointer; position: relative;
}
.ord.fxs3 .fxs3-chk label:before {
content: ""; position: absolute; left: 0; top: 0; width: 22px; height: 22px; box-sizing: border-box;
border: 2px solid #bdbdbd; border-radius: 6px; background: #fff; transition: background .15s, border-color .15s;
}
.ord.fxs3 .fxs3-chk input:checked + label:before { background: var(--fx-d); border-color: var(--fx-d); }
.ord.fxs3 .fxs3-chk input:checked + label:after {
content: ""; position: absolute; left: 8px; top: 3px; width: 6px; height: 12px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.ord.fxs3 .fxs3-chk input:focus-visible + label:before { outline: 2px solid var(--fx-y); outline-offset: 2px; }
.ord.fxs3 .fxs3-chk label a { color: var(--fx-d); font-weight: 700; text-decoration: underline; }
.ord.fxs3 .fxs3-all { padding-bottom: 8px; border-bottom: 1px dashed var(--fx-l); }
.ord.fxs3 .fxs3-all label { font-size: 14px; font-weight: 700; color: var(--fx-d); padding-top: 2px; }
.ord.fxs3 .fxs3-chk.fx-bad label { color: var(--fx-bad); }
.ord.fxs3 .fxs3-chk.fx-bad label:before { border-color: var(--fx-bad); background: #fff6f6; }
.ord.fxs3 .fxs3-cond.fx-bad .fxs3-req { color: var(--fx-bad); font-weight: 700; }
.ord.fxs3 .fxs3-cond.fx-bad .fxs3-req:before { content: "Zaznacz wymagane zgody. "; }
.ord.fxs3 .fxs3-req { font-size: 11px; color: var(--fx-g); text-align: left !important; margin: 8px 0 0; }
/* przyciski */
.ord.fxs3 .fxs3-nav { display: grid !important; gap: 8px; margin: 16px 0 0 !important; padding: 0 !important; text-align: center; }
.ord.fxs3 .fxs3-nav #orderAdd {
order: 1; width: 100% !important; margin: 0 !important; padding: 15px 16px !important; border-radius: 12px !important; border: 0 !important;
background: var(--fx-y) !important; color: var(--fx-d) !important; font-size: 17px !important; font-weight: 700; line-height: 1.25; white-space: normal;
transition: background .15s, transform .1s;
}
.ord.fxs3 .fxs3-nav #orderAdd:hover { background: #ffd43a !important; }
.ord.fxs3 .fxs3-nav #orderAdd:active { transform: scale(.98); }
.ord.fxs3 .fxs3-nav #orderAdd:disabled { background: #ececec !important; color: #8a8a8a !important; cursor: progress; }
.ord.fxs3 .fxs3-pay { order: 2; margin: 0; font-size: 13px; color: var(--fx-g); }
.ord.fxs3 .fxs3-pay b { color: var(--fx-d); }
.ord.fxs3 .fxs3-nav #ordPrevStep2 {
order: 3; justify-self: center; width: auto !important; height: auto !important; margin: 4px 0 0 !important; padding: 6px 10px !important;
background: none !important; border: 0 !important; color: var(--fx-d) !important; text-decoration: underline; font-size: 14px !important; opacity: 1 !important;
}
.ord.fxs3 .fxs3-info { margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; background: #fff8dc; font-size: 14px; text-align: center !important; }
.ord.fxs3 .fxc-trust { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--fx-l); font-size: 13px; color: var(--fx-g); }
.ord.fxs3 .fxc-trust li { position: relative; padding-left: 24px; margin-bottom: 8px; line-height: 1.4; }
.ord.fxs3 .fxc-trust li:before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--fx-ok); font-weight: 700; }
.ord.fxs3 .fxc-trust a { color: var(--fx-d); font-weight: 700; }
.ord.fxs3.fxc-busy .fxc-grid { opacity: .55; pointer-events: none; }
@media (max-width: 991px) {
.ord.fxs3 .fxc-grid { grid-template-columns: 1fr; }
.ord.fxs3 .fxc-side { position: static; }
}
@media (max-width: 767px) {
.ord.fxs3 .fxc-box { padding: 14px; border-radius: 12px; }
.ord.fxs3 .fxs3-note { padding: 0; }
.ord.fxs3 .fxs3-note summary { padding: 14px; }
.ord.fxs3 .fxs3-note textarea { width: calc(100% - 28px) !important; margin: 0 14px 14px; }
.ord.fxs3 .fxc-steps .label { font-size: 11px; padding: 5px 9px; }
.ord.fxs3 .fxs3-blocks { grid-template-columns: 1fr; }
.ord.fxs3 .fxs3-item { grid-template-columns: 56px minmax(0, 1fr) auto; grid-template-areas: "img name name" "img qty sum"; }
.ord.fxs3 .fxs3-item > :first-child { grid-area: img; width: 56px; height: 56px; }
.ord.fxs3 .fxs3-iname { grid-area: name; } .ord.fxs3 .fxs3-iqty { grid-area: qty; } .ord.fxs3 .fxs3-isum { grid-area: sum; min-width: 0; }
}
/* ==========================================
KROK 4 i 5: Dziękujemy / Płatność (23.10.2026)
========================================== */
.ord.fxs4 { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; }
.ord.fxs4 .fxs4-hide { display: none !important; }
.ord.fxs4 .fxc-steps { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 18px; }
.ord.fxs4 .fxc-steps .label { font-size: 13px; font-weight: 400; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--fx-l) !important; background: #fff !important; color: var(--fx-g) !important; }
.ord.fxs4 .fxc-steps .label-success { background: var(--fx-d) !important; color: #fff !important; border-color: var(--fx-d) !important; font-weight: 700; }
.ord.fxs4 .fxs4-card { max-width: 640px; margin: 0 auto 30px; background: #fff; border: 1px solid var(--fx-l); border-radius: 16px; padding: 32px; box-sizing: border-box; }
.ord.fxs4 .fxs4-top { text-align: center; margin-bottom: 22px; }
.ord.fxs4 .fxs4-ico { display: block; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: #e9f6ee; position: relative; }
.ord.fxs4 .fxs4-ico:after { content: ""; position: absolute; left: 24px; top: 15px; width: 14px; height: 26px; border: solid var(--fx-ok); border-width: 0 4px 4px 0; transform: rotate(45deg); }
.ord.fxs4 .fxs4-ico.is-wait { background: #fff8dc; }
.ord.fxs4 .fxs4-ico.is-wait:after { left: 20px; top: 20px; width: 24px; height: 24px; border: 4px solid var(--fx-y); border-right-color: transparent; border-radius: 50%; transform: none; animation: fxSpin 1.4s linear infinite; box-sizing: border-box; }
.ord.fxs4 .fxs4-h { font-size: 26px !important; font-weight: 700; line-height: 1.25; margin: 0 0 10px !important; color: var(--fx-d); text-transform: none; }
.ord.fxs4 .fxs4-no { margin: 0; font-size: 15px; color: var(--fx-g); }
.ord.fxs4 .fxs4-no b { display: inline-block; margin-left: 4px; padding: 3px 10px; border-radius: 8px; background: var(--fx-bg); color: var(--fx-d); font-size: 17px; letter-spacing: .03em; }
.ord.fxs4 .fxs4-no small { display: block; margin-top: 6px; font-size: 12px; }
.ord.fxs4 .fxs4-status { margin: 10px 0 0; font-size: 14px; color: var(--fx-g); }
.ord.fxs4 .fxs4-status b { color: var(--fx-d); }
.ord.fxs4 .fxs4-pay { background: #fffdf3; border: 2px solid var(--fx-y); border-radius: 14px; padding: 18px; margin-bottom: 24px; }
.ord.fxs4 .fxs4-payrow { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 15px; color: var(--fx-g); margin-bottom: 6px; }
.ord.fxs4 .fxs4-payrow b { font-size: 26px; color: var(--fx-d); }
.ord.fxs4 .fxs4-payrow.is-sm span:last-child { color: var(--fx-d); font-weight: 700; }
.ord.fxs4 .fxs4-form { margin: 12px 0 0; padding: 0; }
.ord.fxs4 .fxs4-form .btn-pay, .ord.fxs4 .fxs4-form button {
display: block; width: 100% !important; margin: 0 !important; padding: 15px 16px !important; border: 0 !important; border-radius: 12px !important;
background: var(--fx-y) !important; color: var(--fx-d) !important; font-size: 18px !important; font-weight: 700; cursor: pointer;
transition: background .15s, transform .1s; box-shadow: none !important;
}
.ord.fxs4 .fxs4-form .btn-pay:hover, .ord.fxs4 .fxs4-form button:hover { background: #ffd43a !important; }
.ord.fxs4 .fxs4-form .btn-pay:active { transform: scale(.98); }
.ord.fxs4 .fxs4-safe { margin: 10px 0 0; font-size: 12px; color: var(--fx-g); text-align: center; }
.ord.fxs4 .fxs4-next { border-top: 1px solid var(--fx-l); padding-top: 20px; }
.ord.fxs4 .fxs4-next h3 { font-size: 17px; font-weight: 700; margin: 0 0 14px; color: var(--fx-d); text-transform: none; }
.ord.fxs4 .fxs4-next ol { list-style: none; counter-reset: fx; margin: 0; padding: 0; display: grid; gap: 14px; }
.ord.fxs4 .fxs4-next li { counter-increment: fx; position: relative; padding-left: 42px; min-height: 30px; }
.ord.fxs4 .fxs4-next li:before { content: counter(fx); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--fx-d); color: #fff; font-weight: 700; font-size: 14px; display: grid; place-items: center; }
.ord.fxs4 .fxs4-next li b { display: block; font-size: 15px; color: var(--fx-d); }
.ord.fxs4 .fxs4-next li span { display: block; font-size: 13px; color: var(--fx-g); line-height: 1.45; }
.ord.fxs4 .fxs4-foot { margin-top: 24px; text-align: center; }
.ord.fxs4 .fxs4-home { display: inline-block; padding: 11px 22px; border-radius: 12px; border: 1px solid #cfcfcf; color: var(--fx-d) !important; font-weight: 700; text-decoration: none !important; }
.ord.fxs4 .fxs4-home:hover { border-color: var(--fx-d); }
.ord.fxs4 .fxs4-foot p { margin: 14px 0 0; font-size: 13px; color: var(--fx-g); }
.ord.fxs4 .fxs4-foot p a { color: var(--fx-d); font-weight: 700; }
.ord.fxs4 .fxs4-card > :not(.fxs4-top):not(.fxs4-pay):not(.fxs4-next):not(.fxs4-foot):not(.fxs4-hide) { font-size: 14px; }
@media (max-width: 767px) {
.ord.fxs4 .fxc-steps .label { font-size: 11px; padding: 5px 9px; }
.ord.fxs4 .fxs4-card { padding: 20px 16px; border-radius: 14px; }
.ord.fxs4 .fxs4-h { font-size: 21px !important; }
.ord.fxs4 .fxs4-payrow b { font-size: 22px; }
}
/* ===== FOX BLOK: konto, lista, główna, wspólne, profil (v2, 25.10.2026: bez przebudowy treści skryptem) START ===== */
/* ==========================================
Konto: logowanie, rejestracja, przypomnienie hasła (v2, 25.10.2026)
Wygląd tylko w CSS, przypięty do klas body z serwera:
page-id-53 logowanie (HTML w szablonie site.html), page-id-6 rejestracja,
page-id-13 hasło. JS tylko sprawdza pola i pokazuje błędy.
========================================== */
body.page-id-53, body.page-id-6, body.page-id-13 { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; --fx-bad: #c12e2a; }
body.page-id-53 .mainContent > .leftColumn, body.page-id-6 .mainContent > .leftColumn, body.page-id-13 .mainContent > .leftColumn { display: none !important; }
body.page-id-53 .mainContent > .content, body.page-id-6 .mainContent > .content, body.page-id-13 .mainContent > .content { width: 100% !important; float: none !important; max-width: 1040px; margin: 0 auto; padding: 0 !important; }
body.page-id-6 .mainContent > .content > .page-header, body.page-id-13 .mainContent > .content > .page-header { border: 0 !important; margin: 10px 0 18px !important; padding: 0 !important; }
body.page-id-6 .mainContent > .content > .page-header h1, body.page-id-13 .mainContent > .content > .page-header h1 { font-size: 28px; font-weight: 700; margin: 0; color: #212121; text-transform: none; }
.fxa-card { background: #fff !important; border: 1px solid #e6e6e6; border-radius: 16px; padding: 28px !important; box-sizing: border-box; }
.fxa-h { font-size: 22px; font-weight: 700; margin: 0 0 6px; color: #212121; text-transform: none; }
.fxa-sub { margin: 4px 0 18px; font-size: 15px; color: #6b6b6b; }
/* wspólne: pola */
body.page-id-53 #signinForm label, body.page-id-6 .registration-section .input-group:not(.tos) > label, body.page-id-13 .passForm label {
display: block; position: static !important; transform: none !important; margin: 0 0 6px !important; padding: 0 !important; float: none !important; width: auto !important;
font-size: 13px !important; font-weight: 700 !important; color: #212121 !important; opacity: 1 !important; top: auto !important; left: auto !important; pointer-events: none; text-align: left !important; }
body.page-id-53 #signinForm input:not([type=hidden]):not([type=submit]),
body.page-id-6 .registration-section .input-group:not(.tos) > input, body.page-id-6 .registration-section .input-group > select,
body.page-id-13 .passForm input:not([type=hidden]):not([type=submit]) {
display: block; width: 100% !important; max-width: none !important; height: 48px !important; padding: 0 14px !important; margin: 0 !important; box-sizing: border-box; float: none !important;
font-size: 16px !important; color: #212121 !important; background: #fff !important; border: 1px solid #cfcfcf !important; border-radius: 10px !important; box-shadow: none !important; transition: border-color .15s, box-shadow .15s; }
body.page-id-53 #signinForm input:focus, body.page-id-6 .registration-section input:focus, body.page-id-6 .registration-section select:focus, body.page-id-13 .passForm input:focus {
border-color: #212121 !important; box-shadow: 0 0 0 3px rgba(248,195,1,.45) !important; outline: 0; }
body.page-id-53 .fx-bad input, body.page-id-6 .fx-bad > input, body.page-id-6 .fx-bad > select, body.page-id-13 .fx-bad input { border-color: #c12e2a !important; background: #fff6f6 !important; }
.fxa-err { display: block; margin-top: 6px; font-size: 13px; font-weight: 700; color: #c12e2a; line-height: 1.35; }
.fxa-err:empty { display: none; }
.fxa-err:before { content: "! "; }
.fxa-pwrap { display: block; position: relative; }
.fxa-pwrap input { padding-right: 76px !important; }
.fxa-eye { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); height: 36px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: #212121; font-size: 13px; font-weight: 700; cursor: pointer; z-index: 1; }
.fxa-eye:hover { background: #f6f6f6; }
.fxa-alert { margin: 0 0 14px; padding: 12px 14px 12px 44px; border-radius: 10px; background: #fff3f2; border: 1px solid #f3c7c5; color: #8f201d; font-size: 14px; line-height: 1.45; position: relative; }
.fxa-alert:before { content: "!"; position: absolute; left: 14px; top: 11px; width: 20px; height: 20px; border-radius: 50%; background: #c12e2a; color: #fff; font-weight: 700; font-size: 13px; display: grid; place-items: center; }
/* wspólne: przyciski */
body.page-id-53 #signinForm input[type=submit], body.page-id-6 .registration-section .primary-action-button, body.page-id-13 .passForm input[type=submit] {
display: block; width: 100% !important; height: auto !important; margin: 0 !important; padding: 14px 18px !important; box-sizing: border-box; float: none !important;
border: 0 !important; border-radius: 12px !important; background: #f8c301 !important; color: #212121 !important;
font-size: 17px !important; font-weight: 700; text-align: center; cursor: pointer; transition: background .15s, transform .1s; line-height: 1.3 !important; }
body.page-id-53 #signinForm input[type=submit]:hover, body.page-id-6 .registration-section .primary-action-button:hover, body.page-id-13 .passForm input[type=submit]:hover { background: #ffd43a !important; }
body.page-id-53 #signinForm input[type=submit].fx-loading { color: transparent !important; pointer-events: none; }
.fxa-btn1 { display: inline-flex; align-items: center; justify-content: center; padding: 13px 22px; border-radius: 12px; background: #f8c301; color: #212121 !important; font-weight: 700; font-size: 16px; text-decoration: none !important; }
.fxa-btn1:hover { background: #ffd43a; }
.fxa-btn2 { display: block; text-align: center; padding: 13px 18px; border-radius: 12px; background: #212121; color: #fff !important; font-weight: 700; font-size: 16px; text-decoration: none !important; }
.fxa-btn2:hover { background: #000; }
/* lista korzyści, notki */
.fxa-ben { list-style: none; margin: 0 0 20px; padding: 0; }
.fxa-ben li { position: relative; padding-left: 28px; margin-bottom: 10px; font-size: 15px; color: #212121; line-height: 1.4; }
.fxa-ben li:before { content: ""; position: absolute; left: 0; top: 1px; width: 18px; height: 18px; border-radius: 50%; background: #e9f6ee; }
.fxa-ben li:after { content: ""; position: absolute; left: 6px; top: 4px; width: 5px; height: 9px; border: solid #2e9b4f; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.fxa-note { margin: 16px 0 0; padding: 12px 14px; border-radius: 10px; background: #f6f6f6; font-size: 13px; color: #6b6b6b; line-height: 1.45; }
.fxa-note b { color: #212121; }
.fxa-help { margin: 14px 0 0; font-size: 13px; color: #6b6b6b; }
.fxa-help a { color: #212121; font-weight: 700; }
/* ---------- logowanie (HTML z szablonu) ---------- */
.loginContent.fxa-login { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; margin: 10px 0 30px; }
.loginContent.fxa-login > div { float: none !important; width: auto !important; margin: 0 !important; min-height: 0 !important; }
.fxa-login .page-header { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.fxa-login .page-header h1 { font-size: 22px !important; background: none !important; color: #212121 !important; padding: 0 !important; margin: 0 !important; text-transform: none !important; display: block; font-weight: 700 !important; }
.fxa-login #signinForm p { margin: 0 0 16px; }
.fxa-login #signinForm p.fxa-submit { margin: 6px 0 0; }
.fxa-login .fxa-forgot { display: inline-block; margin-top: 8px; font-size: 13px; color: #212121 !important; text-decoration: underline; }
.fxa-login .login-social-button { margin-top: 10px; border-radius: 12px !important; }
.fxa-logged { max-width: 460px; margin: 20px auto 30px; text-align: center; }
.fxa-logged p { font-size: 15px; margin: 0 0 14px; }
/* ---------- rejestracja (pola Comarch, tylko CSS) ---------- */
.fxa-regwrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; margin-bottom: 30px; }
.fxa-aside { margin: 0 !important; }
.fxa-aside .fxa-h { font-size: 18px; margin-bottom: 14px; }
.fxa-aside .fxa-ben li { font-size: 14px; }
body.page-id-6 .registration-section form { margin: 0; }
body.page-id-6 .registration-section .registration-container, body.page-id-6 .registration-section .registration-form-content,
body.page-id-6 .registration-section .registration-tos-container { float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
body.page-id-6 .registration-section .clear { display: none !important; }
/* zakładki Osoba prywatna / Firma */
body.page-id-6 .registration-section .standard-form, body.page-id-6 .registration-section .company-form {
display: grid !important; grid-template-columns: 1fr 1fr; gap: 4px; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
body.page-id-6 .registration-section .active-tab, body.page-id-6 .registration-section .inactive-tab {
float: none !important; width: auto !important; margin: 0 !important; padding: 11px 12px !important; text-align: center; border-radius: 9px; font-size: 15px; font-weight: 700; cursor: pointer;
background: #f6f6f6 !important; color: #6b6b6b !important; border: 0 !important; height: auto !important; line-height: 1.3 !important; }
body.page-id-6 .registration-section .active-tab { background: #212121 !important; color: #fff !important; cursor: default; }
body.page-id-6 .registration-section .inactive-tab:hover { color: #212121 !important; background: #ececec !important; }
/* siatka pól */
body.page-id-6 .registration-section .registration-form-content { grid-column: 1 / -1; display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px 12px; margin-top: 18px !important; }
body.page-id-6 .registration-section .registration-form-content .data, body.page-id-6 .registration-section .registration-form-content .company-data,
body.page-id-6 .registration-section .registration-form-content .company-data > div:not(.input-group) { display: contents !important; }
body.page-id-6 .registration-section .registration-form-content .data:first-child:before,
body.page-id-6 .registration-section .registration-form-content .company-data:before,
body.page-id-6 .registration-section .registration-form-content .data:not(:first-child):before {
grid-column: 1 / -1; display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #6b6b6b; padding-top: 14px; border-top: 1px solid #e6e6e6; }
body.page-id-6 .registration-section .registration-form-content .data:first-child:before { content: "Dane logowania"; padding-top: 0; border-top: 0; }
body.page-id-6 #registration-standard-form .registration-form-content .company-data:before { content: "Adres dostawy"; }
body.page-id-6 #registration-company-form .registration-form-content .company-data:before { content: "Dane firmy i adres"; }
body.page-id-6 .registration-section .registration-form-content .data:not(:first-child):before { content: "Kontakt"; }
body.page-id-6 .registration-section .input-group:not(.tos) { display: flex !important; flex-direction: column-reverse; justify-content: flex-end; position: relative;
float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; grid-column: 1 / -1; }
body.page-id-6 .registration-section .input-group.hidden { display: none !important; }
body.page-id-6 .registration-section .input-group:has(> [name=email]), body.page-id-6 .registration-section .input-group:has(> [name=password]),
body.page-id-6 .registration-section .input-group:has(> [name=tin]), body.page-id-6 .registration-section .input-group:has(> [name=countryCode]),
body.page-id-6 .registration-section .input-group:has(> [name=phoneNo]) { grid-column: span 3; }
body.page-id-6 .registration-section .input-group:has(> [name=street]), body.page-id-6 .registration-section .input-group:has(> [name=city]) { grid-column: span 4; }
body.page-id-6 .registration-section .input-group:has(> [name=streetNo]), body.page-id-6 .registration-section .input-group:has(> [name=unitNo]) { grid-column: span 1; }
body.page-id-6 .registration-section .input-group:has(> [name=zipCode]) { grid-column: span 2; }
body.page-id-6 .registration-section .input-group > select { -webkit-appearance: none; appearance: none; background-image: linear-gradient(45deg, transparent 50%, #212121 50%), linear-gradient(135deg, #212121 50%, transparent 50%) !important;
background-position: calc(100% - 20px) 21px, calc(100% - 15px) 21px !important; background-size: 5px 5px !important; background-repeat: no-repeat !important; }
body.page-id-6 .registration-section .input-group:has(> [name=password]) > input { padding-right: 76px !important; }
body.page-id-6 .registration-section .input-group > .fxa-eye { top: 31px; transform: none; }
/* podpowiedzi pod polami */
body.page-id-6 .registration-section .input-group:has(> [name=password]):after { content: "Zapamiętaj je, przyda się przy kolejnych zakupach"; }
body.page-id-6 .registration-section .input-group:has(> [name=phoneNo]):after { content: "Kurier zadzwoni lub wyśle SMS przed dostawą"; }
body.page-id-6 .registration-section .input-group:has(> [name=tin]):after { content: "Na ten NIP wystawimy fakturę"; }
body.page-id-6 .registration-section .input-group:not(.tos):after { order: -1; display: block; margin-top: 5px; font-size: 12px; color: #6b6b6b; }
body.page-id-6 .registration-section .input-group.fx-bad:after { display: none; }
body.page-id-6 .registration-section .input-group > .fxa-err { order: -2; }
/* zgody */
/* zgody oddzielone od pola Telefon (selektor mocniejszy niż reset wyżej) */
body.page-id-6 .registration-section .registration-tos-container { margin-top: 20px !important; padding-top: 18px !important; border-top: 1px solid #e6e6e6 !important; }
body.page-id-6 .registration-tos-container .input-group.tos { display: block; position: relative; margin: 0 0 12px !important; padding: 0 !important; width: auto !important; float: none !important; }
body.page-id-6 .registration-tos-container .tos > input[type=checkbox] { position: absolute; left: 0; top: 0; width: 22px; height: 22px; margin: 0; opacity: 0; z-index: 1; cursor: pointer; }
body.page-id-6 .registration-tos-container .tos > label.switch { display: block; position: relative !important; padding: 1px 0 0 34px !important; margin: 0 !important; min-height: 22px;
font-size: 13px !important; font-weight: 400 !important; line-height: 1.45; color: #6b6b6b !important; cursor: pointer; text-transform: none; width: auto !important; }
body.page-id-6 .registration-tos-container .tos > label.switch:before { content: "" !important; position: absolute; left: 0; top: 0; width: 22px; height: 22px; box-sizing: border-box;
border: 2px solid #bdbdbd; border-radius: 6px; background: #fff !important; transition: background .15s, border-color .15s; transform: none !important; }
body.page-id-6 .registration-tos-container .tos > label.switch:after { content: none !important; }
body.page-id-6 .registration-tos-container .tos > input:checked + label.switch:before { background: #212121 !important; border-color: #212121; }
body.page-id-6 .registration-tos-container .tos > input:checked + label.switch:after { content: "" !important; position: absolute; left: 8px; top: 3px; width: 6px; height: 12px;
border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); background: none !important; display: block; }
body.page-id-6 .registration-tos-container .tos > input:focus-visible + label.switch:before { outline: 2px solid #f8c301; outline-offset: 2px; }
body.page-id-6 .registration-tos-container .tos label a { color: #212121; font-weight: 700; text-decoration: underline; }
body.page-id-6 .registration-tos-container .tos.fx-bad > label.switch { color: #c12e2a !important; }
body.page-id-6 .registration-tos-container .tos.fx-bad > label.switch:before { border-color: #c12e2a; background: #fff6f6 !important; }
body.page-id-6 .registration-tos-container .tos > .fxa-err { margin-left: 34px; }
body.page-id-6 .registration-tos-container .channels { display: none !important; }
body.page-id-6 .registration-tos-container .required-fields-info { font-size: 12px; color: #6b6b6b; margin: 4px 0 16px !important; padding: 0 !important; float: none !important; width: auto !important; }
body.page-id-6 .registration-tos-container > p { margin: 0; }
body.page-id-6 .registration-section .no-acc { margin-top: 16px !important; text-align: center; font-size: 14px; color: #6b6b6b; float: none !important; width: auto !important; }
body.page-id-6 .registration-section .no-acc:before { content: "Masz już konto? "; }
body.page-id-6 .registration-section .no-acc a { color: #212121 !important; font-weight: 700; text-decoration: underline; }
/* sukces rejestracji */
.fxa-ok { text-align: center; padding: 10px 4px 6px; }
.fxa-ok-ico { display: block; width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 50%; background: #e9f6ee; position: relative; }
.fxa-ok-ico:after { content: ""; position: absolute; left: 24px; top: 15px; width: 14px; height: 26px; border: solid #2e9b4f; border-width: 0 4px 4px 0; transform: rotate(45deg); }
.fxa-ok .fxa-h { font-size: 26px; }
.fxa-ok-mail { margin: 18px auto 20px; max-width: 460px; padding: 14px 16px; border-radius: 12px; background: #fff8dc; text-align: left; font-size: 14px; line-height: 1.45; color: #212121; }
.fxa-ok-mail b { display: block; margin-bottom: 4px; word-break: break-word; }
.fxa-ok-mail span { color: #5a5a5a; }
.fxa-ok-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.fxa-ok .fxa-btn2 { display: inline-flex; padding: 13px 22px; }
/* ---------- przypomnienie hasła (tylko CSS) ---------- */
body.page-id-13 .passForm { max-width: 460px; margin: 0 auto 30px; background: #fff; border: 1px solid #e6e6e6; border-radius: 16px; padding: 28px; box-sizing: border-box; }
body.page-id-13 .mainContent > .content > .page-header { max-width: 460px; margin-left: auto !important; margin-right: auto !important; }
body.page-id-13 .passForm ul { list-style: none; margin: 0; padding: 0; }
body.page-id-13 .passForm li { margin: 0 0 14px; }
body.page-id-13 .passForm form > p { font-size: 15px; color: #6b6b6b; margin: 0 0 18px; }
body.page-id-13 .passForm + p, body.page-id-13 .mainContent > .content > p { max-width: 460px; margin-left: auto; margin-right: auto; }
/* okna z komunikatami Comarch */
.message-popup-background .message-popup.msg2 {
background: #fff !important; color: #212121 !important; border: 0 !important; border-left: 6px solid #f8c301 !important;
border-radius: 14px !important; box-shadow: 0 20px 60px rgba(0,0,0,.25) !important; padding: 18px 22px !important; text-align: left !important; }
.message-popup-background .message-popup .title { font-weight: 700; font-size: 17px; margin-bottom: 4px; }
@media (max-width: 991px) {
.loginContent.fxa-login, .fxa-regwrap { grid-template-columns: 1fr; }
.fxa-aside { position: static; }
}
@media (max-width: 767px) {
body.page-id-6 .mainContent > .content > .page-header h1, body.page-id-13 .mainContent > .content > .page-header h1 { font-size: 24px; }
.fxa-card { padding: 18px !important; border-radius: 14px; }
body.page-id-13 .passForm { padding: 18px; }
body.page-id-6 .registration-section .registration-form-content { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.page-id-6 .registration-section .input-group:not(.tos) { grid-column: 1 / -1 !important; }
body.page-id-6 .registration-section .input-group:has(> [name=streetNo]), body.page-id-6 .registration-section .input-group:has(> [name=unitNo]),
body.page-id-6 .registration-section .input-group:has(> [name=zipCode]), body.page-id-6 .registration-section .input-group:has(> [name=city]) { grid-column: span 1 !important; }
}
/* ==========================================
Lista produktów (kategorie, wyszukiwarka) (v2, 25.10.2026: bez skoków, wygląd od razu z CSS)
========================================== */
body.page-id-3 { --fx-y: #f8c301; --fx-d: #212121; --fx-g: #6b6b6b; --fx-l: #e6e6e6; --fx-bg: #f6f6f6; --fx-ok: #2e9b4f; --fx-warn: #b7791f; }
.fxl-hide { display: none !important; }
/* nagłówek i pasek */
body.page-id-3 .category-products .blackbg { float: none !important; width: auto !important; }
body.page-id-3 .category-products h1 { font-size: 28px; font-weight: 700; margin: 4px 0 2px; text-transform: none; }
body.page-id-3 .category-products .lcount { font-size: 14px; color: var(--fx-g); margin: 0 0 14px; }
body.page-id-3 #products.category-products > .grey { display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 10px 12px !important; margin: 0 0 14px !important;
background: #fff !important; border: 1px solid var(--fx-l); border-radius: 12px; }
body.page-id-3 #products.category-products > .grey > .clear { display: none; }
body.page-id-3 #products.category-products > .grey .listOrder { order: 1; float: none !important; display: flex; white-space: nowrap; align-items: center; gap: 8px; margin: 0 !important; font-size: 14px; color: var(--fx-g); }
body.page-id-3 #products.category-products > .grey .listOrder select { height: 40px; border: 1px solid #cfcfcf; border-radius: 10px; padding: 0 34px 0 12px; font-size: 14px; color: var(--fx-d); background-color: #fff; cursor: pointer; }
body.page-id-3 #products.category-products > .grey .pager { order: 3; margin-left: auto !important; float: none !important; display: flex; align-items: center; gap: 4px; }
body.page-id-3 #products .pager .d { font-size: 13px; color: var(--fx-g); margin-right: 6px; }
body.page-id-3 #products .pager .btn { min-width: 36px; height: 36px; line-height: 36px !important; padding: 0 8px !important; border-radius: 9px !important; border: 1px solid var(--fx-l) !important;
background: #fff !important; color: var(--fx-d) !important; font-weight: 700; text-align: center; box-shadow: none !important; }
body.page-id-3 #products .pager .btn.active { background: var(--fx-d) !important; color: #fff !important; border-color: var(--fx-d) !important; }
body.page-id-3 #products .pager a.btn:hover { border-color: var(--fx-d) !important; }
/* kafelki */
body.page-id-3 #products .pdrs.pdrs-list { display: grid; gap: 10px; margin: 0 0 18px !important; }
body.page-id-3 #products .pdrs.pdrs-list .pdr { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; }
body.page-id-3 #products .pdr .brd {
display: grid !important; grid-template-columns: 132px minmax(0, 1fr) 210px; grid-template-areas: "img info buy"; gap: 4px 20px; align-items: center;
padding: 14px !important; margin: 0 !important; border: 1px solid var(--fx-l) !important; border-radius: 14px; background: #fff; position: relative;
transition: border-color .15s, box-shadow .15s; min-height: 0 !important; height: auto !important;
}
body.page-id-3 #products .pdr .brd:hover { border-color: #cfcfcf !important; box-shadow: 0 6px 20px rgba(0,0,0,.06); }
body.page-id-3 #products .pdr .brd > .clear, body.page-id-3 #products .pdr .pAttr:empty { display: none; }
body.page-id-3 #products .pdr .pImg { grid-area: img; float: none !important; width: 132px !important; height: 104px !important; margin: 0 !important; padding: 0 !important; }
body.page-id-3 #products .pdr .pImg a { display: flex !important; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 10px; overflow: hidden; background: #fff; }
body.page-id-3 #products .pdr .pImg img { max-width: 100% !important; max-height: 100% !important; width: auto !important; height: auto !important; object-fit: contain; margin: 0 !important; }
body.page-id-3 #products .pdr .pImg:not(:has(img)) a { background: var(--fx-bg); flex-direction: column; gap: 4px; color: #b5b5b5 !important; text-decoration: none !important; }
body.page-id-3 #products .pdr .pImg:not(:has(img)) i { font-size: 28px !important; margin: 0 !important; color: #c4c4c4; }
body.page-id-3 #products .pdr .pImg:not(:has(img)) a:after { content: "Brak zdjęcia"; font-size: 11px; color: #9a9a9a; }
body.page-id-3 #products .pdr .pNewPr { position: absolute; left: 20px; top: 20px; z-index: 1; margin: 0 !important; }
body.page-id-3 #products .pdr .pNewPr .fl { float: none !important; display: inline-block; margin: 0 !important; padding: 3px 8px !important; border-radius: 99px; font-size: 11px !important; font-weight: 700; line-height: 1.3 !important; height: auto !important; width: auto !important; }
body.page-id-3 #products .pdr .z { grid-area: info; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; min-width: 0; }
body.page-id-3 #products .pdr .pTxt { margin: 0 0 4px !important; height: auto !important; }
body.page-id-3 #products .pdr .pTxt a { font-size: 15px !important; font-weight: 700; line-height: 1.35 !important; color: var(--fx-d) !important; text-transform: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.page-id-3 #products .pdr .pTxt a:hover { text-decoration: underline; }
body.page-id-3 #products .pdr .pDesc { margin: 0 0 8px !important; font-size: 12px !important; line-height: 1.45; color: var(--fx-g); height: auto !important; }
.fxl-stock { display: inline-flex !important; align-items: center; gap: 7px; margin: 0 !important; padding: 4px 10px !important; border-radius: 99px !important; height: auto !important; text-decoration: none !important; font-size: 12px; font-weight: 700; line-height: 1.3; }
.fxl-stock i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.fxl-stock.is-ok { background: #e9f6ee; color: var(--fx-ok); }
.fxl-stock.is-low { background: #fff4e0; color: #b45309; }
.fxl-stock.is-ext { background: #fff8dc; color: #8a6100; }
.fxl-stock.is-off { background: #f1f1f1; color: #6b6b6b; }
body.page-id-3 #products .pdr .c { grid-area: buy; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; text-align: right; }
body.page-id-3 #products .pdr .c > .clear { display: none; }
body.page-id-3 #products .pdr .pPrc { margin: 0 0 8px !important; float: none !important; text-align: right; }
body.page-id-3 #products .pdr .pPrc .prc { font-size: 22px !important; font-weight: 700; color: var(--fx-d); white-space: nowrap; }
body.page-id-3 #products .pdr .pPrc .curr { font-size: 15px; font-weight: 400; }
body.page-id-3 #products .pdr .pCart { margin: 0 !important; float: none !important; }
body.page-id-3 #products .pdr .pCart .btn {
display: flex !important; box-sizing: border-box !important; align-items: center; justify-content: center; gap: 8px; width: 100% !important; max-width: 100%; height: 46px !important; margin: 0 !important; padding: 0 12px !important;
border: 0 !important; border-radius: 12px !important; background: var(--fx-y) !important; color: var(--fx-d) !important;
font-size: 15px !important; font-weight: 700; line-height: 1.2 !important; white-space: nowrap; box-shadow: none !important; transition: background .15s, transform .1s;
}
body.page-id-3 #products .pdr .pCart .btn i { color: var(--fx-d) !important; margin: 0 !important; }
body.page-id-3 #products .pdr .pCart .btn:hover { background: #ffd43a !important; }
body.page-id-3 #products .pdr .pCart .btn:active { transform: scale(.98); }
body.page-id-3 #products .pdr .pCart .btn.fxl-notify { background: #fff !important; border: 1px solid #cfcfcf !important; font-size: 14px !important; white-space: normal; }
body.page-id-3 #products .pdr .pCart .btn.fxl-notify:hover { border-color: var(--fx-d) !important; }
/* lewa kolumna: modele */
body.page-id-3 .leftCat2 { border: 1px solid var(--fx-l) !important; border-radius: 14px; background: #fff; overflow: hidden; }
body.page-id-3 .leftCat2 .panel-body { padding: 14px !important; }
.fxl-msearch { width: 100%; height: 40px; border: 1px solid #cfcfcf; border-radius: 10px; padding: 0 12px; font-size: 14px; box-sizing: border-box; }
.fxl-msearch:focus { border-color: var(--fx-d); outline: 0; box-shadow: 0 0 0 3px rgba(248,195,1,.45); }
body.page-id-3 .leftCat2 > .panel-body > a { display: inline-block; font-size: 13px; color: var(--fx-g) !important; margin-bottom: 6px; }
body.page-id-3 .leftCat2 ul { list-style: none; margin: 0 !important; padding: 0 !important; }
body.page-id-3 .leftCat2 ul ul li a { display: block; padding: 7px 10px !important; margin: 0 !important; border-radius: 8px; font-size: 13px !important; color: var(--fx-d) !important; text-transform: uppercase; text-decoration: none !important; line-height: 1.3; }
body.page-id-3 .leftCat2 ul ul li a:hover { background: var(--fx-bg); }
body.page-id-3 .leftCat2 a.b { font-weight: 700; font-size: 14px; display: block; padding: 4px 0 6px; }
.fxl-mmore, .fxl-fmore { display: block !important; box-sizing: border-box; height: 36px !important; line-height: 34px !important; width: 100%; margin: -36px 0 0 !important; padding: 0 10px; border: 1px dashed #cfcfcf; border-radius: 10px; background: #fff; color: var(--fx-d); font-size: 13px; font-weight: 700; cursor: pointer; }
.fxl-mmore:hover, .fxl-fmore:hover { border-color: var(--fx-d); }
/* filtry */
body.page-id-3 .leftFilters { border: 1px solid var(--fx-l) !important; border-radius: 14px; background: #fff; overflow: hidden; }
body.page-id-3 .leftFilters .panel-heading { background: var(--fx-d) !important; }
body.page-id-3 .leftFilters .panel-body { padding: 4px 14px 14px !important; }
body.page-id-3 .leftFilters p.heading { margin: 14px 0 8px !important; padding: 0 !important; font-size: 12px !important; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--fx-g) !important; background: none !important; border: 0 !important; }
body.page-id-3 .leftFilters .filter-content > div > p { display: flex; align-items: center; gap: 8px; margin: 0 !important; padding: 5px 4px !important; border-radius: 8px; position: relative; }
body.page-id-3 .leftFilters .filter-content > div > p:hover { background: var(--fx-bg); }
body.page-id-3 .leftFilters .filter-content > div > p > input { position: absolute; opacity: 0; pointer-events: none; }
body.page-id-3 .leftFilters .filter-content > div > p > span.far { width: 18px; height: 18px; flex: 0 0 18px; border: 2px solid #bdbdbd; border-radius: 5px; box-sizing: border-box; position: relative; margin: 0 !important; }
body.page-id-3 .leftFilters .filter-content > div > p > span.far:before { content: none !important; }
body.page-id-3 .leftFilters .filter-content > div > p:has(> input:checked) > span.far { background: var(--fx-d); border-color: var(--fx-d); }
body.page-id-3 .leftFilters .filter-content > div > p:has(> input:checked) > span.far:after { content: ""; position: absolute; left: 4px; top: 0; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
body.page-id-3 .leftFilters .filter-content > div > p label { flex: 1; display: flex; justify-content: space-between; gap: 8px; margin: 0 !important; font-size: 13px !important; font-weight: 400 !important; color: var(--fx-d) !important; line-height: 1.3; }
body.page-id-3 .leftFilters .filter-content > div > p label small { color: #9a9a9a; font-size: 12px; }
body.page-id-3 .leftFilters .filter-content > div > p:has(> input:checked) label { font-weight: 700 !important; }
/* telefon */
@media (max-width: 767px) {
body.page-id-3 .category-products h1 { font-size: 24px; }
body.page-id-3 #products.category-products > .grey { padding: 10px !important; gap: 10px; }
body.page-id-3 #products.category-products > .grey .listOrder { width: 100%; }
body.page-id-3 #products.category-products > .grey .listOrder select { flex: 1; }
body.page-id-3 #products.category-products > .grey .pager { margin-left: 0 !important; width: 100%; justify-content: center; }
body.page-id-3 #products.category-products > .grey .pager .d { display: none; }
body.page-id-3 #products .pager .btn { min-width: 40px; }
body.page-id-3 #products .pdr .brd { grid-template-columns: 96px minmax(0, 1fr); grid-template-areas: "img info" "buy buy"; gap: 10px 12px; padding: 12px !important; align-items: start; }
body.page-id-3 #products .pdr .pImg { width: 96px !important; height: 96px !important; }
body.page-id-3 #products .pdr .pNewPr { left: 16px; top: 16px; }
body.page-id-3 #products .pdr .pTxt a { font-size: 14px !important; }
body.page-id-3 #products .pdr .c { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 10px !important; border-top: 1px solid var(--fx-l); }
body.page-id-3 #products .pdr .pPrc { margin: 0 !important; text-align: left; }
body.page-id-3 #products .pdr .pPrc .prc { font-size: 20px !important; }
body.page-id-3 #products .pdr .pCart { flex: 0 0 auto; }
body.page-id-3 #products .pdr .pCart .btn { width: auto !important; height: 44px !important; padding: 0 16px !important; font-size: 14px !important; }
}
body.page-id-3 .leftFilters .filter-content > div { height: auto !important; max-height: none !important; overflow: visible !important; }
body.page-id-3 .leftFilters .filter-content > div.fxl-open { max-height: 340px !important; overflow-y: auto !important; overscroll-behavior: contain; }
body.page-id-3 .leftFilters .panel-heading .panel-title { color: #fff !important; }
/* bez logo marki w nagłówku kategorii */
body.page-id-3 #products .catImg { display: none !important; }
body.page-id-3 #products .pdr .c { overflow: visible !important; min-width: 0; }
/* bez skoku: puste gwiazdki i stary opis dostępności chowane od razu w CSS */
body.page-id-3 #products .pdr .revBex:not(:has(.fas)) { display: none !important; }
body.page-id-3 #products .pdr .fxl-stock + .addinfo { display: none !important; }
/* ===== v2: wszystko od razu z CSS, skrypt tylko dokłada drobiazgi w zarezerwowane miejsca ===== */
/* opis: pierwsza linia (kod) pogrubiona, reszta max 2 linie */
body.page-id-3 #products .pdr .pDesc { white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
body.page-id-3 #products .pdr .pDesc::first-line { font-weight: 700; color: #4a4a4a; }
/* z kilku czerwonych etykiet zostaje jedna */
body.page-id-3 #products .pdr .pNewPr .fl ~ .fl { display: none !important; }
/* stary opis dostępności chowany od razu, na kolorową etykietę jest stałe miejsce */
body.page-id-3 #products .pdr .addinfo { display: none !important; }
body.page-id-3 #products .pdr .z { position: relative; padding-bottom: 30px !important; }
body.page-id-3 #products .pdr .fxl-stock { position: absolute; left: 0; bottom: 0; }
/* pasek nad listą */
body.page-id-3 #products.category-products > .grey .listOrder { order: 1; }
/* modele: tytuł z CSS, miejsce na wyszukiwarkę zarezerwowane, pierwsze 10 widoczne */
body.page-id-3 .leftCat2 .panel-body { position: relative; padding-top: 46px !important; }
body.page-id-3 .leftCat2 .panel-body:before { content: "Wybierz model"; position: absolute; left: 14px; top: 14px; font-size: 15px; font-weight: 700; color: var(--fx-d); }
body.page-id-3 .leftCat2 .panel-body:has(ul ul > li:nth-child(11)) { padding-top: 98px !important; }
body.page-id-3 .leftCat2 .fxl-msearch { position: absolute; left: 14px; right: 14px; top: 46px; width: auto; }
body.page-id-3 .leftCat2 ul ul:has(> li:nth-child(11)) { margin-bottom: 44px !important; }
body.page-id-3 .leftCat2:not(.fxl-all) ul ul > li:nth-child(n+11):not(:has(.b, .selected, .active)) { display: none; }
body.page-id-3 .leftCat2 ul ul > li.fxl-miss { display: none !important; }
body.page-id-3 .leftCat2.fxl-q ul ul > li:not(.fxl-miss) { display: list-item !important; }
body.page-id-3 .leftCat2.fxl-q .fxl-mmore { visibility: hidden; }
/* filtry: bez listy marek, pierwsze 6 opcji widoczne, miejsce na "Pokaż więcej" zarezerwowane */
body.page-id-3 .leftFilters p.heading.MARK, body.page-id-3 .leftFilters p.heading.MARK + div { display: none !important; }
body.page-id-3 .leftFilters .filter-content > p.heading + div:has(> p:nth-of-type(7)) { margin-bottom: 44px !important; }
body.page-id-3 .leftFilters .filter-content > p.heading + div:not(.fxl-open) > p:nth-of-type(n+7):not(:has(> input:checked)) { display: none !important; }
/* ==========================================
Strona główna: baner, pasek zaufania, marki (24.10.2026)
========================================== */
.fx-hero { position: relative; min-height: 380px; border-radius: 16px; overflow: hidden; background: #212121; color: #fff; display: flex; align-items: center; isolation: isolate; }
.fx-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; z-index: -2; }
.fx-hero:after { content: ""; position: absolute; inset: 0; z-index: -1;
background: linear-gradient(90deg, rgba(18,18,18,.92) 0%, rgba(18,18,18,.78) 45%, rgba(18,18,18,.35) 100%); }
.fx-hero-in { padding: 36px 40px; max-width: 620px; box-sizing: border-box; width: 100%; }
.fx-hero-eye { margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #f8c301; }
.fx-hero-h { margin: 0 0 18px !important; font-size: 34px !important; line-height: 1.15 !important; font-weight: 700 !important; color: #fff !important; text-transform: none !important; }
.fx-hero-h span { color: #f8c301; display: block; }
.fx-hero-list { list-style: none; margin: 0 0 24px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; }
.fx-hero-list li { position: relative; padding-left: 28px; font-size: 15px; line-height: 1.35; color: #f2f2f2; }
.fx-hero-list li:before { content: ""; position: absolute; left: 0; top: 0; width: 19px; height: 19px; border-radius: 50%; background: #f8c301; }
.fx-hero-list li:after { content: ""; position: absolute; left: 7px; top: 4px; width: 5px; height: 9px; border: solid #212121; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.fx-hero-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.fx-hero-btn, .fx-hero-btn2 { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 22px; border-radius: 12px; font-size: 16px; font-weight: 700; text-decoration: none !important; transition: background .15s, border-color .15s, transform .1s; }
.fx-hero-btn { background: #f8c301; color: #212121 !important; }
.fx-hero-btn:hover { background: #ffd43a; }
.fx-hero-btn2 { border: 2px solid rgba(255,255,255,.7); color: #fff !important; }
.fx-hero-btn2:hover { border-color: #fff; background: rgba(255,255,255,.08); }
.fx-hero-btn:active, .fx-hero-btn2:active { transform: scale(.98); }
/* pasek zaufania */
.fx-trust { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.fx-trust li { background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fx-trust b { font-size: 15px; color: #212121; }
.fx-trust small { font-size: 12px; color: #6b6b6b; line-height: 1.35; }
.fx-star { color: #f8c301; }
.fx-pays { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.fx-pays i { font-style: normal; font-size: 11px; font-weight: 700; color: #212121; background: #f6f6f6; border: 1px solid #e6e6e6; border-radius: 6px; padding: 2px 6px; }
/* marki */
.fx-marki { padding: 6px 0 4px; }
.fx-marki-h { margin: 0 0 14px !important; font-size: 22px !important; font-weight: 700 !important; color: #212121 !important; text-align: center; text-transform: none !important; }
.fx-marki-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.fx-marka { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 18px 44px 18px 18px; background: #fff; border: 1px solid #e6e6e6; border-radius: 14px;
text-decoration: none !important; transition: border-color .15s, box-shadow .15s, transform .15s; min-height: 92px; box-sizing: border-box; }
.fx-marka b { font-size: 20px; color: #212121; letter-spacing: .01em; }
.fx-marka small { font-size: 13px; color: #6b6b6b; line-height: 1.35; }
.fx-marka:after { content: ""; position: absolute; right: 18px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border: solid #212121; border-width: 2px 2px 0 0; transform: rotate(45deg); transition: right .15s; }
.fx-marka:before { content: ""; position: absolute; left: 18px; right: 18px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: #f8c301; transform: scaleX(0); transition: transform .2s; }
.fx-marka:hover { border-color: #212121; box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-2px); }
.fx-marka:hover:before { transform: scaleX(1); }
.fx-marka:hover:after { right: 14px; }
/* szare tło pod markami zostaje, tylko mniej miejsca */
.grey_section:has(.fx-marki) { padding: 24px 0 !important; }
@media (max-width: 1199px) {
.fx-marki-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fx-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
.fx-hero { min-height: 0; border-radius: 14px; align-items: flex-end; }
.fx-hero:after { background: linear-gradient(180deg, rgba(18,18,18,.55) 0%, rgba(18,18,18,.9) 55%, rgba(18,18,18,.95) 100%); }
.fx-hero-in { padding: 120px 18px 20px; }
.fx-hero-h { font-size: 25px !important; }
.fx-hero-list { grid-template-columns: 1fr; gap: 8px; margin-bottom: 18px; }
.fx-hero-list li { font-size: 14px; }
.fx-hero-btns { flex-direction: column; }
.fx-hero-btn, .fx-hero-btn2 { width: 100%; }
.fx-trust li { padding: 10px 12px; }
.fx-trust b { font-size: 14px; }
.fx-marki-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
.fx-marka { padding: 14px 34px 14px 14px; min-height: 0; }
.fx-marka b { font-size: 17px; }
.fx-marka small { font-size: 12px; }
.fx-marka:after { right: 14px; }
}
@media (max-width: 767px) { .fx-marka:last-child:nth-child(odd) { grid-column: 1 / -1; } }
/* ==========================================
Wspólne drobiazgi (25.10.2026)
========================================== */
/* "Wybierz markę" nie chowa się pod przyklejonym nagłówkiem */
#fx-marki { scroll-margin-top: calc(var(--fx-hh, 140px) + 16px); }
.fx-trust b { text-wrap: balance; }
/* Okna Comarch #cart_tt.tabr: Powiadom o dostępności, Zapytaj, Poleć */
#cart_tt.tabr.fxo-box {
position: fixed !important; left: 50% !important; top: 50% !important; margin: 0 !important; transform: translate(-50%, -50%);
width: min(520px, calc(100vw - 24px)) !important; max-height: calc(100vh - 40px) !important; overflow: auto; box-sizing: border-box;
padding: 26px 26px 22px !important; border-radius: 16px !important; background: #fff !important; animation: none !important;
}
#cart_tt.tabr.fxo-box > .close {
position: absolute !important; right: 14px !important; top: 14px !important; width: 36px !important; height: 36px !important; margin: 0 !important;
border-radius: 10px; background: #f2f2f2 !important; cursor: pointer; z-index: 2;
}
#cart_tt.tabr.fxo-box > .close:before, #cart_tt.tabr.fxo-box > .close:after {
content: "" !important; position: absolute; left: 10px; top: 17px; width: 16px; height: 2px; background: #212121; transform: rotate(45deg); font-size: 0;
}
#cart_tt.tabr.fxo-box > .close:after { transform: rotate(-45deg); }
#cart_tt.tabr.fxo-box > .close:hover { background: #e6e6e6 !important; }
#cart_tt.tabr.fxo-box .cntForm { padding: 0 !important; margin: 0 !important; width: auto !important; float: none !important; }
#cart_tt.tabr.fxo-box h2 { margin: 0 44px 8px 0 !important; font-size: 21px !important; font-weight: 700; color: #212121; text-transform: none; line-height: 1.25; }
#cart_tt.tabr.fxo-box h4 { margin: 0 0 10px !important; font-size: 14px !important; font-weight: 700; color: #4a4a4a; line-height: 1.4; text-transform: none;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding: 0 0 0 12px; border-left: 3px solid #f8c301; }
#cart_tt.tabr.fxo-box .fxo-lead { margin: 0 0 16px; font-size: 14px; color: #6b6b6b; line-height: 1.45; }
#cart_tt.tabr.fxo-box form.fxo p { display: block; margin: 0 0 14px !important; padding: 0 !important; float: none !important; width: auto !important; }
#cart_tt.tabr.fxo-box form.fxo label { display: block !important; float: none !important; width: auto !important; margin: 0 0 6px !important; padding: 0 !important;
font-size: 13px !important; font-weight: 700; color: #212121; text-align: left !important; }
#cart_tt.tabr.fxo-box form.fxo input:not([type=hidden]):not([type=submit]), #cart_tt.tabr.fxo-box form.fxo textarea {
display: block; width: 100% !important; max-width: none !important; height: 46px !important; padding: 0 14px !important; box-sizing: border-box; float: none !important;
font-size: 16px !important; color: #212121; background: #fff !important; border: 1px solid #cfcfcf !important; border-radius: 10px !important; box-shadow: none !important;
}
#cart_tt.tabr.fxo-box form.fxo textarea { height: 110px !important; padding: 12px 14px !important; }
#cart_tt.tabr.fxo-box form.fxo input:focus, #cart_tt.tabr.fxo-box form.fxo textarea:focus { border-color: #212121 !important; box-shadow: 0 0 0 3px rgba(248,195,1,.45) !important; outline: 0; }
#cart_tt.tabr.fxo-box form.fxo p.fx-bad input, #cart_tt.tabr.fxo-box form.fxo p.fx-bad textarea { border-color: #c12e2a !important; background: #fff6f6 !important; }
#cart_tt.tabr.fxo-box .fxo-err { display: block; margin-top: 6px; font-size: 13px; font-weight: 700; color: #c12e2a; }
#cart_tt.tabr.fxo-box .fxo-err:empty { display: none; }
#cart_tt.tabr.fxo-box .legend { font-size: 12px !important; color: #6b6b6b; margin: 0 0 14px !important; }
#cart_tt.tabr.fxo-box input[type=submit] {
display: block; width: 100% !important; height: auto !important; margin: 0 !important; padding: 14px 18px !important; box-sizing: border-box;
border: 0 !important; border-radius: 12px !important; background: #f8c301 !important; color: #212121 !important; font-size: 17px !important; font-weight: 700; cursor: pointer;
}
#cart_tt.tabr.fxo-box input[type=submit]:hover { background: #ffd43a !important; }
#cart_tt.tabr.fxo-box .alert { margin: 12px 0 0 !important; padding: 12px 14px !important; border-radius: 10px !important; font-size: 14px; }
#cart_tt.tabr.fxo-box .alert-success, #cart_tt.tabr.fxo-box .alert.ok { background: #e9f6ee !important; color: #1f7a3c !important; border: 0 !important; }
@media (max-width: 767px) {
#cart_tt.tabr.fxo-box { padding: 20px 16px 16px !important; }
#cart_tt.tabr.fxo-box h2 { font-size: 19px !important; }
}
/* przyciski w kafelkach zamienników na karcie produktu nie wychodzą poza kartę */
.fx-rel .pdr .pCart .btn, .fx-rel .pdr .btn { box-sizing: border-box !important; max-width: 100% !important; }
/* ==========================================
Moje konto (profil-klienta,7) (25.10.2026, v2: tylko CSS)
Bez JavaScriptu: klasa body.page-profile przychodzi z serwera,
więc wygląd jest gotowy od pierwszej klatki, nic nie skacze.
========================================== */
body.page-profile .mainContent > .leftColumn { display: none !important; }
body.page-profile .mainContent > .content { width: 100% !important; float: none !important; max-width: 1040px; margin: 0 auto 30px; padding: 0 !important; }
body.page-profile .mainContent > .content > .page-header { border: 0 !important; margin: 10px 0 16px !important; padding: 0 !important; }
body.page-profile .mainContent > .content > .page-header h1 { margin: 0 !important; font-size: 28px !important; font-weight: 700; color: #212121; text-transform: none; }
/* zakładki */
body.page-profile ul.nav-pills { display: flex !important; flex-wrap: wrap; gap: 4px; margin: 0 0 16px !important; padding: 4px !important; list-style: none;
background: #f6f6f6; border-radius: 12px; text-align: left !important; border: 0 !important; }
body.page-profile ul.nav-pills > li { float: none !important; display: block !important; margin: 0 !important; padding: 0 !important; flex: 0 0 auto; }
body.page-profile ul.nav-pills > li > a { display: block; padding: 9px 14px !important; margin: 0 !important; border-radius: 9px !important; font-size: 14px !important; font-weight: 700;
white-space: nowrap; color: #5a5a5a !important; background: transparent !important; border: 0 !important; text-decoration: none !important; line-height: 1.3; }
body.page-profile ul.nav-pills > li > a br { display: none; }
body.page-profile ul.nav-pills > li > a:after, body.page-profile ul.nav-pills > li > a:before { display: none !important; }
body.page-profile ul.nav-pills > li > a:hover { color: #212121 !important; background: #ececec !important; }
body.page-profile ul.nav-pills > li.active > a { background: #fff !important; color: #212121 !important; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
/* karta treści */
body.page-profile .tabc { background: #fff; border: 1px solid #e6e6e6; border-radius: 16px; padding: 24px !important; float: none !important; width: auto !important; box-sizing: border-box; }
body.page-profile .tabc:empty:after { content: "Nie masz jeszcze żadnych rabatów."; display: block; text-align: center; padding: 20px 0; font-size: 16px; color: #212121; }
body.page-profile .tabc > p:only-child, body.page-profile .tabc .complaint > p:only-child { margin: 0; padding: 26px 10px; text-align: center; font-size: 16px; color: #212121; }
body.page-profile .tabc > p { font-size: 15px; color: #212121; }
/* karty adresów */
body.page-profile .customer-details { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; float: none !important; width: auto !important; }
body.page-profile .customer-details > .clear { display: none !important; }
body.page-profile .customer-details > .address { position: relative; float: none !important; width: auto !important; min-height: 0 !important; height: auto !important; margin: 0 !important;
padding: 18px 18px 60px !important; border: 1px solid #e6e6e6 !important; border-radius: 14px; background: #fff; box-sizing: border-box;
display: grid !important; grid-template-columns: 34px minmax(0, 1fr); gap: 6px 12px; align-items: start; }
body.page-profile .customer-details > .address > .clear { display: none !important; }
body.page-profile .customer-details > .address.da.active { border: 2px solid #212121 !important; background: #fffdf3; }
body.page-profile .customer-details .address .title { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; margin: 0 0 4px !important; padding: 0 !important; position: static !important; }
body.page-profile .customer-details .address.da.active .title:after { content: "Domyślny"; margin-left: auto; font-size: 11px; font-weight: 700; text-transform: uppercase;
letter-spacing: .04em; padding: 3px 8px; border-radius: 99px; background: #f8c301; color: #212121; }
body.page-profile .customer-details .address .title label { margin: 0 !important; padding: 0 !important; font-size: 16px !important; font-weight: 700; color: #212121; position: static !important; }
body.page-profile .customer-details .address .title label:before, body.page-profile .customer-details .address .title label:after { display: none !important; }
body.page-profile .customer-details .address .title input[type=radio] { position: static !important; opacity: 1 !important; margin: 0 !important; width: 18px; height: 18px; accent-color: #212121; }
body.page-profile .customer-details .address .icon { grid-column: 1; float: none !important; width: 34px !important; height: 34px; margin: 0 !important; border-radius: 50%; background: #f6f6f6; display: grid; place-items: center; }
body.page-profile .customer-details .address .icon i { font-size: 15px !important; color: #6b6b6b !important; margin: 0 !important; }
body.page-profile .customer-details .address .content { grid-column: 2; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; font-size: 15px; line-height: 1.55; color: #212121; position: static; }
body.page-profile .customer-details .address .content > div:first-child { font-weight: 700; }
body.page-profile .customer-details .edit-icon { position: absolute !important; left: 18px; bottom: 14px; right: auto !important; top: auto !important; display: inline-flex !important; align-items: center; gap: 6px;
height: 32px; padding: 0 12px; border-radius: 9px; border: 1px solid #cfcfcf; background: #fff; font-size: 13px; font-weight: 700; color: #212121; cursor: pointer; width: auto !important; box-sizing: border-box; }
body.page-profile .customer-details .edit-icon:after { content: "Edytuj"; }
body.page-profile .customer-details .edit-icon i { font-size: 12px !important; color: #212121 !important; margin: 0 !important; }
body.page-profile .customer-details .edit-icon:hover { border-color: #212121; }
body.page-profile .customer-details .show-add-delivery-address { float: none !important; width: auto !important; height: auto !important; margin: 0 !important;
display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 170px; padding: 18px !important; box-sizing: border-box;
border: 2px dashed #cfcfcf !important; border-radius: 14px !important; background: #fff !important; color: #212121 !important; cursor: pointer;
font-size: 15px !important; font-weight: 700; text-align: center; box-shadow: none !important; transition: border-color .15s, background .15s; }
body.page-profile .customer-details .show-add-delivery-address i, body.page-profile .customer-details .show-add-delivery-address .glyphicon, body.page-profile .customer-details .show-add-delivery-address [class*="fa-"] { display: none !important; }
body.page-profile .customer-details .show-add-delivery-address:before { content: "+"; width: 40px; height: 40px; border-radius: 50%; background: #f8c301; display: grid; place-items: center; font-size: 24px; line-height: 1; font-weight: 700; }
body.page-profile .customer-details .show-add-delivery-address:hover { border-color: #212121 !important; background: #fffdf3 !important; }
/* Wyloguj (na dole karty) */
body.page-profile .tabc > br { display: none; }
body.page-profile #signoutForm { margin: 20px 0 0 !important; padding-top: 18px; border-top: 1px solid #e6e6e6; }
body.page-profile #signoutForm input[type=submit], body.page-profile #signoutForm .logout {
height: 40px !important; padding: 0 16px !important; border-radius: 10px !important; border: 1px solid #cfcfcf !important; background: #fff !important; color: #212121 !important;
font-size: 14px !important; font-weight: 700; cursor: pointer; text-decoration: none !important; box-shadow: none !important; width: auto !important; }
body.page-profile #signoutForm input:hover { border-color: #212121 !important; }
/* okna edycji adresu */
body.page-profile .popup-dialog { z-index: 2000 !important; background: rgba(20,20,20,.55); }
body.page-profile .popup-dialog .modal-box { border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.3); padding: 24px !important; max-height: calc(100vh - 40px); overflow: auto;
width: 540px; max-width: calc(100vw - 24px); box-sizing: border-box; }
body.page-profile .popup-dialog .main-title { font-size: 20px; font-weight: 700; color: #212121; }
body.page-profile .popup-dialog .modal-box .input-group { width: auto !important; float: none !important; margin: 0 0 12px !important; display: flex; flex-direction: column-reverse; position: relative; }
body.page-profile .popup-dialog .modal-box .input-group label { position: static !important; transform: none !important; font-size: 13px !important; font-weight: 700; color: #212121 !important; margin: 0 0 5px !important; padding: 0 !important; opacity: 1 !important; }
body.page-profile .popup-dialog .modal-box input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]), body.page-profile .popup-dialog .modal-box select {
width: 100% !important; height: 44px !important; padding: 0 12px !important; border: 1px solid #cfcfcf !important; border-radius: 10px !important; font-size: 15px !important; box-sizing: border-box; background: #fff !important; }
body.page-profile .popup-dialog .modal-box input:focus { border-color: #212121 !important; box-shadow: 0 0 0 3px rgba(248,195,1,.45) !important; outline: 0; }
body.page-profile .popup-dialog .modal-box .btn, body.page-profile .popup-dialog .modal-box input[type=submit], body.page-profile .popup-dialog .modal-box button:not(.close-button) {
display: block; width: 100% !important; height: auto !important; margin: 8px 0 0 !important; padding: 12px 16px !important; box-sizing: border-box; border: 0 !important; border-radius: 12px !important;
background: #f8c301 !important; color: #212121 !important; font-size: 16px !important; font-weight: 700; cursor: pointer; }
body.page-profile .popup-dialog .close-button { width: 36px; height: 36px; line-height: 36px; text-align: center; border-radius: 10px; cursor: pointer; }
body.page-profile .popup-dialog .close-button:hover { background: #f2f2f2; }
/* nagłówki sekcji */
body.page-profile .tabc p.formHeader, body.page-profile .tabc h2, body.page-profile .tabc .consents-label {
font-size: 19px !important; font-weight: 700; color: #212121; margin: 0 0 14px !important; padding: 0 !important; background: none !important; border: 0 !important; text-transform: none; line-height: 1.3; }
body.page-profile .tabc h2 br { display: none; }
/* formularze: e-mail, hasło, nick */
body.page-profile .tabc .customerPassword { margin-top: 26px; padding-top: 22px; border-top: 1px solid #e6e6e6; }
body.page-profile .tabc form ul { list-style: none; margin: 0; padding: 0; max-width: 460px; }
body.page-profile .tabc form ul li, body.page-profile .tabc form > p { margin: 0 0 14px; float: none !important; width: auto !important; max-width: 460px; }
body.page-profile .tabc form label { display: block; float: none !important; width: auto !important; margin: 0 0 6px !important; font-size: 13px !important; font-weight: 700; color: #212121; text-align: left !important; }
body.page-profile .tabc form input:not([type=submit]):not([type=hidden]):not([type=checkbox]):not([type=radio]) { display: block; width: 100% !important; max-width: none !important; height: 46px !important;
padding: 0 14px !important; box-sizing: border-box; border: 1px solid #cfcfcf !important; border-radius: 10px !important; font-size: 16px !important; background: #fff !important; box-shadow: none !important; }
body.page-profile .tabc form input:focus { border-color: #212121 !important; box-shadow: 0 0 0 3px rgba(248,195,1,.45) !important; outline: 0; }
body.page-profile .tabc form ul li > span { display: block; font-size: 15px; font-weight: 700; color: #212121; }
body.page-profile .tabc input[type=submit].btn, body.page-profile .tabc .add-complaint {
height: auto !important; padding: 12px 20px !important; border: 0 !important; border-radius: 12px !important; background: #f8c301 !important; color: #212121 !important;
font-size: 15px !important; font-weight: 700; cursor: pointer; box-shadow: none !important; text-decoration: none !important; display: inline-flex; align-items: center; gap: 6px; }
body.page-profile .tabc input[type=submit].btn:hover, body.page-profile .tabc .add-complaint:hover { background: #ffd43a !important; }
body.page-profile .tabc .add-complaint br { display: none; }
/* zgody */
body.page-profile .all-consents-box .title-bar h2 { font-size: 22px !important; margin-bottom: 18px !important; }
body.page-profile .consents-box { margin: 0 0 22px; }
body.page-profile .consents-box .consents-label { font-size: 13px !important; text-transform: uppercase; letter-spacing: .05em; color: #6b6b6b; margin-bottom: 10px !important; }
body.page-profile .consents-box:has(.to-acceptation:empty) { display: none; }
body.page-profile .consents-list { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; gap: 10px; }
body.page-profile .consents-list > li { margin: 0 !important; padding: 16px 18px !important; border: 1px solid #e6e6e6 !important; border-radius: 14px; background: #fff;
display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "warn warn" "name btn" "date btn"; gap: 6px 16px; align-items: center; }
body.page-profile .consents-list > li > br { display: none; }
body.page-profile .consents-list .withdraw-warning { grid-area: warn; margin: 0 !important; font-size: 12px !important; color: #8f201d !important; background: #fff3f2; border-radius: 8px; padding: 6px 10px; justify-self: start; }
body.page-profile .consents-list .withdraw-warning .fa { color: #c12e2a !important; margin-right: 4px; }
body.page-profile .consents-list .withdraw-warning span:not(.fa) { color: #8f201d !important; }
body.page-profile .consents-list > li > .switch-name.tos-name { grid-area: name; font-size: 14px; line-height: 1.5; color: #212121; }
body.page-profile .consents-list .switch-name a { color: #212121; font-weight: 700; text-decoration: underline; }
body.page-profile .consents-list > li > p.switch-name { grid-area: date; margin: 0 !important; font-size: 12px; color: #6b6b6b; }
body.page-profile .consents-list .accept-date strong { color: #212121; }
body.page-profile .consents-list > li > .consent-withdraw { grid-area: btn; align-self: center; }
body.page-profile .consents-list .consent-withdraw {
height: 38px !important; padding: 0 14px !important; margin: 0 !important; border-radius: 10px !important; border: 1px solid #cfcfcf !important; background: #fff !important; color: #212121 !important;
font-size: 13px !important; font-weight: 700; cursor: pointer; box-shadow: none !important; white-space: nowrap; }
body.page-profile .consents-list .consent-withdraw:hover { border-color: #c12e2a !important; color: #c12e2a !important; }
/* newsletter: kanały (E-mail) w środku zgody */
body.page-profile .consents-list > li > ul { grid-column: 1 / -1; grid-row: 3; list-style: none; margin: 4px 0 0 !important; padding: 0 !important; }
body.page-profile .consents-list > li > ul > li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 10px; background: #f6f6f6; flex-direction: row-reverse; }
body.page-profile .consents-list > li > ul > li > p.switch-name { margin: 0 !important; font-size: 14px; font-weight: 700; color: #212121; }
body.page-profile .consents-list > li > ul > li .accept-date { display: block; font-size: 12px; font-weight: 400; color: #6b6b6b; }
/* reklamacje */
body.page-profile .profile-header { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 14px; }
body.page-profile .profile-header h2 { flex: 1 1 auto; margin: 0 !important; }
body.page-profile .profile-header .complaint-scenario { flex-basis: 100%; margin: 0; font-size: 13px; color: #6b6b6b; }
body.page-profile .header-tabs { flex-basis: 100%; display: flex; gap: 6px; }
body.page-profile .header-tabs a { padding: 7px 12px; border-radius: 99px; border: 1px solid #e6e6e6; font-size: 13px; font-weight: 700; color: #5a5a5a !important; text-decoration: none !important; }
body.page-profile .header-tabs a.active { background: #212121; border-color: #212121; color: #fff !important; }
/* tabele (opinie, historia, zamówienia) */
body.page-profile .tabc table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #e6e6e6; border-radius: 12px; overflow: hidden; font-size: 14px; margin: 0; }
body.page-profile .tabc table th { background: #f6f6f6 !important; color: #5a5a5a; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; padding: 10px 12px !important; border: 0 !important; text-align: left; }
body.page-profile .tabc table td { padding: 12px !important; border: 0 !important; border-top: 1px solid #eee !important; background: #fff !important; vertical-align: middle; }
@media (max-width: 767px) {
body.page-profile .mainContent > .content > .page-header h1 { font-size: 24px !important; }
body.page-profile ul.nav-pills > li > a { padding: 8px 11px !important; font-size: 13px !important; }
body.page-profile .tabc { padding: 16px !important; border-radius: 14px; }
body.page-profile .customer-details { grid-template-columns: 1fr; }
body.page-profile .consents-list > li { grid-template-columns: 1fr; grid-template-areas: "warn" "name" "date" "btn"; }
body.page-profile .consents-list > li > .consent-withdraw { justify-self: start; }
body.page-profile .tabc table { display: block; overflow-x: auto; }
}
/* ===== FOX BLOK KONIEC ===== */
/* ===== 26.10.2026: strona "Produkty" bez logotypów marek + przełącznik "Tylko ze zdjęciem" ===== */
body.page-id-3 #products .home_categories { margin: 6px 0 24px; }
body.page-id-3 #products .home_categories ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 0 !important; padding: 0 !important; list-style: none; }
body.page-id-3 #products .home_categories li.cat { float: none !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; background: none !important; }
body.page-id-3 #products .home_categories li.cat > a:first-child, body.page-id-3 #products .home_categories .prImg { display: none !important; }
body.page-id-3 #products .home_categories li.cat > span { display: block; margin: 0 !important; padding: 0 !important; background: none !important; height: auto !important; }
body.page-id-3 #products .home_categories li.cat > span a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 64px; box-sizing: border-box; padding: 16px 18px !important;
border: 1px solid #e6e6e6; border-radius: 14px; background: #fff; color: #212121 !important; font-size: 17px !important; font-weight: 700; letter-spacing: .02em; text-decoration: none !important; transition: border-color .15s, box-shadow .15s; }
body.page-id-3 #products .home_categories li.cat > span a:after { content: ""; flex: 0 0 auto; width: 9px; height: 9px; border: solid #212121; border-width: 2px 2px 0 0; transform: rotate(45deg); }
body.page-id-3 #products .home_categories li.cat > span a:hover { border-color: #212121; box-shadow: 0 6px 20px rgba(0,0,0,.06); }
body.page-id-3 #products .home_categories li.cat > span a:hover:after { border-color: #f8c301; }
body.page-id-3 #products.category-products > .grey .fxl-photo { order: 2; display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 700; color: #212121; cursor: pointer; user-select: none; white-space: nowrap; }
body.page-id-3 #products.category-products > .grey .pager { order: 3; }
.fxl-sw { width: 38px; height: 22px; border-radius: 99px; background: #cfcfcf; position: relative; transition: background .15s; flex: 0 0 auto; }
.fxl-sw:after { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.fxl-sw.is-on { background: #212121; }
.fxl-sw.is-on:after { transform: translateX(16px); }
/* miejsce na przełącznik zarezerwowane od początku (osobny rząd na dole paska), nic nie skacze */
body.page-id-3:has(#filterProducts input[name="PHOTO"]) #products.category-products > .grey { position: relative; padding-bottom: 50px !important; }
body.page-id-3 #products.category-products > .grey .fxl-photo { position: absolute; left: 14px; bottom: 14px; }
/* kręciołek na żółtym przycisku w liście produktów ciemny, żeby był widoczny */
body.page-id-3 #products .pdr .addBtn.fx-loading::after { border-color: rgba(0,0,0,.2); border-top-color: #212121; }
body.page-id-3 #products .pdr .pCart .addBtn.fx-loading { color: transparent !important; }
/* ===== KONIEC 26.10.2026 ===== */
/* ===== Ulubione: małe serduszko w rogu zdjęcia (karta produktu i lista) 26.10.2026 =====
Ciemny kwadrat (nie 100% czarny) z żółtym sercem, na hover żółty kwadrat i czarne serce.
Widać go na każdym tle zdjęcia, jasnym i ciemnym. */
/* karta produktu: zanim skrypt przeniesie serduszko na zdjęcie, nie zajmuje miejsca obok koszyka */
.product.pl.fxp #pCart > .addWishlistBtn { position: absolute !important; opacity: 0; pointer-events: none; width: 0 !important; min-height: 0 !important; overflow: hidden; border: 0 !important; }
.product.pl.fxp .leftFoto { position: relative; }
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav, body.page-id-3 #products .pdr .pCart .wishlistAdd {
position: absolute !important; z-index: 3; display: flex !important; align-items: center; justify-content: center;
width: 40px !important; height: 40px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important;
border: 0 !important; border-radius: 10px !important; background: rgba(33,33,33,.82) !important; box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
color: #f8c301 !important; font-size: 0 !important; line-height: 1 !important; text-decoration: none !important; cursor: pointer; transition: background .15s, color .15s;
}
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav { top: 12px; right: 12px; width: 44px !important; height: 44px !important; }
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav i, body.page-id-3 #products .pdr .pCart .wishlistAdd i { font-size: 19px !important; font-weight: 900 !important; margin: 0 !important; color: inherit !important; }
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav:hover, body.page-id-3 #products .pdr .pCart .wishlistAdd:hover,
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav:focus-visible, body.page-id-3 #products .pdr .pCart .wishlistAdd:focus-visible { background: #f8c301 !important; color: #212121 !important; }
/* lista: w prawym górnym rogu miniatury */
body.page-id-3 #products .pdr .pCart .wishlistAdd { top: 20px; left: 112px; width: 30px !important; height: 30px !important; border-radius: 8px !important; }
body.page-id-3 #products .pdr .pCart .wishlistAdd i { font-size: 14px !important; }
@media (max-width: 767px) {
body.page-id-3 #products .pdr .pCart .wishlistAdd { top: 16px; left: 78px; width: 28px !important; height: 28px !important; }
.product.pl.fxp .leftFoto > .addWishlistBtn.fx-fav { top: 8px; right: 8px; }
}
/* ===== KONIEC ulubione ===== */
/* ===== Karta produktu bez skoku: miejsce na zdjęcie i miniatury zarezerwowane od początku (27.10.2026) ===== */
.product.fxp #prodFoto { aspect-ratio: 4 / 3; overflow: hidden; }
.product.fxp #prodFoto:not(.slick-initialized) > a:not(:first-child) { display: none !important; }
.product.fxp #prodFoto:not(.slick-initialized) > a:first-child, .product.fxp #prodFoto .slick-list, .product.fxp #prodFoto .slick-track, .product.fxp #prodFoto .slick-slide { height: 100% !important; }
.product.fxp #prodFoto:not(.slick-initialized) > a:first-child { display: flex !important; align-items: center; justify-content: center; }
.product.fxp #prodFoto img { width: 100% !important; height: 100% !important; max-height: none !important; object-fit: contain; }
.product.fxp .leftFoto .miniatures { height: 66px; overflow: hidden; }