.or-separator{
  margin: 30px 0;
  background-color: #e2e9e1;
  height: 1px;
  position: relative;
}
.or-separator::before{
position: absolute;
content: "OR";
color: #687188;
width: 40px;
height: 20px;
left: calc(50% - 20px);
top: -9px;
line-height: 1.4;
background: #ffffff;
text-align: center;
}

.btn-google-login{
background: #ffffff;
color: #687188;
border-color: #687188;
display: flex;
align-items: center;
justify-content: center;
padding: 10px 20px;
}
.btn-google-login img{
width: 30px;
margin-right: 10px;
}

/* .btn-google-login:hover{
background: #ffffff;
color: #0F3EB0 !important;
border-color: #0F3EB0;
} */




.whatsapp {
  animation-duration: 8s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-name: tada;
  position: fixed;
  bottom: 86px;
  left: 36px;
  z-index: 2000000;
  font-size: 46px;
  color: #fff;
  width: 50px;
}

@media (max-width: 576px) {
  .whatsapp {
    bottom: 90px;
  }
}


.cr-chat-btn {
  display: flex;
  flex-direction: row;
  position: absolute;
  z-index: 2;
  bottom: 8px;
  right: 8px;
  max-width: 95vw;
  color: inherit;
  cursor: pointer;
  transition: background .2s linear;
}

.whatsapp img {
  width: 100%;
}


























.card-product .card-product-wrapper .on-sale-wrap .on-sale-item.is_hot {
  background-color: purple;
}

.card-product .card-product-wrapper .on-sale-wrap .on-sale-item.is_new {
  background-color: green;
}

.card-product .card-product-wrapper .on-sale-wrap .on-sale-item.is_best_sell {
  background-color: #1B4872;
}


.card-product .box-icon.active {
  background-color: var(--main) !important;
  color: var(--white) !important;
  border-color: var(--main) !important;
}
.card-product .box-icon.active svg path {
  stroke: var(--white);
}


.footer-logo{
  max-width: 220px;
}

.custom-checkbox{
  gap: 8px;
}


/* .attributes .attribute-cont input:checked + label.style-text{ */
.attribute-option.active + label.style-text{
  background-color: #181818;
  border: 1px solid #181818;
  color: #ffffff;
}


.add-cart.disabled{
  opacity: 0.6;
}
.add-cart.disabled:hover{
  cursor: not-allowed;
}

.add-wishlist.disabled{
  opacity: 0.6;
}
.add-wishlist.disabled:hover{
  cursor: not-allowed;
}


.add-wishlist.active {
  background-color: #181818;
  color: #ffffff;
  border-color: #181818;
}


.card-product .btn-main-product {
  background-color: var(--main);
  color: var(--white);
}




#card-element, .payment-input{
    padding: 12px; border: 1px solid #ccc; border-radius: 6px; margin-top: 5px;
}

.payment-input{
    padding: 10px;
    font-size: 15px;
    color: #ABB8C5;
    font-family: sans-serif;
    /* font-size: 1em; */

}

.payment-input::placeholder {
    color: #888888;
}

.payment-input:focus{
    border-color: inherit;
    background: inherit;
}

.payment-image{
    max-width: 140px;
    height: auto;
}

.border-custom-color{
    border-color: #e2e2e2 !important;
}

.card-image{
    background-image: url('../img/theme/cards.png');
    background-repeat: no-repeat;
    /* display: block;
    float: left; */
    display: inline-block;
    margin-left: 5px;

    height: 25px;
    width: 38px;
    
    
}
.card-image.visa{
    background-position: 0 0;
}
.card-image.mastercard{
    background-position: -46px 0px;
}
.card-image.mastero{
    background-position: -92px 0px;
}
.card-image.amex{
    background-position: -138px 0px;
}
.card-image.discover{
    background-position: -182px 0px;
}

.form-has-password .toggle-password {
  top: 25px;
}


.bg-custom{
  background-color: #f1f1f1;
}

/* 
.bg-custom-blue{
  background-color: #0F3EB0;
}

.title-display, h1, h2, h3, h4, h5, h6{
  color: #0F3EB0;
}

.btn-style-6:hover{
  background-color: #0F3EB0;
  color: var(--white) !important;
}

.tf-btn{
  background-color: #0F3EB0;
  border: 1px solid #0F3EB0;
}
.tf-btn:not(.btn-reset):hover{
  color: #0F3EB0;
}
.btn-line{
  color: #0F3EB0 !important;
}
.card-product .btn-main-product{
  background-color: #0F3EB0;
}

.card-product .btn-main-product:hover {
    background-color: var(--white);
    color: #0F3EB0;
    border-color: #0F3EB0;
} */


.header-style-7 .form-search {
  width: 320px;
}


.search-continer{
  position: relative;
}


.search-results {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  background-color: var(--bs-body-bg);
  max-height: 300px;
  overflow-y: auto;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);

  position: absolute;
  left: 0;
  top: 50px;
  width: 100%;
  z-index: 9;
}

.search-results li {
  padding: .5rem .75rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .5rem;
  border-bottom: 1px solid var(--bs-border-color);
}

.search-results li:last-child {
  border-bottom: none;
}

/* Hover and active states like Bootstrap list group */
.search-results li:hover,
.search-results li:focus {
  background-color: rgba(var(--bs-primary-rgb), 0.08);
}

.search-results li.all:hover,
.search-results li.all:focus {
  background-color: inherit;
}

.search-results li.active {
  background-color: var(--bs-primary);
  color: #fff;
}

/* Optional thumbnail/icon slot */
.search-results li img {
  width: 36px;
  height: 36px;
  object-fit: cover;
  border-radius: .25rem;
}

/* Title and subtext */
.search-results li .title {
  font-weight: 500;
  line-height: 1.2;
}
/* .search-results li .subtitle {
  font-size: .85rem;
  color: var(--bs-secondary-color);
} */
.search-results li .price {
  font-size: .85rem;
  color: var(--bs-secondary-color);
}

/* No results message */
.search-results li.no-results {
  text-align: center;
  color: var(--bs-secondary-color);
  cursor: default;
}

/* Small screen adjustments */
@media (max-width: 576px) {
  .search-results {
    max-height: 50vh;
  }
}



.loader{
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-align: center;
    /* opacity: 0.5; */
    /* background-color: #fff; */
    background: rgba(255, 255, 255, .5);
    z-index: 9999;
    background-image: url('../images/loading/loading.gif');
    background-repeat: no-repeat;
    background-position: center center;
  
  }


.loading-search{
  width: 32px;
  position: absolute;
  right: 12px;
  top: 6px;
}

.tf-btn span{
  min-width: 100px;
  text-align: center;
}


.tf-btn.btn-white.has-border span{
  color: var(--main);
}
.tf-btn.btn-white.has-border:hover span{
  color: #ffffff;
}

.canvas-filter .canvas-bottom {
  box-shadow: none;
}

.logo-header img {
  width: 275px;
  margin: 5px 0;
}

/* #header .nav-icon .nav-icon-item:hover .icon {
    color: #0F3EB0;
}
#header .nav-icon .nav-icon-item:hover svg path {
    stroke: #0F3EB0;
} */


.collection-position-2{
  background: #f7f7f7;
}

/* .header-style-7 .form-search {
  width: auto;
  transition: 400ms;
}
.header-style-7 .show-search {
  width: 320px;
} */
.form-search button{
  right: 6px;
}


.wrap-slider{
  text-align: center;
}


/* .wrap-slider img{
  object-fit: contain;
} */

/* .link-open {
  pointer-events: none;
} */

.text-caption-1.text-white a{
  color: #ffffff;
}


/* @media only screen and (max-width: 767px){
  .tf-slideshow .wrap-slider {
        height: 200px;
    }
  .tf-slideshow .wrap-slider a{
        margin-top: 20px;
    }
} */

/* a:hover{
  color: #0F3EB0 !important;
} */

/* .link:hover{
  color: #0F3EB0 !important;
}

.btn-line:hover::before {
    background-color: #0F3EB0;
}


.canvas-filter .canvas-bottom .tf-btn:hover{
  color: #0F3EB0 !important;
} */

.card-product .card-product-wrapper img, .tf-cart-item .tf-cart-item_product .img-box img, .sidebar-checkout-content .item-product .img-product img{
  object-fit: contain;
  border: 1px solid #efefef;
}

.btn-style-2:hover{
  color: #ffffff !important;
}


/* .icon-star.half {
  display: inline-block;
  overflow: hidden;
  width: 0.5em;
  margin-right: 0.5em;
}
.icon-star.half::before {
  width: 1em;
  overflow: hidden;
} */


/* .icon-star {
  position: relative;
  display: inline-block;
}


.icon-star.half::after {
  content: "\e92a"; 
  font-family: 'icomoon';
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  overflow: hidden;
  color: #ccc;
  text-align: right; 
} */


/* 
.half-star {
  font-family: 'icomoon'; 
  font-size: 24px;
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
} */

/* If IcoMoon places the glyph directly in the element (rare) */
.icon-star.half {
  background: linear-gradient(90deg, #181818 50%, #A5A09A 50%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}

/* If IcoMoon inserts the glyph via ::before (common) */
.icon-star.half::before {
  /* do NOT overwrite the content if IcoMoon already sets it */
  display: inline-block;   /* make sure this pseudo-element can receive background-clip */
  background: linear-gradient(90deg, #181818 50%, #A5A09A 50%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}

.icon-star.empty {
  color: #A5A09A;
}

.footer-count-box{
  position: absolute;
  line-height: 14px;
  height: 14px;
  min-width: 14px;
  text-align: center;
  padding: 0 3px;
  font-size: 10px;
  font-weight: 500;
  border-radius: 9999px;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
  overflow: hidden;
  z-index: 2;
  top: 0;
  right: 32px;
  color: var(--white);
  background-color: var(--primary);
}

.wg-pagination .pagination-item:hover {
color: var(--white) !important;
}



.wrapper-header-custom{
  padding: 0 !important;
}
 




/*responsive css starts*/

@media (min-width : 320px) and (max-width : 479px) {

  
  .header-style-4 .main-header .wrapper-header {
      padding-bottom: 26px !important;
  }

  .header-default .main-header .wrapper-header {
      padding-top: 22px !important;
      padding-bottom: 22px !important;
  }

  .logo-header img {
    margin-top: 0 !important;
  }

}

@media (min-width : 480px) and (max-width : 568px){

  
  .header-style-4 .main-header .wrapper-header {
      padding-bottom: 26px !important;
  }

  .header-default .main-header .wrapper-header {
      padding-top: 22px !important;
      padding-bottom: 22px !important;
  }

  .logo-header img {
    margin-top: 0 !important;
  }

}

/* Extra Small Devices, Phones */
@media (min-width : 569px) and (max-width : 767px){


}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) and (max-width : 991px){


}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) and (max-width : 1199px){

    
}

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



}

@media only screen and (min-width : 1401px) and (max-width : 1599px){


}

@media only screen and (min-width : 1600px) and (max-width : 2048px){


}

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


}

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


}
/*responsive css ends*/