/* CrazyBubble – custom overrides (ładowany na końcu) */
/* Wymuszenie Dosis niezależnie od settings.fontFamily z panelu */
body {
font-family: 'Dosis', sans-serif !important;
}
main
{
overflow-x: hidden;
}
.gridMainElement:has(.newsletter1-wrapper) {
margin-bottom: 0;
}
/* Banner promo – wyśrodkowany blok tekstu, bez przycinania */
.bannerPromo__wrapper .bannerPromo__image,
.bannerPromo__wrapper .bannerPromo__image img {
border-radius: 15px !important;
overflow: hidden;
}
.bannerPromo__wrapper .bannerPromo__texts {
left: 50%;
right: auto;
transform: translateX(-50%);
width: calc(100% - 40px);
max-width: calc(100% - 40px);
max-height: none;
overflow: visible;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.bannerPromo__wrapper .bannerPromo__info.bannerPromo__info-bg {
margin-left: auto;
margin-right: auto;
max-width: 100%;
width: fit-content;
text-align: center;
border-radius: 10px !important;
box-sizing: border-box;
background-color: rgba(0, 0, 0, 0.45);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
}
.bannerPromo__wrapper .bannerPromo__title,
.bannerPromo__wrapper .bannerPromo__title.bannerPromo__title__small {
text-align: center;
text-overflow: unset;
overflow: visible;
white-space: normal;
-webkit-line-clamp: unset;
-webkit-box-orient: unset;
display: block;
max-height: none;
letter-spacing: 0;
font-family: 'Dosis';
font-weight: 600;
}
.bannerPromo__wrapper .bannerPromo__title b,
.bannerPromo__wrapper .bannerPromo__title strong {
display: block;
font-family: bogart, sans-serif;
font-weight: 900;
}
.bannerPromo__wrapper .bannerPromo__texts .desktopLink {
margin-left: auto;
margin-right: auto;
}
/* Home slider – peeki L/P + pasek tytułów (karuzela CSS order, bez Swiper loop) */
.gridMainElement:has(.cb-banner-shell) {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
margin-bottom: 0;
overflow: hidden;
}
.cb-banner-shell {
width: 100%;
margin-bottom: 50px;
}
#banner-2-1 {
width: 100%;
max-width: none;
height: auto;
margin-bottom: 0;
padding: 0 7%;
box-sizing: border-box;
overflow: hidden;
position: relative;
}
/* Track: flex + order – zawsze [prev][active][next] */
#banner-2-1.cb-order-carousel .swiper-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: stretch;
gap: 16px;
width: 100%;
will-change: transform;
transform: translate3d(0, 0, 0);
}
#banner-2-1.cb-order-carousel .swiper-slide {
flex: 0 0 100%;
width: 100%;
max-width: 100%;
height: auto;
box-sizing: border-box;
opacity: 0;
margin: 0 !important;
position: relative;
transition: opacity 650ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
#banner-2-1.cb-order-carousel .swiper-slide.is-active,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-active {
opacity: 1;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-prev,
#banner-2-1.cb-order-carousel .swiper-slide.is-next,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next {
opacity: 0.45;
cursor: pointer;
pointer-events: auto;
}
/* Peeki: warstwa klikalna (wrapper ma pointer-events:none, by nie wchodzić w link) */
#banner-2-1.cb-order-carousel .swiper-slide.is-prev::after,
#banner-2-1.cb-order-carousel .swiper-slide.is-next::after,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev::after,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next::after {
content: '';
position: absolute;
inset: 0;
z-index: 5;
cursor: pointer;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-fading-in {
opacity: 1;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-fading-out {
opacity: 0.45;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-prev .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.is-next .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next .banner2__wrapper {
pointer-events: none;
}
#banner-2-1.cb-banner-xk .banner2__wrapper {
width: 100%;
border-radius: 10px;
overflow: hidden;
display: block;
position: relative;
}
/* Desktop: 1800×750 */
#banner-2-1.cb-banner-xk .banner2__image,
#banner-2-1.cb-banner-xk .banner2__image.lazy {
width: 100%;
aspect-ratio: 1800 / 750;
display: block;
background-color: transparent;
}
#banner-2-1.cb-banner-xk .banner2__image img {
display: block;
width: 100%;
height: 100%;
max-width: 100%;
max-height: none;
object-fit: contain;
object-position: center center;
vertical-align: middle;
}
#banner-2-1.cb-banner-xk .banner2__info,
#banner-2-1.cb-banner-xk .desktopLink {
display: none !important;
}
/* Pasek tytułów POD grafiką */
.cb-banner-shell > .cb-banner-nav {
position: relative;
z-index: 10;
width: min(86%, 1180px);
margin: 10px auto 0;
display: flex;
align-items: center;
gap: 0;
height: 36px;
max-height: 36px;
background: rgba(245, 245, 247, 0.92);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-radius: 8px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
overflow: hidden;
box-sizing: border-box;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-prev,
.cb-banner-shell > .cb-banner-nav .swiper-button-next,
.cb-banner-shell > .cb-banner-nav .swiper-button-prev.bar,
.cb-banner-shell > .cb-banner-nav .swiper-button-next.bar {
position: static !important;
width: 36px !important;
min-width: 36px !important;
max-width: 36px !important;
height: 36px !important;
min-height: 36px !important;
max-height: 36px !important;
margin: 0 !important;
top: auto !important;
left: auto !important;
right: auto !important;
bottom: auto !important;
flex-shrink: 0;
background: transparent !important;
color: #1a1a1a;
opacity: 1 !important;
pointer-events: auto !important;
border: none;
border-radius: 0;
cursor: pointer;
--swiper-navigation-size: 12px;
--swiper-navigation-sides-offset: 0;
--swiper-navigation-top-offset: 0;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-prev.swiper-button-disabled,
.cb-banner-shell > .cb-banner-nav .swiper-button-next.swiper-button-disabled,
.cb-banner-shell > .cb-banner-nav .swiper-button-prev.swiper-button-lock,
.cb-banner-shell > .cb-banner-nav .swiper-button-next.swiper-button-lock {
opacity: 1 !important;
pointer-events: auto !important;
cursor: pointer !important;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-prev::after,
.cb-banner-shell > .cb-banner-nav .swiper-button-next::after {
font-size: 12px !important;
font-weight: 700;
color: #1a1a1a;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-prev:hover,
.cb-banner-shell > .cb-banner-nav .swiper-button-next:hover {
background: rgba(0, 0, 0, 0.05) !important;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-pause {
position: static !important;
width: 36px !important;
min-width: 36px !important;
height: 36px !important;
min-height: 36px !important;
max-height: 36px !important;
aspect-ratio: auto !important;
margin: 0 !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
flex-shrink: 0;
display: flex !important;
align-items: center;
justify-content: center;
background: transparent !important;
border: none !important;
border-left: 1px solid rgba(0, 0, 0, 0.08) !important;
border-radius: 0 !important;
cursor: pointer;
color: #1a1a1a;
opacity: 1 !important;
padding: 0 !important;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-pause svg {
width: 14px;
height: 14px;
fill: #1a1a1a;
}
.cb-banner-shell .cb-banner-nav__tabs {
display: flex;
flex: 1;
min-width: 0;
height: 100%;
align-items: stretch;
}
.cb-banner-shell .cb-banner-nav__tab {
position: relative;
flex: 1;
min-width: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 0 10px;
border: none;
border-left: 1px solid rgba(0, 0, 0, 0.06);
background: transparent;
color: #3a3a3a;
font-size: 13px;
font-weight: 500;
line-height: 1.2;
text-align: center;
cursor: pointer;
transition: background 0.2s ease, color 0.2s ease;
}
.cb-banner-shell .cb-banner-nav__tab:first-child {
border-left: none;
}
.cb-banner-shell .cb-banner-nav__tab-label {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 100%;
line-height: 1.2;
}
.cb-banner-shell .cb-banner-nav__tab.is-active {
background: rgba(255, 255, 255, 0.95);
color: #111;
font-weight: 600;
}
.cb-banner-shell .cb-banner-nav__tab-progress {
position: absolute;
left: 0;
bottom: 0;
height: 2px;
width: 0;
background: #FF69C9;
border-radius: 0;
}
.cb-banner-shell .cb-banner-nav__tab.is-active .cb-banner-nav__tab-progress {
animation: cb-banner-progress 8s linear forwards;
}
.cb-banner-shell .cb-banner-nav__tab.is-active.is-paused .cb-banner-nav__tab-progress {
animation-play-state: paused;
}
@keyframes cb-banner-progress {
from { width: 0; }
to { width: 100%; }
}
@media screen and (max-width: 1199px) and (min-width: 990px) {
.cb-banner-shell > .cb-banner-nav {
height: auto;
min-height: 36px;
max-height: 48px;
}
.cb-banner-shell > .cb-banner-nav .swiper-button-prev,
.cb-banner-shell > .cb-banner-nav .swiper-button-next,
.cb-banner-shell > .cb-banner-nav .swiper-button-prev.bar,
.cb-banner-shell > .cb-banner-nav .swiper-button-next.bar,
.cb-banner-shell > .cb-banner-nav .swiper-button-pause {
height: 100% !important;
max-height: 48px !important;
}
.cb-banner-shell .cb-banner-nav__tab {
padding: 4px 8px;
}
.cb-banner-shell .cb-banner-nav__tab-label {
white-space: normal;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
line-height: 1.2;
max-height: 2.4em;
}
}
/* Kropki – tylko mobile */
.cb-banner-dots {
display: none;
align-items: center;
justify-content: center;
gap: 8px;
margin: 12px auto 0;
padding: 0;
}
.cb-banner-dots__dot {
width: 8px;
height: 8px;
padding: 0;
border: none;
border-radius: 50%;
background: rgba(0, 0, 0, 0.18);
cursor: pointer;
transition: background 0.2s ease, transform 0.2s ease;
}
.cb-banner-dots__dot.is-active {
background: #ff4da6;
transform: scale(1.15);
}
/* <990px: jeden slide, swipe, kropki, 990×600 */
@media screen and (max-width: 989px) {
.gridMainElement:has(.cb-banner-shell) {
overflow: visible;
}
.recommended-products1 .recommended-products-border
{
margin: 0 0 50px;
}
.cb-banner-shell {
padding: 0 15px;
box-sizing: border-box;
margin-bottom: 15px;
}
.cb-banner-shell > .cb-banner-nav {
display: none !important;
}
.cb-banner-shell > .cb-banner-dots {
display: flex;
}
#banner-2-1 {
overflow: hidden;
border-radius: 10px;
padding: 0;
touch-action: pan-y;
cursor: grab;
user-select: none;
-webkit-user-select: none;
}
#banner-2-1.is-dragging {
cursor: grabbing;
}
#banner-2-1.cb-banner-xk img,
#banner-2-1.cb-banner-xk a,
#banner-2-1.cb-banner-xk .banner2__wrapper {
-webkit-user-drag: none;
user-drag: none;
-webkit-user-select: none;
user-select: none;
}
#banner-2-1.cb-order-carousel .swiper-wrapper {
gap: 12px;
}
#banner-2-1.cb-order-carousel .swiper-slide {
opacity: 0;
}
/* Active + sąsiedzi zawsze widoczni (clip przez overflow) – bez pustki w animacji */
#banner-2-1.cb-order-carousel .swiper-slide.is-active,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-active,
#banner-2-1.cb-order-carousel .swiper-slide.is-prev,
#banner-2-1.cb-order-carousel .swiper-slide.is-next,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next {
opacity: 1;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-prev,
#banner-2-1.cb-order-carousel .swiper-slide.is-next,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next {
pointer-events: none;
cursor: default;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-prev::after,
#banner-2-1.cb-order-carousel .swiper-slide.is-next::after,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev::after,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next::after {
display: none;
}
#banner-2-1.cb-order-carousel .swiper-slide.is-prev .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.is-next .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-prev .banner2__wrapper,
#banner-2-1.cb-order-carousel .swiper-slide.swiper-slide-next .banner2__wrapper {
pointer-events: none;
}
#banner-2-1.cb-banner-xk .banner2__wrapper {
border-radius: 10px;
}
#banner-2-1.cb-banner-xk .banner2__image,
#banner-2-1.cb-banner-xk .banner2__image.lazy {
aspect-ratio: 990 / 600;
}
#banner-2-1.cb-banner-xk .banner2__image img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
/* Filtry – ukryj trigger tytułu */
.product-list__filters-trigger.display-details__title {
display: none !important;
}
.product-item .product-flags {
z-index: 5 !important;
position: absolute;
}
/* Ostatnio przeglądane na PD – ten sam wygląd co kafle recommended / home */
.productDetails-recent--recentList__item {
border: none !important;
padding: 0 !important;
padding-bottom: 0 !important;
height: auto !important;
min-height: 0 !important;
background: transparent !important;
box-sizing: border-box;
}
.productDetails-recent--recentList__item .product-item,
.productDetails-recent--recentList__item .product-item:not(.product-item-pl) {
width: 100% !important;
max-width: 100% !important;
display: block !important;
}
.productDetails-recent--recentList__item .product-item__link {
height: auto !important;
aspect-ratio: 1 / 1 !important;
max-height: none !important;
}
.productDetails-recent .swiper-button-next,
.productDetails-recent .swiper-button-prev {
z-index: 6;
}
.product-item:not(.product-item-pl) .product-item__description {
padding: 10px 5px;
}
.swiper-slide.sliderItem {
border-radius: 8px !important;
overflow: hidden;
}
/* PD: kwadratowy kontener galerii – radius widać przy object-fit: contain */
.productDetails-images--container:not(:has(iframe)):not(:has(video)) {
aspect-ratio: 1 / 1 !important;
width: 100% !important;
height: auto !important;
max-height: none !important;
border-radius: 10px !important;
overflow: hidden !important;
display: flex !important;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.productDetails-images--image {
border-radius: 10px !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain !important;
object-position: center center;
}
/* Lightbox / fullscreen – bez wymuszonego 1:1 */
.opened-gallery .productDetails-images--container,
.productDetails-images.opened-gallery .productDetails-images--container {
aspect-ratio: auto !important;
height: 100vh !important;
max-height: 100vh !important;
border-radius: 0 !important;
}
.productDetails-setList--set,
.productDetails-setList--recentList,
.productDetails-setList--relatedList,
.productDetails-recent--set,
.productDetails-recent--recentList,
.productDetails-recent--relatedList,
.productDetails-related--set,
.productDetails-related--recentList,
.productDetails-related--relatedList {
padding: 10px;
}
/* ========== Product tiles – radius, shadow, hover ========== */
.product-item__placeholder,
.product-item__placeholder-third {
overflow: visible;
z-index: 0;
isolation: isolate;
}
.product-item,
.product-item:not(.product-item-pl),
.product-item-pl,
.product-item-third,
.productsList__gridView-js .product-item-third,
.product-list__gridView-js .product-item-third,
.product-item__placeholder .product-item,
.rndA.product-item {
/* stałe 10px – settings.roundedType=0 daje 0*16px */
border-radius: 10px !important;
overflow: visible !important;
box-sizing: border-box;
background-color: inherit;
z-index: 0 !important;
transform: none !important;
/* stałe rozmycie; przezroczystość 0 → 0.1 na hover (bez skoku layoutu) */
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0) !important;
transition: box-shadow 0.2s ease !important;
}
.product-item:hover,
.product-item:focus-within,
.product-item.cb-show-second,
.product-item.product-item-rec_hover:hover,
.product-item.product-item-rec_hover:focus-within,
.bannerPromo__products .product-item:hover,
.product-item-pl:hover,
.product-item-pl:focus-within,
.product-item-third:hover,
.product-item-third:focus-within,
.productsList__gridView-js .product-item-third:hover,
.productsList__gridView-js .product-item-third:focus-within,
.product-list__gridView-js .product-item-third:hover,
.product-list__gridView-js .product-item-third:focus-within,
.productsList__listView-js .product-item-third:hover,
.product-list__listView-js .product-item-third:hover {
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1) !important;
z-index: 1 !important;
transform: none !important;
scale: none !important;
}
@media screen and (min-width: 769px) {
.productsList__gridView-js .product-item-third:hover,
.productsList__gridView-js .product-item-third:focus-within,
.product-list__gridView-js .product-item-third:hover,
.product-list__gridView-js .product-item-third:focus-within,
.productsList__gridView-js .product-item-pl:hover,
.productsList__gridView-js .product-item-pl:focus-within,
.product-list__gridView-js .product-item-pl:hover,
.product-list__gridView-js .product-item-pl:focus-within,
.product-item-pl:hover,
.product-item-pl:focus-within,
.product-item-third:hover,
.product-item-third:focus-within {
position: relative !important;
left: 0 !important;
top: 0 !important;
right: auto !important;
bottom: auto !important;
width: calc(100% - 32px) !important;
max-width: calc(100% - 32px) !important;
height: auto !important;
transform: none !important;
scale: none !important;
border-radius: 10px !important;
}
.product-item-pl:hover::before,
.product-item-pl:focus-within::before,
.product-item-third:hover::before,
.product-item-third:focus-within::before,
.productsList__gridView-js .product-item-third:hover::before,
.productsList__gridView-js .product-item-third:focus-within::before,
.product-list__gridView-js .product-item-third:hover::before,
.product-list__gridView-js .product-item-third:focus-within::before {
content: none !important;
display: none !important;
}
/* Sztywna wysokość placeholdera = banner nie skacze przy hover */
.productsList__gridView-js .product-item__placeholder,
.product-list__gridView-js .product-item__placeholder {
height: 500px !important;
min-height: 500px !important;
margin-bottom: 40px !important;
box-sizing: border-box;
overflow: visible;
}
/* Hover nie może dorzucać wysokości (opis / phantom / koszyk) */
.productsList__gridView-js .product-item-third:hover .product-item__shortDescription,
.productsList__gridView-js .product-item-third:focus-within .product-item__shortDescription,
.product-list__gridView-js .product-item-third:hover .product-item__shortDescription,
.product-list__gridView-js .product-item-third:focus-within .product-item__shortDescription,
.productsList__gridView-js .product-item-third:hover .product-item__phantom,
.productsList__gridView-js .product-item-third:focus-within .product-item__phantom,
.product-list__gridView-js .product-item-third:hover .product-item__phantom,
.product-list__gridView-js .product-item-third:focus-within .product-item__phantom {
height: 0 !important;
max-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
visibility: hidden !important;
}
}
/* Miniatura / kafelek: zawsze kwadrat 1:1 – radius widać przy contain */
.product-item .product-item__link {
width: 100% !important;
height: auto !important;
max-height: none !important;
aspect-ratio: 1 / 1 !important;
}
.product-item .product-item__image,
.product-item-third .product-item__image,
.productsList__gridView-js .product-item-third .product-item__image,
.product-list__gridView-js .product-item-third .product-item__image {
position: relative;
width: 100% !important;
max-width: 100% !important;
height: 100% !important;
aspect-ratio: 1 / 1 !important;
margin: 5px auto 0 !important;
display: flex !important;
align-items: center;
justify-content: center;
overflow: hidden !important;
border-radius: 8px !important;
box-sizing: border-box;
}
.product-item .product-item__image > img,
.product-item .product-item__image > img.product-item__image--first,
.product-item .product-item__image > img.product-item__image--second,
.product-item .product-item__image > img:nth-of-type(1),
.product-item .product-item__image > img:nth-of-type(2) {
border-radius: 8px !important;
}
.product-item .product-item__image > img.product-item__image--first,
.product-item .product-item__image > img:nth-of-type(1) {
position: relative;
z-index: 1;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain;
object-position: center center;
margin-top: 0;
border-radius: 8px !important;
opacity: 1 !important;
visibility: visible !important;
transition: opacity 0.25s ease !important;
}
.product-item .product-item__image > img.product-item__image--second,
.product-item .product-item__image > img:nth-of-type(2) {
position: absolute !important;
left: 0 !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain;
object-position: center center;
transform: none !important;
border-radius: 8px !important;
z-index: 0;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
display: block !important;
transition: opacity 0.25s ease, visibility 0.25s ease !important;
}
/* Prosty swap 1↔2 na hover (bez flipa) */
.product-item.cb-show-second .product-item__image > img.product-item__image--first,
.product-item.cb-show-second .product-item__image > img:nth-of-type(1),
.product-item:hover .product-item__image.second-image-js > img.product-item__image--first,
.product-item:hover .product-item__image.second-image-js > img:nth-of-type(1),
.product-item.hover:hover .product-item__image > img:nth-of-type(1) {
opacity: 0 !important;
visibility: hidden !important;
}
.product-item.cb-show-second .product-item__image > img.product-item__image--second,
.product-item.cb-show-second .product-item__image > img:nth-of-type(2),
.product-item:hover .product-item__image.second-image-js > img.product-item__image--second,
.product-item:hover .product-item__image.second-image-js > img:nth-of-type(2),
.product-item.hover:hover .product-item__image > img:nth-of-type(2) {
opacity: 1 !important;
visibility: visible !important;
z-index: 2;
}
.product-item--restricted .product-item__image img,
.product-item-third--restricted .product-item__image img {
transform: none !important;
}
/* ========== info-banner-4 ========== */
.info-banner-4 img {
border-radius: 8px !important;
}
.info-banner-4__middle-column.twoRows img,
.info-banner-4__middle-column.twoRows .main-product-item__image img {
border-radius: 10px !important;
}
@media (min-width: 769px) {
/* Kolumna lewa (1. i 3. item) – wyrównanie do prawej, w stronę środka */
.info-banner-4__wrapper > .info-banner-4__column-item:nth-child(2),
.info-banner-4__wrapper > .info-banner-4__column-item:nth-child(4) {
text-align: right !important;
}
.info-banner-4__wrapper > .info-banner-4__column-item:nth-child(2) .info-banner-4__column-item__image,
.info-banner-4__wrapper > .info-banner-4__column-item:nth-child(4) .info-banner-4__column-item__image {
display: flex !important;
justify-content: flex-end !important;
}
.headerSection__categories {
position: relative;
margin-top: 21px;
}
.headerSection .mainCategories {
position: relative;
margin: 26px 0 5px;
}
.headerSection.frozenHeader .mainCategories {
margin: 0 0 5px;
}
}
@media screen and (max-width: 768px) {
.info-banner-4__column-item,
.info-banner-4__column-item__header,
.info-banner-4__column-item__text {
text-align: center !important;
}
.info-banner-4__column-item__image {
display: flex !important;
justify-content: center !important;
}
.info-banner-4__middle-column {
display: flex;
justify-content: center;
}
.headerSection .headerSection__iconsMenu
{
display: none;
}
}
/* ========== Header: navLinks zawsze ukryte ========== */
.headerSection__mainMenu__navLinks {
display: none !important;
}
/* Logo zawsze lewa + góra (każdy tryb / szerokość) */
.headerSection .headerSection__logo--wrapper,
.headerSection.frozenHeader .headerSection__logo--wrapper,
.headerSection.headerSection__bg .headerSection__logo--wrapper {
left: 3% !important;
right: auto !important;
transform: none !important;
justify-content: flex-start !important;
align-items: flex-start !important;
text-align: left !important;
margin-top: 0 !important;
}
.headerSection.frozenHeader .headerSection__logo--wrapper {
margin-top: 12px !important;
}
/* Ikony: poza frozenHeader */
.headerSection:not(.frozenHeader) .headerSection__iconsMenu {
top: 66px !important;
}
/* frozenHeader – glassmorphism */
.headerSection.frozenHeader,
.headerSection.headerSection__bg.frozenHeader {
background: rgba(255, 255, 255, 0.72) !important;
background-color: rgba(255, 255, 255, 0.72) !important;
-webkit-backdrop-filter: blur(14px) saturate(1.2);
backdrop-filter: blur(14px) saturate(1.2);
box-shadow: 0 1px 12px rgba(0, 0, 0, 0.08) !important;
}
.headerSection.headerSection__bg .headerContainer>.headerSection__row
{
justify-content: center !important;
}
.headerSection.frozenHeader .headerSection__categories {
margin-top: 22px !important;
}
@media screen and (max-width: 1199px) {
.headerSection,
.headerSection.headerSection__bg {
min-height: 100px !important;
}
.headerSection.frozenHeader .headerContainer>.scrollHeader .headerSection__iconsMenu {
top: 30px;
}
.headerSection:not(.frozenHeader) .headerSection__iconsMenu {
top: 38px !important;
}
.headerSection.frozenHeader,
.headerSection.headerSection__bg.frozenHeader {
min-height: 90px !important;
height: 90px !important;
}
.headerSection.headerSection__bg .headerContainer > .headerSection__row {
min-height: 80px !important;
}
.headerSection.frozenHeader.headerSection__bg .headerContainer > .headerSection__row,
.headerSection.headerSection__bg.frozenHeader .headerContainer > .headerSection__row {
min-height: 90px !important;
}
}
@media (min-width: 1200px) {
.headerSection.headerSection__bg .headerContainer > .headerSection__row,
.headerSection.frozenHeader.headerSection__bg .headerContainer > .headerSection__row,
.headerSection.headerSection__bg.frozenHeader .headerContainer > .headerSection__row {
min-height: 80px !important;
}
.headerSection {
min-height: 90px;
}
.headerSection.frozenHeader .headerContainer>.scrollHeader .headerSection__iconsMenu {
top: 25px !important;
}
.headerSection:not(.frozenHeader) .headerSection__iconsMenu {
top: 68px !important;
}
}
@media only screen and (max-width: 768px) {
.headerSection__logo--wrapper img,
.headerSection__logo--wrapper svg {
max-height: 58px;
max-width: 100px;
width: auto;
background: #FFFFFF;
}
.headerSection .headerSection__iconsMenu
{
position: relative !important;
right: 0 !important;
top: 18px !important;
}
}
/* ========== Mobile/tablet nav + bottomMenu do 1199px ========== */
@media screen and (max-width: 1199px) {
.bottomMenuBack:not(.hidden) {
display: block !important;
width: 100% !important;
height: 56px !important;
}
.bottomMenu:not(.hidden) {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
width: 100% !important;
height: 41px !important;
position: fixed !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
z-index: 1000 !important;
padding-top: 10px !important;
padding-bottom: 5px !important;
box-sizing: content-box !important;
background-color: rgba(255, 255, 255, 0.9) !important;
-webkit-backdrop-filter: blur(15px) !important;
backdrop-filter: blur(15px) !important;
}
.bottomMenu .menuItem {
flex: 0 1 20%;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
}
.bottomMenu .menuItem .svgContainer {
margin: 0 auto;
position: relative;
}
.bottomMenu .menuItem svg {
fill: rgba(25, 25, 25,1);
width: 20px;
height: 18px;
margin: 0 auto;
}
.bottomMenu .menuItem .itemsCounter {
position: absolute;
border-radius: 50%;
font-size: 9px;
width: 14px;
height: 14px;
top: -5px;
right: -6px;
font-weight: 500;
color: #FFFFFF;
background-color: #000000;
text-align: center;
}
.bottomMenu .menuItem .text {
font-size: 11px;
line-height: 18px;
color: rgba(25, 25, 25,1);
font-weight: 300;
text-align: center;
margin: 0 auto;
}
.bottomMenu .activePage svg {
fill: #000000;
}
.bottomMenu .activePage .text {
color: #000000;
}
.menuActive svg {
fill: #000000 !important;
}
.menuActive .text {
color: #000000 !important;
}
.menuDisabledIcons svg {
fill: rgba(25, 25, 25,1) !important;
}
.menuDisabledIcons .text {
color: rgba(25, 25, 25,1) !important;
}
.headerSection__iconsMenu .mobileMenuIcon,
.headerSection__iconsMenu .mobileSearchIcon {
display: inline-block !important;
}
.headerSection__categories__desktop {
display: none !important;
}
/*
frozenHeader + backdrop-filter tworzy containing block dla position:fixed.
Przy otwartym menu wyłączamy filter, żeby popup cotował się do viewportu.
*/
.headerSection.cb-mobileMenuOpen,
.headerSection.headerSection__bg.cb-mobileMenuOpen,
.headerSection.frozenHeader.cb-mobileMenuOpen,
.headerSection.headerSection__bg.frozenHeader.cb-mobileMenuOpen {
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
filter: none !important;
transform: none !important;
overflow: visible !important;
z-index: 9999 !important;
}
/* Scroll >768px dodaje .hidden na treść menu – poniżej 1200 treść musi zostać */
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .headerSection__mainMenu__navLinks.hidden,
.headerSection__mainMenu.headerSection__mobilePopup .headerSection__mainMenu__navLinks.hidden {
display: flex !important;
visibility: visible !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .headerSection__shopData.hidden,
.headerSection__mainMenu.headerSection__mobilePopup .headerSection__shopData.hidden {
display: block !important;
visibility: visible !important;
}
/* Desktopowy pasek menu ukryty; lista otwierana z bottomMenu jako mobilePopup */
.headerSection.headerSection__bg .headerContainer > .headerSection__row .headerMainMenu--showOnDesktop,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup {
display: none !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 56px !important;
width: 100% !important;
height: auto !important;
max-height: none !important;
overflow-y: auto !important;
overflow-x: hidden !important;
z-index: 13 !important;
padding: 35px 20px 20px !important;
box-sizing: border-box !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
justify-content: flex-start !important;
align-items: stretch !important;
background-color: #FFFFFF !important;
color: rgba(25,25,25,1.00) !important;
}
/* jQuery fadeToggle ustawia display:block / flex w style="" */
.headerSection.headerSection__bg .headerContainer > .headerSection__row .headerMainMenu--showOnDesktop[style*="display: block"],
.headerSection.headerSection__bg .headerContainer > .headerSection__row .headerMainMenu--showOnDesktop[style*="display:block"],
.headerSection.headerSection__bg .headerContainer > .headerSection__row .headerMainMenu--showOnDesktop[style*="display: flex"],
.headerSection.headerSection__bg .headerContainer > .headerSection__row .headerMainMenu--showOnDesktop[style*="display:flex"],
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup[style*="display: block"],
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup[style*="display:block"],
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup[style*="display: flex"],
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup[style*="display:flex"] {
display: block !important;
}
/* navLinks: na desktop ukryte, w trybie mobilePopup (≤1199) widoczne */
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .headerSection__mainMenu__navLinks,
.headerSection__mainMenu.headerSection__mobilePopup .headerSection__mainMenu__navLinks {
display: flex !important;
flex-direction: column !important;
position: static !important;
left: auto !important;
width: 100% !important;
}
.headerSection .headerSection__mobilePopup__closeBtn,
.headerSection .headerMainMenu--showOnDesktop .headerSection__mobilePopup__closeBtn {
display: block !important;
}
.headerSection .headerSection__mobilePopup__closeBtn span {
display: none !important;
}
.headerSection .headerSection__mobilePopup__closeBtn svg {
display: block !important;
cursor: pointer;
fill: #000000;
margin-bottom: 25px;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainMenu__toggle-display {
display: block !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainMenu__navLink {
padding: 15px 0 !important;
border-bottom: 1px solid rgba(174,174,174,0.69) !important;
width: 100% !important;
text-align: left !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation__sites,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation__lookbooks {
position: relative !important;
left: auto !important;
top: auto !important;
min-width: 0 !important;
width: 100% !important;
padding: 5px 0 0 !important;
box-shadow: none !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation ul ul {
display: none !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation__sites li,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation ul .mainNavigation__category,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation ul .mainNavigation__undercategory,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation ul .mainNavigation__underundercategory {
font-size: 12px !important;
padding: 10px 0 !important;
display: inline-block !important;
width: 100% !important;
border-bottom: 1px solid rgba(174,174,174,0.69) !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation__sites li > a,
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation a {
color: rgba(25,25,25,1.00) !important;
text-decoration: none !important;
display: inline-block !important;
width: 100% !important;
padding: 5px 0 !important;
margin-bottom: 0 !important;
text-transform: none !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .headerSection__shopData {
font-size: 14px !important;
top: unset !important;
position: relative !important;
border-bottom: 1px solid rgba(174,174,174,0.69) !important;
padding: 15px 0 !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .headerSection__languageAndCurrencyMenu {
position: relative !important;
box-shadow: none !important;
top: 0 !important;
width: calc(100% - 20px) !important;
left: -5px !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .customerLogin__mobileButton {
display: block !important;
position: relative !important;
margin: 80px 0 40px !important;
}
.headerSection .headerMainMenu--showOnDesktop.headerSection__mobilePopup .mainNavigation__image {
display: none !important;
}
/* Kategorie (pierwszy collapse) zawsze rozwinięte w mobilePopup */
.headerSection.cb-mobileMenuOpen .headerSection__categories__mobile {
display: block !important;
}
}
@media screen and (min-width: 1200px) {
.bottomMenu,
.bottomMenuBack {
display: none !important;
}
}
.movie-element__content
{
border-radius: 10px !important;
overflow: hidden;
}
.movie-element__content iframe
{
display: block;
margin: 0;
padding: 0;
border: none !important;
}
a.image-container img
{
border-radius: 8px !important;
}
@media screen and (min-width: 769px) {
#bannerInListContainer.bannerInList-products1.bannerInList-third:not(.bannerInList-row1) {
margin-top: 20px;
}
}
.info-banner-4 .info-banner-title, .movie-element__title, .recommended-products1 .recommended-products-title, .blog-wrapper__title .text, .info-banner-2 .info-banner-title, .newsletter1__title, .footer__section-title, .productDetails-section__mobileName
{
font-family: 'Dosis' !important;
font-weight: 600 !important;
}
.info-banner-4 .info-banner-title b, .movie-element__title b, .recommended-products1 .recommended-products-title b, .blog-wrapper__title .text b, .info-banner-2 .info-banner-title b, .newsletter1__title b, .footer__section-title b, .productDetails-section__mobileName b
{
font-weight: 600 !important;
font-family: bogart, sans-serif !important;
}
.recommended-products1 .recommended-products-title, .info-banner-2 .info-banner-title
{
bottom: -26px;
}
.movie-element__title
{
margin-top: -7px;
}
.blog-wrapper__title .text {
display: inline-block;
margin-top: -10px;
}
.info-banner-4 .info-banner-title {
margin-top: -7px;
}
@media only screen and (max-width: 1000px) {
.contactSection__cell__banner .contactSection__imgContainer, .contactSection__cell__banner.hide-on-mobile {
display: block;
}
}
.contactSection__imgContainer img
{
border-radius: 15px !important;
}
.contactSection__contactData .contactData__content, .contactSection__contactData .contactData__content a {
font-size: 18px;
line-height: 2;
color: rgba(0, 0, 0);
margin-top: -5px;
}
@media screen and (max-width: 768px) {
.contactSection__contactData > div {
width: 50% !important;
}
.contactSection__contactData > div.fullWidth {
width: 100% !important;
}
.contactSection__imgContainer__titleBox {
cursor: pointer;
}
}
@media screen and (min-width: 769px) {
.productDetails-productInfo {
position: sticky;
bottom: 0;
align-self: flex-start;
}
}
.listbanner-header {
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: 0;
color: #FFFFFF;
margin-bottom: 16px;
white-space: normal;
text-overflow: unset;
overflow: visible;
text-align: left;
}
.listbanner-header b {
font-family: bogart, sans-serif;
font-weight: 900;
}
#bannerInListContainer.bannerInList-products1:not(.bannerInList-openedFilters) .listbanner-image {
border-radius: 0 15px 15px 0;
overflow: hidden;
}
#bannerInListContainer.bannerInList-products1:not(.bannerInList-openedFilters) .listbanner-textcontainer {
border-radius: 15px 0 0 15px;
}
@media screen and (max-width: 1200px) {
#bannerInListContainer.bannerInList-products1:not(.bannerInList-openedFilters) .listbanner-image {
max-height: unset !important;
width: 100%;
border-radius: 15px 15px 0 0;
overflow: hidden;
}
#bannerInListContainer.bannerInList-products1:not(.bannerInList-openedFilters) .listbanner-textcontainer {
border-radius: 0 0 15px 15px;
}
}
.customer__title
{
font-size: 1.21rem;
font-weight: 600;
}
.customer .customer__submenu
{
font-size: 1.48rem;
font-weight: 900;
font-family: bogart, sans-serif;
}
.customer .customer__submenu li.active-js
{
font-size: 1.48rem;
font-weight: 900;
color: #000000 !important;
font-family: bogart, sans-serif;
}
.customer .customer__menu ul,
.customer .customer__sectionTitle,
.customer .customer__emptySectionTitle,
.customer .customer__contentSection .customer__contentSection--inner
{
font-size: 1.15rem;
}