:root {
    --th-color-primary-dark: #026089;
    --th-color-text: #333;
    --th-color-white: #fff;
    --th-color-blue-light: #e6eff2;
    --th-color-red: #9a0101;
    --th-gap: 20px;
    --th-col-width: calc(33.333% - 20px); /* 3 per row */
    --th-col-width-70: 70%;
    --th-col-width-30: 30%;
    --th-col-width-50: 47%;
    --th-flex-direction: row;
}

@media (min-width:768px) and (max-width:1190px){
    :root {
    --th-col-width: 100%;
    --th-col-width-70 : 50%;
    --th-col-width-30: 50%;
    --th-col-width-50: 100%;
    --th-flex-direction: row;
  }
}

@media (max-width:767px){
    :root {
    --th-col-width: 100%;
    --th-col-width-70 : 100%;
    --th-col-width-30: 100%;
    --th-col-width-50: 100%;
    --th-flex-direction: column;
  }
}

/*/oma-tili/view-order/17133/*/
.order-again{
    display: none !important;
}

/*Common css*/
.blue-arrow{
    color: var(--e-global-color-secondary);
    transition: transform 0.3s;
    display: inline-block;     
}

a{
    transition: transform 0.3s;
}

a:hover .blue-arrow{
    transform: translateX(5px);
}

.jet-listing-dynamic-link{
    a:hover{
     transform: translateX(5px);
    }
}

.msg-error{
   color: var( --th-color-red);
}

.add-to-cart-button{
    font-size: 15px !important;
    padding: 12px 24px !important;
    &:hover{
    background-color: var(--th-color-primary-dark) !important;
    }
}


.elementor-button{
    &:hover{
        transform: translateY(-5px);
    }
}

a.elementor-element{
    transition: ease 0.3s all;

    &:hover{
        transform: scale(1.02);
    }
}



.add-to-cart-message{
    margin-left: calc(var( --th-gap) * 0.5);
}

#cart-email-btn{
    margin-top: calc(var(--th-gap) * 0.5);
    background-color: var(--e-global-color-secondary) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    font-family: "Barlow", Sans-serif;
    font-weight: 400;

    &:hover{
     background-color: var(--th-color-primary-dark) !important;
    }
}

#cart-email-response{
    margin: calc(var(--th-gap) * 0.5) 0;
}



/* Links, ul in the content */
.elementor-widget-woocommerce-product-content, body:not(.home) .elementor-widget-text-editor,
.post-template-default .article-container{
    ul, ol{
        margin-bottom: var(--th-gap) !important;
    }
    a{
        color: var(--e-global-color-secondary) !important;
        &:hover{
            border-bottom: 1px solid var(--e-global-color-secondary);
        }
    }
}
.more-info-box{
     a{
        color: var(--e-global-color-secondary) !important;
        &:hover{
            border-bottom: 1px solid var(--e-global-color-secondary);
        }
    }
}


/* Woocommerce message */

.woocommerce-message{
    border-top-color: var(--e-global-color-secondary) !important;
    &:before{
        color: var(--e-global-color-secondary) !important;
    }
}

/* Header swrink logo */

.jet-sticky-section{
    height:  auto !important;
}
.jet-sticky-section, .jet-sticky-section--stuck{
     img{
        transition: 200ms ease-in-out;
    }
}
.jet-sticky-section--stuck{
    img{
        width: 85% !important;
    }
}

/* Header menu */

header {
    .jet-mega-menu-list{
        .jet-mega-menu-item__desc{
            display: none;
        }
    }
}


/* Header search*/


header .jet-search button.jet-search__popup-trigger{
    background-color: transparent !important;
    color: var(--e-global-color-primary);
}

#header-search-icon{
 cursor: pointer;
}
header .jet-ajax-search__form{
    display: none;
}

header .jet-ajax-search__results-area{
    min-width: 300px;
}

/* Search field */

.jet-search__field:focus-visible{
    outline: none !important;
}


/* Custom breadcrumb*/
.custom-breadcrumb{
    font-size: 0.875rem;
    a{
        &:hover{
            color: var(--th-color-primary-dark);
        }
    }
}
.custom-breadcrumb .fa-angle-right{
    font-size:  0.875rem;
    color: var(--e-global-color-secondary);
    padding: 0 5px;
}


/* tax-product_cat, page-template-default page */

.tax-product_cat, .tax-product_brand, body:not(.home).page-template-default, 
.post-template-default .article-container
{
    h2{
        font-size: 1.375rem !important;
    }
    h3{
        font-size: 1.125rem !important;
    }
}



/* Single product gallery */

.single-product .jet-woo-product-gallery__image-link img {
    height: 400px;
    width: 100%;
    object-fit: contain;
}


.single-product .jet-woo-swiper-control-thumbs__item-image img{
    height: 80px;
    width: 100%;
    object-fit: contain;
}


/* Single product selection*/

.product-selection .product-attributes-form {
    display: flex;
    flex-direction: var(--th-flex-direction);
    gap: var(--th-gap);
}

.product-selection .product-attributes-form .left-wrapper {
    width: var(--th-col-width-70);
    box-sizing: border-box;
    margin-bottom: var(--th-gap);
}

.product-selection .product-attributes-form .right-wrapper {
    width: var(--th-col-width-30);
    box-sizing: border-box;
}


.product-selection .left-wrapper .select-wrapper{
    display: flex;
    flex-wrap: wrap;
    gap: 20px; 
}


.product-selection .right-wrapper  .inner-wrapper{
    background-color: var(--e-global-color-0c3351a);
    border-radius: 10px;
    padding: 20px;
}

.product-selection .right-wrapper  .inner-wrapper .p-price-title{
    font-size: 1.5rem;
    font-weight: 700;
}

.product-selection .right-wrapper  .inner-wrapper .p-price{
    font-size: 0.95rem;
    font-weight: 700;
  
}

.product-selection .right-wrapper  .p-price-inner-wrapper{
    display: flex;
    align-items: end;

}

.product-selection .p-price-wrapper .p-unit-price{
    font-size: 1.575rem;
    font-weight: 700;
    color: var(--e-global-color-secondary);

}

.product-selection .right-wrapper  .p-price-inner-wrapper .p-price-detail{
    font-size: 0.85rem;
    padding-left: 20px;
    padding-bottom: 2px;
}

.product-selection .right-wrapper  .p-qty{
    font-weight: 700;
    margin-bottom: 20px;
}
.product-selection .right-wrapper  .p-qty label{
    margin: 20px 0 10px 0;

}

.product-selection .right-wrapper  .p-qty .product-quantity{
    border: 1px solid var(--e-global-color-secondary);
    border-radius: 10px;
    max-width: 100px;
    background-color: var(--th-color-white);
}

.product-selection .left-wrapper  .attribute-wrapper {
    flex: 0 0 var(--th-col-width);
    box-sizing: border-box;
}

.product-selection .left-wrapper .attribute-wrapper label{
    font-weight: 700;
    padding-bottom: calc(var( --th-gap) * 0.5);
}

.product-selection .left-wrapper .attribute-wrapper select.product-attribute {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--e-global-color-secondary);
  color: var(--th-color-white);
  border: 0;
  padding: 15px 25px;
  border-radius: 10px;
  line-height: 1.2;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 320 512'><path d='M143 352.3L7 216.3C-2.3 207-2.3 191 7 181.7l14.1-14.1c9.4-9.4 24.6-9.4 33.9 0l119 119 119-119c9.4-9.4 24.6-9.4 33.9 0l14.1 14.1c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.2-24.4 9.2-33.8-.3z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 20px 16px;
  option{
    background-color: var(--th-color-white) !important;
    color: var(--e-global-color-text);
    &:hover{
      background-color: var(--e-global-color-secondary) !important;
    }
  }
}

.product-selection .left-wrapper .attribute-wrapper select.product-attribute::-ms-expand {
  display: none;
}

.product-selection .left-wrapper .attribute-wrapper select.product-attribute:focus {
  outline: none;
}


.max-quantity-warning, .min-quantity-warning{
    margin-top: var(--th-gap);
    font-size: 15px !important;
}


/*Taxonomy product page*/
#tax-select-filter{
    select.jet-select__control{
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 320 512'><path d='M143 352.3L7 216.3C-2.3 207-2.3 191 7 181.7l14.1-14.1c9.4-9.4 24.6-9.4 33.9 0l119 119 119-119c9.4-9.4 24.6-9.4 33.9 0l14.1 14.1c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.2 9.2-24.4 9.2-33.8-.3z'/></svg>");
        background-repeat: no-repeat;
        background-position: right 12px center;
        background-size: 20px 16px;
        line-height: 1.2;
        cursor: pointer;
        padding: 10px 15px;
        option{
            background-color: var(--th-color-white) !important;
            color: var(--e-global-color-text);
            &:hover{
            background-color: var(--e-global-color-secondary) !important;
            }
        }

        &:focus {
        outline: none;
        }
    }
}



/* Default price */

.p-default-price-wrapper {
    color: var(--e-global-color-secondary);

    .default-unit-price{
        font-size: 1.475rem;
        font-weight: 700;
    }

    .default-quantity{
        font-weight: 500;
        span{
            padding: 0 5px;
        }
    }
  
}


/* Single product order more */

.order-more{
    margin-top:  var(--th-gap);
    padding: var(--th-gap);
    background-color: var(--e-global-color-secondary);
    border-radius: 10px;
    color: var(--th-color-white);
    display:flex;
    gap: var(--th-gap);
    .order-more-text{
        width: 70%;
        a{
            color: var(--th-color-white);
            &:hover{
                text-decoration: underline;
            }
        }
    }
    .order-more-img{
        width: 30%;
    }

}


/* Single product leveys and korkeus input*/

.leveys-korkeus-wrapper{
    display: flex;
    gap: var(--th-gap);
    margin-bottom: var(--th-gap);
}

.leveys-korkeus-wrapper .inner-wrapper{
    flex: 0 0 var(--th-col-width);
    box-sizing: border-box;
}

.leveys-korkeus-wrapper .inner-wrapper label{
    font-weight: 700;
    margin-bottom: 10px;
}

.leveys-korkeus-wrapper .inner-wrapper input{
    background-color: transparent;
    border-radius: 10px;
    border: 1px solid var(--e-global-color-secondary);
    color: var(--e-global-color-text);
    padding: 12px 25px;

}

.leveys-korkeus-wrapper .inner-wrapper input:focus{
    outline: 0;
}

.leveys-korkeus-wrapper .inner-wrapper input::placeholder{
    color: var(--e-global-color-text);
}

.leveys-korkeus-wrapper .inner-wrapper .pinta-ala{
    font-weight: 700;
}

/* Single product kokotaulukko-attributes */

.kokotaulukko-attributes{
    display: flex;
    gap: 5px;
    margin-bottom: var(--th-gap);
    flex-wrap: wrap;
}

.kokotaulukko-attributes .kokotaulukko-term{
    display: flex;
    flex-direction: column;
}

.kokotaulukko-title{
    font-weight: 700;
}

.kokotaulukko-attributes .kokotaulukko-term label{

    margin-bottom: 10px;

}

.kokotaulukko-attributes .kokotaulukko-term input{
    background-color: transparent;
    border-radius: 10px;
    border: 1px solid var(--e-global-color-secondary);
    color: var(--e-global-color-text);
    padding: 5px;
    max-width: 65px;
}

.kokotaulukko-attributes .kokotaulukko-term input:focus{
    outline: 0;
}

/* Single product upload, extra info */

.upload-extra-info-wrapper{
    display: flex;
    gap: var(--th-gap);
    flex-wrap: wrap;
    margin-bottom: var(--th-gap);

}


.product-extra-info-wrapper{
     
    .extra-info-title{
        font-weight: 700;
        margin: 20px 0 10px;
    }

    .product-extra-info{
        border-radius: calc(var(--th-gap) * 0.5);
        border: 2px solid var(--border);
        &:focus{
            outline-color: var(--e-global-color-secondary);
        }
    }
}



.custom-file-upload-wrapper, .product-extra-info-wrapper{
    flex: 0 0 var(--th-col-width-50);
    box-sizing: border-box;
}


.file-drop-area, .product-extra-info{
    min-height: 150px;
}


/* Single Asiakaskokemus */

.type-asiakaskokemuksia{
    .elementor-gallery__titles-container{
        display: none;
    }
}




/* Sidebar menu */
.th-sidebar-menu, .th-sidebar-pages {
    width: 100%;
}

.th-menu-parent {
    margin-bottom: 8px;
    border-radius: 4px;
    overflow: hidden;
}

.th-parent-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--e-global-color-secondary);
    color: var(--th-color-white);
    padding: 5px 0 5px 15px;
    border-radius: calc(var( --th-gap) * 0.5);
    transition: ease-in-out 200ms;
}

.th-parent-header:hover{
        background: var(--th-color-primary-dark);
}


.th-parent-link {
    color: var(--th-color-white) !important;
    text-decoration: none;
    font-weight: 400;
    flex: 1;
    font-family: var(--exo-font) !important;
    text-transform: uppercase;
}

.th-menu-toggle {
    background: transparent !important;
    border: none;
    color: var(--th-color-white);
    font-size: 16px;
    cursor: pointer;
    border-radius:  0 !important;
    padding: 0.2rem 1rem !important;
}
.th-menu-toggle:hover, .th-menu-toggle:focus {
    background: transparent !important;
}

.th-menu-parent.active .th-parent-header {
    background: var(--th-color-primary-dark);
}

.th-submenu {
    list-style: none;
    margin: 0;
    padding: 0 0 0 var( --th-gap);
}

.th-submenu li:not(:last-child){
 border-bottom: 2px solid var(--e-global-color-0c3351a);
}

.th-submenu li a {
    display: block;
    padding: 8px 0;
    color: var( --e-global-color-primary );
    text-decoration: none;
    font-weight: 700;
    font-family: var(--e-global-typography-d8b13bd-font-family) !important;
   
    transition: 200ms ease-in-out;
}


.th-submenu li.active .th-child-header a,.th-submenu li.g-active  a, .th-submenu li a:hover {
    color: var(--e-global-color-secondary);
}

.th-child-header{
    display: flex;
    .th-menu-toggle-grandchild{
        background: transparent !important;
        border: none;
        color: var(--th-color-text);
        font-size: 16px;
        cursor: pointer;
        border-radius:  0 !important;
        padding: 0.2rem 1rem !important;
        i{
            color: var(--th-color-text);
            
            &:hover{
                color: var(--e-global-color-secondary);
            }
        }
    }
}

/* Side cart*/

.xoo-wsc-ft-buttons-cont .xoo-wsc-ft-btn, .xoo-wsc-btn{
    border-radius: 20px;
}

.xoo-wsch-section .xoo-wsch-text{
    font-family: var(--e-global-typography-d8b13bd-font-family), Sans-serif !important;
    font-size: var(--e-global-typography-aae159d-font-size) !important;
    font-weight: 700;
}

.xoo-wsc-product .variation dt{
    font-weight: 700;
}

.xoo-wsc-cart-active {
    .xoo-wsc-pname{
        display: none;
    }
}


/* Footer */

.home footer .elementor-element-eb217e8{
    margin-top:  0 !important;
}

footer{
    
        a{
            transition: none !important;
            &:hover{
                color: var(--e-global-color-secondary) !important;
            }
        }
    
}


