@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//garage.wolfgraf.com/wp-content/themes/woodmart/fonts/woodmart-font-1-400.woff2?v=8.3.9") format("woff2");
}

@font-face {
	font-family: "star";
	font-weight: 400;
	font-style: normal;
	src: url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/star.eot?#iefix") format("embedded-opentype"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/star.woff") format("woff"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/star.ttf") format("truetype"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/star.svg#star") format("svg");
}

@font-face {
	font-family: "WooCommerce";
	font-weight: 400;
	font-style: normal;
	src: url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.eot?#iefix") format("embedded-opentype"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.woff") format("woff"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.ttf") format("truetype"), url("//garage.wolfgraf.com/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.svg#WooCommerce") format("svg");
}

:root {
	--wd-text-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(0,0,0);
	--wd-text-font-size: 16px;
	--wd-title-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 500;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(0, 0, 0);
	--wd-alternative-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 500;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 18px;
	--wd-header-el-font: "Saira Semi Condensed", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 500;
	--wd-header-el-transform: none;
	--wd-header-el-font-size: 18px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(185,7,7);
	--wd-alternative-color: #fbbc34;
	--btn-default-font-weight: 500;
	--btn-default-transform: none;
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-font-weight: 500;
	--btn-accented-transform: none;
	--btn-accented-bgcolor: rgb(185,7,7);
	--btn-accented-bgcolor-hover: rgb(185,7,7);
	--wd-form-brd-width: 2px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: rgb(15,0,0);
	--wd-link-color-hover: rgb(15,0,0);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(30,115,190);
	background-image: url(https://garage.wolfgraf.com/wp-content/uploads/2021/10/grocery-popup.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg, :is(.woodmart-archive-shop .wd-builder-off,.wd-wishlist-content,.related-and-upsells,.cart-collaterals,.wd-shop-product,.wd-fbt) .wd-products-with-bg :is(.wd-product,.wd-cat) {
	--wd-prod-bg:rgb(244,244,244);
	--wd-bordered-bg:rgb(244,244,244);
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 151px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(255,255,255);
	background-image: none;
}
.page .wd-page-content {
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment: inherit;
	background-position: center top;
}
.woodmart-archive-shop:not(.single-product) .wd-page-content {
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment: inherit;
	background-position: center top;
}
.single-product .wd-page-content {
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment: inherit;
	background-position: center top;
}
.woodmart-archive-blog .wd-page-content {
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment: inherit;
	background-position: center top;
}
.single-post .wd-page-content {
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment: inherit;
	background-position: center top;
}
.product-labels .product-label.onsale {
	background-color: rgb(6,70,209);
	color: rgb(247,247,247);
}
.product-labels .product-label.new {
	background-color: rgb(0,126,134);
	color: rgb(255,255,255);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1600px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 0px;
}

@media (min-width: 1600px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(255,255,255);
}

/* tło pod miniaturą */
.wd-product .product-element-top{
  background:#f5f5f5 !important;
}

/* mieszanie */
.wd-product .product-image-link img{
  mix-blend-mode:multiply !important;
}







.wd-nav[class*="wd-style-underline"] .nav-link-text:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #b90707;
    transition: width 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.15);
}



.call_class, .faq_class, .wd-tools-icon {
    padding: 10px;
}
.product-image-link img {
    mix-blend-mode: multiply !important;
    background-color: #fff !important; /* Zakładając, że tło jest białe */
}
.product-grid-item .product-image-link {
  mix-blend-mode: multiply !important;  
    background-color: #fff !important; /* Zakładając, że tło jest białe */  
	 position: relative;
    display: block;
}
.wpclv-attributes .wpclv-terms img {
    display: block;
    width: 100%;
    height: auto;
	mix-blend-mode: multiply !important;  
    background-color: #fff !important; /* Zakładając, że tło jest białe */  
}
.wpclv-attributes .wpclv-terms .wpclv-term {
    border-radius: 25px;
        background-color: #ffffff;
   
}
.wpclv-attributes .wpclv-terms .wpclv-term span, .wpclv-attributes .wpclv-terms .wpclv-term a {
   background-color: #ffffff;
    border-radius: 25px;
   
}





.wpclv-attributes .wpclv-terms .wpclv-term.active, .wpclv-attributes .wpclv-terms .wpclv-term:hover {
    border-color: black;
}

.uni-cpo-option-label {
    /* Dodaj styl float: left dla obrazka */
    float: left;
}

.uni-cpo-option-label__description {
    /* Dodaj styl float: left dla opisu */
    float: left;
    margin-left: 10px; /* Dla odstępu między obrazkiem a opisem */
}
.sluchawka {
    padding-left: 6px;
    padding-right: 9px;
}

.headerfaq {
    padding-left: 9px;
    padding-right: 7px;
}
.headerfaq:hover, /* opacity stara słuchawka*/
.headerfaq:hover {
    opacity: 0.5;
}



.whb-header-bottom {
	    background-color: rgba(255, 255, 255, 0);
}

#woocommerce_product_categories-2 .product-categories .cat-item-247,
#woocommerce_product_categories-2 .product-categories .cat-item-126,
#woocommerce_product_categories-2 .product-categories .cat-item-222,
#woocommerce_product_categories-2 .product-categories .cat-item-79,
#woocommerce_product_categories-2 .product-categories .cat-item-78 {
    display: none;
}

li.wd-active .wd-nav-link .nav-link-text {
    color: #070707;
    font-size: 28px;
}


.wd-nav-link .nav-link-text  {
    color: #8A8A8A;
    font-size: 18px;
}





.wooco_component_product_selection_list .wooco_component_product_selection_list_item {
    padding: 5PX;
	BORDER: NONE;
    margin-bottom: 0;
       -webkit-tap-highlight-color: transparent;
    position: relative;
    }

.wooco_component_multiple .wooco_component_product_selection_list_item .wooco_component_product_selection_list_item_choose span:before {
    border-radius: 0PX;
}

.wooco_component_product_selection_list .wooco_component_product_selection_list_item.wooco_item_selected .wooco_component_product_selection_list_item_choose span:before {
    color: red;
    background-color: transparent;
}

.wooco_component_multiple .wooco_component_product_selection_list_item .wooco_component_product_selection_list_item_choose span:before {
    border-radius: 0PX;
    border-color: black;
 }

.wooco_component_product_selection_list .wooco_component_product_selection_list_item .wooco_component_product_selection_list_item_choose span:before {
    content: "✓";
    color: transparent;
    display: block;
    background-color: transparent;
    text-align: center;
    font-size: 16px;
      border-width: 1px;
    border-style: solid;
    border-color: #D8D8D8;
  
}

.wooco_component_product_selection_list .wooco_component_product_selection_list_item .wooco_component_product_selection_list_item_info .wooco_component_product_selection_list_item_name {
    font-weight: 400;
}

.wooco_component_product_selection {
    margin: 0px;
}

.wooco_component_product_selection_list_item.wooco_component_product_selection_item {
    padding: 5px;
}

    .product-labels {
        display: flex;
        flex-direction: row;
				margin-top: -15px;
			        /* Inne stylizacje dla klasy .product-labels, jeśli są potrzebne. ulozenie etykiet w poziomie obok sienie */
    }


#menu-item-34769 .nav-link-text {
    display: none;
}

.wd-nav-img, .mega-menu-list img {
    display: inline-block;
    margin-right: 7px;
    max-height: 24px;
    width: auto !important;
}


.wd-nav-img:hover,
.mega-menu-list img:hover {
    opacity: 0.5;
}

#menu-item-34769 a.woodmart-nav-link::after {
    display: none;
}

.wishlist_ico {
    padding-left: 9px;
    padding-right: 7px;
}
.wishlist_ico:hover, /* opacity ulubione serce*/
.wishlist_ico:hover {
    opacity: 0.5;
}
.whb-col-right .wd-dropdown-menu.wd-design-default {
    right: 0;
    left: auto;
    margin-left: 0;
    margin-right: -190px;
}

#menu-item-35165 .nav-link-text {
    display: none;
}

#menu-item-35165 a.woodmart-nav-link::after {
    display: none;
}

.przycisk_kontakt {
      box-sizing: border-box; /* Zapewnia, że padding nie zwiększa faktycznej szerokości elementu */
}



.elementor.elementor-36337 {
    width: 355px;
}




.wd-header-search {
    margin-right: 27px;  /*ustawienie marginesu aby było równo z górnymmenu*/
}

.wd-header-my-account { /*ustawienie marginesu aby było równo z górnymmenu*//*ustawienie marginesu aby było równo z górnymmenu*/
    margin-right: 25px;
}

.wd-header-cart { /*ustawienie marginesu aby było równo z górnymmenu*/
    margin-right: 0px;
}


.wooco_component_layout_grid_4 .wooco_component_product_selection_grid > div {
    width: calc(23% - 30px);
    height: 150px;
	width: 200px
    overflow: hidden; /* Dodaj tę linię, aby ukryć dodatkową zawartość, jeśli element jest większy niż 72px */
}


.wooco_component_product 
{
margin-top: 0 !important;
}

.konfigurator_men {
    background-color: #b90707 !important;
	padding-right: 10px !important;
  padding-left: 10px !important;
	}

#menu-item-34148 {
    padding-left: 10px !important;
}

.konfigurator_men .nav-link-text {
    color: #fff !important; /* Ustawienie koloru tekstu na biały */
}

.wooco_count {
    display: none !important; /*usuniecie napisu selected z single layout*/
}



.galeria-akordeon { 
  display: none;
}



@media (min-width: 1025px) {

    /* LEWA – Y */
    #wymiarlewe_y_1,
    #wymiarlewe_y_2,
    #wymiarlewe_y_3,
    #wymiarlewe_y_4,
    #wymiarlewe_y_5,
    #wymiarlewe_y_6,
    #wymiarlewe_y_7 {
        padding-left: 18px !important;
    }

    /* PRZEDNIA – Y */
    #wymiarprzednie_y_1,
    #wymiarprzednie_y_2,
    #wymiarprzednie_y_3,
    #wymiarprzednie_y_4,
    #wymiarprzednie_y_5,
    #wymiarprzednie_y_6,
    #wymiarprzednie_y_7,

    /* PRAWA – Y */
    #wymiarprawa_y_1,
    #wymiarprawa_y_2,
    #wymiarprawa_y_3,
    #wymiarprawa_y_4,
    #wymiarprawa_y_5,
    #wymiarprawa_y_6,
    #wymiarprawa_y_7,

    /* TYŁ – Y */
    #wymiartyl_y_1,
    #wymiartyl_y_2,
    #wymiartyl_y_3,
    #wymiartyl_y_4,
    #wymiartyl_y_5,
    #wymiartyl_y_6,
    #wymiartyl_y_7 {
        padding-left: 18px !important;
    }

    /* PRAWA – Z */
    #wymiarprawa_z_1,
    #wymiarprawa_z_2,
    #wymiarprawa_z_3,
    #wymiarprawa_z_4,
    #wymiarprawa_z_5,
    #wymiarprawa_z_6,
    #wymiarprawa_z_7,

    /* TYŁ – Z */
    #wymiartyl_z_1,
    #wymiartyl_z_2,
    #wymiartyl_z_3,
    #wymiartyl_z_4,
    #wymiartyl_z_5,
    #wymiartyl_z_6,
    #wymiartyl_z_7,

    /* LEWA – Z */
    #wymiarlewe_z_1,
    #wymiarlewe_z_2,
    #wymiarlewe_z_3,
    #wymiarlewe_z_4,
    #wymiarlewe_z_5,
    #wymiarlewe_z_6,
    #wymiarlewe_z_7,

    /* PRZEDNIA – Z */
    #wymiarprzednie_z_1,
    #wymiarprzednie_z_2,
    #wymiarprzednie_z_3,
    #wymiarprzednie_z_4,
    #wymiarprzednie_z_5,
    #wymiarprzednie_z_6,
    #wymiarprzednie_z_7 {
        padding-left: 13px !important;
    }

}
/* =========================================================

/* =========================================================
   #bloktekstowy – DOMYŚLNIE (poza podsumowaniem)
   ========================================================= */
#bloktekstowy .wd-text-block {
    max-height: 761px;
    width: 100% !important;
    overflow-y: auto;
    overflow-x: hidden;

    padding: 12px 14px;
    border: 1px solid #d5d5d5;
    border-radius: 4px;

    background: #ffffff;
    line-height: 1.45;
	 
}

#podsumowaniefull #bloktekstowy .wd-text-block {
    font-size: 25px !important;
    line-height: 1.5 !important;
} 

/* =========================================================
   #bloktekstowy – TRYB PODSUMOWANIA
   - działa na realnym wrapperze #podsumowaniefull
   - od startu ma stałą wysokość
   - nie rośnie od treści
   ========================================================= */
#podsumowaniefull #bloktekstowy,
#podsumowaniefull #bloktekstowy .elementor-widget-container,
#podsumowaniefull #bloktekstowy .wd-text-block {
    width: 100% !important;
    max-width: 100% !important;
}

#podsumowaniefull #bloktekstowy .wd-text-block {
    height: calc(100vh - 700px) !important;
    min-height: calc(100vh - 700px) !important;
    max-height: calc(100vh - 700px) !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    padding: 12px 14px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
}

/* =========================================================
   Dodatkowa ochrona na bardzo niskie ekrany
   ========================================================= */
@media (max-height: 650px) {
  #podsumowaniefull #bloktekstowy .wd-text-block {
    height: 55vh !important;
    min-height: 55vh !important;
    max-height: 55vh !important;
  }
}

@media (max-height: 520px) {
  #podsumowaniefull #bloktekstowy .wd-text-block {
    height: 45vh !important;
    min-height: 45vh !important;
    max-height: 45vh !important;
  }
}

/* =========================================================
   Scrollbar
   ========================================================= */
#bloktekstowy .wd-text-block::-webkit-scrollbar { width: 6px; }
#bloktekstowy .wd-text-block::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px; }
#bloktekstowy .wd-text-block::-webkit-scrollbar-track { background: transparent; }

/* =========================================================
   Cena produktu
   ========================================================= */
#productprice { font-size: 25px; line-height: 1.2; font-weight: 700; }
#productprice del { font-weight: 400; opacity: 0.6; }
#productprice ins { font-weight: 700; text-decoration: none; }

/* ================================
   MAŁA WYSOKOŚĆ EKRANU
   (poza podsumowaniem)
   ================================ */
@media (max-height: 700px) {
  body:not(.podsumowanie-aktywne) #bloktekstowy .wd-text-block {
    max-height: 250px !important;
  }
}

@media (max-height: 600px) {
  body:not(.podsumowanie-aktywne) #bloktekstowy .wd-text-block {
    max-height: 200px !important;
  }
}






/* =========================================================
   Cena produktu
   ========================================================= */
#productprice { font-size: 25px; line-height: 1.2; font-weight: 700; }
#productprice del { font-weight: 400; opacity: 0.6; }
#productprice ins { font-weight: 700; text-decoration: none; }

/* =========================================================
   UniCPO – Kolor ramy (anti-flash) sterowany klasą na <body>
   ========================================================= */

/* Domyślnie ukryj wszystkie 4 */
#uni_cpo_kolor_ramy_lewe,
#uni_cpo_kolor_ramy_prawe,
#uni_cpo_kolor_ramy_tyl,
#uni_cpo_kolor_ramy_przod {
  display: none !important;
}

/* Pokaż tylko właściwy, gdy body ma odpowiednią klasę */
body.show-ramy-left  #uni_cpo_kolor_ramy_lewe  { display: block !important; }
body.show-ramy-right #uni_cpo_kolor_ramy_prawe { display: block !important; }
body.show-ramy-back  #uni_cpo_kolor_ramy_tyl   { display: block !important; }
body.show-ramy-front #uni_cpo_kolor_ramy_przod { display: block !important; }



/* ===== Pomoc: wyrównanie dropdown pomoc w lewo ===== 30-01-2026 */

nav[aria-label="menu pomoc header"] #menu-menu-pomoc-header > li {
  position: relative !important;
}


nav[aria-label="menu pomoc header"] #menu-menu-pomoc-header > li > .wd-dropdown-menu {
  position: absolute !important;
  left: auto !important;
  right: 0 !important;
  transform: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: calc(100vw - 24px) !important;
  box-sizing: border-box !important;
}

nav[aria-label="menu pomoc header"] #menu-menu-pomoc-header > li > .wd-dropdown-menu[style] {
  left: auto !important;
  right: 0 !important;
  transform: none !important;
}


/* ================================
   WOODMART – MAIN NAV responsywnie
   Sterowanie odstępem przez --nav-gap
   ================================ */

/* 0) Bezpieczna baza – tylko main nav */
.whb-main-header .wd-header-nav .wd-nav {
  /* nic na stałe tutaj nie zmieniamy */
}

/* 1) Duże ekrany (>=1600) – może zostać luźniej */
@media (min-width: 1600px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 40px; }
}

/* 2) Standard desktop (1440–1599) */
@media (max-width: 1599px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 32px; }
}

/* 3) 1366–1439 */
@media (max-width: 1439px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 26px; }
}

/* 4) 1280–1365 (tu zwykle zaczyna się problem z 2 liniami) */
@media (max-width: 1365px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 22px; }

  .whb-main-header .wd-header-nav .wd-nav > li > a{
    font-size: 14px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    line-height: 1.15 !important;
  }
}

/* 5) <=1280 – zgodnie z audytem UX: ciaśniej + mniejsza czcionka */
@media (max-width: 1280px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 20px; }

  /* nie łam w 2 linie */
  .whb-main-header .wd-header-nav .wd-nav,
  .whb-main-header .wd-header-nav nav .menu {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }

  .whb-main-header .wd-header-nav .wd-nav > li > a,
  .whb-main-header .wd-header-nav nav .menu > li > a {
    font-size: 13px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    line-height: 1.1 !important;
  }
}

/* 6) <=1152 – dodatkowa kompresja (u Ciebie często testowana) */
@media (max-width: 1152px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 16px; }

  .whb-main-header .wd-header-nav .wd-nav > li > a,
  .whb-main-header .wd-header-nav nav .menu > li > a {
    font-size: 12.5px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}

/* 7) <=1024 – tu zwykle i tak wchodzi inny układ headera (mobile/tablet),
      ale zostawiamy awaryjnie */
@media (max-width: 1024px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-l { --nav-gap: 12px; }
}

/* (opcjonalnie) jeżeli masz też inne warianty gap (M/S), dodaj to samo: */
@media (max-width: 1280px) {
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-m { --nav-gap: 16px; }
  .whb-main-header .wd-header-nav .wd-nav.wd-gap-s { --nav-gap: 12px; }
}


#productpricerabatwartosc .rabat-label {
  color: #000;
  font-weight: 500;
}

#productpricerabatwartosc .rabat-kwota {
  color: #b90707;
  font-weight: 700;
  
	font-size: 25px;
}








/* KLIKALNE KONTENERY KOLORÓW – POKAŻ RĄCZKĘ */
#kolbra,
#koldach,
#kolorokucianaroznikow,
#kolorokucdachowych,
#kondrzwikolorprzod,
#kondrzwikolortyl,
#kondrzwikolorprawa,
#kondrzwikolorlewe,
#kolsciall,
#kolscilew,
#kolscipraw,
#kolsciprzed,
#kolscityl {
    cursor: pointer;
}






/* Wyrównanie menu moje konto do prawej krawędzi */
.wd-dropdown.wd-dropdown-my-account {
    right: 0 !important;
    left: -80px!important;
}




/* Przycisk typu Outline z WYRAŹNĄ ramką */
.login-form-side .create-account-button {
    background-color: transparent !important;
    border: 2px solid rgb(183, 3, 3) !important;
    color: rgb(183, 3, 3) !important;
    
    font-weight: 500;
    text-transform: none;
    width: 100%;
    padding: 12px 20px;
    border-radius: 0; 
    
    display: block;
    text-align: center;
    margin-top: 10px;
    transition: all 0.3s ease;
}

/* Hover - po najechaniu wypełnia się kolorem */
.login-form-side .create-account-button:hover {
    background-color: rgb(183, 3, 3) !important;
    color: #fff !important;
}
ox-shadow: none;
}











#maskamenudolnego {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;

  /* WYSOKOŚĆ DOLNEGO MENU – DOSTOSUJ */
  height: 130px;

  background: rgba(0,0,0,0.10);
  z-index: 19990;

  display: none;
  pointer-events: all;
}



#strzalkalewaid,
#strzalkaprawaid {
  cursor: pointer;
}

#strzalkalewaid:hover,
#strzalkaprawaid:hover {
  background: #b90707;
}

#strzalkalewaid:active,
#strzalkaprawaid:active {
  background: #b90707;
}


#copywrightid{
  position: fixed !important;   /* żeby nie zależał od układu */
  left: 0 !important;
  right: 0 !important;

  bottom: 0 !important;
  top: auto !important;         /* klucz: kasuje ewentualny top z animacji */

  transform: none !important;   /* klucz: kasuje podnoszenie przez translate */
}

/* aktywny kafel koloru */
.kolor-active {
  background: #ffffff !important;
}

/* aktywny kafel: białe tło + cień */
.kolor-active{
  background: #fff !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.12) !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  
}

/* opcjonalnie: lekki efekt hover dla tych kafli */
#kolbra:hover,
#kondrzwikolorprzod:hover,
#kondrzwikolortyl:hover,
#kondrzwikolorprawa:hover,
#kondrzwikolorlewe:hover,
#koldach:hover,
#kolorokucianaroznikow:hover,
#kolorokucdachowych:hover,
#kolsciall:hover,
#kolscilew:hover,
#kolscipraw:hover,
#kolsciprzed:hover,
#kolscityl:hover{
  box-shadow: 0 4px 14px rgba(0,0,0,0.10);
}

/* =========================
   ICONKA "i" (chip + cień)
   ========================= */
.cpo-info-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.10);
  background: #fff;
  box-shadow: 0 1px 1px rgba(0,0,0,0.16);
  cursor: pointer;
  vertical-align: middle;
  flex: 0 0 auto;
}

.cpo-info-btn svg{
  width: 16px;
  height: 16px;
}

/* żeby label miał układ jak "tekst + ikonka" */
.uni-cpo-option-label{
  display: inline-flex;
  align-items: center;
  gap: 0;
}

/* =========================
   POPUP ze zdjęciem
   ========================= */
#cpo-tooltipinfo{
  position: absolute;
  z-index: 999999;
  display: none;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  
  padding: 10px;
  max-width: 360px;
}

#cpo-tooltipinfo .close-btn{
  position: absolute;
  top: 6px;
  right: 10px;
  border: 0;
  background: transparent;
  font-size: 22px;
  line-height: 22px;
  cursor: pointer;
}

#cpo-tooltipinfo img{
  display: block;
  max-width: 340px;
  height: auto;
  border-radius: 10px;
}





/* Ukryj przycisk Porównaj (WoodMart) */
.wd-compare-btn {
    display: none !important;
}

.tab-title-wd_additional_tab_3 {
    border-top: none !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}


/* ===========================================================
 elementy do strony

/* ======================================================
   WOODMART: przycisk w loopie — hover ma pokazać tekst
   ZAMIANA ikony koszyka na "Wybierz opcje"
   ====================================================== */

/* 1) Ustaw kontekst pozycjonowania na <a> */
.wd-add-btn.wd-add-btn-replace a.add-to-cart-loop{
  position: relative !important;
  overflow: hidden !important;
}

/* 2) Normalnie pokazuj tekst */
.wd-add-btn.wd-add-btn-replace a.add-to-cart-loop span{
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

/* 3) Wyłącz pseudo-elementy motywu, które robią ikonę/overlay */
.wd-add-btn.wd-add-btn-replace a.add-to-cart-loop::before,
.wd-add-btn.wd-add-btn-replace a.add-to-cart-loop::after{
  content: none !important;
  display: none !important;
  background: none !important;
}

/* 4) Na hover ukryj span (żeby nie dublować) */
.wd-add-btn.wd-add-btn-replace:hover a.add-to-cart-loop span{
  opacity: 0 !important;
  visibility: hidden !important;
}

/* 5) Na hover WSTAW tekst jako ::before (z wysokim z-index) */
.wd-add-btn.wd-add-btn-replace:hover a.add-to-cart-loop::before{
  content: "Zobacz produkt" !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  position: absolute !important;
  inset: 0 !important;

  z-index: 9999 !important;
  pointer-events: none !important;

  /* żeby dziedziczył wygląd fontu/koloru z buttona */
  font: inherit !important;
  color: inherit !important;
  white-space: nowrap !important;
}

/* 6) Rozjaśnienie przy hover */
.wd-add-btn.wd-add-btn-replace:hover a.add-to-cart-loop{
    filter: brightness(1.12);
    transition: filter 0.25s ease;
}


/* === KOSZYK: kupon w 1 linii (50/50) === */
@media (min-width: 768px){
  .woocommerce-cart .cart_totals .wd-coupon-form{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 14px !important;
    width: 100% !important;
  }

  .woocommerce-cart .cart_totals .wd-coupon-form .input-text{
    flex: 0 0 calc(50% - 7px) !important;
    width: calc(50% - 7px) !important;
    min-width: 0 !important;
    height: 48px !important;
    box-sizing: border-box !important;
  }

  .woocommerce-cart .cart_totals .wd-coupon-form button[name="apply_coupon"]{
    flex: 0 0 calc(50% - 7px) !important;
    width: calc(50% - 7px) !important;
    min-width: 0 !important;
    height: 48px !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
  }
}


/* === KOSZYK: przycisk "Wykorzystaj kupon" czarny (outline) === */
@media (min-width: 768px){
  .woocommerce-cart .cart_totals .wd-coupon-form button[name="apply_coupon"]{
    background: transparent !important;
    color: #111 !important;
    border: 2px solid #111 !important;

    box-shadow: none !important;
    text-shadow: none !important;

    /* żeby nie było "dolnego bordera" / podbicia */
    border-bottom-width: 2px !important;
    transform: none !important;
  }

  .woocommerce-cart .cart_totals .wd-coupon-form button[name="apply_coupon"]:hover{
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
  }

  .woocommerce-cart .cart_totals .wd-coupon-form button[name="apply_coupon"]:focus,
  .woocommerce-cart .cart_totals .wd-coupon-form button[name="apply_coupon"]:active{
    box-shadow: none !important;
    outline: none !important;
  }
}








/* === CHECKOUT: kupon – zachowaj toggle + układ 50/50 po rozwinięciu === */

/* 0) Zostaw “Masz kupon? Kliknij tutaj…” (nie ukrywamy info) */
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout .woocommerce-info {
  display: block !important;
}

/* 1) NIE wymuszamy display na form.checkout_coupon
   (WooCommerce samo przełącza display:none/block po kliknięciu .showcoupon) */

/* 2) Usuń sztuczne ograniczenie szerokości formularza kuponu (to u Ciebie kluczowe) */
.woocommerce-checkout .woocommerce-form-coupon,
.woocommerce-checkout .woocommerce-form-login.hidden-form {
  max-width: none !important;
  width: 100% !important;
}

/* 3) Desktop: po rozwinięciu formularza – 2 kolumny 50/50 */
@media (min-width: 768px){
  .woocommerce-checkout form.checkout_coupon {
    /* to zadziała dopiero, gdy formularz jest pokazany (display != none) */
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    align-items: stretch;
    margin: 10px 0 18px;
  }

  /* form-rowy nie mogą mieć floatów i “dziwnych” szerokości z motywu */
  .woocommerce-checkout form.checkout_coupon .form-row {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 50% input */
  .woocommerce-checkout form.checkout_coupon .form-row-first {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  .woocommerce-checkout form.checkout_coupon .form-row-first .input-text {
    width: 100% !important;
    height: 48px !important;
    box-sizing: border-box !important;
  }

  /* 50% button */
  .woocommerce-checkout form.checkout_coupon .form-row-last {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  .woocommerce-checkout form.checkout_coupon .form-row-last button[name="apply_coupon"] {
    width: 100% !important;
    height: 48px !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: transparent !important;
    color: #111 !important;
    border: 2px solid #111 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  .woocommerce-checkout form.checkout_coupon .form-row-last button[name="apply_coupon"]:hover{
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
  }
}

/* 4) Mobile: standard (pod sobą, pełna szerokość) */
@media (max-width: 767px){
  .woocommerce-checkout form.checkout_coupon .form-row {
    width: 100% !important;
    margin: 0 0 10px !important;
  }
  .woocommerce-checkout form.checkout_coupon .form-row-last button[name="apply_coupon"]{
    width: 100% !important;
  }
}
/* Checkout – odstęp pod linkiem "Masz kupon? Kliknij tutaj..." */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
  margin-bottom: 30px !important;
}

/* === CHECKOUT: formularz kuponu – tylko dolna krawędź === */
.woocommerce-checkout
form.checkout_coupon.woocommerce-form-coupon {
  /* reset z motywu / Woo */
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
	border-bottom: 0 !important;
  

  /* spacing */
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 45px !important;

  /* bardzo ważne – WoodMart to ustawia */
  max-width: none !important;
  width: 100% !important;
}





/* CHECKOUT – odstęp między produktami (tbody) a Kwota / Paczka / Łącznie */
.woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot tr:first-child > th,
.woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot tr:first-child > td,
.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child > th,
.woocommerce-checkout #order_review table.shop_table tfoot tr:first-child > td {
  padding-top: 55px !important;
}


/* CHECKOUT – wizualny separator: tło dla podsumowania */
.woocommerce-checkout 
#order_review 
table.shop_table tfoot {
  background: #f6f6f6;
}

/* wewnętrzny oddech */
.woocommerce-checkout 
#order_review 
table.shop_table tfoot th,
.woocommerce-checkout 
#order_review 
table.shop_table tfoot td {
  padding-top: 14px;
  padding-bottom: 14px;
}

/* dodatkowy odstęp od produktów */
.woocommerce-checkout 
#order_review 
table.shop_table tfoot tr:first-child th,
.woocommerce-checkout 
#order_review 
table.shop_table tfoot tr:first-child td {
  padding-top: 32px;
}

/* zaokrąglenia tylko na dole */
.woocommerce-checkout 
#order_review 
table.shop_table tfoot tr:last-child th:first-child {
  border-bottom-left-radius: 8px;
}
.woocommerce-checkout 
#order_review 
table.shop_table tfoot tr:last-child td:last-child {
  border-bottom-right-radius: 8px;
}

  border-top: 1px solid #e3e3e3;
  background: #fafafa;
}

/* Kopia omnibus pod ceną */
.single-product .wooco_summary .iworks-omnibus.omni-clone{
  display: block;
  text-align: right;
  margin: 6px 0 0 0;
  font-size: 13px;
  line-height: 1.2;
  color: #777;
}


/* FIX: strzałki NIE mogą przykrywać całej galerii */
/* Woodmart gallery: Chrome bugfix (overflow:clip + transform) */
.woocommerce-product-gallery__wrapper.wd-carousel {
  overflow: hidden !important; /* zamiast clip */
}

/* nie pozwól żeby wrapper “cinał” slajdy po transformie */
.woocommerce-product-gallery__wrapper .wd-carousel-wrap {
  overflow: visible !important;
}

/* ujednolicenie renderu obrazków (u Ciebie 2 i 3 nie mają klasy wp-post-image) */
.woocommerce-product-gallery__wrapper .wd-carousel-item img:not(.zoomImg) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}




.wd-post-meta {
    display: none !important;
}


[id^="gallery-"] img {
    border: none !important;
}


@media (max-width: 767px){

  .galeria_nav .e-n-accordion-item-title{
      padding-top: 0 !important;
      padding-bottom: 0 !important;
  }

}

.wg-mini-cart-item-blocked{
  cursor: default;
}
.wg-mini-cart-item-blocked a:not(.remove):not(.remove_from_cart_button){
  cursor: not-allowed !important;
  opacity: .75;
}

#uni_cpo_brama_okna_lewe .uni-cpo-option-label:not(:last-child) {
    margin-right: 15px;
}

#uni_cpo_brama_okna_prawe .uni-cpo-option-label:not(:last-child) {
    margin-right: 15px;
}



/* QH: karuzela – twardo usuń wrapp-swatches + nie zostawiaj miejsca */
.wd-carousel .wd-product .wrapp-swatches{
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: none !important;
  pointer-events: none !important;
}




 .kolorallc_ocynk {
    margin-left: 100px;
    margin-right: 100px;
  }

  .kolorallc_czer {
    margin-left: 10px;
    margin-right: 10px;
  }

  .kolorallc {
    margin-left: 10px;
    margin-right: 10px;
  }

  .kolorallc_szary {
    margin-left: 10px;
    margin-right: 100px;
  }

  .kolorallc_grafitowy {
    margin-left: 100px;
    margin-right: 10px;
  }

  .kolorallc_czarny {
    margin-left: 10px;
    margin-right: 100px;
  }

  .kolorallc_antracyt {
    margin-left: 100px;
    margin-right: 10px;
  }

  .kolorallczloto {
    margin-left: 10px;
    margin-right: 10px;
  }




#wymiarywys, 
#wymiarywys2 {
  position: absolute !important;
  left: -9999px !important;
  top: 0 !important;

  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.uni-node-bac868ff-cpo-option-label-rone_kolory {
    margin-bottom: 0 !important;
}

#uni_cpo_jednolity_roznekolory.uni-module 
.uni-cpo-radio-option-label {
    margin-bottom: 0 !important;
}



@media (min-width: 769px) {

    #notice {
        height: calc(100vh - 241px);
    }

    #v3d_iframe {
        height: calc(100vh - 200px);
        width: 100%;
    }

    #centercont {
        height: calc(100vh - 241px);
    }
		
		#menuleft {
    height: calc(100vh - 241px);
		}
	
	#pods {
    height: calc(100vh - 494px) !important;
		}
	 
}
@media (max-width: 768px) {
    #v3d_iframe {
        width: 95%;
        height: 350px;
        margin: 0 auto;
        display: block;
    }
}

#maskowaniekolor{
    height:100px !important;
    bottom:auto !important;
}

/* Omnibus pod ceną – mniejsza czcionka */
p.iworks-omnibus{
  font-size: 12px !important;
  line-height: 1.2 !important;
  margin-top: 6px !important;
  margin-bottom: 0 !important;
  color: inherit !important;
}

/* Sama kwota w omnibusie też ma być mała */
p.iworks-omnibus .woocommerce-Price-amount,
p.iworks-omnibus bdi,
p.iworks-omnibus .woocommerce-Price-currencySymbol{
  font-size: 12px !important;
  font-weight: 600 !important; /* możesz dać 400 jeśli ma być “normalnie” */
}



/* Ustawiamy układ jako flex, żeby kolumny miały równą wysokość */
.wd-post.blog-design-small-images .wd-post-inner {
    display: flex;
    align-items: stretch;
}

#menuleft input {
    border: none !important;
    background: transparent !important;
}




/* Omnibus: "Najniższa cena w ostatnich 30 dni" na czarno */
p.iworks-omnibus,
p.iworks-omnibus * {
  color: #000 !important;
}


#productpricerabatwartosc .rabat-label,
#productpricerabatwartosc .rabat-kwota {
  display: block;
}

#productpricerabatwartosc .rabat-kwota {
  margin-top: 4px;
}

#productpricerabatwartosc {
    text-align: right;
}

#productpricerabatwartosc .rabat-label,
#productpricerabatwartosc .rabat-kwota {
    display: block;
    text-align: right;
}

#productpricerabatwartosc .rabat-kwota {
    font-size: 25px;
    font-weight: 600;
}

#productpricerabatwartosc .rabat-label {
    font-size: 13px;
    opacity: 0.8;
}


#kontcenaword {
	margin-top: 10px;
}

#kontocynk {
    padding-left: 18px;
}

/* =========================
   GLOBAL TOOLTIP dla CPO
   ========================= */

/* każdy kafelek */
.uni-module .uni-cpo-option-label {
    position: relative;
    overflow: visible !important;
}

/* wrapper obrazka */
.uni-module .uni-cpo-option-label__image-wrap[data-tip] {
    position: relative;
    display: inline-block;
    overflow: visible !important;
    cursor: pointer;
    z-index: 2;
}

/* dymek */
.uni-module .uni-cpo-option-label__image-wrap[data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%);
    white-space: nowrap;

    background: rgba(0, 0, 0, 0.9);
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    padding: 6px 8px;
    border-radius: 6px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    z-index: 999999;
}

/* strzałka */
.uni-module .uni-cpo-option-label__image-wrap[data-tip]::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 4px);
    transform: translateX(-50%);

    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid rgba(0, 0, 0, 0.9);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    z-index: 999999;
}

/* hover (na label — stabilniejsze niż span) */
.uni-module .uni-cpo-option-label:hover .uni-cpo-option-label__image-wrap[data-tip]::after,
.uni-module .uni-cpo-option-label:hover .uni-cpo-option-label__image-wrap[data-tip]::before {
    opacity: 1;
    visibility: visible;
}

/* =========================
   FIX na obcinanie tooltipów
   ========================= */

.uni-module,
.elementor-container,
.elementor-column,
.elementor-widget,
#kolorallkont {
    overflow: visible !important;
}





/* zamiana radio w composite domki narzedziowe – wymuszenie kwadratu */
.wooco_component label::before,
.wooco_component label:before,
.wooco-components label::before,
.wooco-components label:before,
.wooco_components label::before,
.wooco_components label:before,
.wooco-component label::before,
.wooco-component label:before,
.wooco_component span::before,
.wooco_component span:before,
.wooco-components span::before,
.wooco-components span:before,
.wooco_components span::before,
.wooco_components span:before,
.wooco-component span::before,
.wooco-component span:before {
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
}





/* Composite product – usuniecie paddinguz komponentu w domki narzedziowe aby wyrownac*/
.wooco_component {
    padding: 0 !important;
}



.woocommerce-shipping-estimate-html {
    display: none !important;
}


/* Odstęp między ceną regularną a promocyjną */
.price del {
    margin-right: 14px !important;
}


#tytulprzesunieciewtylokna {
	padding-bottom: 21px;
}

#kolorramykont {
	padding-bottom: 10px;
}

#tytulprzesunieciewtyldrzwi {
	padding-bottom: 21px;
}


body:not([class*="wrapper-boxed"]) {
    background-color: #f5f5f5;
}


#uni_cpo_formularz_rodzaje_blachy_bramy > .uni-cpo-module-radio-label {
    margin-bottom: 19px !important;
    margin-top: -44px !important;
	color: #020101;
}


#uni_cpo_okna_w_bramach > .uni-cpo-module-checkbox-label {
    margin-top: -44px;
    margin-bottom: 19px;
	color: #020101;
}

#oknotab.tab-disabled-wiata {
    opacity: 0.45;
    cursor: not-allowed !important;
    position: relative;
}

#oknotab.tab-disabled-wiata {
    opacity: 0.45;
    cursor: not-allowed !important;
    position: relative;
    user-select: none;
}

#oknotab.tab-disabled-wiata::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    top: -34px;
    transform: translateX(-50%);
    background: #000000;
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    padding: 6px 10px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 9999;
}

#oknotab.tab-disabled-wiata:hover::after {
    opacity: 1;
}


/* =========================================================
   PODSUMOWANIE – większa czcionka tylko w podsumowaniu
   ========================================================= */
#podsumowaniefull #bloktekstowy .wd-text-block,
#podsumowaniefull #bloktekstowy .wd-text-block p,
#podsumowaniefull #bloktekstowy .wd-text-block strong,
#podsumowaniefull #bloktekstowy .wd-text-block em,
#podsumowaniefull #bloktekstowy .wd-text-block span,
#podsumowaniefull #bloktekstowy .wd-text-block div {
    font-size: 25px !important;
    line-height: 1.5 !important;
}

/* =========================================================
   PODSUMOWANIE – font 25px (pewna wersja)
   ========================================================= */
#bloktekstowy.is-summary .wd-text-block,
#bloktekstowy.is-summary .wd-text-block * {
    font-size: 25px !important;
    line-height: 1.5 !important;
}@media (min-width: 1025px) {
	.widgettitle, .widget-title {
	text-transform: capitalize;
}


.product-labels {
      flex-direction: row !important;
      max-width: 100% !important;
			font-weight: 200 !important;
 }

  .wd-buttons {
    		visibility: none !important;
}



.sticky-column {                   /*aby sticky kolory w galerii były widoczne przy scolowaniu zdjęć*/
    position: sticky;
    position: -webkit-sticky;
    top: 83px; /* 3rem (48px) + 50px */
}

.sticky-parent .elementor-widget-wrap 
{
    display: block!important;
}

/* wyrwnanie ikon mega-menu*/
#menu-shop-maritom {
    display: flex;
    justify-content: center;
}

#menu-shop-maritom .elementor-widget-image-box .elementor-image-box-wrapper,
#menu-shop-maritom .elementor-widget-image-box .elementor-image-box-content {
    text-align: center;
}

#menu-shop-maritom .elementor-widget-image-box .elementor-image-box-img {
    margin-left: auto;
    margin-right: auto;
}


}

@media (max-width: 576px) {
	.wd-buttons.wd-pos-r-t {
    margin-top: 15px;
}

.wd-add-cart-icon {
    display: none;
}

 .product-label {
    min-width: 95% !important;
    font-weight: 500 !important;
 		flex-direction: row !important;
  }


.product-wrapper {
    position: relative; /* Ustawienie pozycji względem tego elementu */
}

.wd-buttons.wd-pos-r-t {
    position: absolute; /* Ustawienie pozycji absolutnej względem rodzica (product-wrapper) */
    top: 1px; /* Możesz dostosować tę wartość w zależności od preferencji */
    right: 5px; /* Odległość 5px od prawej krawędzi */
}


@media (max-width: 767px) {
  .elementor-element-c450201 {
    top: 3px !important; /* zwiększaj wartość aż będzie idealnie */
  }
}
.wd-coupon-form .button {
    flex: 0 0 auto;
    border-radius: var(--btn-accented-brd-radius);

    /* WYGLĄD */
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;

    /* zachowujemy typografię WoodMarta */
    text-transform: var(--btn-accented-transform, var(--btn-transform, uppercase));
    font-weight: var(--btn-accented-font-weight, var(--btn-font-weight, 600));
    font-family: var(--btn-accented-font-family, var(--btn-font-family, inherit));
    font-style: var(--btn-accented-font-style, var(--btn-font-style, unset));

    box-shadow: none !important;
}

.wd-coupon-form .button:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
}


.woocommerce-form-coupon .button {
    border-radius: var(--btn-accented-brd-radius);

    /* WYGLĄD */
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;

    /* wyłączamy cień WoodMarta */
    box-shadow: none !important;

    /* zachowujemy typografię */
    text-transform: var(--btn-accented-transform, var(--btn-transform, uppercase));
    font-weight: var(--btn-accented-font-weight, var(--btn-font-weight, 600));
    font-family: var(--btn-accented-font-family, var(--btn-font-family, inherit));
    font-style: var(--btn-accented-font-style, var(--btn-font-style, unset));
}


.woocommerce-form-coupon .button:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-bottom: 0px !important;
}


@media (max-width: 767px) {
  .wd-carousel .wd-carousel-item {
    display: flex;
  }
  .wd-carousel .wd-product,
  .wd-carousel .product-wrapper {
    width: 100%;
  }
}


.wd-product .product-element-top .product-image-link {
  position: relative;
  display: block;
  padding-top: 36px;  /* robi miejsce */
}

.wd-product .product-element-top .product-image-link .advanced-woo-labels {
  top: 0 !important;  /* trzyma się góry linku */
}

.wd-product .product-element-top .product-image-link img {
  margin-top: 0 !important; /* bo padding już zrobił miejsce */
  display: block;
}




/* 3 kolumny dla kolorów */
.wd-product .wpclv-terms {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  justify-items: center;
}

/* wyłącz ewentualny flex z motywu */
.wd-product .wpclv-term {
  margin: 0 !important;
}

/* żeby obrazki były wycentrowane */
.wd-product .wpclv-term-image {
  display: flex;
  justify-content: center;
  align-items: center;
}


.wpclv-attribute-label {
    padding-left: 10px !important;
}



/* =====================================================
   MOBILE: scroll na #kolorallleft (a nie na samych kolorach)
   ===================================================== */
@media (max-width: 768px){

  /* SCROLL MA BYĆ TUTAJ */
  #kolorallleft{
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding: 0 10px 10px !important;
  }

  /* #kolorallkont niech nie ucina */
  #kolorallkont{
    overflow: visible !important;
  }

  /* ZAWARTOŚĆ (kolory) ma być szeroka i w jednej linii, ale bez własnego scrolla */
  #uni_cpo_wszystkie_kolory_all{
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;

    overflow: visible !important;       /* <- wyłączamy scroll tutaj */
    white-space: nowrap;

    gap: 10px;
    padding: 0 !important;              /* padding jest na #kolorallleft */
    margin: 0 !important;
  }

  /* Inputy chowamy */
  #uni_cpo_wszystkie_kolory_all input[type="radio"]{
    position: absolute !important;
    left: -9999px !important;
  }

  /* Kafelki */
  #uni_cpo_wszystkie_kolory_all label.uni-cpo-option-label{
    flex: 0 0 auto !important;
    display: inline-flex !important;
    flex-direction: column;
  }

  /* Obrazki */
  #uni_cpo_wszystkie_kolory_all .uni-cpo-option-label__image{
    display: block;
    max-width: 100%;
    height: auto;
  }
}


/* =========================================================
   MOBILE: maks 203px dla aplikacji (i dla Verge)
   ========================================================= */
@media (max-width: 768px){

  /* 1) Kontener aplikacji */
  #apllikation_center{
    height: 203px !important;
    max-height: 203px !important;
    min-height: 203px !important;
    overflow: hidden !important;
  }

  /* 2) Jeśli Verge jest w iframe */
  #v3d_iframe{
    height: 203px !important;
    max-height: 203px !important;
    min-height: 203px !important;
    width: 100% !important;
    display: block !important;
  }

  /* 3) Jeśli Verge jest embed (div + canvas) */
  #v3d-container{
    height: 203px !important;
    max-height: 203px !important;
    min-height: 203px !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  /* KLUCZ: canvas ma być 203px (przebija inline 644px) */
  #v3d-container canvas.v3d-canvas{
    height: 203px !important;
    width: 100% !important;
    display: block !important;
  }

  /* 4) #centercont na mobile NIE może wymuszać wysokości vh */
  #centercont{
    height: auto !important;       /* najbezpieczniej */
    min-height: 0 !important;
  }

}




@media (max-width: 768px){
  #menukontener{
    position: fixed !important;
    top: 45px !important;   /* <- tu ustawiasz przesunięcie */
    left: 0;
    right: 0;
    z-index: 99999 !important;
  }
}

@media (max-width: 768px){

  #centercont{
    margin-top: 75px !important;
  }

}

@media (max-width: 768px){

  /* oba loga (normalne i półprzezroczyste) */
  #center img[src$="maritom-logo.svg"]{
    height: 90px !important;              /* 180 -> 90 */
    width: auto !important;

    left: calc(50% - 102px) !important;   /* 204 -> 102 */
    top:  calc(50% - 45px) !important;    /* 90 -> 45 */
  }

  /* napis "Loading.. 100%" też trzeba przeskalować, bo top masz zależny od logo */
  #center #loadingtks,
  #center #procent{
    font-size: 22px !important;           /* opcjonalnie */
  }

  /* kontener z tekstem przesuwamy o połowę (był +90px) */
  #center > div[style*="top: calc(50% + 90px)"]{
    top: calc(50% + 45px) !important;
    left: calc(50% - 120px) !important;   /* możesz zmniejszyć jeśli ma się mieścić */
  }

}


@media (max-width: 768px) {

    .uni-node-755c37f0 .uni-cpo-option-label__text-content {
        width: 328px !important;
        box-sizing: border-box;
    }

}


@media (max-width: 767px) {

  .uni-node-065969e9 .uni-cpo-option-label__text-content {
      width: 350px !important;   /* albo np. 240px jeśli ma być stała */
  }

}

@media (max-width: 767px) {

    .uni-node-d53f70fe input:checked + label .uni-cpo-option-label__text-content {
        border-color: #e8e8e8 !important;
        background-color: #ffffff !important;
    }

}

@media (max-width: 1024px) {

    #uni_cpo_input_przednie_y_1 input {
        text-align: left !important;
        padding-right: 0 !important;
        padding-left: 10px !important;
    }

}

@media (max-width: 767px) {
    #menuleft input {
        padding-right: 61px !important;
    }
}

@media (max-width: 1024px) {

    .uni-node-0cc676bb .uni-cpo-option-label__text-content,
    .uni-node-619372cd .uni-cpo-option-label__text-content,
    .uni-node-54adaf2b .uni-cpo-option-label__text-content,
    .uni-node-d53f70fe .uni-cpo-option-label__text-content {
        width: 350px !important;
        display: block !important;
    }

}


@media (max-width: 1024px) {

    .single_add_to_cart_button {
        display: block !important;
        width: 69% !important;
        max-width: 69% !important;
        box-sizing: border-box !important;
				margin-right: 15px;
    }

}

@media (max-width: 1024px) {

    .quantity {
        margin-left: 15px !important;
    }

}


@media (max-width: 1024px) {
    #productpricerabatwartosc {
        text-align: right !important;
			margin-right: 6px;
    }
}



@media (max-width: 768px) {
    .uni-node-6b319a44 .uni-cpo-option-label__image-wrap img {
        margin-left: 156px !important;
        
    }
}



/* =====================================================
   MOBILE: scroll na #szerandwys
   #szerokosckonf i #dlugosckonf obok siebie
   ===================================================== */
@media (max-width: 768px){

  #szerandwys{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    gap: 10px;
    padding: 0 10px 10px;

    height: 100px;           /* KLUCZOWE */
    align-items: center;     /* wyśrodkowanie pionowe */
  }

  #szerokosckonf,
  #dlugosckonf{
    flex: 0 0 280px;
    min-width: 550px;
    max-width: 550px;

    height: 100%;            /* żeby dopasowały się do 120px */
    display: flex;
    align-items: center;     /* wyśrodkowanie zawartości */
  }
}

/* =====================================================
   MOBILE: scroll na #rodzadach (Elementor fix)
   ===================================================== */
@media (max-width: 768px){

  #rodzadach{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;

    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;

    gap: 10px;
    padding: 0 10px 10px;
    height: 100px;
    align-items: flex-start;
  }

  #rodzadach > .e-con{
    width: auto;
    flex-direction: row;
  }

  #dachblacha{
    flex: 0 0 114px;
    min-width: 114px;
    max-width: 114px;
  }

  #ookuciadachu{
    flex: 0 0 176px;
    min-width: 176px;
    max-width: 176px;
    padding-top: 32px;
  }

  #dodajrynnykolor{
    flex: 0 0 112px;
    min-width: 112px;
    max-width: 112px;
  }
}



/* =====================================================
   MOBILE: scroll na #rodzaje_bram
   z poprawką dla suwaków
   ===================================================== */
@media (max-width: 768px){

  #rodzaje_bram{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    gap: 10px;
    padding: 0 10px 10px;
    height: 100px;
    align-items: flex-start;
  }

  #rodzaje_bram > .e-con{
    width: auto;
    flex-direction: row;
    flex-shrink: 0;
  }

  /* mniejsze bloki */
  #rodzaj_blachy{
		 padding-top: 10px;
    flex: 0 0 137px;
    min-width: 137px;
    max-width: 137px;
  }

  #oknawbramienew{
		 padding-top: 10px;
    flex: 0 0 120px;
    min-width: 120px;
    max-width: 120px;
  }

  #kolorokienbramiii{
		 padding-top: 10px;
    flex: 0 0 120px;
    min-width: 120px;
    max-width: 120px;
  }

  /* bloki z suwakami — szersze */
  #wysokosckonfgaraz,
  #wys_bramy,
  #szer_bramy,
  #przesunieciebramy{
		 padding-top: 10px;
    flex: 0 0 260px;
    min-width: 260px;
    max-width: 260px;
  }

  /* wewnętrzne elementy suwaka */
  #wysokosckonfgaraz .irs,
  #wys_bramy .irs,
  #szer_bramy .irs,
  #przesunieciebramy .irs{
    width: 100%;
  }

}
}