/* Google Fonts (Poppins: 400, 500, 600) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

:root{
    --primary-color: #5AAA31;
    --primary-color-2: #eefdeb;
    --font-poppins: 'Poppins', sans-serif;
    --font-color: #1a1a1a;
}

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

html,body{
    font-family: var(--bs-font-sans-serif);
    font-size: 16px;
}

.h-100{
    height: 100%;
    padding: 15px 0;
}

.sec-padding{
    padding: 80px 0;
}
.sec-margin{
    margin: 80px 0;
}

/* Owl-Carousel */
.owl-carousel .owl-nav.disabled{
    display: none;
}
.owl-carousel .owl-nav{
    position: absolute;
    top: 50%;
    left: -40px;
    right: -40px;
    transform: translateY(-50%);
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
}
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next{
    outline: none;
    pointer-events: all;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* width: 50px;
    height: 50px;
    border-radius: 50%; */
    background-color: transparent !important;
    color: var(--primary-color) !important;
    font-size: 28px !important;
    font-weight: bolder !important;
}
.owl-carousel .owl-nav .owl-prev.disabled,
.owl-carousel .owl-nav .owl-next.disabled{
    pointer-events: none;
    opacity: 0.5;
}

.owl-carousel .owl-dots.disabled{
    display: none;
}
.owl-carousel .owl-dots{
    position: relative;
    left: 0;
    right: 0;
    bottom: -15px;
    z-index: 1;
    width: 100%;
    text-align: center;
    margin-bottom: 6px;
    pointer-events: none;
}
.owl-carousel .owl-dots .owl-dot{
    pointer-events: all;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--primary-color);
    margin: 0 5px;
    opacity: 0.5;
}
.owl-carousel .owl-dots .owl-dot.active{
    width: 10px;
    height: 10px;
    opacity: 1;
}

.owl-carousel .owl-stage{
    display: flex;
    flex-wrap: wrap;
}
.owl-carousel .owl-stage .owl-item .slide,
.owl-carousel .owl-stage .owl-item .slide > *{
    height: 100%;
}


/* =========== Side-Element-Sticky Area =========== */
@media screen and (min-width: 768px) {
    [data-sticky-main-ele]{
        position: relative;
    }
    [data-sticky-main-ele] [data-sticky-content-ele]{
        position: sticky;
        top: 80px;
        z-index: 1;
        height: 100%;
    }
}
.page-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100vh;
    overflow: hidden;
}
.page-wrapper .page-main {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

/* =========== scroll_bar =========== */
.scroll_bar::-webkit-scrollbar {
    width: 4px;
}

.scroll_bar::-webkit-scrollbar-track {
    background-color: #e1e1e1;
    border-radius: 25px;
}

.scroll_bar::-webkit-scrollbar-thumb {
    background-color: #555;
    border-radius: 25px;
}

/* =========== Text-Overflow =========== */
.text-overflow {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    overflow: hidden;
}

/* =========== Sec-Heading =========== */
.sec-heading > div{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}
.sec-heading.center > div{
    justify-content: center;
}
.sec-heading > div a{
    text-decoration: none;
    font-weight: 600;
    font-size: 1rem;
    color: #333;
    transition: 0.3s;
}
.sec-heading > div a:hover{
    color: var(--primary-color);
}
.sec-heading > div a i{
    display: inline-block;
    color: var(--primary-color);
    margin-left: 5px;
}

/* =========== Sec-Heading =========== */
.product-card{
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    border: 2px solid var(--primary-color);
    padding: 0.92rem;
}
.product-card .top{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}
.product-card .top .cate{
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.8rem;
    color: #fff;
    background-color: var(--primary-color);
    padding: 0.2rem 0.5rem;
}
.product-card .top .rating i{
    font-size: 0.8rem;
    color: rgb(255, 166, 0);
}
.product-card .pro-img{
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    margin-bottom: 1rem;
}
.product-card .pro-img img{
    max-width: 100%;
    max-height: 100%;
}
.product-card .pro-qty{
    display: block;
    font-size: 0.72rem;
    color: #8a8a8a;
    margin-bottom: 0.3rem;
}
.product-card .pro-name{
    text-decoration: none;
    display: block;
    font-weight: 500;
    font-size: 0.92rem;
    color: #333;
    margin-bottom: 0.5rem;
}
.product-card .pro-price{
    margin-top: auto;
}
.product-card .pro-price del{
    display: inline-block;
    font-size: 0.88rem;
    color: #8a8a8a;
    margin-right: 0.3rem;
}
.product-card .pro-price ins{
    text-decoration: none;
    display: inline-block;
    font-weight: 600;
    font-size: 1rem;
    color: #333;
}
.add-to-cart{
    outline: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border-radius: 4px;
    border: 2px solid transparent;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 0.92rem;
    padding: 0.5rem 0.5rem;
    margin-top: 15px;
    transition: border-color 0.3s, background-color 0.3s, color 0.3s;
}
.product-card .add-to-cart i{
    position: relative;
    top: -1px;
    display: inline-block;
    font-size: 0.8rem;
    margin-right: 8px;
}
.product-card .add-to-cart.added i{
    font-size: 1rem;
}
.add-to-cart:hover{
    border-color: var(--primary-color);
    background-color: #fff;
    color: var(--primary-color);
    font-weight: 600;
}
.product-card .add-to-cart.added{
    border-color: transparent;
    background-color: var(--primary-color-2);
    color: var(--primary-color);
    font-weight: 600;
    cursor: default;
}

/* =================== Announcement-Sec Area =================== */
.announcement-sec{
    position: relative;
    text-align: center;
    font-size: 0.85rem;
    padding: 2px 15px;
    background-color: greenyellow;
}
.announcement-sec p{
    margin: 0;
}
.announcement-sec button{
    border: none;
    overflow: none;
    box-shadow: none;
    background-color: transparent;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    padding: 1px 5px;
}
/* =================== End Announcement-Sec Area =================== */

/* =================== Header Area =================== */
header{
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    background-color: #fff;
    padding: 8px 0;
}
header.sticky{
    position: sticky;
    animation: sticky 1s ease-out;
}
@keyframes sticky {
    0%{
        transform: translateY(-150px);
    }
    100%{
        transform: translateY(0);
    }
}
.main-header .header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.main-header .header .logo img{
    width: 100%;
    max-width: 180px;
}
.main-header .header .nav ul,
.main-header .header .menu-btns ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.main-header .header .nav li,
.main-header .header .menu-btns li{
    position: relative;
    display: inline-block;
    padding: 8px 3px;
    margin: 0 8px;
}
.main-header .header .nav li a,
.main-header .header .menu-btns li button{
    text-decoration: none;
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    color: var(--font-color);
}
.main-header .header .nav li a::after{
    content: '';
    display: block;
    width: 0%;
    height: 2px;
    background-color: var(--primary-color);
    transition: 0.3s;
}
.main-header .header .nav li a:hover{
    color: var(--primary-color);
}
.main-header .header .nav li a:hover::after{
    width: 100%;
}
.main-header .header .menu-btns li button{
    position: relative;
    font-size: 1.1rem;
    transition: 0.3s;
}
.main-header .header .menu-btns li button.cart span{
    position: absolute;
    top: -5px;
    right: -8px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    line-height: 1;
    border-radius: 50%;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 0.65rem;
    padding-top: 2px;
}
.main-header .header .menu-btns li:hover button{
    color: var(--primary-color);
}
.main-header .header .menu-btns li .drop-down{
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: #fff;
    position: absolute;
    top: 100%;
    right: -100%;
    width: 150px;
    opacity: 0;
    pointer-events: none;
    transition: 0.3s;
}
.main-header .header .menu-btns li:hover .drop-down{
    opacity: 1;
    pointer-events: all;
}
.main-header .header .menu-btns li .drop-down li{
    display: block;
    border: 1px solid #ccc;
    padding: 0;
    margin: -1px 0 0;
}
.main-header .header .menu-btns li .drop-down li a{
    text-decoration: none;
    display: block;
    font-size: 0.92rem;
    color: var(--font-color);
    padding: 6px 8px;
    transition: 0.3s;
}
.main-header .header .menu-btns li .drop-down li a:hover{
    background-color: var(--primary-color);
    color: #fff;
}
.main-header .header .side-menu-btn{
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    line-height: 1;
    font-size: 1.25rem;
    color: var(--font-color);
    display: none;
}

@media screen and (max-width: 575px) {
    header{
        padding: 10px 0;
    }

    .main-header .header .side-menu-btn,
    .main-header .header .logo,
    .main-header .header .menu-btns{
        flex: none;
    }
    .main-header .header .side-menu-btn{
        width: 30%;
        text-align: left;
    }
    .main-header .header .logo{
        width: 40%;
        text-align: center;
    }
    .main-header .header .menu-btns{
        width: 30%;
        text-align: right;
    }

    .main-header .header .side-menu-btn{
        display: block;
    }
    .main-header .header .nav{
        display: none;
    }
    .main-header .header .logo img{
        width: 115px;
    }
    .main-header .header .menu-btns li{
        padding: 0;
        margin: 0 0.2rem;
    }
    .main-header .header .menu-btns li button{
        font-size: 0.92rem;
    }
    .main-header .header .menu-btns li .drop-down{
        width: 120px;
    }
    .main-header .header .menu-btns li .drop-down li a{
        font-size: 0.8rem;
        padding: 4px 8px;
    }
}
/* =================== End Header Area =================== */

/* =================== Side-Popup Area =================== */
.side-popup-sec{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    pointer-events: none;
}
.side-popup-sec.active{
    pointer-events: all;
}
.side-popup-sec .overlay{
    position: relative;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: 0.3s ease;
}
.side-popup-sec.active .overlay{
    opacity: 1;
}
.side-popup-sec .side-popup-box{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    max-width: 340px;
    transform: translateX(120%);
    transition: 0.3s ease;
}
.side-popup-sec.active .side-popup-box{
    transform: translateX(0%);
}
.side-popup-sec .side-popup::-webkit-scrollbar {
    appearance: none;
    display: none;
    width: 0% !important;
}
.side-popup-sec .side-popup{
    scrollbar-width: none;
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #fff;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    padding: 1rem;
}
.side-popup-sec .close-btn{
    text-align: right;
    margin-bottom: 0.8rem;
}
.side-popup-sec .close-btn button{
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    line-height: 1;
    font-size: 1.2rem;
    padding: 0.3rem 0.5rem;
    margin: -0.1rem -0.3rem 0 0;
}
/* =================== End Side-Popup Area =================== */

/* =================== Side-Menu-Popup Area =================== */
[data-side-popup="side-menu"] .side-popup-box{
    width: 280px;
}
[data-side-popup="side-menu"] .side-popup .close-btn{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #ccc;
    padding: 0;
    margin: -1rem;
}
[data-side-popup="side-menu"] .side-popup .close-btn button{
    height: 100%;
    border-left: 1px solid #ccc;
    padding: 0.6rem 0.8rem;
    margin: 0;
}
[data-side-popup="side-menu"] .side-popup .close-btn .logo{
    padding: 0.6rem 0.8rem;
}
[data-side-popup="side-menu"] .side-popup .close-btn .logo img{
    width: 100px;
}
[data-side-popup="side-menu"] .side-popup .nav{
    display: block;
    list-style: none;
    padding: 0;
    margin: 3rem 0 0;
}
[data-side-popup="side-menu"] .side-popup .nav li{
    display: block;
    text-align: center;
    padding: 0.4rem 1rem;
}
[data-side-popup="side-menu"] .side-popup .nav li a{
    text-decoration: none;
    display: inline-block;
    color: var(--font-color);
}
/* =================== End Side-Menu-Popup Area =================== */

/* =================== Search-Popup Area =================== */
[data-side-popup="search-popup"] .side-popup form {
    position: relative;
    border-radius: 8px;
    background-color: var(--primary-color);
    margin-bottom: 20px;
}
[data-side-popup="search-popup"] .side-popup form input {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    color: #fff;
    width: 100%;
    padding: 10px 15px;
    padding-right: 40px;
}
[data-side-popup="search-popup"] .side-popup form input::placeholder {
    font-family: var(--font-poppins);
    font-weight: 500;
    font-size: 13px;
    color: #fff;
}
[data-side-popup="search-popup"] .side-popup form button {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    color: #fff;
    width: 40px;
}

/* Search-Result-Box */
.search-result {
    height: 100%;
    min-height: 1px;
    max-height: 100%;
    overflow: auto;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
}
.search-result .search-output a {
    text-decoration: none;
    display: block;
    padding: 10px 15px;
}
.search-result .search-output a{
    border-bottom: 1px solid #dfdfdf;
}
.search-result .search-output a:hover {
    background-color: rgba(74, 143, 44, 0.1);
}
.search-result .search-output .output-box {
    display: flex;
    align-items: center;
}
.search-result .search-output .output-box .img {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 65px;
    height: 65px;
    margin-right: 20px;
}
.search-result .search-output .output-box .img img {
    flex: none;
    width: 100%;
    height: 100%;
    /* max-width: 100%;
    max-height: 100%; */
    object-fit: cover;
}
.search-result .search-output .output-box .product-name {
    font-family: var(--font-poppins);
    font-size: 14px;
    font-weight: 500;
    color: #333;
}
.search-result .no-result{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}
/* =================== End Search-Popup Area =================== */

/* =================== Cart-Popup Area =================== */
[data-side-popup="cart-popup"] .side-popup .total{
    border-top: 1px solid #aaa;
    padding-top: 0.8rem;
    margin-top: auto;
}
[data-side-popup="cart-popup"] .side-popup .total p,
[data-side-popup="cart-popup"] .side-popup .total .btns{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
}
[data-side-popup="cart-popup"] .side-popup .total p{
    padding: 0 0.4rem;
}
[data-side-popup="cart-popup"] .side-popup .total p b{
    color: var(--primary-color);
}
[data-side-popup="cart-popup"] .side-popup .total .btns button{
    border: none;
    overflow: none;
    box-shadow: none;
    border-radius: 50px;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 1rem;
    font-weight: 400;
    padding: 0.4rem 1.2rem;
}
[data-side-popup="cart-popup"] .result-box{
    height: 100%;
    min-height: 1px;
    max-height: 100%;
    overflow: auto;
    margin-bottom: 15px;
}
[data-side-popup="cart-popup"] .result-box .result{
    text-decoration: none;
    color: var(--font-color);
    display: flex;
    align-items: flex-start;
    padding: 0.6rem 0;
}
[data-side-popup="cart-popup"] .result-box .result:not(:last-child){
    border-bottom: 1px solid #ccc;
}
[data-side-popup="cart-popup"] .result-box .result .img{
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 65px;
    height: 65px;
    margin-right: 12px;
}
[data-side-popup="cart-popup"] .result-box .result .img img{
    /* max-width: 100%;
    max-height: 100%; */
    width: 100%;
    height: 100%;
    object-fit: cover;
}
[data-side-popup="cart-popup"] .result-box .result .info p{
    margin-bottom: 5px;
}
[data-side-popup="cart-popup"] .result-box .result .info span{
    font-size: 0.8rem;
}
[data-side-popup="cart-popup"] .result-box .cart-empty{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}
/* =================== End Cart-Popup Area =================== */

/* =================== Banner-Sec Area =================== */
.banner-sec .img img{
    width: 100%;
}
/* =================== End Banner-Sec Area =================== */

/* =================== Best-Seller-Sec Area =================== */
.best-seller-sec .filter-btns{
    border-bottom: 2px solid #ccc;
    margin-bottom: 50px;
    display: flex;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}
.best-seller-sec .filter-btns button{
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border-bottom: 2px solid transparent;
    padding: 0.5rem 1rem;
    white-space: nowrap;
    margin-bottom: -2px;
}
.best-seller-sec .filter-btns button.active{
    border-color: var(--primary-color);
}
/* =================== End Best-Seller-Sec Area =================== */

/* =================== About-Sec Area =================== */
.about-sec{
    background-color: var(--primary-color-2);
}
.about-sec .points{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.about-sec .points > div{
    flex: none;
    width: 50%;
    display: flex;
    align-items: center;
    margin-bottom: 22px;
}
.about-sec .points > div .img{
    width: 60px;
    aspect-ratio: 1 / 1;
    margin-right: 10px;
}
.about-sec .points > div .img img{
    max-width: 100%;
    max-height: 100%;
}
.about-sec .points > div span{
    font-size: 0.92rem;
}
.about-sec .about-img img{
    max-width: 100%;
}
/* =================== End About-Sec Area =================== */

/* =================== Product-Cate-Sec Area =================== */
.product-cate-sec .sec-img img{
    /* max-width: 100%; */
    width: 100%;
}
.product-cate-slider.owl-carousel .owl-nav{
    justify-content: flex-end;
}
.product-cate-slider.owl-carousel .owl-nav .owl-prev{
    display: none !important;
}
/* =================== End Product-Cate-Sec Area =================== */

/* =================== Testimonial-Sec Area =================== */
.testimonial-slider.owl-carousel .owl-nav{
    left: 40px;
    right: 40px;
}
.testimonial-slider .testimonial{
    text-align: center;
    border: 2px solid var(--primary-color);
    background-color: var(--primary-color-2);
    padding: 40px;
}
.testimonial-slider .testimonial .img{
    display: inline-block;
    width: 100px;
    aspect-ratio: 1 / 1;
    margin-bottom: 15px;
}
.testimonial-slider .testimonial .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.testimonial-slider .testimonial .name{
    font-weight: 600;
    font-size: 1.1rem;
}
.testimonial-slider .testimonial .sub{
    font-size: 0.85rem;
    color: #8a8a8a;
}
.testimonial-slider .testimonial .rating{
    font-size: 0.8rem;
    color: rgb(255, 166, 0);
    margin: 10px 0 15px;
}
.testimonial-slider .testimonial .comment{
    font-size: 0.92rem;
}
/* =================== End Testimonial-Sec Area =================== */

/* =================== Footer Area =================== */
footer{
    background-color: var(--primary-color-2);
}
.footer{
    padding: 40px 0;
}
.footer .logo{
    margin-bottom: 15px;
}
.footer .logo img{
    width: 140px;
}
.footer .des{
    font-size: 0.85rem;
    margin: 0;
}
.footer .title{
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 15px;
}
.footer ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer ul li{
    margin-bottom: 8px;
}
.footer ul a{
    text-decoration: none;
    display: inline-block;
    font-size: 0.85rem;
    color: #333;
    transition: 0.3s;
}
.footer ul a:hover{
    color: var(--primary-color);
}
.footer ul.links a::after{
    content: '';
    display: block;
    width: 0%;
    height: 2px;
    background-color: var(--primary-color);
    transition: 0.3s;
}
.footer ul.links a:hover:after{
    width: 100%;
}
.footer ul p{
    font-weight: 600;
    font-size: 0.85rem;
    margin-bottom: 3px;
}
.copy-msg{
    text-align: center;
    font-weight: 600;
    background-color: rgba(73, 143, 43, 0.25);
    color: var(--primary-color);
    padding: 15px 0;
}
/* =================== End Footer Area =================== */

/* =================== Login-Signup-Page Area =================== */
.login-signup-page .form-box{
    display: flex;
    flex-wrap: wrap;
    background-color: var(--primary-color-2);
    padding: 25px;
}
.login-signup-page .form-box .left-box,
.login-signup-page .form-box .right-box{
    flex: none;
    width: 50%;
    padding: 25px;
}
.login-signup-page .form-box .input-field:not(:last-child){
    margin-bottom: 15px;
}
.login-signup-page .form-box .input-field label{
    display: flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
}
.login-signup-page .form-box .input-field label span{
    display: inline-block;
    font-size: 0.85rem;
    margin-left: 5px;
}
.login-signup-page .form-box .input-field .label{
    display: block;
    font-size: 0.85rem;
    margin-bottom: 0.25rem;
}
.login-signup-page .form-box .input-field input:not([type=checkbox], [type=submit]),
.login-signup-page .form-box .input-field select{
    display: block;
    width: 100%;
    outline: none;
    box-shadow: none;
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 10px 15px;
}
.login-signup-page .form-box .input-field input.error-msg{
    border: 1px solid red;
}
.login-signup-page .form-box .input-field small.error-msg{
    font-size: 0.72rem;
    color: red;
}
.login-signup-page .form-box .input-field.submit{
    text-align: right;
}
.login-signup-page .form-box .input-field.submit a{
    font-size: 0.85rem;
    color: #333;
}
.login-signup-page .form-box .input-field.submit input{
    outline: none;
    box-shadow: none;
    border: 1px solid #aaa;
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 22px;
    margin-left: 8px;
}
.login-signup-page .login-or-signup{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: #fff;
}
.login-signup-page .login-or-signup h6{
    margin-bottom: 15px;
}
.login-signup-page .login-or-signup a{
    display: inline-block;
    text-decoration: none;
    outline: none;
    box-shadow: none;
    border: 1px solid #aaa;
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 22px;
}
.login-signup-page .form-box.register{
    padding: 50px 25px;
}
.login-signup-page .form-box.register .input-field{
    flex: none;
    width: 50%;
    padding: 0 25px;
}
.login-signup-page .form-box.register .input-field.submit{
    margin-top: 15px;
}
/* =================== End Login-Signup-Page Area =================== */

/* =================== Shop-Page Area =================== */
.shop-page .shop-filter .m-view{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #333;
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.shop-page .shop-filter .m-view span{
    font-weight: 500;
    font-size: 0.85rem;
}
.shop-page .shop-filter .m-view button{
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    font-size: 0.72rem;
}

.shop-page .shop-filter .d-view .filter-sec{
    height: calc(100vh - 115px);
    background-color: var(--primary-color-2);
    padding: 18px 18px;
    margin-top: 15px;
}

.filter-sec{
    height: calc(100vh - 80px);
    display: flex;
    flex-direction: column;
    padding: 0 12px;
}
.filter-sec .title{
    font-weight: 500;
    font-size: 1.4rem;
    color: #333;
    margin-bottom: 20px;
}
.filter-sec ul{
    list-style: none;
    padding: 0;
    margin: 0;

    max-height: 100%;
    overflow: auto;

    padding-right: 15px;
    margin-right: -5px;
}
.filter-sec ul li:not(:last-child) a{
    border-bottom: 1px solid var(--primary-color);
}
.filter-sec ul li a{
    text-decoration: none;
    display: block;
    font-size: 0.92rem;
    color: #333;
    padding: 10px 15px;
    transition: 0.3s;
}
.filter-sec ul li a.active,
.filter-sec ul li a:hover{
    background-color: rgba(74, 143, 44, 0.5);
    color: #fff;
}

@media screen and (min-width: 768px) {
    .shop-page .shop-filter .m-view{
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .shop-page.sec-margin{
        margin: 42px 0px;
    }

    .shop-page .shop-filter .d-view{
        display: none;
    }
}
/* =================== End Shop-Page Area =================== */

/* =================== Product-Detail-Page Area =================== */
.product-detail-page{

}
.product-detail-page .product-info .product-cate{
    font-style: italic;
    font-size: 1rem;
    color: var(--primary-color);
    margin-bottom: 0.3rem;
}
.product-detail-page .product-info .product-name{
    font-size: 1.8rem;
    color: #333;
    margin-bottom: 0.6rem;
}
.product-detail-page .product-info .product-des{
    font-size: 0.85rem;
    color: #8a8a8a;
    margin-bottom: 0.8rem;
}
.product-detail-page .product-info .product-price ins{
    text-decoration: none;
    font-weight: 600;
    font-size: 1.8rem;
    color: #4a4a4a;
}
.product-detail-page .product-info .product-price del{
    font-size: 1.2rem;
    color: #aaa;
}
.product-detail-page .product-info .product-btns{
    margin-top: 1rem;
}
.product-detail-page .product-info .product-btns .qty-btns{
    position: relative;
    top: 2px;
    display: inline-flex;
    max-width: 85px;
}
.product-detail-page .product-info .product-btns .qty-btns > input{
    display: block;
    width: 100%;
    border: 1px solid #aaa;
    text-align: center;
    margin-right: -1px;
}
.product-detail-page .product-info .product-btns .qty-btns > div button{
    display: block;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border: 1px solid #aaa;
    font-size: 0.65rem;
    padding: 1px 3px;
    transition: 0.3s;
}
.product-detail-page .product-info .product-btns .qty-btns > div button:hover{
    background-color: var(--primary-color-2);
}
.product-detail-page .product-info .product-btns .add-to-cart{
    outline: none;
    box-shadow: none;
    min-width: 180px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    border: 2px solid transparent;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 0.92rem;
    padding: 0.5rem 1.2rem;
    margin-top: 15px;
    margin-left: 10px;
    transition: border-color 0.3s, background-color 0.3s, color 0.3s;
}
.product-detail-page .product-info .product-btns .add-to-cart i{
    position: relative;
    top: -1px;
    display: inline-block;
    font-size: 0.8rem;
    margin-right: 8px;
}
.product-detail-page .product-info .product-btns .add-to-cart:hover{
    border-color: var(--primary-color);
    background-color: #fff;
    color: var(--primary-color);
    font-weight: 600;
}
.product-detail-page .product-info .product-btns .add-to-cart.added{
    border-color: var(--primary-color);
    background-color: var(--primary-color-2);
    color: var(--primary-color);
    font-weight: 600;
    cursor: default;
}

.product-slider .owl-nav{
    left: 25px;
    right: 25px;
}
.product-slider .product-img{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
}
.product-slider .product-img img{
    max-width: 100%;
    max-height: 100%;
}
.product-slider-nav{
    margin-top: 15px;
}
.product-slider-nav .nav-img{
    position: relative;
    border: 1px solid #eee;
    cursor: pointer;
}
.product-slider-nav .nav-img.active::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #4a8f2c;
    opacity: 0.4;
}
/* =================== End Product-Detail-Page Area =================== */




/* =================== start loging-Page Area =================== */
@media screen and (max-width: 767px) {
    .testimonial-slider .testimonial{
        padding: 30px 15px;
    }
    .login-signup-page .form-box{
        flex-direction: column;
    }
    .login-signup-page .form-box .left-box, .login-signup-page .form-box .right-box{
        width: 100%;
        padding-left: 0px;
        padding-right: 0px;
    }
    .login-signup-page .login-or-signup{
        background: transparent;
    }

    .login-signup-page .form-box.register .input-field{
        width: 100%;
        padding: 0px;
    }
}

/* =================== End loging-Page Area =================== */

/* =================== Start Cart-Page Area =================== */
input[type=number] {
    -moz-appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    appearance: none;
}

/* ======================== Cart-Sec Area ======================== */
.cart-sec {
    margin: 50px 0;
}

.cart-sec .cus-row {
    display: flex;
}

.cart-sec .cus-row>div {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 5px;
}

.cart-sec .cus-row>div:first-child {
    padding-left: 10px;
}

.cart-sec .cus-row>div:last-child {
    padding-right: 10px;
}

.cart-sec .cus-row>div:nth-child(1) {
    width: 60%;
}

.cart-sec .cus-row>div:nth-child(2) {
    width: 10%;
}

.cart-sec .cus-row>div:nth-child(3) {
    width: 15%;
}

.cart-sec .cus-row>div:nth-child(4) {
    width: 10%;
}

.cart-sec .cus-row>div:nth-child(5) {
    width: 5%;
}

.cart-sec .cart-head p,
.cart-sec .cart-body p {
    margin: 0;
}


.cart-sec .cart-head {
    border-bottom: 5px solid #fff;
    background-color: var(--primary-color);
    text-align: center;
    font-size: 16px;
    color: #fff;
}

.cart-sec .cart-head>.cus-row>div:not(:last-child) {
    border-right: 1px solid #fff;
}


.cart-sec .cart-body {
    color: #999;
}

.cart-sec .cart-body .cus-row {
    background-color: var(--primary-color-2);
    border-bottom: 5px solid #fff;
}

.cart-sec .cart-body .cus-row:nth-child(odd) {
    /* background-color: #2c3034; */
}

.cart-sec .cart-body .cus-row:nth-child(even) {
    /* background-color: #212529; */
}


.cart-sec .cart-body>.cus-row>div:not(:last-child) {
    /* border-right: 1px solid rgba(194, 164, 118, 0.1); */
}

.cart-sec .cart-body>.cus-row>div:nth-child(1)>* {
    width: 100%;
    display: flex;
    align-items: center;
}

.cart-sec .cart-body .product-img {
    flex: none;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    margin-right: 12px;
    font-size: 6px;
    user-select: none;
    /* pointer-events: none; */
}
.cart-sec .cart-body .product-img a{
    width: 100%;
    height: 100%;
    display: block;
}
.cart-sec .cart-body .product-img img {
    max-width: 100%;
    max-height: 100%;
}

.cart-sec .cart-body .product-img span {
    display: block;
    position: absolute;
    top: 25%;
    font-size: 1em;
}

.cart-sec .cart-body .des {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    overflow: hidden;
    text-align: left;
    font-size: 16px;
}

.cart-sec .cart-body .des a {
    text-decoration: none;
    color: #000000;
}

.cart-sec .cart-body .des .cate a {
    display: inline-block;
    color: var(--primary-color);
    margin-bottom: 3px;
}

.cart-sec .cart-body .des .pro-name a:hover {
    text-decoration: underline
}

.cart-sec .cart-body .qty-box button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    display: inline-block;
    color: var(--primary-color);;
    font-size: 18px;
}

.cart-sec .cart-body .qty-box input {
    display: inline-block;
    width: 100%;
    max-width: 50px;
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border: 1px solid var(--primary-color);;
    color: #999;
    font-size: 16px;
    text-align: center;
    padding: 3px 0;
    margin: 0 8px;
    pointer-events: none;
}

.cart-sec .cart-body .total {
    color: var(--primary-color);;
}

.cart-sec .cart-body .remove-btn {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    color: var(--primary-color);;
    padding: 8px;
}

@media screen and (max-width: 991px) {
    .cart-sec .cus-row>div:nth-child(1) {
        width: 42%;
    }

    .cart-sec .cus-row>div:nth-child(2) {
        width: 15%;
    }

    .cart-sec .cus-row>div:nth-child(3) {
        width: 20%;
    }

    .cart-sec .cus-row>div:nth-child(4) {
        width: 15%;
    }

    .cart-sec .cus-row>div:nth-child(5) {
        width: 8%;
    }
}

@media screen and (max-width: 767px) {
    .cart-sec .cus-row {
        border: 1px solid #fff;
        flex-wrap: wrap;
        padding: 10px;
        margin-bottom: 15px;
    }

    .cart-sec .cus-row>div {
        padding: 0;
    }

    .cart-sec .cus-row>div:first-child {
        padding-left: 0;
    }

    .cart-sec .cus-row>div:last-child {
        padding-right: 0;
    }

    .cart-sec .cus-row>div:nth-child(1) {
        width: 100%;
        border-bottom: 3px solid #fff;
        padding-bottom: 6px;
        margin-bottom: 12px;
    }

    .cart-sec .cus-row>div:nth-child(2) {
        width: 25%;
    }

    .cart-sec .cus-row>div:nth-child(3) {
        width: 25%;
    }

    .cart-sec .cus-row>div:nth-child(4) {
        width: 25%;
    }

    .cart-sec .cus-row>div:nth-child(5) {
        width: 25%;
    }

    .cart-sec .cart-head {
        display: none;
    }

    .cart-sec .cart-body .qty-box button {
        font-size: 15px;
    }

}

@media screen and (max-width: 575px) {
    .cart-sec .cus-row {
        margin-bottom: 5px;
    }

    .cart-sec .cus-row>div:nth-child(1) {
        padding-bottom: 0;
    }

    .cart-sec .cus-row>div:nth-child(2) {
        display: none;
    }

    .cart-sec .cus-row>div:nth-child(3) {
        width: 40%;
    }

    .cart-sec .cus-row>div:nth-child(4) {
        width: 40%;
    }

    .cart-sec .cus-row>div:nth-child(5) {
        width: 20%;
    }

    .cart-sec .cart-body .qty-box input {
        max-width: 45px;
        margin: 0 5px;
    }

}

.checkout-box {
    max-width: 320px;
    margin-left: auto;
    margin-top: 50px;
}

.checkout-box .apply-code {
    margin-bottom: 20px;
}

.checkout-box .apply-code form {
    position: relative;
    display: flex;
    border: 2px solid var(--primary-color);;
}

.checkout-box .apply-code input,
.checkout-box .apply-code button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
}

.checkout-box .apply-code input {
    width: 100%;
    color: #999;
    padding: 3px 10px;
}

.checkout-box .apply-code button {
    white-space: nowrap;
    background-color: var(--primary-color);
    color: #fff;
    padding: 5px 15px;
    transition: .3s ease;
}

.checkout-box .apply-code button:hover {
    background-color: #fff;
    color: var(--primary-color);;
}

.checkout-box .checkout-info>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    margin-bottom: 5px;
}

.checkout-box .checkout-info .sub-total {
    font-size: 18px;
    margin-bottom: 10px;
}

.checkout-box .checkout-info .total {
    font-size: 28px;
    color: var(--primary-color);;
    margin-top: 25px;
}

.checkout-box .checkout-info .checkout-btn button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    width: 100%;
    border: 2px solid var(--primary-color);;
    color: var(--primary-color);;
    font-size: 18px;
    padding: 5px 15px;
    margin-top: 25px;
    transition: .3s ease;
}

.checkout-box .checkout-info .checkout-btn button:hover {
    background-color: var(--primary-color);;
    color: #fff;
}

@media screen and (max-width: 767px) {
    .checkout-box {
        max-width: 100%;
    }
}

/* ======================== End Cart-Sec Area ======================== */

.set-margin {
    margin-bottom: 92px;
}

@media screen and (max-width: 991px) {
    .set-margin {
        margin-bottom: 25px;
    }
}
/* =================== End Cart-Page Area =================== */

/* =================== Start checkout-Page Area =================== */
/*-------- 2.6 Checkout --------*/
.nav-link {
    display: block;
    padding: 0 15px;
    height: 30px;
    font-size: 15px;
    font-size: 0.9375rem;
    color: #444;
}

.nav-link:hover,
.nav-link:focus {
    text-decoration: none;
}

.nav-link.disabled {
    color: #6c757d;
}

.nav-tabs {
    border: none;
    border-bottom: 2px solid #dee2e6;
}

.nav-tabs .nav-item {
    margin-bottom: -2px;
}

.nav-tabs .nav-link {
    border: none;
}

.nav-tabs .nav-link.disabled {
    color: #6c757d;
    background-color: transparent;
    border-color: transparent;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    border-bottom: 2px solid #004dda;
    color: #004dda;
    background-color: transparent;
}

.tab-content.checkout {
    padding: 15px 0 0 0;
}

.tab-content.checkout hr {
    margin: 10px 0;
}

.tab-content.checkout .form-group {
    margin-bottom: 10px;
}

.tab-content.checkout .nice-select {
    margin-bottom: 0;
}

.tab-content.checkout .social_bt {
    margin-bottom: 10px;
}

#other_addr_c {
    display: none;
}

.step {
    margin-bottom: 30px;
}

@media (max-width: 991px) {
    .step {
        margin-bottom: 35px;
    }
}

.step h3:before {
    width: 0;
    height: 0;
    border-top: 20px inset transparent;
    border-bottom: 20px inset transparent;
    border-left: 10px solid #f8f8f8;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
}

@media (max-width: 767px) {
    .step h3:before {
        border: none;
    }
}

.step h3:after {
    width: 0;
    height: 0;
    border-top: 20px inset transparent;
    border-bottom: 20px inset transparent;
    border-left: 10px solid var(--primary-color);
    position: absolute;
    content: "";
    top: 0;
    right: -10px;
    z-index: 2;
}

@media (max-width: 767px) {
    .step h3:after {
        border: none;
    }
}

.step.first h3:before,
.step.last h3:after {
    border: none;
}

.step h3 {
    padding: 10px 12px 10px 20px;
    background: var(--primary-color);
    position: relative;
    margin-bottom: 15px;
    color: #fff;
    font-size: 18px;
}

@media (max-width: 767px) {
    .step h3 {
        margin-left: -15px;
        margin-right: -15px;
        padding-left: 15px;
    }
}

.step #forgot_pw {
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
}

.payments ul,
.shipping ul {
    list-style: none;
    margin: 0 0 10px 0;
    padding: 0;
}

.payments ul li,
.shipping ul li {
    border-bottom: 1px solid #ededed;
    margin-bottom: 8px;
}

.payments ul li a.info,
.shipping ul li a.info {
    display: inline-block;
    float: right;
    color: #444;
}

.payments ul li a.info:hover,
.shipping ul li a.info:hover {
    color: #004dda;
}

.payments ul li a.info:after,
.shipping ul li a.info:after {
    font-family: 'themify';
    content: "\e718";
    position: relative;
    right: 0;
    top: 0;
    font-size: 15px;
    font-size: 0.9375rem;
}

.payment_info figure img {
    height: 20px;
    width: auto;
}

.payment_info p {
    font-size: 13px;
    font-size: 0.8125rem;
}

.box_general.summary {
    box-shadow: none;
    background-color: #fff;
    padding-bottom: 20px;
    padding: 25px 25px 20px 25px;
    border: 1px solid #ededed;
}

.box_general.summary ul {
    list-style: none;
    margin: 0 0 15px 0;
    padding: 0;
    border-bottom: 1px solid #ededed;
}

.box_general.summary ul li {
    padding: 0;
    margin: 0 0 15px 0;
    font-weight: 500;
    display: block;
    line-height: 1.3;
}

.box_general.summary ul li em {
    font-style: normal;
    float: left;
    width: 70%;
    font-weight: 400;
}

.box_general.summary ul li span {
    float: right;
    text-align: right;
    width: 30%;
    font-weight: 700;
}

.box_general.summary label.container_check {
    font-size: 12px;
    font-size: 0.75rem;
}

.box_general.summary .total {
    font-size: 18px;
    font-weight: 700;
    border-bottom: none;
    color: red;
}

.box_general.summary .total span {
    float: right;
    margin-bottom: 15px;
}

#confirm {
    text-align: center;
    background-color: #f8f8f8;
    padding: 150px 15px;
}

@media (max-width: 767px) {
    #confirm {
        padding: 60px 15px;
    }
}

@-webkit-keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@-ms-keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes checkmark {
    0% {
        stroke-dashoffset: 50px;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

@-ms-keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

@keyframes checkmark-circle {
    0% {
        stroke-dashoffset: 240px;
    }

    100% {
        stroke-dashoffset: 480px;
    }
}

.inlinesvg .svg svg {
    display: inline;
}

.icon--order-success svg path {
    -webkit-animation: checkmark 0.25s ease-in-out 0.7s backwards;
    animation: checkmark 0.25s ease-in-out 0.7s backwards;
}

.icon--order-success svg circle {
    -webkit-animation: checkmark-circle 0.6s ease-in-out backwards;
    animation: checkmark-circle 0.6s ease-in-out backwards;
}




.checkout-page .input-group {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}

.checkout-page .input-group-prepend {
    margin-right: -1px;
}

.checkout-page .input-group-append,
.checkout-page .input-group-prepend {
    display: -ms-flexbox;
    display: flex;
}


.checkout-page .input-group>.input-group-append:last-child>.btn:not(:last-child):not(.dropdown-toggle),
.checkout-page .input-group>.input-group-append:last-child>.input-group-text:not(:last-child),
.checkout-page .input-group>.input-group-append:not(:last-child)>.btn,
.checkout-page .input-group>.input-group-append:not(:last-child)>.input-group-text,
.checkout-page .input-group>.input-group-prepend>.btn,
.checkout-page .input-group>.input-group-prepend>.input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.checkout-page .input-group-text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: .375rem .75rem;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

.checkout-page .input-group>.custom-select:not(:first-child),
.checkout-page .input-group>.form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.checkout-page .input-group>.custom-file,
.checkout-page .input-group>.custom-select,
.checkout-page .input-group>.form-control,
.checkout-page .input-group>.form-control-plaintext {
    position: relative;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    min-width: 0;
    margin-bottom: 0;
}

.checkout-page input,
.checkout-page select {
    box-shadow: none !important;
    outline: none !important;
    border-color: #aaa !important;
}

.checkout-page input::placeholder,
.checkout-page select::placeholder {
    color: #777;
}

.checkout-page a.btn_1,
.checkout-page .btn_1 {
    text-decoration: none;
    border: none;
    outline: none;
    /* border: 2px solid #e2acde; */
    background:var(--primary-color);;
    color: #fff;
    display: inline-block;
    cursor: pointer;
    padding: 10px 18px;
    text-align: center;
    font-weight: 600;
    font-size: 15px;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    line-height: normal;
}

.checkout-page button,
.checkout-page input {
    -webkit-appearance: auto;
}
/* .checkout-page a.btn_1:hover,
.checkout-page .btn_1:hover {
    background-color: #a2e4b8;
    color: #fff !important;
} */

.checkout-page .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(245,245,245,0.7);
    z-index: 2;
}

.set-appearance{
    -webkit-appearance: auto;
    appearance: auto;
}

em{
    color: #333;
}

.discount-coupon{
    position: relative;
    display: flex;
    border: 2px solid #e2acde;
    margin-bottom: 20px;
}
.discount-coupon input,
.discount-coupon button{
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
}
.discount-coupon input{
    width: 100%;
    color: #999;
    padding: 3px 10px;
}
.discount-coupon button{
    white-space: nowrap;
    background-color: #e2acde;
    color: #fff;
    padding: 5px 15px;
    transition: .3s ease;
}


.checkout-page .btn_1.cust-back-btn{
    border: 2px solid #000 !important;
    background: #fff !important;
    color: #000 !important;
    padding: 3px 8px !important;
}
.checkout-page .btn_1.cust-back-btn:hover{
    border: 2px solid #a2e4b8 !important;
    background: #fff !important;
    color: #a2e4b8 !important;
}
/* =================== End checkout-Page Area =================== */
/* =================== start profile-Page Area =================== */

 .panel-page {
     padding: 50px 0;
     margin-bottom: 30px;
 }

.panel-page .d-none {
    display: none !important;
}

.panel-page .d-block {
    display: block !important;
}

.panel-page .d-flex {
    display: flex !important;
}

.panel-page .row.d-flex {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.panel-page .row.d-flex>div {
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
}

.panel-page .row.d-flex .col-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

.ms-auto {
    margin-left: auto;
}

@media (min-width: 576px) {
    .panel-page .row.d-flex .col-sm-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .panel-page .row.d-flex .col-sm-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (min-width: 768px) {
    .panel-page .row.d-flex .col-md-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .panel-page .row.d-flex .col-md-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .ms-md-0 {
        margin-left: 0;
    }
}

@media (min-width: 992px) {
    .panel-page .row.d-flex .col-lg-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

.panel-page .row.d-flex .edit-address-box,
.panel-page .row.d-flex .add-address-box {
    height: 100%;
    min-height: 280px;
}

.panel-page input[type="number"]::-webkit-inner-spin-button,
.panel-page input[type="number"]::-webkit-inner-spin-button {
    appearance: none;
}

.panel-page input[type="number"] {
    -moz-appearance: textfield;
}

.panel-page .primary-btn,
.panel-page .secondary-btn,
.panel-page .third-btn {
    text-decoration: none !important;
    width: auto !important;
    border: none !important;
    outline: none !important;
    font-size: 16px !important;
    padding: 10px 20px !important;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
    cursor: pointer;
    transition: .3s;
    border-radius: 4px;
}

@media screen and (max-width: 1199px) {

    .panel-page .primary-btn,
    .panel-page .secondary-btn,
    .panel-page .third-btn {
        font-size: 14px !important;
        padding: 8px 16px !important;
    }
}

.panel-page .primary-btn {
    background-color:var(--primary-color);
    color: #fff;
}

.panel-page .secondary-btn {
    background-color: #fff;
    color:var(--primary-color);
}

.panel-page .primary-btn:hover,
.panel-page .secondary-btn:hover {
    background-color: #000;
    color: #fff;
}

.panel-page .third-btn {
    background-color: #000;
    color: #fff;
}

.panel-page .third-btn:hover {
    background-color: var(--primary-color);
    color: #fff;
}

.panel-page .panel-list ul {
    text-align: center;
    padding: 0;
    padding-bottom: 25px;
}

.panel-page .panel-list ul a {
    text-decoration: none;
}

.panel-page .panel-list ul li {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--primary-color);;
    color: #fff;
    font-size: 28px;
    width: 50px;
    height: 50px;
    cursor: pointer;
}

.panel-page .panel-list ul li:hover,
.panel-page .panel-list ul li.active {
    background-color: #000;
}

.panel-tab-box .box-title,
.panel-tab-box .form-heading {
    font-size: 22px;
    font-weight: 600;
    padding-bottom: 25px;
}

.panel-tab-box .form-heading {
    text-align: center;
    font-size: 18px;
}

.panel-tab-box {
    display: none;
    box-shadow: 0 0 15px #ddd;
    padding: 50px;
}

.panel-tab-box.active {
    display: block;
}

@media screen and (max-width: 767px) {

    .panel-tab-box .box-title,
    .panel-tab-box .form-heading {
        font-size: 18px;
        padding-bottom: 15px;
    }

    .panel-tab-box {
        padding: 25px 15px;
    }
}

.panel-tab-box .input-field {
    padding-bottom: 20px;
}

.panel-tab-box .input-field input:not([type="checkbox"]),
.panel-tab-box .input-field select,
.panel-tab-box .input-field textarea {
    outline: none;
    border: 2px solid var(--primary-color);
    width: 100%;
    font-size: 16px;
    padding: 10px 15px;
}

.panel-tab-box .input-field input[type="checkbox"] {
    -webkit-appearance: auto;
    line-height: 1.5;
    margin-right: 3px;
}

.panel-tab-box .input-field label {
    font-family: Poppins, sans-serif;
    font-size: 16px;
    font-weight: 500;
}

.panel-tab-box .edit-address-box {
    border-radius: 15px;
    border: 2px solid #000;
    padding: 25px;
}

@media screen and (max-width: 991px) {

    .panel-tab-box .input-field input:not([type="checkbox"]),
    .panel-tab-box .input-field select,
    .panel-tab-box .input-field textarea {
        font-size: 14px;
        padding: 8px 12px;
    }
}

@media screen and (max-width: 767px) {
    .panel-tab-box .edit-address-box {
        padding: 15px;
    }
}

.panel-tab-box .edit-address-box .default {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: #777;
    padding-bottom: 20px;
}

.panel-tab-box .edit-address-box p {
    font-size: 16px;
    font-weight: 500;
    color: #000;
}

@media screen and (max-width: 1199px) {
    .panel-tab-box .edit-address-box .default {
        font-size: 18px;
    }

    .panel-tab-box .edit-address-box p {
        font-size: 14px;
        line-height: 1.2;
    }
}

.panel-tab-box .edit-address-box .btns {
    text-align: right;
}

.panel-tab-box .add-address-box {
    width: 100%;
    border: 2px dotted #000;
    border-radius: 15px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #777;
    padding: 50px 25px;
}

.panel-tab-box .add-address-box span {
    display: block;
}

.panel-tab-box .pendding-orders {
    text-align: center;
}

.panel-tab-box .pendding-orders>.d-flex>div {
    padding: 0 15px;
}

.panel-tab-box .pendding-orders .tag {
    font-size: 22px;
    color: var(--primary-color);
}

.panel-tab-box .pendding-orders span {
    font-size: 14px;
}

.panel-tab-box .pendding-orders span.amount {
    color: #3c763d;
    font-size: 18px;
    font-weight: 600;
}

.panel-tab-box .pendding-product {
    border-top: 1px solid #aaa;
    margin-top: 30px;
}

.panel-tab-box .pendding-product .tag {
    font-size: 22px;
    color: #dbabcf;
}

.panel-tab-box .pendding-product span {
    font-size: 14px;
    color: #777;
}

@media screen and (max-width: 991px) {
    .panel-tab-box .pendding-orders>.d-flex>div {
        padding: 8px;
    }

    .panel-tab-box .pendding-orders .tag {
        font-size: 18px;
        margin-bottom: 5px;
    }

    .panel-tab-box .pendding-orders span {
        font-size: 12px;
    }

    .panel-tab-box .pendding-product .tag {
        font-size: 18px;
    }

    .panel-tab-box .pendding-product span {
        font-size: 12px;
    }
}

.panel-tab-box .pendding-product .products-sec {
    /* padding-top: 20px; */
}

.panel-tab-box .pendding-product .products-sec:not(:last-child) {
    border-bottom: 1px solid #aaa;
}

.panel-tab-box .pendding-product .products-sec .product-card {
    display: flex;
    align-items: center;
    padding: 10px 0;
    flex-direction: row;
    border: unset;
}

.panel-tab-box .pendding-product .products-sec .product-card .product-img {
    flex: none;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.panel-tab-box .pendding-product .products-sec .product-card .product-img img {
    max-width: 100%;
    max-height: 100%;
}

.panel-tab-box .pendding-product .products-sec .product-card .product-details {
    padding-left: 15px;
}

.panel-tab-box .pendding-product .products-sec .product-card .product-details>div {
    font-size: 14px;
    padding: 2px 0;
}

.panel-tab-box .pendding-product .products-sec .product-card .product-details .pro-name a {
    text-decoration: none;
    font-weight: 600;
    color: #333;
}



.panel-tab-sec>div>div:not(:last-child) .panel-tab-box.order {
    margin-bottom: 50px;
}

.panel-tab-box .pendding-product .product-info {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.panel-tab-box .pendding-product .products-sec .product-progress-bar {
    display: flex;
    border-radius: 50px;
    background-color: #eee;
    color: #555;
    overflow: hidden;
    margin-bottom: 30px;
}

.panel-tab-box .pendding-product .products-sec .product-progress-bar .status {
    flex: none;
    width: 25%;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 0;
}

.panel-tab-box .pendding-product .products-sec .product-progress-bar .status:not(:last-child) {
    border-right: 3px solid #fff;
}

.panel-tab-box .pendding-product .products-sec .product-progress-bar .status.processed {
    /* background-color: #198754; */
    background-color: var(--primary-color);
    color: #fff;
}

@media screen and (max-width: 575px) {
    .panel-tab-box .pendding-product {
        margin-top: 15px;
    }

    .panel-tab-box .pendding-product .products-sec .product-card .product-img {
        width: 92px;
        height: 92px;
    }
}



.panel-tab-box.order.indetail .order-address {
    border-top: 1px solid #aaa;
    font-family: Arial, Helvetica, sans-serif;
    padding-top: 30px;
    margin-top: 30px;
}

.panel-tab-box.order.indetail .order-address>.d-flex>div {
    color: #444;
    padding: 0 15px;
}

.panel-tab-box.order.indetail .order-address .address>div strong {
    display: inline-block;
    font-size: 18px;
    margin-bottom: 10px;
}

.panel-tab-box.order.indetail .order-address .address>div:not(:last-child) {
    font-size: 15px;
    margin-bottom: 3px;
}

.panel-tab-box .pendding-product .products-sec .modal-btns {
    text-align: right;
}

.panel-tab-box .pendding-product .products-sec .modal-btns button {
    margin-left: 8px;
}

.panel-tab-box .pendding-product .products-sec .product-card .modal-btns {
    margin-left: auto;
}

.panel-tab-box .pendding-product .products-sec>.modal-btns {
    display: none;
}


.panel-tab-box .pendding-product .products-sec:last-child {
    margin-bottom: -30px;
}


@media screen and (max-width: 767px) {
    .panel-tab-box .pendding-product .products-sec:last-child {
        margin-bottom: -15px;
    }

    .panel-tab-box.indetail .pendding-product .products-sec:last-child {
        margin-bottom: 0;
    }

    .panel-tab-box.order.indetail .order-address {
        margin-top: 15px;
    }

    .panel-tab-box.order.indetail .order-address .address {
        margin-bottom: 18px;
    }

    .panel-tab-box .pendding-product .products-sec .product-card .modal-btns {
        display: none;
    }

    .panel-tab-box .pendding-product .products-sec>.modal-btns {
        display: block;
        margin-bottom: 20px;
    }
}


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

    /* =========== scroll_bar =========== */
    .scroll_bar::-webkit-scrollbar {
        width: 4px;
    }

    .scroll_bar::-webkit-scrollbar-track {
        background-color: transparent;
        border-radius: 25px;
    }

    .scroll_bar::-webkit-scrollbar-thumb {
        background-color: #555;
        border-radius: 25px;
    }
}

.chat-msg-box {
    position: relative;
    height: 420px;
    display: flex;
    flex-direction: column;
    background-color: var(--primary-color-2);;
    border: 5px solid #fff;
    outline: 1px solid #ccc;
    padding: 15px;
    margin-top: 15px;
}

.chat-msg-box .inner-box {
    height: 100%;
    overflow-y: auto;
    padding-left: 5px;
    padding-right: 15px;
    margin-right: -12px;
}

.chat-msg-box .scroll-to-bottom {
    position: absolute;
    right: 22px;
    bottom: 85px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    outline: none;
    box-shadow: none;
    border-radius: 50%;
    background-color: #dbabcf;
    color: #fff;
    font-size: 15px;
    width: 32px;
    height: 32px;
    opacity: 0;
    pointer-events: none;
    transition: 0.3s;
}

.chat-msg-box .scroll-to-bottom.active {
    opacity: 1;
    pointer-events: all;
}

.chat-msg-box .scroll-to-bottom span {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #000;
    color: #fff;
    font-size: 11px;
    display: none;
}

.chat-msg-box .scroll-to-bottom span.active {
    display: flex;
}

.chat-msg-box .chat-date {
    display: flex;
    align-items: center;
    margin: 15px 0 30px;
}

.chat-msg-box .chat-date::after,
.chat-msg-box .chat-date::before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #aaa;
}

.chat-msg-box .chat-date span {
    display: inline-block;
    white-space: nowrap;
    font-size: 14px;
    color: #777;
    margin: 0 10px;
}

.chat-msg-box .msg {
    position: relative;
    display: inline-block;
    background-color: #aaa;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    padding: 6px 10px;
}

.chat-msg-box .msg::after {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    position: absolute;
}

.chat-msg-box .msg-time {
    display: block;
    font-size: 12px;
    color: #777;
    margin: 3px 0 15px;
}

.chat-msg-box .left .msg {
    background-color: var(--primary-color);
    margin-left: 8px;
}

.chat-msg-box .left .msg::after {
    clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
    background-color: inherit;
    left: -10px;
    bottom: -0.5px;
}

.chat-msg-box .right .msg {
    background-color: #000;
    margin-right: 8px;
}

.chat-msg-box .right .msg::after {
    clip-path: polygon(0% 0%, 0% 100%, 100% 100%);
    background-color: inherit;
    right: -10px;
    bottom: 0;
}

.msg-area {
    background-color: var(--primary-color-2);
    margin-top: auto;
}

.msg-area form {
    display: flex;
    width: 100%;
    background-color: #fff;
    border-radius: 100px;
    overflow: hidden;
    margin-top: 25px;
}

.msg-area form textarea,
.msg-area form button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border-radius: 0;
}

.msg-area form textarea {
    width: 100%;
    padding: 12px 15px;
}

.msg-area form button {
    flex: none;
    width: 60px;
    background-color: var(--primary-color);
    color: #fff;
    padding-right: 5px;
}

@media screen and (max-width: 575px) {
    .chat-msg-box .chat-date {
        margin: 12px 0 22px;
    }

    .chat-msg-box .chat-date span {
        font-size: 12px;
    }

    .chat-msg-box .msg-time {
        font-size: 11px;
    }

    .chat-msg-box .msg {
        font-size: 13px;
        margin: 0;
    }

    .msg-area form textarea {
        padding: 6px 10px;
    }

    .msg-area form button {
        width: 40px;
        font-size: 14px;
    }

    .chat-msg-box .scroll-to-bottom {
        right: 20px;
        bottom: 65px;
    }
}

.cursor-pointer {
    cursor: pointer;
}

.table-box {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    overflow-x: auto;
}

.table-box table {
    white-space: nowrap;
}
.table-hover>tbody>tr:hover{
    background: var(--primary-color-2);
}
.pagination {
    display: flex;
    align-items: center;
}

.pagination button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border: 1px solid #aaa;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-size: 12px;
    color: #777;
    margin: 0 3px;
}

.pagination button:hover {
    background-color: #eee;
}

.filter-data select {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border-radius: 0;
    border: 1px solid #aaa;
    color: #555;
    height: 26px;
}

.filter-data button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border: 1px solid #aaa;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 26px;
    font-size: 13px;
    color: #777;
    transform: translateY(-2px);
}

.filter-data button:hover {
    background-color: #eee;
}

.custom_modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.custom_modal .modal-box {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
}

.custom_modal .modal-box .overlay {
    width: 100%;
    min-height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
}

.custom_modal .modal-box .modal-body {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* opacity: 0; */
    width: calc(100% - 30px);
    max-width: 420px;
    background-color: #fff;
    border-radius: 5px;
    padding: 0 22px;
}

.custom_modal .modal-box .modal-body .close-btn {
    text-align: right;
}

.custom_modal .modal-box .modal-body .close-btn button {
    border: none;
    outline: none;
    background-color: transparent;
    color: #000;
    font-size: 18px;
    padding: 15px 8px;
    cursor: pointer;
}

.custom_modal .modal-box .modal-body .content-box .form {
    padding: 15px 0;
}

.custom_modal .modal-box .modal-body .content-box .form h2 {
    font-size: 28px;
    color: var(--primary-color);
    margin: -15px 0 20px !important;
}

.custom_modal .modal-box .modal-body .content-box .form p {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.custom_modal .modal-box .modal-body .content-box .form select {
    border-color: #000;
    margin-bottom: 5px;
}
/* =================== End profile-Page Area =================== */

/* =================== Start order-Page Area =================== */
.order-confirm #confirm .icon i {
    font-size: 6rem;
    color: var(--primary-color);
}
/* =================== End order-Page Area =================== */
/* =================== Start product-Page Area =================== */
.sec-title {
    text-align: center;
    max-width: 722px;
    margin: auto;
    margin-bottom: 40px
}


.sec-padding {
    padding: 80px 0px;
}

.bg-color {
    background-color: var(--primary-color-2);
}

.bl {
    border-left: 2px solid #ccc;
}

.bb {
    border-bottom: 2px solid #ccc;
}

.ReviewUploadImages {
    background-image: url(https://www.plixlife.com/plixlifefc/assets/uploadIcon.png);
    width: 150px;
    height: 150px;
    border: 1px solid #ccc;
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 5px;
}

.ReviewUploadImages>input {
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.btn-1 {
    outline: none;
    box-shadow: none;
    /* min-width: 180px; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    border: 2px solid transparent;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 0.92rem;
    padding: 0.5rem 1.7rem;
}

.filter-btns {
    border-bottom: 2px solid #ccc;
    margin-bottom: 50px;
    display: flex;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}

.filter-btns button {
    border: none;
    outline: none;
    box-shadow: none;
    background-color: transparent;
    border-bottom: 2px solid transparent;
    padding: 0.5rem 1rem;
    white-space: nowrap;
    margin-bottom: -2px;
}

.filter-btns button.active {
    /* border-bottom: 1px solid var(--primary-color); */
    color: var(--primary-color);
}

.product-detail-sec .filter-box .filter-item{
    display: none;
}
.product-detail-sec .filter-box .filter-item.active{
    display: block;

}
.product-detail-sec .filter-box .card-container {
    display: flex;
    gap: 22px;
    margin: 10px 0px;
}

.product-detail-sec .filter-box .card-container:last-child {
    margin-bottom: 0px
}

.product-detail-sec .filter-box .card-container .cards-img {
    text-align: center;
}

.product-detail-sec .filter-box .card-container .cards-img img {
    max-width: 80px;
    max-height: 80px
}

.product-detail-sec .filter-box .card-container h3 {
    font-size: 1.2rem;
    color: var(--primary-color);
}

.product-detail-sec .filter-box .how-to-use {
    width: 100%;
    position: relative;
}

.product-detail-sec .filter-box .how-to-use::after {
    width: 4px;
    border-radius: 10px;
    height: 100%;
    content: "";
    position: absolute;
    top: 0px;
    background: var(--primary-color);
    left: 50%;
    border-radius: 10px;
}

.product-detail-sec .filter-box .how-to-use .box {
    background-color: var(--primary-color-2);
    padding: 0px 28px;
    padding: 20px 30px;
    width: 50%;
    position: relative;
    border-radius: 18px
}

.product-detail-sec .filter-box .how-to-use .box.left-box {
    left: 0%;
}

.product-detail-sec .filter-box .how-to-use .box.right-box {
    left: 50%;
}

.product-detail-sec .filter-box .how-to-use .box .box-img {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    /* margin: auto; */
    border: 2px solid var(--primary-color);
    margin-bottom: 12px;

}

.product-detail-sec .filter-box .how-to-use .box .box-img img {
    width: 100%;
}

.product-detail-sec .filter-box .how-to-use .box .box-content h3 {
    font-size: 1.09rem;
    color: var(--primary-color);
    font-weight: 600;
}

.product-detail-sec .filter-box .how-to-use .box .box-content p {
    margin-bottom: 0px
}

.product-detail-sec .filter-box .pro-info-cover {
    width: 90%;
    /* margin: auto; */
}

.product-detail-sec .filter-box .pro-info-cover .info-row {
    display: flex;
    align-items: baseline;
    padding-bottom: 6px
}

.product-detail-sec .filter-box .pro-info-cover .info-row .info-col:first-child {
    width: 40%;
}

.product-detail-sec .filter-box .pro-info-cover .info-row .info-col:last-child {
    width: 80%;
}

.product-detail-sec .filter-box .pro-info-cover .info-row .info-col h4 {
    margin-bottom: 0px;
    font-size: 1.2rem;
}

.product-detail-sec .filter-box .pro-info-cover .info-row .info-col p {
    margin-bottom: 0px
}

.see-results .content h2 {
    margin-bottom: 40px;
}

.see-results .box h4 {
    color: var(--primary-color);
    margin-bottom: 6px
}

.see-results .see-result-img img {
    width: 100%;
}

.see-results .filter-box .filter-item{
    display: none;
}
.see-results .filter-box .filter-item.active{
    display: block;
}

.validated-ingredints .ingredints-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.validated-ingredints .ingredints-content h4 {
    color: var(--primary-color);
}

.consumer-love-points .content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

/* .consumer-love-points .points {
                                                                                        padding: 20px 0px;
                                                                                    } */

.consumer-love-points .points p {
    margin-bottom: 0px;
    color: #000
}

.consumer-love-points .points p span {
    font-size: 4rem;
    font-weight: 900;
    color: var(--primary-color);
}

.safe-weight-sec .sec-heading {
    margin-bottom: 30px;
}

.accordion-box .accordion {
    border-bottom: 2px solid #CDCDCD;
    margin-bottom: 0;
}

.accordion-box .accordion .accordion-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1em 0;
    cursor: pointer;
}

.accordion-box .accordion .accordion-title h3 {
    font-family: var(--LufgaMedium);
    font-size: 1.2rem;
    /* color: #444; */
    margin-bottom: 0;
}

.accordion-box .accordion .accordion-title .icon {
    padding: 0 1.4em;
}

.accordion-box .accordion .accordion-title .icon::after {
    content: '\f067';
    font-family: 'Font Awesome 5 Pro';
    display: inline-block;
    transition: 0.3s;
}

.accordion-box .accordion.active .accordion-title .icon::after {
    transform: rotate(45deg);
}

.accordion-box .accordion .accordion-slide {
    display: none;
    font-size: .9rem;
    /* color: #777; */
    padding-bottom: 1.2em;
}

.accordion-box .accordion .accordion-slide p:last-child {
    margin-bottom: 0;
}

.who-is-this-for .box {
    text-align: center;
}

.who-is-this-for .box .box-img {
    max-width: 128px;
    max-height: 128px;
    margin: 0 auto;

}

/* .filter-box .filter-item {
    display: none;
}

.filter-box .filter-item.active {
    display: block;
} */

.reviews-sec .review-header .total-review {
    text-align: center;
}

.reviews-sec .review-header .total-review p {
    font-size: .9rem;
}

.reviews-sec .review-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 20px;
    align-items: center;
}

.reviews-sec .review-header .left-review-box {
    display: flex;
    gap: 30px;
    align-items: center;

}

.reviews-sec .review-header .review-counts .review-count-box {
    display: flex;
    align-items: center;
    gap: 4px;
}

.reviews-sec .review-header .review-counts .review-count-box span {
    font-size: .9rem;
}

.progress-box {
    background-color: rgb(246, 246, 246);
    position: relative;
    width: 10em;
    height: 1em;
    margin: 0.5rem;
}

.progress-box .progress-bar {
    width: 85.0325%;
    position: absolute;
    background-color: var(--primary-color);
    height: 1em;
}

.reviews-sec .review-form-cover {
    border: 2px solid var(--primary-color);
    border-radius: 8px;
    padding: 20px;
    display: none;
}

.reviews-sec .review-form-cover.active {
    display: block;
}

.reviews-sec .review-header .right-review-box .white-review {
    margin-bottom: 10px;
}

.reviews-sec .review-header .right-review-box .sort-review select {
    /* min-width: 180px; */
    border-radius: 4px;
    font-size: 0.92rem;
    padding: 0.5rem 1.2rem;
    text-align: center;
}

.reviews-sec .reviews .review {
    padding: 14px 0px;
}

.reviews-sec .reviews .rating-date {
    text-align: center;
}

.stars i {
    margin-bottom: 10px;
    color: #ffa500;
    font-size: .8rem;
}

.reviews-sec .reviews .review-details .review-username {
    font-size: 1.2rem;
    font-weight: 300;
}

.reviews-sec .reviews .review-details .review-username span {
    font-size: .8rem;
}

.reviews-sec .reviews .review-details .review-username span i {
    color: var(--primary-color);
}

.reviews-sec .reviews .review-details p.review-title {
    font-weight: bold;
}

.reviews-sec .reviews .review-details .review-image {
    max-width: 300px;
    max-height: 300px;
}

.reviews-sec .reviews .review-details .review-image img {
    width: 100%;
}

.reviews-sec .reviews .review-details .review-helpful-container {
    display: flex;
    justify-content: space-between;
    font-size: .9rem;
}

.reviews-sec .reviews .review-details .review-helpful-container .review-helpful-button {
    display: flex;
    gap: 10px;
}

.reviews-sec .reviews .review-details .review-reply {
    background-color: var(--primary-color-2);
    padding: 12px;
    margin-top: 12px;
}

.reviews-sec .reviews .review-details .review-reply .review-reply-title {
    font-weight: 600;
}

.reviews-sec .reviews .review-details .review-reply .review-reply-description p {
    margin-bottom: 0px;
    font-size: .9rem;
}

@media screen and (max-width: 992px) {
    .product-detail-sec .filter-box .pro-info-cover {
        width: 100%;
    }

    .consumer-love-points .points p span {
        font-size: 2rem
    }

    .who-is-this-for .box {
        padding: 10px 0px;
    }

    .reviews-sec .review-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .reviews-sec .review-header .left-review-box {
        width: 100%;
        justify-content: space-between;
    }
}

@media screen and (max-width: 767px) {
    .product-detail-sec .filter-box .card-container {
        display: unset;
    }

    .product-detail-sec .filter-box .card-container h3 {
        text-align: center;
    }

    .product-detail-sec .filter-box .card-container .card-content p {
        font-size: .9rem;
    }

    .product-detail-sec .filter-box .how-to-use::after {
        left: 0%;
    }

    .product-detail-sec .filter-box .how-to-use .box {
        width: 100%;
        margin-bottom: 20px;
        padding: 20px;
    }

    .sec-title p,
    .who-is-this-for .box .des,
    .consumer-love-points .points p,
    .validated-ingredints .ingredints-content p,
    .see-results .filter-box .box p,
    .product-detail-sec .filter-box .how-to-use .box .box-content p {
        font-size: .9rem;
    }

    .product-detail-sec .filter-box .how-to-use .box .box-img {
        width: 60px;
        height: 60px;
    }

    .product-detail-sec .filter-box .how-to-use .box:last-child {
        margin-bottom: 0px;
    }

    .product-detail-sec .filter-box .how-to-use .box.right-box,
    .product-detail-sec .filter-box .how-to-use .box.left-box {
        left: 0%;
    }

    .product-detail-sec .filter-box .pro-info-cover .info-row {
        display: unset;
    }

    .product-detail-sec .filter-box .pro-info-cover .info-row .info-col:first-child,
    .product-detail-sec .filter-box .pro-info-cover .info-row .info-col:last-child {
        width: 100%;
    }

    .product-detail-sec .filter-box .pro-info-cover .info-row .info-col h4 {
        margin-bottom: 4px;
    }

    .product-detail-sec .filter-box .pro-info-cover .info-row .info-col p {
        margin-bottom: 10px;
    }

    .see-results .content h2 {
        text-align: center;
    }

    .consumer-love-points .content {
        margin-top: 20px;
    }

    .accordion-box .accordion .accordion-title h3 {
        font-size: 1rem;
    }

    .reviews-sec .review-header .right-review-box {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-top: 20px;
    }

    .reviews-sec .review-header .right-review-box .white-review {
        margin-bottom: 0px;
    }

    .reviews-sec .reviews .rating-date {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .col-lg-10.col-md-10.bl {
        border-left: unset;
    }

    .white-review button.btn-1 {
        padding: 0.5rem 1.2rem;
    }

    .review-details p.review-description {
        font-size: .9rem;
    }

    .reviews-sec .reviews .review-details .review-helpful-container,
    .reviews-sec .reviews .review-details .review-reply .review-reply-description p {
        font-size: .8rem;
    }

    .progress-box .progress-bar {
        height: .9em;
    }
}

@media screen and (max-width: 525px) {
    .reviews-sec .review-header .left-review-box {
        flex-direction: column;
        gap: 0px;
    }

    .stars i {
        font-size: .6rem;
    }

    .reviews-sec .review-header .review-counts .review-count-box span {
        font-size: .8rem;
    }

    .reviews-sec .reviews .review-details .review-helpful-container {
        flex-direction: column;
    }

    .white-review button.btn-1,
    .reviews-sec .review-header .right-review-box .sort-review select {
        padding: 0.2rem 1rem;
        font-size: .8rem;
    }
}

@media screen and (max-width: 375px) {
    .section-hide1 {
        width: 200px;
    }
}

/* =================== End product-Page Area =================== */
.pull-right {
    float: right;
}
.pull-left {
    float: left;
}

.ing-spinner {
    width: 50px;
    height: 50px;
    display: inline-block;
    padding: 0;
    border-radius: 100%;
    border: 6px solid;
    border-top-color: #005a9c;
    border-bottom-color: #005a9c;
    border-left-color: rgba(0, 90, 156, .15);
    border-right-color: rgba(0, 90, 156, .15);
    animation: spinner .8s ease-in-out infinite alternate
}

@keyframes spinner {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}
.theme-color{
    color: var(--primary-color) !important;
}

/* Header Style */

#search-input{
    font-size: 14px !important;
}

.btn-custom-success {
    background-color: #5AA931;
}

.btn-custom-success:hover {
    background-color: #5AA931;
}

/* Payment Pages */
.checkout-panel {
    background-color: var(--primary-color-2);
    padding: 0.9rem;
    border-radius: 0.75rem
}

.payment-button {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    padding: 1rem;
    text-transform: uppercase;
}

.payment-button:hover {
    background-color: red;
}