/*
Theme Name: Mica Online New API
Author: Russell Nagel
Author URI: www.lionmarketing.com
Description: Theme Created For Mica
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: 
Text Domain: Mica
*/

#filter-sidebar #wc-tag-filter{
	width: 100%;
	border-radius: 0;
	background: white;
	padding: 5px 10px;
}

/* Out of Stock Banner */
#out-of-stock-banner {
    position: absolute !important;
	top: 0;
	left: 0;
	right: 0;
	display: block;
	text-align: center !important;
	background: #0072bc !important;
	color: white !important;
	font-weight: bold;
	text-transform: uppercase;
}

.product.out-of-stock .product-image-wrapper {
    position: relative;
}

.product.out-of-stock .out-of-stock-banner {
    display: flex; /* Show banner on out-of-stock products */
}

/* The overlay itself */
.loading-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	display: none; /* Initially hidden */
	justify-content: center;
	align-items: center;
	z-index: 9999;
	justify-content: center;
	align-items: center;
	/* display: flex; */
}

/* Spinner style */
.loading-overlay .spinner {
	border: 4px solid rgba(255, 255, 255, 0.3);
	border-top: 4px solid #fff;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 1s linear infinite;
	position: absolute;
	left: 50%;
	top: 50%;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* Element | https://micashop.co.za/checkout/ */

/* .checkout #shipping_city_field > span:nth-child(2), 
.checkout #select2-shipping_state-container,
.checkout #shipping_postcode,
.checkout .select2-container--below > span:nth-child(1) > span:nth-child(1),
.checkout #select2-billing_state-container,
.checkout #billing_postcode,
.checkout #billing_city {
  pointer-events: none;
} */

/* ul#shipping_method input{
	display: none !important;
}
 */
div.blockOverlay:nth-child(5),div.blockOverlay:nth-child(4) {display: none !important;}
.woocommerce-message{display:none;}
#sm-17568941407441348-2, #sm-16661647653441465-2{column-count:3;}

.hidden{display:none !important;}
.show{display:inline-table !important;}
html{overflow-x:none;}
.product-template-default.single{padding-right:0 !important;}
.elementor-portfolio.elementor-has-item-ratio .elementor-post__thumbnail { background-color: rgba(0,0,0,0) !important; }

#header-icon::before{
    content: "";
    height: 30px;
    width: 50px;
    background-image: url(http://localhost:8888/mica-store/wp-content/uploads/2021/08/main-bg-m.png);
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-bottom: -15px;
    z-index: 99;
    position: relative;
    margin-left: 10px;
}

.elementor-kit-6 img:hover{box-shadow: none !important;}

.padded{ padding: 50px 0;}
.padded{padding: 25px 0;}


.text-upper{text-transform: uppercase;} 
.text-red a{color: #BC0000 !important;}
.text-red.current-menu-item a,
.text-red:hover a{
    color: white !important;
    background: #BC0000 !important;
}
/*-----------------------------------*/
/*------- Global Styles Start -------*/
/*-----------------------------------*/

html{
    max-width: 100vw;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

html, h1, h2, h3, h4, h5, p, a, li{font-family: 'roboto', sans-serif;}

.text-blue{color: #0072bc !important;}
.text-grey{color: #8d8e8d !important;}
.text-orange{color: #f58220 !important;}
.text-yellow{color: #ffd400 !important;}
.text-black{color: black;}
.text-white, a.text-white{color: white !important;}

.text-red{color:red !important;}
.text-green{color:green !important;}

.bg-blue{background: #0072bc;}
.bg-orange{background: #f58220;}
.bg-yellow{background: #ffd400;}
.bg-black{background: black;}
.bg-white{background: white}
.bg-dgray{background: gray;}

.grey-button{
    border-radius: 0;
    background-color: gray !important;
    border-color: gray;
	color: white !important;
}
.grey-button:hover{
    background-color: #0072bc !important;
    border-color: #0072bc !important;
}

.sub-arrow{ padding: 0 0 0 5px !important;}

/*-------- Global Styles end --------*/


/*-----------------------------------*/
/*------- Woocomm Styles Start ------*/
/*-----------------------------------*/

.woocommerce ul.products li.product a img{
    background-color: white;
    padding: 10px;
}

li.product{
 display: flex !important;
 flex-direction: column;
}

li.product > a:nth-child(1) {
    flex-grow: 1;
    display: flex !important;
    flex-direction: column;
}


li.product > a:nth-child(1) > .price {
  margin-top: auto;
}

/*------- Woocomm Styles end --------*/


/*-----------------------------------*/
/*----- Front Page Styles Start -----*/
/*-----------------------------------*/

#top-brands .wl-single-brand {
  margin-bottom: 0;
}


#top-brands .wl-col-6{
  justify-content: center;
  align-items: center;
  display: flex;
}


.ht-product-image-wrap{
    background: white;
    padding: 20px;
}

/*------ Special Posts ------*/

#fp-exclusives .elementor-post__text {
  justify-content: center;
  display: flex;
  flex-direction: column;
  background: white;
  height: max-content;
  padding: 20px 10px;
  margin-right: -42%;
}

#fp-exclusives .elementor-grid-item {
  justify-content: center;
  align-items: center;
}

#fp-exclusives article.elementor-grid-item > a:nth-child(1) > div:nth-child(1) {overflow: visible;}




/*------ Category Section ------*/
li.product-category a { position: relative;}

li.product-category a h2 {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255,255,255,0.9);
  padding: 10px !important;
	opacity: 0;
	transition: opacity 500ms;
}
li.product-category a img {margin-bottom:0 !important;}
li.product-category a:hover h2 {opacity: 1;}




#cat-section .cat-image{
    background-size: cover;
    background-position: center;
}
#cat-section .wl-row .wl-col-3{padding: 15px !important;}

.percent-count .elementor-counter-number:after{content: "%";}
.plus-count .elementor-counter-number:after{content: "+";}



/*------ Signup front ------*/


#front-sub .frm_style_formidable-style.with_frm_style .form-field {
  margin-bottom: 10px;
}

#front-sub .frm_button_submit {
  margin-top: 0;
  width: 100%;
  background: orange;
  border: none;
}


.frm_form_fields > fieldset:nth-child(1) {
  padding-bottom: 0;
}

#subscriptions .elementor-element-af9912e {
  margin-left: -10%;
}

#subscriptions .elementor-element-53a55c9 {
  margin-right: -10%;
  width: 100%;
}


#subscriptions .elementor-element-53a55c9 > div:nth-child(1) {
  padding-right: 30%;
}

/*------ Front Page Styles end ------*/

/*-----------------------------------*/
/*------- Shop Styles Start -------*/
/*-----------------------------------*/

.elementor-widget-wrap{z-index: 1 !important;}
.orderby {
    background: white;
    padding: 5px 10px;
}

.woocommerce-result-count{text-transform: uppercase;}


#price-filter h5{ text-transform: uppercase; }

#price-filter .ui-slider .ui-slider-handle, 
#price-filter .ui-slider .ui-slider-range{
    background-color: #0072bc !important;
}

#price-filter .price_slider_wrapper .ui-widget-content{ background-color: #464646 !important;}

ul.products li.product .button {text-align: center;}

.products .product{
    position: relative;
    overflow: hidden;
        
}


.products .product > a:nth-child(2), .products .product > a:nth-child(3){
    position: absolute;
    top: -30%;
    left: 10px;
    right: 10px;
    transition: top 500ms ease;
    text-transform: uppercase;
	text-align: center;
}

.products .product:hover a:nth-child(2) {top: 30%;}
.products .product:hover a:nth-child(3) {top: 50%;}

#related-prods .product > a:nth-child(2), #related-prods .product > a:nth-child(3) {
    border: 2px solid;
    padding: 15px;
}

#related-prods .product > a:nth-child(2):hover, #related-prods .product > a:nth-child(3):hover {
    background: rgba(255,255,255,0.8);
    border-color: #7a7a7a;
    color: #7a7a7a;
}


#sidebar-cats .product-categories,
#sidebar-cats .product-categories li{
    list-style:  none;
    padding: 0;
    color: var( --e-global-color-text );
    padding-top: 5px;
}

#sidebar-cats .product-categories li a{
    color: var( --e-global-color-text );
    text-transform: uppercase;
}
#sidebar-cats .product-categories .current-cat a,
#sidebar-cats .product-categories li a:hover,
#sidebar-cats .product-categories li a:active{
    color: var( --e-global-color-primary );
    font-weight: 600;
}
#sidebar-cats .product-categories li .count::After{
    content: "";
    border-bottom: 0.5px solid rgba(0,0,0,0.2);
    width: 100%;
    display: block;
    padding: 5px;
}
#sidebar-cats .product-categories ul.children{
    padding-left: 20px;
}
/*-------- Shop Styles end --------*/

/*-----------------------------------*/
/*------- Single Styles Start -------*/
/*-----------------------------------*/

#single-info .woocommerce-Price-amount bdi{
	font-size: 26px;
	text-decoration: underline;
}

.woocommerce span.onsale, span.onsale,
.wcviews_onsale_wrap .onsale{ 
	padding: 5px 10px !important;
	background-color: #BC0000;
}

#single-image .onsale{
    background: #bc0000;
    color: white;
    padding: 10px 20px;
    font-size: 2em;
}

#single-image .wcviews_onsale_wrap{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
}

#single-add-btn .elementor-button-content-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

#single-info .product_meta{
    justify-content: center;
}

#single-price select{
    background-color: white;
    padding: 5px;
    width: 100%;
    border: 1px solid gray;
	margin: 0 5px;
}


#single-price .variations tbody tr{
    display: flex;
    justify-content: center;
}

#single-price .variations > tbody > tr > td:nth-child(2) {
     min-width: 60%;
}


#single-price .price span{
  color: var( --e-global-color-primary );
  font-family: "Roboto", Sans-serif;
  font-size: 24px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 5.4px;
}

#single-price .woocommerce-variation-price {
  justify-content: center;
  text-align: center;
  margin: 10px;
}

#single-price .reset_variations {
    text-transform: uppercase;
    font-weight: bold;
    color: var( --e-global-color-primary );
}

#single-price .elementor-add-to-cart > p:nth-child(1) {
    text-align: center;
    font-size: 22px;
    text-transform: uppercase;
    color: var( --e-global-color-text );
}


#single-price .quantity input{
  height: 100% !important;
}

.woocommerce-Tabs-panel{
    background: white !important;
    border: 1px solid rgb(211, 206, 210) !important;
}


.related > h2:nth-child(1) {
  text-transform: uppercase;
  color: var( --e-global-color-text ) !important;
}


.single_variation{text-align:center;}

.single_add_to_cart_button{text-transform: uppercase;}


#loading-page {
	position: fixed;
	z-index: 999999;
	background: rgba(0,0,0,0.4);
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

#loading-page #loading-container{
  height: 100vh;
  justify-content: center;
  align-items: center;
}

#single-info .elementor-639 .elementor-element.elementor-element-225367d > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute) {
  margin-bottom: 15px;
}

/*-------- Single Styles End --------*/


/*-----------------------------------*/
/*------- Login Styles Start ---------*/
/*-----------------------------------*/


.woocommerce-form-login, 
.woocommerce-form-register{
    background: white;
    border-radius: 0 !important;
    box-shadow: 0 0 30px rgba(0,0,0,0.16);
}

.woocommerce-form-login .woocommerce-Input--text, .woocommerce-form-register .woocommerce-Input--text{min-height: 40px;}

.frm_button_submit,
.checkout-button,
.woocommerce button.button.alt,
.woocommerce-form-login button, 
.woocommerce-form-register button{
    border-style: solid !important;
    border-width: 1px 1px 1px 1px !important;
    border-radius: 0px 0px 0px 0px !important;
    padding: 14px 035px 14px 35px !important;
    color: #ffffff !important;
    background-color: var( --e-global-color-text ) !important;
    border-color: var( --e-global-color-text ) !important;
    transition: all 0.2s !important;
}

.frm_button_submit:hover,
.checkout-button:hover,
.woocommerce button.button.alt:hover,
.woocommerce-form-login button:hover, 
.woocommerce-form-register button:hover{
    background-color: var( --e-global-color-primary ) !important;
    border-color: var( --e-global-color-primary ) !important;
}


.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link{
    list-style: none;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 10px;
}

.woocommerce-cart-form__cart-item .product-name a:hover,
.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link > a:hover{ color:  var( --e-global-color-primary );}

.woocommerce-cart-form__cart-item .product-name a,
.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link > a{ 
    color: var( --e-global-color-text );
}
.woocommerce-cart-form__cart-item .product-name a{
    text-transform: uppercase;
    font-weight: 600;
}

.woocommerce-MyAccount-navigation > ul { padding: 0;}


.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
  min-height: 40px;
}

.woocommerce-cart-form, .shop_table_responsive{
    background: white !important;
    border-radius: 0;
    box-shadow: 0 0 30px rgba(0,0,0,0.16);
}

.woocommerce-cart-form__contents thead{
    background: var( --e-global-color-text );
    color: white;
    text-transform: uppercase;
}

.main-title h1, .cart_totals h2{
    text-transform: uppercase;
    font-weight: 600;
    color: var( --e-global-color-text );
}

/*-------- Login Styles End ----------*/

/*-----------------------------------*/
/*-------- Modal Styles Start -------*/
/*-----------------------------------*/

.modal-backdrop.show {
     opacity:0 !important;
     display: none !important; 
}

.modal-backdrop{
    display: none !important;
    z-index: 0!important;
}

#modal-section .modal {
  z-index: 999;
  position: fixed;
  justify-content: center;
  align-items: center;
  background: rgba(0,0,0,0.4);
}


#modal-section .modal.show {
  display: flex !important;
}

.modal.show .modal-dialog {
    min-width: 771px;  
    width: 771px;
}



/*-------- Modal Styles End --------*/

/*-----------------------------------*/
/*------ About us Styles Start ------*/
/*-----------------------------------*/

/*------- About us Styles End -------*/

/*-----------------------------------*/
/*------ Contact Styles Start -------*/
/*-----------------------------------*/

#form_newsletter-signup input,
#form_newsletter-signup textarea,
#form_contact-form input,
#form_contact-form textarea{
    height: 40px;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    border: none;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: medium;
    box-shadow: none;
    border-bottom: 1px solid;
}

#form_newsletter-signup input,
#form_newsletter-signup textarea{
    color:white !important;
	background-color: white;
}
    
/*------- Contact Styles End --------*/

/*-----------------------------------*/
/*-------- Promo Styles Start -------*/
/*-----------------------------------*/


/*--------- Promo Styles End --------*/

/*-----------------------------------*/
/*-------- Single Styles Start ------*/
/*-----------------------------------*/


/*-------- Single Styles End --------*/

/*-----------------------------------*/
/*--------- Case Styles Start -------*/
/*-----------------------------------*/


/*--------- Case Styles End ---------*/

/*-----------------------------------*/
/*-------- Page Styles Start --------*/
/*-----------------------------------*/


/*--------- Page Styles End ---------*/

/*-----------------------------------*/
/*------- Slider Styles Start -------*/
/*-----------------------------------*/

/*------- Slider Styles End ---------*/

/*-----------------------------------*/
/*-------- Form Styles Start --------*/
/*-----------------------------------*/

/*-------- Form Styles End ----------*/

/*-----------------------------------*/
/*----- Responsive Styles Start -----*/
/*-----------------------------------*/


@media only screen and (min-width: 1200px){

}

@media only screen and (max-width: 1300px){
    
}

@media only screen and (max-width: 1024px){
    
    .product-slider .slick-arrow.slick-next {right: 0px;}
    .product-slider .slick-arrow{left: 0px;}
    #subscriptions .elementor-element-53a55c9{ width: 80%; }
    .ht-product{
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        max-width: 25%;
    }

}

@media only screen and (max-width: 991px){
    #category-container .wl-col-3{ margin-bottom: 20px;}
    .ht-product{
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%;
    }
    #modal-section .modal .modal-dialog{
        min-width: inherit;
        width: inherit;
    }
    
}


@media only screen and (max-width: 767px){
	
    .woocommerce ul.products[class*="columns-"] li.product, .woocommerce-page ul.products[class*="columns-"] li.product {
        width: 100%;
        padding: 20px;
    }
    #subscriptions .elementor-element-af9912e { margin-left: 0 !important;}
    #subscriptions .elementor-element-53a55c9 {
        margin-right:  0 !important;   
        width: 100%;
    }
    #subscriptions .elementor-element-53a55c9 > div:nth-child(1) {padding-right:  20px !important;}
    #cat-section .wl-row .wl-col-3{padding: 10px !important;}
    .products .product > a:nth-child(2) {  
		position: initial !important; 
		width: 100%;
	}
	.products .product{flex-wrap: wrap;}
}

@media only screen and (max-width: 575px){
    #single-tabs .woocommerce-tabs ul.wc-tabs li a,
    #single-tabs .woocommerce-tabs ul.wc-tabs li {
      width: 100%;
    }

    #single-tabs .tabs {
      padding-left: 0px;
      text-align: center;
    }
    
    #cat-section .d-flex {
      flex-direction: column;
    }

    #cat-section .cat-image {
      height: 180px;
    }
    
    .ht-product .ht-product-content{ padding: 10px !important; }

}
@media only screen and (max-width: 540px){
    
    .woocommerce ul.products[class*="columns-"] li.product, .woocommerce-page ul.products[class*="columns-"] li.product {
        width: 100%;
        padding: 10px;
    }

    .woocommerce ul.products[class*=columns-] li.product,
    .woocommerce-page ul.products[class*=columns-] li.product {
        margin:0 0 1em;
    }

}

@media only screen and (max-width: 480px){
	.ht-product{
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
    }
    #cat-section .wl-row .wl-col-3{
        flex: 0 0 100%;
        max-width: 100%;
    }

}
@media only screen and (max-width: 420px){
	

}
@media only screen and (max-width: 330px){


}


/*------ Responsive Styles End ------*/