.elementor-kit-5{--e-global-color-primary:#4C1417;--e-global-color-secondary:#1A1918;--e-global-color-text:#6B6764;--e-global-color-accent:#C42418;--e-global-color-sofasrf:#F6F5F4;--e-global-color-sofalin:#E7E5E3;--e-global-color-sofalns:#D5D2CF;--e-global-color-sofacth:#94190F;--e-global-color-sofawht:#FFFFFF;--e-global-color-sofaplc:#857F7B;--e-global-typography-primary-font-family:"Manrope";--e-global-typography-primary-font-size:30px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-line-height:1.1em;--e-global-typography-primary-letter-spacing:-0.02em;--e-global-typography-secondary-font-family:"Manrope";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:500;--e-global-typography-secondary-line-height:1.25em;--e-global-typography-secondary-letter-spacing:-0.02em;--e-global-typography-text-font-family:"Manrope";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.7em;--e-global-typography-text-letter-spacing:0em;--e-global-typography-accent-font-family:"Manrope";--e-global-typography-accent-font-size:15px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1.4em;--e-global-typography-accent-letter-spacing:0.01em;--e-global-typography-sofaeyb-font-family:"Manrope";--e-global-typography-sofaeyb-font-size:12px;--e-global-typography-sofaeyb-font-weight:600;--e-global-typography-sofaeyb-text-transform:uppercase;--e-global-typography-sofaeyb-line-height:1.4em;--e-global-typography-sofaeyb-letter-spacing:0.16em;color:#1A1918;font-family:"Manrope", Sans-serif;font-size:16px;font-weight:400;line-height:1.7em;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-kit-5 a{color:#C42418;}.elementor-kit-5 a:hover{color:#94190F;}.elementor-kit-5 button,.elementor-kit-5 input[type="button"],.elementor-kit-5 input[type="submit"],.elementor-kit-5 .elementor-button{border-radius:8px 8px 8px 8px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =============================================================
KAFELKI I KARTY - podswietlenie calego kafelka przy najechaniu
Odpowiednik z projektu HTML: .cat:hover / .card:hover
Elementor nie ma kontrolki "hover rodzica -> styl dziecka",
dlatego to jedyne miejsce w calym serwisie z recznym CSS.
Klasy nadane w panelu (Zaawansowane > Klasy CSS):
.sofa-kafel - kontener calej karty/kafelka
.sofa-kafel--kat - to samo, wariant kafelka kategorii
.sofa-foto - kontener ze zdjeciem (overflow: hidden)
.sofa-ramka - przycisk z nazwa (biala ramka)
============================================================= */
/* 1. Przyblizenie zdjecia */
.sofa-kafel .sofa-foto img {
transition: transform .7s cubic-bezier(.16, 1, .3, 1);
}
.sofa-kafel:hover .sofa-foto.e-con img {
transform: scale(1.045);
}
.sofa-kafel--kat:hover .sofa-foto.e-con img {
transform: scale(1.05);
}
/* 2. Ramka z nazwa: biala -> czarna, tekst na bialy */
.sofa-ramka .elementor-button {
transition: background-color .4s cubic-bezier(.16, 1, .3, 1),
border-color .4s cubic-bezier(.16, 1, .3, 1),
color .4s cubic-bezier(.16, 1, .3, 1);
}
.sofa-kafel:hover .sofa-ramka.elementor-widget .elementor-button {
background-color: #1A1918;
border-color: #1A1918;
color: #FFFFFF;
}
.sofa-kafel:hover .sofa-ramka.elementor-widget .elementor-button svg {
fill: #FFFFFF;
}
/* 3. Klikalny caly kafelek.
W projekcie / obejmuje cala karte.
HTML nie dopuszcza zagniezdzonych , wiec zamiast owijac kafelek
w drugi odnosnik rozciagamy pseudoelement istniejacego przycisku.
Kontener widgetu przycisku ma position:relative - trzeba go zdjac,
inaczej nakladka objelaby sam przycisk zamiast calego kafelka. */
.sofa-kafel {
position: relative;
}
.sofa-kafel .sofa-ramka {
position: static;
}
.sofa-kafel .sofa-ramka .elementor-button::after {
content: "";
position: absolute;
inset: 0;
z-index: 3;
}
/* 4. Wymiary siedza przy dolnej krawedzi karty, wiec w rzedzie kart
dwuwierszowa nazwa nie zsuwa dolnej linii ramki nizej niz u sasiadow.
Ramka zachowuje naturalna wysokosc. */
.sofa-kafel .sofa-wymiary {
margin-top: auto;
padding-top: 10px;
}
/* 5. Ramka z nazwa zbudowana na Dynamic Link (kafelki kategorii):
tekst po lewej, strzalka po prawej, klikalny caly kafelek. */
.sofa-kafel .sofa-ramka .jet-listing-dynamic-link__link {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
transition: background-color .4s cubic-bezier(.16, 1, .3, 1),
color .4s cubic-bezier(.16, 1, .3, 1);
}
.sofa-kafel .sofa-ramka .jet-listing-dynamic-link__link::after {
content: "";
position: absolute;
inset: 0;
z-index: 3;
}
.sofa-kafel:hover .sofa-ramka .jet-listing-dynamic-link__link {
background-color: #1A1918;
color: #FFFFFF;
}
.sofa-kafel:hover .sofa-ramka .jet-listing-dynamic-link__link svg {
fill: #FFFFFF;
}
.sofa-tag .jet-listing-dynamic-link__link {
justify-content: center;
text-align: center;
transition: background-color .3s ease, color .3s ease, border-color .3s ease;
}
/* 6. Lista podkategorii pod kafelkiem: kafelki dopasowane do dlugosci
nazwy i zawijane, zamiast siatki rownych kolumn. */
.sofa-tagi .jet-listing-grid__items {
display: flex;
flex-wrap: wrap;
}
.sofa-tagi .jet-listing-grid__item {
flex: 0 0 auto;
width: auto;
max-width: none;
}
/* 7. Pusty podpis kategorii nie zostawia po sobie odstepu. */
.sofa-kafel .elementor-widget-jet-listing-dynamic-field:not(:has(.jet-listing-dynamic-field__content:not(:empty))) {
display: none;
}
/* 8. Wyszukiwarka pelnoekranowa: Elementor renderuje przycisk zamkniecia
bez wymiarow (svg 0x0), wiec nie da sie jej zamknac na telefonie.
Ustawiamy mu rozmiar i sadzamy w prawym gornym rogu. */
.elementor-search-form--full-screen .dialog-close-button {
position: absolute;
top: 18px;
right: 18px;
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border: 1px solid rgba(255, 255, 255, 0.35);
color: #FFFFFF;
opacity: 1;
cursor: pointer;
transition: background-color .3s ease, border-color .3s ease;
}
.elementor-search-form--full-screen .dialog-close-button:hover,
.elementor-search-form--full-screen .dialog-close-button:focus-visible {
background-color: #C42418;
border-color: #C42418;
}
.elementor-search-form--full-screen .dialog-close-button svg {
width: 20px;
height: 20px;
fill: #FFFFFF;
}
/* 9. Nazwa w ramce wyrownana do lewej takze przy zawinieciu do 2 linii. */
.sofa-ramka .elementor-button-text,
.sofa-ramka .jet-listing-dynamic-link__label {
text-align: left;
}/* End custom CSS */