/*!
Theme Name: Shoppable Beauty
Theme URI: https://bosathemes.com/shoppable-beauty
Author: Bosa Themes
Author URI: https://bosathemes.com
Description: Shoppable Beauty is beautiful multipurpose ecommerce theme. Shoppable Beauty is beautiful, fast, lightweight, responsive, extremely customizable, multipurpose ecommerce theme that you can use as a foundation to build versatile sites such as beauty, beauty gadgets, beauty product, beauty store, cosmetic, cosmetic store, cosmetics shop and preferably ideal for any type of sites. Shoppable Beauty works perfectly with Gutenberg and the most popular page builder Elementor that can easily drag-and-drop your ideas from the interface. Shoppable Beauty is built with SEO, speed, and usability in mind with the multiple Header & Footer layouts, predesigned starter sites includes awesome Home & Inner Pages that is incredibly customizable and powerful enough to take a stand among the crowd. Shoppable Beauty is compatible with all major plugins like WooCommerce, Yoast, Contact form 7, Mailchimp for WordPress, bbPress, etc. Looking for a multipurpose ecommerce theme? Look no further! Browse the demos to see that it's the only theme you will ever need: https://demo.bosathemes.com/shoppable/beauty
Version: 1.0.0
Requires PHP: 5.6
Tested up to: 6.7
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: hello-shoppable
Text Domain: shoppable-beauty
Tags: blog, portfolio, news, grid-Layout, one-column, two-columns, three-columns, flexible-header, left-sidebar, right-sidebar, custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, post-formats, rtl-language-support, theme-options, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks

Shoppable Beauty WordPress Theme, Copyright 2025 Bosa Themes
Shoppable Beauty is distributed under the terms of the GNU General Public License v3

Shoppable Beauty is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #111111;
  font-family: 'Jost', serif;
  font-weight: 500;
}
.entry-content h1 a,
.entry-content h2 a,
.entry-content h3 a,
.entry-content h4 a,
.entry-content h5 a,
.entry-content h6 a {
  text-decoration: underline;
}
.entry-content p a,
.comment-content p a,
.entry-content li a,
.comment-content li a,
.widget p a,
.comments-area .comment-list .comment-content a {
  color: #2e92ff;
}
.entry-content p a:hover,
.entry-content p a:focus,
.comment-content p a:hover,
.comment-content p a:focus,
.entry-content li a:hover,
.entry-content li a:focus,
.comment-content li a:hover,
.comment-content li a:focus,
.widget p a:hover,
.widget p a:focus,
.comments-area .comment-list .comment-content a:hover,
.comments-area .comment-list .comment-content a:focus {
  color: #086abd;
}
.slide-item .entry-content h3 a,
.list-post .entry-content h3 a,
.grid-post .entry-content h3 a,
.single-post .entry-content h3 a {
  text-decoration: none;
}
.wp-block-quote {
  padding: 30px 30px 30px 50px;
  margin: 30px 0 30px 30px;
}

/*biggest brand css*/
.section-biggest-area {
  padding-bottom: 70px;
}
.section-biggest-area .section-title-wrap{
  text-align: center;
}
.section-biggest-area .section-title-wrap .section-title{
  padding-bottom: 0;
}
.section-biggest-area .section-title-wrap .section-title:before{
  width: 100%;
}
.section-biggest-area .section-title-wrap p {
  margin-top: 30px;
}
.section-biggest-area .content-wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.section-biggest-area .biggest-items {
  box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.2);
  padding: 10px;
  text-align: center;
  transition: all 0.4s;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.section-biggest-area .biggest-items .entry-title {
  margin-bottom: 0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  opacity: 0;
  transition: all 0.5s;
}
.section-biggest-area .biggest-items .entry-title a {
  display: inline-block;
  position: relative;
  z-index: 1;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  color: white;
}
.section-biggest-area .biggest-items:hover .entry-title{
  opacity: 1;
}
.section-biggest-area .biggest-items:hover .entry-title a{
  opacity: 1;
}
@media screen and (max-width: 991px) {
  .section-biggest-area .content-wrap {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .section-biggest-area .content-wrap {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 479px) {
  .section-biggest-area .content-wrap {
    grid-template-columns: repeat(1, 1fr);
  }
}

/*info content section*/
.section-info-area {
    margin-bottom: 70px;
}
.section-info-area .info-content-wrap {
    padding: 28px 24px;
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 40px;
    background-color: #fff;
    -webkit-box-shadow: 15px -15px 70px 0px rgba(0, 0, 0, 0.13);
    box-shadow: 15px -15px 70px 0px rgba(0, 0, 0, 0.13);
    position: relative;
    z-index: 1;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}

.section-info-area .info-content-wrap:before {
    content: "";
    position: absolute;
    z-index: -1;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: rotate(45deg) scale(0);
    -ms-transform: rotate(45deg) scale(0);
    transform: rotate(45deg) scale(0);
    opacity: 0.02;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
.section-info-area .info-content-wrap:hover:before {
    -webkit-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity: 1;
}
.section-info-area .info-content-wrap .entry-title {
    position: relative;
    z-index: 1;
    padding-bottom: 5px;
    -webkit-transition: color 0.4s;
    -o-transition: color 0.4s;
    transition: color 0.4s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 10px;
}
.section-info-area .info-content-wrap .entry-title:before {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0px;
    height: 2px;
    width: 100%;
    background-color: #F9F5F0;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
.section-info-area .info-content-wrap .entry-header p {
    margin-bottom: 0;
    -webkit-transition: color 0.4s;
    -o-transition: color 0.4s;
    transition: color 0.4s;
}

.section-info-area {
    counter-reset: count;
}
.section-info-area .info-content-wrap {
    counter-increment: count;
}
.section-info-area .info-content-wrap .entry-title:after {
    content: counter(count, decimal-leading-zero);
    font-size: 50px;
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
    color: #aaa;
  }

/*product utilities css*/
.section-utility-area{
  padding-bottom: 70px;
}
.section-utility-area .row{
  row-gap: 30px;
}

.section-utility-area .utility-content-wrap {
  box-shadow: 0px 0px 13px -4px rgba(0, 0, 0, 0.2);
  padding: 25px;
}
.section-utility-area .inner-content {
  display: flex;
  align-items: center;
  gap: 15px;
}
.utility-content-wrap .featured-image {
  overflow: hidden;
  border-radius: 100%;
  width: 80px;
  flex-shrink: 0;
}
.utility-content-wrap .featured-image img{
  border-radius: 50%;
}
.section-utility-area .inner-content .entry-title a {
  text-decoration: none;
}
.utility-content-wrap .button-container {
  padding-top: 10px;
  margin-top: 30px;
  margin-bottom: -10px;
  position: relative;
  font-size: 13px;
}
.utility-content-wrap .button-container:before {
  border-top: 1px solid rgba(243, 243, 243, 0.8);
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  bottom: 100%;
  margin-right: -25px;
  margin-left: -25px;
}
.utility-content-wrap .button-container a {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media screen and (max-width: 479px) {
 .section-utility-area .inner-content {
  flex-direction: column;
  gap: 30px;
 }
 .section-utility-area .inner-content .entry-content {
  text-align: center;
 }
 .utility-content-wrap .featured-image {
  width: 120px;
 }
}