/*!
Theme Name: The Storefront Woocommerce
Theme URI: https://www.revolutionwp.com/products/storefront-woocommerce
Author: revolutionwp
Author URI: https://www.revolutionwp.com/
Description: The Storefront WooCommerce Theme is a multipurpose, modern, and minimal design solution that combines elegance, sophistication, and high functionality for online stores, providing a clean, clutter-free layout that ensures a seamless, user-friendly shopping experience and a stunning, retina-ready display across all devices. Perfect for WooCommerce online shops, responsive WooCommerce themes, mobile-friendly stores, digital downloads, appointment booking systems, coupons, discounts, and product variation setups, it also caters beautifully to fashion boutiques, electronics stores, furniture shops, beauty and skincare brands, sports equipment outlets, pet supply stores, baby product retailers, home décor studios, gourmet food shops, jewelry stores, health and wellness retailers, toy outlets, print-on-demand businesses, stationery shops, and outdoor gear providers seeking a sleek, professional, and reliable eCommerce platform. Built with fully responsive and mobile-optimized layouts, the theme ensures accessibility for every visitor on desktops, tablets, and smartphones while maintaining fast, smooth, and secure performance through clean, optimized code. Designed for seamless WooCommerce integration, Storefront makes setting up product catalogs, shopping carts, streamlined checkout processes, and inventory management effortless. With Bootstrap-based support, rich shortcodes, and extensive customization options, users can easily adjust layouts, colors, fonts, banners, and typography to reflect their brand identity. Key features include promotional banner sections, testimonial blocks, team showcases, and strategically placed Call-to-Action (CTA) buttons to enhance conversions, build trust, and highlight featured products or special offers. Integrated social media links, interactive elements, and subtle animations elevate engagement and visual appeal, while translation-ready functionality ensures global reach and multilingual support. Whether you’re launching a fashion store, tech shop, lifestyle brand, or specialty eCommerce business, the Storefront WooCommerce Theme empowers entrepreneurs, developers, and creative brands to craft a secure, fast-loading, visually captivating, and highly professional online store that drives sales and creates an exceptional shopping experience for customers worldwide.
Version: 1.9
Requires at least: 5.5
Tested up to: 6.9
Requires PHP: 5.6
License: GNU General Prefer License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: the-storefront-woocommerce
Template: wp-shop-woocommerce
Tags: one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, grid-layout, full-width-template, wide-blocks, editor-style, custom-background, custom-colors, custom-header, custom-logo, custom-menu, sticky-post, featured-images, footer-widgets, flexible-header, post-formats, theme-options, threaded-comments, translation-ready, rtl-language-support, e-commerce, portfolio, blog

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/

a{
    text-decoration: none;
    color: var(--color-primary1);
}
:root {
  --primary-color: #30BFBF;
  --secondary-color: #212A39;
  --body-font: 'Montserrat', sans-serif;
}
#main-slider-wrap button.owl-prev i{
  color: #fff;
}
#main-slider-wrap .owl-prev, #main-slider-wrap .owl-next{
  background: var(--primary-color);
  border:1px solid var(--primary-color);
}
#main-slider-wrap .owl-prev:hover, #main-slider-wrap .owl-next:hover{
  background: transparent;
  border:1px solid #fff;
  color: #fff;
}
.site-header .return-btn a {
  text-transform: uppercase;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
}
.site-header .return-btn a:hover {
  color: var(--primary-color);
}
.site-header .topbar-text {
  color: rgb(255 255 255 / 90%);
  font-size: 15px;
  padding-left: 5px;
}
.nav-box-header-right p{
  font-weight: 400;
}
.nav-box-header-right p.email-id {
  border-left: 1px solid #a39e9e;
  padding-left: 35px;
}
.site-branding .site-title{
  font-weight: 600;
  font-size: 32px;
  text-transform: capitalize;
}
.main-slider-content-box {
    top: 50%;
    transform: translateY(-50%);
    left: 5%;
    right: 50%;
    color: #fff;
}
.main-slider-content-box hr{
  background: var(--primary-color);
}
.main-slider-content-box p.slider-content{
  font-weight: 300;
  margin: 35px 0;
}
.main-slider-inner-box {
  background: var(--secondary-color);
}
.main-slider-inner-box img{
  opacity: 0.5;
}
.main-slider-button a{
  background: var(--primary-color);
  font-weight: 200;
  padding:10px 20px;
  letter-spacing: 1px;
  display: inline-block;
  margin-top: 10px;
}
.main-slider-button a:hover{
  background: var(--secondary-color);
}

/*owl nav*/
#main-slider-wrap .owl-dots {
  position: absolute;
    top: 90%;
    flex-direction: row;
    display: flex;
    left: 5%;
    right: auto;
    bottom: auto;
    text-align: center;
}
#main-slider-wrap .owl-dots .owl-dot {
  background: transparent;
  border-radius: 50%;
  height: 11px;
  margin: 10px;
  width: 11px; 
  border: 2px solid #fff;
}
#main-slider-wrap .owl-dots .owl-dot.active {
  border: 2px solid #fff;
  background: #fff;
}
h4.product-head {
    font-size: 22px;
    margin: 8px 0px;
    letter-spacing: 1px;
    font-weight: 200;
}
.main-expert-button a{
  font-weight: 200;
  font-size: 16px;
}
.box img{
  width: 90%;
  height: 492px;
}
.heading-expert-wrap h5{
  font-weight: 300;
}
.product-image {
  padding: 16px;
  background: #F7F7F7;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
}
.product-box-content:hover h6.product-heading-text a{
  color: var(--primary-color);
}



.grid-box {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 columns */
  gap: 20px;
}

.product-box {
  display: flex;
  align-items: center;
  gap: 10px;
}
.product-image img {
  width: 80px !important;
  height: 80px !important;
  object-fit: cover;
}

/* Owl Products Carousel Navigation */
.product-list .owl-nav {
    position: absolute;
    top: -7em;
    left: 0;
    right: 0;
    display: flex;
    justify-content: flex-end;
    gap: 15px;
}
.product-list .owl-carousel .owl-nav button.owl-prev,
.product-list .owl-carousel .owl-nav button.owl-next {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    font-size: 25px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
/* Next Button (Filled Style) */
.product-list .owl-carousel .owl-nav button.owl-next, 
.product-list .owl-carousel .owl-nav button.owl-prev {
    background: var(--primary-color);
    border: 2px solid var(--primary-color);
    color: #fff;
}
/* Hover Effects */
.product-list .owl-carousel .owl-nav button.owl-prev:hover,
 .product-list .owl-carousel .owl-nav button.owl-next:hover {
    background: #fff;
    color: var(--secondary-color);
    border: 2px solid var(--secondary-color);;
}
#product-sec .product-image img{
  object-fit: contain;
}
/*single product sale*/
.product-box{
  position: relative;
  z-index: 9;
}
.top-expert-wrap .owl-carousel{
  display: block !important;
}
  .product-box-content-one h2 {
  margin: 0;
  line-height: 1;
  }
  .product-box-content-one h2 a {
  margin: 0;
  text-transform: capitalize;
  letter-spacing: 1px;
  font-size: 30px;
  color: var(--secondary-color);
  font-weight: 500;
  text-decoration: none;
  }
  .product-box-content-one .product-image-one {
  position: relative;
  z-index: 9;
  background-color: #fff;
  margin: 0 15px;
  }
  .product-box-content-one .product-image-one img {
  height: 500px;
  width: 100%;
  object-fit: cover;
  opacity: 0.5;
  }
  .product-box-content-one .content-over-image {
  position: absolute;
  top: 10%;
  right: 30%;
  left: 10%;
  text-align: left;
  z-index: 9999;
  }
  .product-box-content-one .sale-tag {
  font-size: 33px;
  color: var(--secondary-color);
  font-family: "Caveat Brush", cursive;
  margin-bottom: 5px;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 1px;
  }
  .product-box-content-one .sale-percentage {
  font-size: 18px;
  letter-spacing: 4px;
  color: var(--secondary-color);
  }
  
  .product-box-content-one .product-price {
  color: var(--secondary-color);
  font-weight: 500;
  font-family: "Caveat Brush", cursive;
  }
  .product-box-content-one .product-price del span {
  font-size: 15px;
  font-weight: 500;
  }
  .product-box-content-one .product-price ins span {
  font-size: 22px;
  font-weight: 500;
  }
  .main-shop-now a {
  padding: 10px 20px;
  color: #fff;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-decoration: none;
  background: var(--primary-color);
  border-radius: 30px;
  font-family: 'Caveat Brush', cursive;
  display: inline-block;
  }
  
  .main-shop-now a:hover,
  .main-shop-now a:focus {
  background: var(--secondary-color);
  color: #fff;
  }
  
  .product-box-content-one:hover .sale-tag,
  .product-box-content-one:hover h2 a,
  .product-box-content-one:hover .product-price,
  .product-box-content-one:hover .sale-percentage {
  color: #fff;
  }
  
  .product-box-content-one:hover .product-image-one {
  background-color: #000;
  }
  
  .product-box-content:hover .product-image-one img {
  opacity: 0.5;
  }
  
@media screen and (max-width: 767px){
  .main-slider-content-box p{
    font-size: 10px;
  }
  .main-navigation ul#primary-menu>li>a, .main-navigation div#primary-menu>ul>li>a{
    padding-left: 0;
  }
  .nav-box-header-right p{
    margin-bottom: 10px;
  }
  .product-cat{
    height: auto;
  }
  .box{
    margin: 10px 0;
  }
  .box img{
    width: 100%;
  }
  .grid-box {
    grid-template-columns: repeat(1, 1fr);
    gap: 15px;
}
  .main-slider-content-box h3{
    line-height: 1.2;
    font-size: 34px;
  }
  .main-slider-content-box p.slider-content{
    display: none;
  }
  #main-slider-wrap .owl-nav, #main-slider-wrap .owl-dots .owl-dot{
    display: none;
  }
  .main-slider-content-box{
    left: 10%;
    right: 10%;
    text-align: center;
  }
  .slider-divide{
    padding: 0;
  }
  .main-navigation{
    text-align: center;
  }
  .nav-box-header-right p.email-id{
    border-left: none;
  }
}
@media screen and (min-width: 767px) and (max-width: 999px){
  .product-box-content-one .product-image-one img{
    height: 450px;
  }
  .product-box-content-one h2 a{
    font-size: 25px;
  }
  .product-box-content-one .sale-percentage{
    font-size: 10px;
  }
  .main-navigation ul#primary-menu>li>a, .main-navigation div#primary-menu>ul>li>a{
    padding-left: 0;
  }
  .product-image{
    margin-right: 5px;
  }
  h6.product-heading-text a{
    line-height: 1.2;
    font-size: 19px;
  }
  .main-expert-button a{
    font-size: 10px;
  }
  .box-content{
    right: 20%;
  }
  .product-image img {
    width: 55px !important;
    height: 55px !important;
  }
  .product-list .owl-carousel .owl-nav button.owl-prev, .product-list .owl-carousel .owl-nav button.owl-next{
    width: 34px !important;
    height: 34px !important;
  }
  .categry-title strong{
    font-size: 15px;
  }
  #main-slider-wrap .owl-nav{
    display: none;
  }
  .main-slider-content-box{
    right: 30%;
  }
  .main-slider-content-box h3{
    line-height: 1.4;
    font-size: 35px;
  }
  .main-slider-inner-box img{
    height: 500px;
  }
  .product-cat{
    height: 450px;
  }
  .main-navigation{
    text-align: center;
  }
  .main-header-wrap .flex-row{
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .nav-box-header-left, .nav-box-header-right{
    width: 100%;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 10px;
  }

}
@media screen and (min-width: 1000px) and (max-width: 1024px){
  .product-box-content-one .product-image-one img{
    height: 450px;
  }
  .product-box-content-one h2 a{
    font-size: 25px;
  }
  .product-box-content-one .sale-percentage{
    font-size: 10px;
  }
  .product-image{
    margin-right: 5px;
  }
  h6.product-heading-text a{
    line-height: 1.2;
    font-size: 19px;
  }
  .main-expert-button a{
    font-size: 10px;
  }
  .box-content{
    right: 20%;
  }
  .product-image img {
    width: 55px !important;
    height: 55px !important;
  }
  .product-list .owl-carousel .owl-nav button.owl-prev, .product-list .owl-carousel .owl-nav button.owl-next{
    width: 34px !important;
    height: 34px !important;
  }
  .categry-title strong{
    font-size: 15px;
  }
.main-slider-content-box{
    right: 30%;
  }
  .main-slider-content-box h3{
    line-height: 1.4;
    font-size: 35px;
  }
  .account a{
    font-size: 14px;
  }
  .main-navigation ul#primary-menu>li>a, .main-navigation div#primary-menu>ul>li>a{
    font-size: 16px;
  }
  .main-navigation a{
    padding: 11px 40px;
  }
}