/*
Theme Name: Storefont Child
Theme URI: https://example.com
Description: A child theme for Storefront
Author: Jure
Author URI: https://kratko.si
Template: storefront
Version: 1.0.71
*/

/*header background: linear-gradient(0deg, #8dc3cf59 0%, #68c5db4f 22%, #68c5db 100%), linear-gradient(90deg, #68c5db, transparent)
mobilni meni: element.style {
    position: absolute;
    right: 0.41575em;
    right: -19px;
    height: 100%;
    top: 0;
    border: none;
    border-radius: 0;
    background: #68c5db;
    width: 50%;
    box-shadow: none;
    border-left: 2px solid #000000;
}
.storefront-primary-navigation .menu-toggle {
    margin-right: 1.41575em;
    background: linear-gradient(0deg, #8dc3cf, #ade3ef);
    border: 2px solid #308093;
    border-radius: 4px;
    padding: 0.718047em 1.675em 0.718047em 2.617924em;
    box-shadow: inset 1px 1px 6px #308093cc, 1px 1px 6px #30809336;
    border-left: none;
    border-right: none;
    border-top: 2px solid #99e6f9;
    border-radius: 16% 84% 18% 82% / 79% 23% 77% 21%;
}
.onsale {
    background: conic-gradient(from 45deg, #ff4000 61%, #ff5700 47%, #ff6e00 29%, #ff8500 21%);
    box-shadow: inset 2px 2px 10px 0px #ffffffbf;
    color: #1E0E0E;
    color: white;
    text-shadow: 0 0 2px white;
    text-shadow: 3px 3px 4px white, 3px -3px 4px white, -3px 3px 4px white, -3px -3px 4px white, 3px 3px 4px white, 3px -3px 4px white, -3px 3px 4px white, -3px -3px 4px white, 3px 3px 4px white, 3px -3px 4px white, -3px 3px 4px white, -3px -3px 4px white;
    text-shadow: 3px 3px 4px black, 3px -3px 4px black, -3px 3px 4px black, -3px -3px 4px black, 3px 3px 4px black, 3px -3px 4px black, -3px 3px 4px black, -3px -3px 4px black, 3px 3px 4px black, 3px -3px 4px black, -3px 3px 4px black, -3px -3px 4px black;
    text-shadow:3px 3px 4px #34c6f6, 3px -3px 4px #34c6f6, -3px 3px 4px #34c6f6, -3px -3px 4px #000000, 3px 3px 4px #34c6f6, 3px -3px 4px #34c6f6, -3px 3px 4px #34c6f6, -3px -3px 4px #000000, 3px 3px 4px #34c6f6, 3px -3px 4px #34c6f6, -3px 3px 4px #34c6f6, -3px -3px 4px #000000
    font-size: 16px;
    border: 1px solid #ff4000;
    border-radius: 84% 16% 84% 16% / 16% 84% 16% 84%;
}*/

a:focus {
    outline:none;
}

.woocommerce-tabs ul.tabs li {
    background: #68c5db99;
    border-radius: 0 7px 7px 0;
    border-bottom: 1px solid #eee;
    width: calc(100% - 10px);
    padding: 0 1em;
}

.woocommerce-tabs ul.tabs li.active {
    background: #68c5db4f;
    width: 100%;
}

.woocommerce-tabs ul.tabs li a, 
.woocommerce-tabs ul.tabs li.active a {
    color: #02182B;
}

.woocommerce-tabs ul.tabs li.active a:focus, 
.woocommerce-tabs ul.tabs li a:focus {
    outline:none;
}

@media (max-width: 768px) {
    .woocommerce-tabs ul.tabs li.active::after {
        opacity: 1;
        right: 1em;
    }
    .woocommerce-tabs ul.tabs li {
        width: 100%;
    }
}

.onsale {
    background: conic-gradient(from 45deg, #ff4000 61%, #ff5700 47%, #ff6e00 29%, #ff8500 21%);
    box-shadow: inset 2px 2px 10px 0px #ffffffbf;
    color: white;
    text-shadow: 0 0 2px #000000;
    font-size: 16px;
    border: 1px solid #ff4000;
}

.storefront-breadcrumb {
    margin: 0 0 0.706326em;
}

@media (min-width: 768px) {
    .storefront-breadcrumb {
        margin: 0 0 0.706326em;
    }
}

select {
    padding: .6180469716em;
    background: #f2f2f2;
    color: #43454b;
    border: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.125);
}

button:focus {
    outline: none;
}

.dgwt-wcas-open-pirx .dgwt-wcas-open .dgwt-wcas-suggestions-wrapp {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 6px 1px;
    border-radius: 7px;
}

.dgwt-wcas-om-bar.js-dgwt-wcas-om-bar {
    border-bottom: 1px solid #c7c7c7;
    background: linear-gradient(135deg, #eaeff1, #f3f6f7a3);
    box-shadow: 0px 1px 3px rgba(0,0,0,0.3);
}

.dgwt-wcas-open-pirx.dgwt-wcas-overlay-mobile-on .dgwt-wcas-om-bar button.dgwt-wcas-om-return {
    background: linear-gradient(0deg, #8dc3cf, #ade3ef);
    border-radius: 0 0 7px 0;
}

.dgwt-wcas-overlay-mobile {
    background: linear-gradient(0deg, #9eccd6, #bfe9f2, white);
}

.dgwt-wcas-overlay-mobile {
    background: linear-gradient(0deg, #9eccd6, #bfe9f2, white);
    background: url('data:image/svg+xml,<svg height="200px" width="200px" version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-256 -256 1024 1024" xml:space="preserve" fill="%23000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><style type="text/css"> .st0 { fill: %239eccd6; } </style><g><path class="st0" d=" M312.069,53.445 c-71.26-71.26-187.194-71.26-258.454,0 c-71.261,71.26-71.261,187.206,0,258.466 c71.26,71.26,187.194,71.26,258.454,0 S383.329,124.705,312.069,53.445z M286.694,286.536 c-57.351,57.34-150.353,57.34-207.704-0.011 s-57.351-150.353,0-207.693 c57.351-57.351,150.342-57.351,207.693,0 S344.045,229.174,286.694,286.536z " ></path><path class="st0" d=" M101.911,112.531 c-29.357,37.725-31.801,89.631-7.321,129.702 c1.877,3.087,5.902,4.048,8.978,2.182 c3.065-1.888,4.037-5.903,2.16-8.978 c-21.666-35.456-19.506-81.538,6.469-114.876 c2.226-2.837,1.713-6.938-1.135-9.154 C108.227,109.193,104.125,109.695,101.911,112.531z " ></path><path class="st0" d=" M498.544,447.722 l-132.637-129.2 c-7.255-7.07-18.84-6.982-26.008,0.174 l-21.033,21.033 c-7.156,7.156-7.234,18.742-0.153,25.986 l129.19,132.636 c14.346,17.324,35.542,18.35,51.917,1.964 C516.216,483.951,515.857,462.068,498.544,447.722z " ></path></g></g></svg>'),
    linear-gradient(0deg, #9eccd6, #bfe9f2, white);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}


.site-footer {
    background:linear-gradient(0deg, #8dc3cf, #ade3ef);
    padding: 1.618em 0 1.806326em;
}

.site-footer .custom-logo-link img {
    height: 100px;
    width: 103px;
}

.site-footer .site-info {
    display:none;
}

.custom-footer {
    display: flex;
    color: #02182b;
    justify-content:center;
    gap:39px;
}

.custom-footer--child {
    width:fit-content;
    padding: 1em;
}

.custom-footer ul {
    margin: 0;
    list-style-type: none;
}

.custom-footer ul li {
    margin-bottom: 0.3em;
}

.custom-footer ul li a {
    text-decoration:none;
}

.site-footer .custom-footer ul li a:hover {
    color: #43596c;
}

/* For mobile screens */
@media (max-width: 768px) {
    .custom-footer {
        flex-direction: column;
        gap:0;
    }
    .custom-footer div {
        width:100%;
    }
    .custom-footer nav {
        padding-bottom: 3.5em;
    }
}

/* Ensure the dropdown opens on click, not hover */
.category-menu-item .sub-menu {
    display: none;
    position: absolute;
    background-color: #fff;
    z-index: 999;
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-menu-item.menu-item-has-children > a::after {
    margin-left: 5px;
}

.category-menu-item.menu-item-has-children.open > .sub-menu {
    display: block;
}

/* Submenu styles */
.sub-menu li {
    padding: 10px;
    border-bottom: 1px solid #eee;
}

/* Make the dropdown fully responsive */
@media (max-width: 768px) {
    .category-menu-item .sub-menu {
        position: relative;
        display: block;
    }
}

.storefront-handheld-footer-bar li a {
    background: linear-gradient(0deg, #8dc3cf, #ade3ef);
}

.storefront-primary-navigation {
    background: linear-gradient(0deg, #8dc3cf, #ade3ef);
}

.site-header {
    background:linear-gradient(0deg, #8dc3cf59 0%, #68c5db4f 22%, #68c5db 100%), linear-gradient(90deg, #68c5db, transparent);
    border:none;
}

.site-header .custom-logo-link {
    display: flex;
    position: relative;
}

.show-site-title__titleDiv {
    display: flex;
    flex-direction: column;
    margin-top: auto;
    position: absolute;
    left: 117px;
    bottom:4px;
    min-width: 179px;
}

.site-header .custom-logo-link .show-site-title__titleDiv h1 {
    display: block;
    margin-block: 0;
    margin-block-end: 2px;
    color: #02182b;
    font-weight:700;
}

.site-header .custom-logo-link .show-site-title__titleDiv p {
    line-height: 21px;
}

.site-header .custom-logo-link .show-site-title__titleDiv p span {
    letter-spacing: 1px;
}

@media screen and (max-width: 434px) {
    .show-site-title__titleDiv h1 {
        font-size:24px;        
    }   
}

.show-site-title__titleDiv p {
    margin-block: 0;
    color: #02182b;
}

.site-header .custom-logo-link img {
    height: 100px;
    width: 103px;
}

.site-header {
   padding-top: 1em;
   padding-bottom:0;
}

.site-branding {
    margin-bottom: 1em;
}

@media screen and (max-width: 767px) {
    .site-header .site-branding {
        width: auto !important;
        padding: 0;
    }
    
    .storefront-primary-navigation {
        background:transparent;
    }
    .storefront-primary-navigation .col-full {
        margin:0;
        padding:0;
    }
    .storefront-primary-navigation .menu-toggle {
        margin-right:1.41575em;
        border:none;
        border-top: 2px solid #02182b;
        border-bottom: 2px solid #02182b;
        border-radius: 4px;
        padding: 0.718047em 1.675em 0.718047em 2.617924em;
    }
    .handheld-navigation {
        background: linear-gradient(0deg, #8dc3cf, #ade3ef);
        padding: 0 1.41575em;
    }
    .main-navigation.toggled .handheld-navigation {
        border-radius: 7px;
        margin: 5px;
        box-shadow: 0px 4px 6px 1px rgba(0,0,0,0.3);
    }
    .handheld-navigation ul.menu li {
        border-bottom: 1px solid #eee;
    }
    .handheld-navigation ul.menu li:last-of-type {
        border:none;
    }
    .handheld-navigation ul.menu .sub-menu.toggled-on {
        background: #ccf2fb;
        border-radius: 7px;
        box-shadow: 0px 4px 6px 1px rgba(0,0,0,0.3);
        padding: 0 1em;
    }
    .handheld-navigation ul.sub-menu li {
        border-bottom: 1px solid #8dc3cf;
    }
    
    .handheld-navigation ul.menu li .dropdown-toggle {
        top:0.2em;
    }
    
    .handheld-navigation ul.sub-menu li .dropdown-toggle {
        top:0.9em;
    }
    
    .handheld-navigation ul.menu .sub-menu.toggled-on .sub-menu.toggled-on {
        background: #bde5ee;
    }
}


@media screen and (min-width: 768px) {
    
    .site-header-cart .widget_shopping_cart {
    background: linear-gradient(0deg, #85c1ce, #ade3ef);
    box-shadow: 0px 4px 6px 1px rgba(0,0,0,0.3);
    border-radius: 7px;
}
.site-header-cart .widget_shopping_cart .buttons, .site-header-cart .widget_shopping_cart .total {
    background-color: #a3dcea;
}

.site-header-cart .widget_shopping_cart .buttons {
    border-radius: 0 0 7px 7px;
}
.main-navigation ul.menu ul.sub-menu, .main-navigation ul.nav-menu ul.children {
    background: linear-gradient(0deg, #85c1ce, #ade3ef);
    box-shadow: 0px 4px 6px 1px rgba(0,0,0,0.3);
}
.main-navigation ul.menu ul.sub-menu {
    border-radius: 7px;
}
.main-navigation ul.menu ul.sub-menu ul.sub-menu {
    border-radius: 0 7px 7px 0;
    background: #a3dcea;
}

}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp {
    background: unset;
}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
    background-color: #fafafa;
}

@media (min-width: 768px) {
    .site-search {
        position: relative;
        top: 14px;
    }
}

.hentry .entry-content .wp-block-button .wp-block-button__link, .editor-styles-wrapper .wp-block-button .wp-block-button__link, 
a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained, 
button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.wc-block-components-checkout-place-order-button--full-width.contained, 
input#scf-button,
button.wc-block-components-button.wp-element-button.wc-block-components-totals-coupon__button.contained,
.button{
    border-radius: 30px;
}

a.added_to_cart.wc-forward {
    border-radius: 30px;
    margin-left: 5px;
}

#cc-main {
     /** Change button primary color to black **/
     --cc-secondary-color: #02182b;

    --cc-bg: linear-gradient(87deg, #8dc3cf, #ade3ef45);
     
     --cc-btn-primary-bg: linear-gradient(0deg, #8dc3cf59 0%, #68c5db4f 22%, #68c5db 100%), linear-gradient(90deg, #68c5db, transparent);
     --cc-btn-primary-border-color: white;
     --cc-btn-primary-hover-bg: linear-gradient(0deg, #8dc3cf59 0%, #68c5db4f 22%, #20a8c7 100%), linear-gradient(90deg, #b1d3db, transparent);
     --cc-btn-primary-hover-border-color: white;
     --cc-btn-primary-color: #02182b;
     --cc-btn-primary-hover-color: #02182b;
     
     --cc-btn-secondary-bg: #68c5db2e;
    --cc-btn-secondary-border-color: white;
    --cc-btn-secondary-color: #02182b;
    
    
    --cc-btn-secondary-hover-bg: #68c5db5c;
    --cc-btn-secondary-hover-border-color: white;
    --cc-btn-secondary-hover-color: #02182b;
    
    --cc-cookie-category-block-bg: linear-gradient(87deg, #8dc3cf, #ade3ef45);
    --cc-cookie-category-block-hover-bg: linear-gradient(87deg, #8dc3cf63, #ade3ef1f);


     /** Also make toggles the same color as the button **/
     --cc-toggle-on-bg: var(--cc-btn-primary-bg);
 }
 
 #cc-main .pm,  #cc-main .cm {
    backdrop-filter: blur(12px);
}

.boxzilla.boxzilla-center {
    border-radius: 15px;
	padding: 25px 25px 0px;
    margin-right: 20px;
    margin-left: 20px;
	background: linear-gradient(to bottom, rgb(230, 238, 239) 0px, rgb(120 211 223) 30px, rgb(230, 238, 239) 80px, hsl(187 22% 86%) 100%) !important;
	box-shadow: rgba(0, 0, 0, 0.21) 3px 3px 18px, inset 3px 3px 16px #ffffff9e;
}