/*-------------------------------------
    Template Name:
    Template URI: https://---.com
    Description:
    Author: ...
    Author URI: https://---.com
    Version: 1.0
    Tags: theme, template, etc
---------------------------------------*/
/*
    Table of Context
    -------------------------------
    01. Common CSS
    02. Content Box
    03. Video Box
    04. Icon Box
    05. Order, Unorder List
    06. Round One side
    07. Overlap Image Box
    08. Image Box
    09. Icon list block

    01. Header style
    02. Banner style

*/
/*********************************
/* Fonts
/* Figtree
/* Montserrat
/*
*********************************/
/* @import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"); */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
/**
 * For max-width media query, device width are sets as::after
 * xl = 1440
 * medium = 1199
 * tabland = 991
 * tabport = 767
 * phone
 * phone-sm
 * phone-mid
 * phone-xm
 */
:host,
:root {
    --rem: 10;
}

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

html {
    font-size: 62.5%;
}

body {
    background: var(--color-white);
    font-family: var(--font-default);
    font-weight: var(--font-regular);
    font-size: 1.6rem;
    line-height: 2.7rem;
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
}
a:hover,
a:focus {
    text-decoration: none;
    outline: 0px;
}

button:hover,
button:focus {
    outline: 0px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: var(--font-regular);
}

img {
    display: block;
    width: 100%;
    height: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

ul {
    margin: 0;
    padding: 0;
    list-style: inherit;
}

figure {
    margin: 0;
}

.gutters-5 {
    margin-right: -5px;
    margin-left: -5px;
}
.gutters-5 > .col,
.gutters-5 > [class*="col-"] {
    padding-right: 5px;
    padding-left: 5px;
}

.gutters-10 {
    margin-right: -10px;
    margin-left: -10px;
}
.gutters-10 > .col,
.gutters-10 > [class*="col-"] {
    padding-right: 10px;
    padding-left: 10px;
}

.gutters-15 {
    margin-right: -15px;
    margin-left: -15px;
}
.gutters-15 > .col,
.gutters-15 > [class*="col-"] {
    padding-right: 15px;
    padding-left: 15px;
}

.gutters-20 {
    margin-right: -20px;
    margin-left: -20px;
}
.gutters-20 > .col,
.gutters-20 > [class*="col-"] {
    padding-right: 20px;
    padding-left: 20px;
}

.gutters-25 {
    margin-right: -25px;
    margin-left: -25px;
}
.gutters-25 > .col,
.gutters-25 > [class*="col-"] {
    padding-right: 25px;
    padding-left: 25px;
}

.mb-05 {
    margin-bottom: 5px !important;
}

.mb-10 {
    margin-bottom: 10px !important;
}

.mb-15 {
    margin-bottom: 15px !important;
}

.mb-20 {
    margin-bottom: 20px !important;
}

.mb-25 {
    margin-bottom: 25px !important;
}

.mb-30 {
    margin-bottom: 30px !important;
}

.mb-35 {
    margin-bottom: 35px !important;
}

.mb-40 {
    margin-bottom: 40px !important;
}

.mb-45 {
    margin-bottom: 45px !important;
}

.mb-50 {
    margin-bottom: 50px !important;
}

.mb-55 {
    margin-bottom: 55px !important;
}

.mb-60 {
    margin-bottom: 60px !important;
}

.mb-65 {
    margin-bottom: 65px !important;
}

.mb-70 {
    margin-bottom: 70px !important;
}

.mb-75 {
    margin-bottom: 75px !important;
}

.mb-80 {
    margin-bottom: 80px !important;
}

.mb-85 {
    margin-bottom: 85px !important;
}

.mb-90 {
    margin-bottom: 90px !important;
}

.mb-95 {
    margin-bottom: 95px !important;
}

.mb-100 {
    margin-bottom: 100px !important;
}

.mb-105 {
    margin-bottom: 105px !important;
}

.mb-110 {
    margin-bottom: 110px !important;
}

.mb-115 {
    margin-bottom: 115px !important;
}

.mb-120 {
    margin-bottom: 120px !important;
}

.mb-125 {
    margin-bottom: 125px !important;
}

.mb-130 {
    margin-bottom: 130px !important;
}

.mb-135 {
    margin-bottom: 135px !important;
}

.mb-140 {
    margin-bottom: 140px !important;
}

.mb-145 {
    margin-bottom: 145px !important;
}

.mb-150 {
    margin-bottom: 150px !important;
}

.mt-05 {
    margin-top: 5px !important;
}

.mt-10 {
    margin-top: 10px !important;
}

.mt-15 {
    margin-top: 15px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mt-25 {
    margin-top: 25px !important;
}

.mt-30 {
    margin-top: 30px !important;
}

.mt-35 {
    margin-top: 35px !important;
}

.mt-40 {
    margin-top: 40px !important;
}

.mt-45 {
    margin-top: 45px !important;
}

.mt-50 {
    margin-top: 50px !important;
}

.mt-55 {
    margin-top: 55px !important;
}

.mt-60 {
    margin-top: 60px !important;
}

.mt-65 {
    margin-top: 65px !important;
}

.mt-70 {
    margin-top: 70px !important;
}

.mt-75 {
    margin-top: 75px !important;
}

.mt-80 {
    margin-top: 80px !important;
}

.mt-85 {
    margin-top: 85px !important;
}

.mt-90 {
    margin-top: 90px !important;
}

.mt-95 {
    margin-top: 95px !important;
}

.mt-100 {
    margin-top: 100px !important;
}

.mt-105 {
    margin-top: 105px !important;
}

.mt-110 {
    margin-top: 110px !important;
}

.mt-115 {
    margin-top: 115px !important;
}

.mt-120 {
    margin-top: 120px !important;
}

.mt-125 {
    margin-top: 125px !important;
}

.mt-130 {
    margin-top: 130px !important;
}

.mt-135 {
    margin-top: 135px !important;
}

.mt-140 {
    margin-top: 140px !important;
}

.mt-145 {
    margin-top: 145px !important;
}

.mt-150 {
    margin-top: 150px !important;
}

.ml-05 {
    margin-left: 5px !important;
}

.ml-10 {
    margin-left: 10px !important;
}

.ml-15 {
    margin-left: 15px !important;
}

.ml-20 {
    margin-left: 20px !important;
}

.ml-25 {
    margin-left: 25px !important;
}

.ml-30 {
    margin-left: 30px !important;
}

.ml-35 {
    margin-left: 35px !important;
}

.ml-40 {
    margin-left: 40px !important;
}

.ml-45 {
    margin-left: 45px !important;
}

.ml-50 {
    margin-left: 50px !important;
}

.ml-55 {
    margin-left: 55px !important;
}

.ml-60 {
    margin-left: 60px !important;
}

.ml-65 {
    margin-left: 65px !important;
}

.ml-70 {
    margin-left: 70px !important;
}

.ml-75 {
    margin-left: 75px !important;
}

.ml-80 {
    margin-left: 80px !important;
}

.ml-85 {
    margin-left: 85px !important;
}

.ml-90 {
    margin-left: 90px !important;
}

.ml-95 {
    margin-left: 95px !important;
}

.ml-100 {
    margin-left: 100px !important;
}

.ml-105 {
    margin-left: 105px !important;
}

.ml-110 {
    margin-left: 110px !important;
}

.ml-115 {
    margin-left: 115px !important;
}

.ml-120 {
    margin-left: 120px !important;
}

.ml-125 {
    margin-left: 125px !important;
}

.ml-130 {
    margin-left: 130px !important;
}

.ml-135 {
    margin-left: 135px !important;
}

.ml-140 {
    margin-left: 140px !important;
}

.ml-145 {
    margin-left: 145px !important;
}

.ml-150 {
    margin-left: 150px !important;
}

.mr-05 {
    margin-right: 5px !important;
}

.mr-10 {
    margin-right: 10px !important;
}

.mr-15 {
    margin-right: 15px !important;
}

.mr-20 {
    margin-right: 20px !important;
}

.mr-25 {
    margin-right: 25px !important;
}

.mr-30 {
    margin-right: 30px !important;
}

.mr-35 {
    margin-right: 35px !important;
}

.mr-40 {
    margin-right: 40px !important;
}

.mr-45 {
    margin-right: 45px !important;
}

.mr-50 {
    margin-right: 50px !important;
}

.mr-55 {
    margin-right: 55px !important;
}

.mr-60 {
    margin-right: 60px !important;
}

.mr-65 {
    margin-right: 65px !important;
}

.mr-70 {
    margin-right: 70px !important;
}

.mr-75 {
    margin-right: 75px !important;
}

.mr-80 {
    margin-right: 80px !important;
}

.mr-85 {
    margin-right: 85px !important;
}

.mr-90 {
    margin-right: 90px !important;
}

.mr-95 {
    margin-right: 95px !important;
}

.mr-100 {
    margin-right: 100px !important;
}

.mr-105 {
    margin-right: 105px !important;
}

.mr-110 {
    margin-right: 110px !important;
}

.mr-115 {
    margin-right: 115px !important;
}

.mr-120 {
    margin-right: 120px !important;
}

.mr-125 {
    margin-right: 125px !important;
}

.mr-130 {
    margin-right: 130px !important;
}

.mr-135 {
    margin-right: 135px !important;
}

.mr-140 {
    margin-right: 140px !important;
}

.mr-145 {
    margin-right: 145px !important;
}

.mr-150 {
    margin-right: 150px !important;
}

.px-05 {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.px-25 {
    padding-left: 25px !important;
    padding-right: 25px !important;
}

.px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
}

.px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

.px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
}

.px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.px-55 {
    padding-left: 55px !important;
    padding-right: 55px !important;
}

.px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
}

.px-65 {
    padding-left: 65px !important;
    padding-right: 65px !important;
}

.px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
}

.px-75 {
    padding-left: 75px !important;
    padding-right: 75px !important;
}

.px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
}

.px-85 {
    padding-left: 85px !important;
    padding-right: 85px !important;
}

.px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
}

.px-95 {
    padding-left: 95px !important;
    padding-right: 95px !important;
}

.px-100 {
    padding-left: 100px !important;
    padding-right: 100px !important;
}

.px-105 {
    padding-left: 105px !important;
    padding-right: 105px !important;
}

.px-110 {
    padding-left: 110px !important;
    padding-right: 110px !important;
}

.px-115 {
    padding-left: 115px !important;
    padding-right: 115px !important;
}

.px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
}

.px-125 {
    padding-left: 125px !important;
    padding-right: 125px !important;
}

.px-130 {
    padding-left: 130px !important;
    padding-right: 130px !important;
}

.px-135 {
    padding-left: 135px !important;
    padding-right: 135px !important;
}

.px-140 {
    padding-left: 140px !important;
    padding-right: 140px !important;
}

.px-145 {
    padding-left: 145px !important;
    padding-right: 145px !important;
}

.px-150 {
    padding-left: 150px !important;
    padding-right: 150px !important;
}

.py-05 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

.py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.py-25 {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
}

.py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}

.py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
}

.py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

.py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
}

.py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.py-55 {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
}

.py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}

.py-65 {
    padding-top: 65px !important;
    padding-bottom: 65px !important;
}

.py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
}

.py-75 {
    padding-top: 75px !important;
    padding-bottom: 75px !important;
}

.py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

.py-85 {
    padding-top: 85px !important;
    padding-bottom: 85px !important;
}

.py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

.py-95 {
    padding-top: 95px !important;
    padding-bottom: 95px !important;
}

.py-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

.py-105 {
    padding-top: 105px !important;
    padding-bottom: 105px !important;
}

.py-110 {
    padding-top: 110px !important;
    padding-bottom: 110px !important;
}

.py-115 {
    padding-top: 115px !important;
    padding-bottom: 115px !important;
}

.py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
}

.py-125 {
    padding-top: 125px !important;
    padding-bottom: 125px !important;
}

.py-130 {
    padding-top: 130px !important;
    padding-bottom: 130px !important;
}

.py-135 {
    padding-top: 135px !important;
    padding-bottom: 135px !important;
}

.py-140 {
    padding-top: 140px !important;
    padding-bottom: 140px !important;
}

.py-145 {
    padding-top: 145px !important;
    padding-bottom: 145px !important;
}

.py-150 {
    padding-top: 150px !important;
    padding-bottom: 150px !important;
}

.pb-05 {
    padding-bottom: 5px !important;
}

.pb-10 {
    padding-bottom: 10px !important;
}

.pb-15 {
    padding-bottom: 15px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.pb-25 {
    padding-bottom: 25px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.pb-35 {
    padding-bottom: 35px !important;
}

.pb-40 {
    padding-bottom: 40px !important;
}

.pb-45 {
    padding-bottom: 45px !important;
}

.pb-50 {
    padding-bottom: 50px !important;
}

.pb-55 {
    padding-bottom: 55px !important;
}

.pb-60 {
    padding-bottom: 60px !important;
}

.pb-65 {
    padding-bottom: 65px !important;
}

.pb-70 {
    padding-bottom: 70px !important;
}

.pb-75 {
    padding-bottom: 75px !important;
}

.pb-80 {
    padding-bottom: 80px !important;
}

.pb-85 {
    padding-bottom: 85px !important;
}

.pb-90 {
    padding-bottom: 90px !important;
}

.pb-95 {
    padding-bottom: 95px !important;
}

.pb-100 {
    padding-bottom: 100px !important;
}

.pb-105 {
    padding-bottom: 105px !important;
}

.pb-110 {
    padding-bottom: 110px !important;
}

.pb-115 {
    padding-bottom: 115px !important;
}

.pb-120 {
    padding-bottom: 120px !important;
}

.pb-125 {
    padding-bottom: 125px !important;
}

.pb-130 {
    padding-bottom: 130px !important;
}

.pb-135 {
    padding-bottom: 135px !important;
}

.pb-140 {
    padding-bottom: 140px !important;
}

.pb-145 {
    padding-bottom: 145px !important;
}

.pb-150 {
    padding-bottom: 150px !important;
}

.pt-05 {
    padding-top: 5px !important;
}

.pt-10 {
    padding-top: 10px !important;
}

.pt-15 {
    padding-top: 15px !important;
}

.pt-20 {
    padding-top: 20px !important;
}

.pt-25 {
    padding-top: 25px !important;
}

.pt-30 {
    padding-top: 30px !important;
}

.pt-35 {
    padding-top: 35px !important;
}

.pt-40 {
    padding-top: 40px !important;
}

.pt-45 {
    padding-top: 45px !important;
}

.pt-50 {
    padding-top: 50px !important;
}

.pt-55 {
    padding-top: 55px !important;
}

.pt-60 {
    padding-top: 60px !important;
}

.pt-65 {
    padding-top: 65px !important;
}

.pt-70 {
    padding-top: 70px !important;
}

.pt-75 {
    padding-top: 75px !important;
}

.pt-80 {
    padding-top: 80px !important;
}

.pt-85 {
    padding-top: 85px !important;
}

.pt-90 {
    padding-top: 90px !important;
}

.pt-95 {
    padding-top: 95px !important;
}

.pt-100 {
    padding-top: 100px !important;
}

.pt-105 {
    padding-top: 105px !important;
}

.pt-110 {
    padding-top: 110px !important;
}

.pt-115 {
    padding-top: 115px !important;
}

.pt-120 {
    padding-top: 120px !important;
}

.pt-125 {
    padding-top: 125px !important;
}

.pt-130 {
    padding-top: 130px !important;
}

.pt-135 {
    padding-top: 135px !important;
}

.pt-140 {
    padding-top: 140px !important;
}

.pt-145 {
    padding-top: 145px !important;
}

.pt-150 {
    padding-top: 150px !important;
}

.pl-05 {
    padding-left: 5px !important;
}

.pl-10 {
    padding-left: 10px !important;
}

.pl-15 {
    padding-left: 15px !important;
}

.pl-20 {
    padding-left: 20px !important;
}

.pl-25 {
    padding-left: 25px !important;
}

.pl-30 {
    padding-left: 30px !important;
}

.pl-35 {
    padding-left: 35px !important;
}

.pl-40 {
    padding-left: 40px !important;
}

.pl-45 {
    padding-left: 45px !important;
}

.pl-50 {
    padding-left: 50px !important;
}

.pl-55 {
    padding-left: 55px !important;
}

.pl-60 {
    padding-left: 60px !important;
}

.pl-65 {
    padding-left: 65px !important;
}

.pl-70 {
    padding-left: 70px !important;
}

.pl-75 {
    padding-left: 75px !important;
}

.pl-80 {
    padding-left: 80px !important;
}

.pl-85 {
    padding-left: 85px !important;
}

.pl-90 {
    padding-left: 90px !important;
}

.pl-95 {
    padding-left: 95px !important;
}

.pl-100 {
    padding-left: 100px !important;
}

.pl-105 {
    padding-left: 105px !important;
}

.pl-110 {
    padding-left: 110px !important;
}

.pl-115 {
    padding-left: 115px !important;
}

.pl-120 {
    padding-left: 120px !important;
}

.pl-125 {
    padding-left: 125px !important;
}

.pl-130 {
    padding-left: 130px !important;
}

.pl-135 {
    padding-left: 135px !important;
}

.pl-140 {
    padding-left: 140px !important;
}

.pl-145 {
    padding-left: 145px !important;
}

.pl-150 {
    padding-left: 150px !important;
}

.pr-05 {
    padding-right: 5px !important;
}

.pr-10 {
    padding-right: 10px !important;
}

.pr-15 {
    padding-right: 15px !important;
}

.pr-20 {
    padding-right: 20px !important;
}

.pr-25 {
    padding-right: 25px !important;
}

.pr-30 {
    padding-right: 30px !important;
}

.pr-35 {
    padding-right: 35px !important;
}

.pr-40 {
    padding-right: 40px !important;
}

.pr-45 {
    padding-right: 45px !important;
}

.pr-50 {
    padding-right: 50px !important;
}

.pr-55 {
    padding-right: 55px !important;
}

.pr-60 {
    padding-right: 60px !important;
}

.pr-65 {
    padding-right: 65px !important;
}

.pr-70 {
    padding-right: 70px !important;
}

.pr-75 {
    padding-right: 75px !important;
}

.pr-80 {
    padding-right: 80px !important;
}

.pr-85 {
    padding-right: 85px !important;
}

.pr-90 {
    padding-right: 90px !important;
}

.pr-95 {
    padding-right: 95px !important;
}

.pr-100 {
    padding-right: 100px !important;
}

.pr-105 {
    padding-right: 105px !important;
}

.pr-110 {
    padding-right: 110px !important;
}

.pr-115 {
    padding-right: 115px !important;
}

.pr-120 {
    padding-right: 120px !important;
}

.pr-125 {
    padding-right: 125px !important;
}

.pr-130 {
    padding-right: 130px !important;
}

.pr-135 {
    padding-right: 135px !important;
}

.pr-140 {
    padding-right: 140px !important;
}

.pr-145 {
    padding-right: 145px !important;
}

.pr-150 {
    padding-right: 150px !important;
}

@media screen and (max-width: 767px) {
    .px-sm-05 {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    .px-sm-10 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .px-sm-15 {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .px-sm-20 {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .px-sm-25 {
        padding-left: 25px !important;
        padding-right: 25px !important;
    }
    .px-sm-30 {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    .px-sm-35 {
        padding-left: 35px !important;
        padding-right: 35px !important;
    }
    .px-sm-40 {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
    .px-sm-45 {
        padding-left: 45px !important;
        padding-right: 45px !important;
    }
    .px-sm-50 {
        padding-left: 50px !important;
        padding-right: 50px !important;
    }
    .px-sm-55 {
        padding-left: 55px !important;
        padding-right: 55px !important;
    }
    .px-sm-60 {
        padding-left: 60px !important;
        padding-right: 60px !important;
    }
    .px-sm-65 {
        padding-left: 65px !important;
        padding-right: 65px !important;
    }
    .px-sm-70 {
        padding-left: 70px !important;
        padding-right: 70px !important;
    }
    .px-sm-75 {
        padding-left: 75px !important;
        padding-right: 75px !important;
    }
    .px-sm-80 {
        padding-left: 80px !important;
        padding-right: 80px !important;
    }
    .px-sm-85 {
        padding-left: 85px !important;
        padding-right: 85px !important;
    }
    .px-sm-90 {
        padding-left: 90px !important;
        padding-right: 90px !important;
    }
    .px-sm-95 {
        padding-left: 95px !important;
        padding-right: 95px !important;
    }
    .px-sm-100 {
        padding-left: 100px !important;
        padding-right: 100px !important;
    }
    .px-sm-105 {
        padding-left: 105px !important;
        padding-right: 105px !important;
    }
    .px-sm-110 {
        padding-left: 110px !important;
        padding-right: 110px !important;
    }
    .px-sm-115 {
        padding-left: 115px !important;
        padding-right: 115px !important;
    }
    .px-sm-120 {
        padding-left: 120px !important;
        padding-right: 120px !important;
    }
    .px-sm-125 {
        padding-left: 125px !important;
        padding-right: 125px !important;
    }
    .px-sm-130 {
        padding-left: 130px !important;
        padding-right: 130px !important;
    }
    .px-sm-135 {
        padding-left: 135px !important;
        padding-right: 135px !important;
    }
    .px-sm-140 {
        padding-left: 140px !important;
        padding-right: 140px !important;
    }
    .px-sm-145 {
        padding-left: 145px !important;
        padding-right: 145px !important;
    }
    .px-sm-150 {
        padding-left: 150px !important;
        padding-right: 150px !important;
    }
    .py-sm-05 {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
    .py-sm-10 {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
    .py-sm-15 {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
    .py-sm-20 {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
    .py-sm-25 {
        padding-top: 25px !important;
        padding-bottom: 25px !important;
    }
    .py-sm-30 {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }
    .py-sm-35 {
        padding-top: 35px !important;
        padding-bottom: 35px !important;
    }
    .py-sm-40 {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
    .py-sm-45 {
        padding-top: 45px !important;
        padding-bottom: 45px !important;
    }
    .py-sm-50 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .py-sm-55 {
        padding-top: 55px !important;
        padding-bottom: 55px !important;
    }
    .py-sm-60 {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }
    .py-sm-65 {
        padding-top: 65px !important;
        padding-bottom: 65px !important;
    }
    .py-sm-70 {
        padding-top: 70px !important;
        padding-bottom: 70px !important;
    }
    .py-sm-75 {
        padding-top: 75px !important;
        padding-bottom: 75px !important;
    }
    .py-sm-80 {
        padding-top: 80px !important;
        padding-bottom: 80px !important;
    }
    .py-sm-85 {
        padding-top: 85px !important;
        padding-bottom: 85px !important;
    }
    .py-sm-90 {
        padding-top: 90px !important;
        padding-bottom: 90px !important;
    }
    .py-sm-95 {
        padding-top: 95px !important;
        padding-bottom: 95px !important;
    }
    .py-sm-100 {
        padding-top: 100px !important;
        padding-bottom: 100px !important;
    }
    .py-sm-105 {
        padding-top: 105px !important;
        padding-bottom: 105px !important;
    }
    .py-sm-110 {
        padding-top: 110px !important;
        padding-bottom: 110px !important;
    }
    .py-sm-115 {
        padding-top: 115px !important;
        padding-bottom: 115px !important;
    }
    .py-sm-120 {
        padding-top: 120px !important;
        padding-bottom: 120px !important;
    }
    .py-sm-125 {
        padding-top: 125px !important;
        padding-bottom: 125px !important;
    }
    .py-sm-130 {
        padding-top: 130px !important;
        padding-bottom: 130px !important;
    }
    .py-sm-135 {
        padding-top: 135px !important;
        padding-bottom: 135px !important;
    }
    .py-sm-140 {
        padding-top: 140px !important;
        padding-bottom: 140px !important;
    }
    .py-sm-145 {
        padding-top: 145px !important;
        padding-bottom: 145px !important;
    }
    .py-sm-150 {
        padding-top: 150px !important;
        padding-bottom: 150px !important;
    }
    .pb-sm-05 {
        padding-bottom: 5px !important;
    }
    .pb-sm-10 {
        padding-bottom: 10px !important;
    }
    .pb-sm-15 {
        padding-bottom: 15px !important;
    }
    .pb-sm-20 {
        padding-bottom: 20px !important;
    }
    .pb-sm-25 {
        padding-bottom: 25px !important;
    }
    .pb-sm-30 {
        padding-bottom: 30px !important;
    }
    .pb-sm-35 {
        padding-bottom: 35px !important;
    }
    .pb-sm-40 {
        padding-bottom: 40px !important;
    }
    .pb-sm-45 {
        padding-bottom: 45px !important;
    }
    .pb-sm-50 {
        padding-bottom: 50px !important;
    }
    .pb-sm-55 {
        padding-bottom: 55px !important;
    }
    .pb-sm-60 {
        padding-bottom: 60px !important;
    }
    .pb-sm-65 {
        padding-bottom: 65px !important;
    }
    .pb-sm-70 {
        padding-bottom: 70px !important;
    }
    .pb-sm-75 {
        padding-bottom: 75px !important;
    }
    .pb-sm-80 {
        padding-bottom: 80px !important;
    }
    .pb-sm-85 {
        padding-bottom: 85px !important;
    }
    .pb-sm-90 {
        padding-bottom: 90px !important;
    }
    .pb-sm-95 {
        padding-bottom: 95px !important;
    }
    .pb-sm-100 {
        padding-bottom: 100px !important;
    }
    .pb-sm-105 {
        padding-bottom: 105px !important;
    }
    .pb-sm-110 {
        padding-bottom: 110px !important;
    }
    .pb-sm-115 {
        padding-bottom: 115px !important;
    }
    .pb-sm-120 {
        padding-bottom: 120px !important;
    }
    .pb-sm-125 {
        padding-bottom: 125px !important;
    }
    .pb-sm-130 {
        padding-bottom: 130px !important;
    }
    .pb-sm-135 {
        padding-bottom: 135px !important;
    }
    .pb-sm-140 {
        padding-bottom: 140px !important;
    }
    .pb-sm-145 {
        padding-bottom: 145px !important;
    }
    .pb-sm-150 {
        padding-bottom: 150px !important;
    }
    .pt-sm-05 {
        padding-top: 5px !important;
    }
    .pt-sm-10 {
        padding-top: 10px !important;
    }
    .pt-sm-15 {
        padding-top: 15px !important;
    }
    .pt-sm-20 {
        padding-top: 20px !important;
    }
    .pt-sm-25 {
        padding-top: 25px !important;
    }
    .pt-sm-30 {
        padding-top: 30px !important;
    }
    .pt-sm-35 {
        padding-top: 35px !important;
    }
    .pt-sm-40 {
        padding-top: 40px !important;
    }
    .pt-sm-45 {
        padding-top: 45px !important;
    }
    .pt-sm-50 {
        padding-top: 50px !important;
    }
    .pt-sm-55 {
        padding-top: 55px !important;
    }
    .pt-sm-60 {
        padding-top: 60px !important;
    }
    .pt-sm-65 {
        padding-top: 65px !important;
    }
    .pt-sm-70 {
        padding-top: 70px !important;
    }
    .pt-sm-75 {
        padding-top: 75px !important;
    }
    .pt-sm-80 {
        padding-top: 80px !important;
    }
    .pt-sm-85 {
        padding-top: 85px !important;
    }
    .pt-sm-90 {
        padding-top: 90px !important;
    }
    .pt-sm-95 {
        padding-top: 95px !important;
    }
    .pt-sm-100 {
        padding-top: 100px !important;
    }
    .pt-sm-105 {
        padding-top: 105px !important;
    }
    .pt-sm-110 {
        padding-top: 110px !important;
    }
    .pt-sm-115 {
        padding-top: 115px !important;
    }
    .pt-sm-120 {
        padding-top: 120px !important;
    }
    .pt-sm-125 {
        padding-top: 125px !important;
    }
    .pt-sm-130 {
        padding-top: 130px !important;
    }
    .pt-sm-135 {
        padding-top: 135px !important;
    }
    .pt-sm-140 {
        padding-top: 140px !important;
    }
    .pt-sm-145 {
        padding-top: 145px !important;
    }
    .pt-sm-150 {
        padding-top: 150px !important;
    }
    .pl-sm-05 {
        padding-left: 5px !important;
    }
    .pl-sm-10 {
        padding-left: 10px !important;
    }
    .pl-sm-15 {
        padding-left: 15px !important;
    }
    .pl-sm-20 {
        padding-left: 20px !important;
    }
    .pl-sm-25 {
        padding-left: 25px !important;
    }
    .pl-sm-30 {
        padding-left: 30px !important;
    }
    .pl-sm-35 {
        padding-left: 35px !important;
    }
    .pl-sm-40 {
        padding-left: 40px !important;
    }
    .pl-sm-45 {
        padding-left: 45px !important;
    }
    .pl-sm-50 {
        padding-left: 50px !important;
    }
    .pl-sm-55 {
        padding-left: 55px !important;
    }
    .pl-sm-60 {
        padding-left: 60px !important;
    }
    .pl-sm-65 {
        padding-left: 65px !important;
    }
    .pl-sm-70 {
        padding-left: 70px !important;
    }
    .pl-sm-75 {
        padding-left: 75px !important;
    }
    .pl-sm-80 {
        padding-left: 80px !important;
    }
    .pl-sm-85 {
        padding-left: 85px !important;
    }
    .pl-sm-90 {
        padding-left: 90px !important;
    }
    .pl-sm-95 {
        padding-left: 95px !important;
    }
    .pl-sm-100 {
        padding-left: 100px !important;
    }
    .pl-sm-105 {
        padding-left: 105px !important;
    }
    .pl-sm-110 {
        padding-left: 110px !important;
    }
    .pl-sm-115 {
        padding-left: 115px !important;
    }
    .pl-sm-120 {
        padding-left: 120px !important;
    }
    .pl-sm-125 {
        padding-left: 125px !important;
    }
    .pl-sm-130 {
        padding-left: 130px !important;
    }
    .pl-sm-135 {
        padding-left: 135px !important;
    }
    .pl-sm-140 {
        padding-left: 140px !important;
    }
    .pl-sm-145 {
        padding-left: 145px !important;
    }
    .pl-sm-150 {
        padding-left: 150px !important;
    }
    .pr-sm-05 {
        padding-right: 5px !important;
    }
    .pr-sm-10 {
        padding-right: 10px !important;
    }
    .pr-sm-15 {
        padding-right: 15px !important;
    }
    .pr-sm-20 {
        padding-right: 20px !important;
    }
    .pr-sm-25 {
        padding-right: 25px !important;
    }
    .pr-sm-30 {
        padding-right: 30px !important;
    }
    .pr-sm-35 {
        padding-right: 35px !important;
    }
    .pr-sm-40 {
        padding-right: 40px !important;
    }
    .pr-sm-45 {
        padding-right: 45px !important;
    }
    .pr-sm-50 {
        padding-right: 50px !important;
    }
    .pr-sm-55 {
        padding-right: 55px !important;
    }
    .pr-sm-60 {
        padding-right: 60px !important;
    }
    .pr-sm-65 {
        padding-right: 65px !important;
    }
    .pr-sm-70 {
        padding-right: 70px !important;
    }
    .pr-sm-75 {
        padding-right: 75px !important;
    }
    .pr-sm-80 {
        padding-right: 80px !important;
    }
    .pr-sm-85 {
        padding-right: 85px !important;
    }
    .pr-sm-90 {
        padding-right: 90px !important;
    }
    .pr-sm-95 {
        padding-right: 95px !important;
    }
    .pr-sm-100 {
        padding-right: 100px !important;
    }
    .pr-sm-105 {
        padding-right: 105px !important;
    }
    .pr-sm-110 {
        padding-right: 110px !important;
    }
    .pr-sm-115 {
        padding-right: 115px !important;
    }
    .pr-sm-120 {
        padding-right: 120px !important;
    }
    .pr-sm-125 {
        padding-right: 125px !important;
    }
    .pr-sm-130 {
        padding-right: 130px !important;
    }
    .pr-sm-135 {
        padding-right: 135px !important;
    }
    .pr-sm-140 {
        padding-right: 140px !important;
    }
    .pr-sm-145 {
        padding-right: 145px !important;
    }
    .pr-sm-150 {
        padding-right: 150px !important;
    }
}
.mw-10 {
    max-width: 100px !important;
}

.w-10 {
    width: 100px !important;
}

.mw-11 {
    max-width: 110px !important;
}

.w-11 {
    width: 110px !important;
}

.mw-12 {
    max-width: 120px !important;
}

.w-12 {
    width: 120px !important;
}

.mw-13 {
    max-width: 130px !important;
}

.w-13 {
    width: 130px !important;
}

.mw-14 {
    max-width: 140px !important;
}

.w-14 {
    width: 140px !important;
}

.mw-15 {
    max-width: 150px !important;
}

.w-15 {
    width: 150px !important;
}

.mw-16 {
    max-width: 160px !important;
}

.w-16 {
    width: 160px !important;
}

.mw-17 {
    max-width: 170px !important;
}

.w-17 {
    width: 170px !important;
}

.mw-18 {
    max-width: 180px !important;
}

.w-18 {
    width: 180px !important;
}

.mw-19 {
    max-width: 190px !important;
}

.w-19 {
    width: 190px !important;
}

.mw-20 {
    max-width: 200px !important;
}

.w-20 {
    width: 200px !important;
}

.mw-21 {
    max-width: 210px !important;
}

.w-21 {
    width: 210px !important;
}

.mw-22 {
    max-width: 220px !important;
}

.w-22 {
    width: 220px !important;
}

.mw-23 {
    max-width: 230px !important;
}

.w-23 {
    width: 230px !important;
}

.mw-24 {
    max-width: 240px !important;
}

.w-24 {
    width: 240px !important;
}

.mw-25 {
    max-width: 250px !important;
}

.w-25 {
    width: 250px !important;
}

.mw-26 {
    max-width: 260px !important;
}

.w-26 {
    width: 260px !important;
}

.mw-27 {
    max-width: 270px !important;
}

.w-27 {
    width: 270px !important;
}

.mw-28 {
    max-width: 280px !important;
}

.w-28 {
    width: 280px !important;
}

.mw-29 {
    max-width: 290px !important;
}

.w-29 {
    width: 290px !important;
}

.mw-30 {
    max-width: 300px !important;
}

.w-30 {
    width: 300px !important;
}

.mw-31 {
    max-width: 310px !important;
}

.w-31 {
    width: 310px !important;
}

.mw-32 {
    max-width: 320px !important;
}

.w-32 {
    width: 320px !important;
}

.mw-33 {
    max-width: 330px !important;
}

.w-33 {
    width: 330px !important;
}

.mw-34 {
    max-width: 340px !important;
}

.w-34 {
    width: 340px !important;
}

.mw-35 {
    max-width: 350px !important;
}

.w-35 {
    width: 350px !important;
}

.mw-36 {
    max-width: 360px !important;
}

.w-36 {
    width: 360px !important;
}

.mw-37 {
    max-width: 370px !important;
}

.w-37 {
    width: 370px !important;
}

.mw-38 {
    max-width: 380px !important;
}

.w-38 {
    width: 380px !important;
}

.mw-39 {
    max-width: 390px !important;
}

.w-39 {
    width: 390px !important;
}

.mw-40 {
    max-width: 400px !important;
}

.w-40 {
    width: 400px !important;
}

.mw-41 {
    max-width: 410px !important;
}

.w-41 {
    width: 410px !important;
}

.mw-42 {
    max-width: 420px !important;
}

.w-42 {
    width: 420px !important;
}

.mw-43 {
    max-width: 430px !important;
}

.w-43 {
    width: 430px !important;
}

.mw-44 {
    max-width: 440px !important;
}

.w-44 {
    width: 440px !important;
}

.mw-45 {
    max-width: 450px !important;
}

.w-45 {
    width: 450px !important;
}

.mw-46 {
    max-width: 460px !important;
}

.w-46 {
    width: 460px !important;
}

.mw-47 {
    max-width: 470px !important;
}

.w-47 {
    width: 470px !important;
}

.mw-48 {
    max-width: 480px !important;
}

.w-48 {
    width: 480px !important;
}

.mw-49 {
    max-width: 490px !important;
}

.w-49 {
    width: 490px !important;
}

.mw-50 {
    max-width: 500px !important;
}

.w-50 {
    width: 500px !important;
}

.mw-51 {
    max-width: 510px !important;
}

.w-51 {
    width: 510px !important;
}

.mw-52 {
    max-width: 520px !important;
}

.w-52 {
    width: 520px !important;
}

.mw-53 {
    max-width: 530px !important;
}

.w-53 {
    width: 530px !important;
}

.mw-54 {
    max-width: 540px !important;
}

.w-54 {
    width: 540px !important;
}

.mw-55 {
    max-width: 550px !important;
}

.w-55 {
    width: 550px !important;
}

.mw-56 {
    max-width: 560px !important;
}

.w-56 {
    width: 560px !important;
}

.mw-57 {
    max-width: 570px !important;
}

.w-57 {
    width: 570px !important;
}

.mw-58 {
    max-width: 580px !important;
}

.w-58 {
    width: 580px !important;
}

.mw-59 {
    max-width: 590px !important;
}

.w-59 {
    width: 590px !important;
}

.mw-60 {
    max-width: 600px !important;
}

.w-60 {
    width: 600px !important;
}

.mw-61 {
    max-width: 610px !important;
}

.w-61 {
    width: 610px !important;
}

.mw-62 {
    max-width: 620px !important;
}

.w-62 {
    width: 620px !important;
}

.mw-63 {
    max-width: 630px !important;
}

.w-63 {
    width: 630px !important;
}

.mw-64 {
    max-width: 640px !important;
}

.w-64 {
    width: 640px !important;
}

.mw-65 {
    max-width: 650px !important;
}

.w-65 {
    width: 650px !important;
}

.mw-66 {
    max-width: 660px !important;
}

.w-66 {
    width: 660px !important;
}

.mw-67 {
    max-width: 670px !important;
}

.w-67 {
    width: 670px !important;
}

.mw-68 {
    max-width: 680px !important;
}

.w-68 {
    width: 680px !important;
}

.mw-69 {
    max-width: 690px !important;
}

.w-69 {
    width: 690px !important;
}

.mw-70 {
    max-width: 700px !important;
}

.w-70 {
    width: 700px !important;
}

.mw-71 {
    max-width: 710px !important;
}

.w-71 {
    width: 710px !important;
}

.mw-72 {
    max-width: 720px !important;
}

.w-72 {
    width: 720px !important;
}

.mw-73 {
    max-width: 730px !important;
}

.w-73 {
    width: 730px !important;
}

.mw-74 {
    max-width: 740px !important;
}

.w-74 {
    width: 740px !important;
}

.mw-75 {
    max-width: 750px !important;
}

.w-75 {
    width: 750px !important;
}

.mw-76 {
    max-width: 760px !important;
}

.w-76 {
    width: 760px !important;
}

.mw-77 {
    max-width: 770px !important;
}

.w-77 {
    width: 770px !important;
}

.mw-78 {
    max-width: 780px !important;
}

.w-78 {
    width: 780px !important;
}

.mw-79 {
    max-width: 790px !important;
}

.w-79 {
    width: 790px !important;
}

.mw-80 {
    max-width: 800px !important;
}

.w-80 {
    width: 800px !important;
}

.mw-81 {
    max-width: 810px !important;
}

.w-81 {
    width: 810px !important;
}

.mw-82 {
    max-width: 820px !important;
}

.w-82 {
    width: 820px !important;
}

.mw-83 {
    max-width: 830px !important;
}

.w-83 {
    width: 830px !important;
}

.mw-84 {
    max-width: 840px !important;
}

.w-84 {
    width: 840px !important;
}

.mw-85 {
    max-width: 850px !important;
}

.w-85 {
    width: 850px !important;
}

.mw-86 {
    max-width: 860px !important;
}

.w-86 {
    width: 860px !important;
}

.mw-87 {
    max-width: 870px !important;
}

.w-87 {
    width: 870px !important;
}

.mw-88 {
    max-width: 880px !important;
}

.w-88 {
    width: 880px !important;
}

.mw-89 {
    max-width: 890px !important;
}

.w-89 {
    width: 890px !important;
}

.mw-90 {
    max-width: 900px !important;
}

.w-90 {
    width: 900px !important;
}

.mw-91 {
    max-width: 910px !important;
}

.w-91 {
    width: 910px !important;
}

.mw-92 {
    max-width: 920px !important;
}

.w-92 {
    width: 920px !important;
}

.mw-93 {
    max-width: 930px !important;
}

.w-93 {
    width: 930px !important;
}

.mw-94 {
    max-width: 940px !important;
}

.w-94 {
    width: 940px !important;
}

.mw-95 {
    max-width: 950px !important;
}

.w-95 {
    width: 950px !important;
}

.mw-96 {
    max-width: 960px !important;
}

.w-96 {
    width: 960px !important;
}

.mw-97 {
    max-width: 970px !important;
}

.w-97 {
    width: 970px !important;
}

.mw-98 {
    max-width: 980px !important;
}

.w-98 {
    width: 980px !important;
}

.mw-99 {
    max-width: 990px !important;
}

.w-99 {
    width: 990px !important;
}

.text-10 {
    font-size: 10px !important;
}

.text-11 {
    font-size: 11px !important;
}

.text-12 {
    font-size: 12px !important;
}

.text-13 {
    font-size: 13px !important;
}

.text-14 {
    font-size: 14px !important;
}

.text-15 {
    font-size: 15px !important;
}

.text-16 {
    font-size: 16px !important;
}

.text-17 {
    font-size: 17px !important;
}

.text-18 {
    font-size: 18px !important;
}

.text-19 {
    font-size: 19px !important;
}

.text-20 {
    font-size: 20px !important;
}

.text-21 {
    font-size: 21px !important;
}

.text-22 {
    font-size: 22px !important;
}

.text-23 {
    font-size: 23px !important;
}

.text-24 {
    font-size: 24px !important;
}

.text-25 {
    font-size: 25px !important;
}

.text-26 {
    font-size: 26px !important;
}

.text-27 {
    font-size: 27px !important;
}

.text-28 {
    font-size: 28px !important;
}

.text-29 {
    font-size: 29px !important;
}

.text-30 {
    font-size: 30px !important;
}

.text-31 {
    font-size: 31px !important;
}

.text-32 {
    font-size: 32px !important;
}

/*********************************
/*  Common Css Start
*********************************/
.border-none {
    border: none !important;
}

.btn-round {
    border-radius: 4px !important;
}

.bg-white {
    background-color: var(--color-white) !important;
}

.bg-color {
    background: var(--color-secondary) !important;
}

.text-primary {
    color: var(--color-primary) !important;
}

.text-content {
    color: var(--color-content) !important;
}

.text-green {
    color: var(--color-green) !important;
}

.bg-primary {
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    border-color: var(--color-primary) !important;
}

.input-bg {
    background: #f4f4f4;
}

.radius {
    border-radius: var(--radius) !important;
}

.border {
    border: 1px solid var(--color-border) !important;
}

.border-top {
    border-top: 1px solid var(--color-border) !important;
}

.border-right {
    border-right: 1px solid var(--color-border) !important;
}

.border-bottom {
    border-bottom: 1px solid var(--color-border) !important;
}

.border-left {
    border-left: 1px solid var(--color-border) !important;
}

button:hover,
button:focus {
    outline: 0px;
}

.text-ellips {
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-ellips-2 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-ellips-3 {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-ellips-4 {
    display: -webkit-box !important;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*********************************
/*  Skeleton Start
*********************************/
.skeleton {
    position: relative;
    height: 100%;
}
.skeleton::after {
    content: "";
    background: var(--color-secondary);
    background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
    border-radius: 5px;
    background-size: 200% 100%;
    width: 100%;
    height: 100%;
    z-index: 999;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: 1.5s shine linear infinite;
    animation: 1.5s shine linear infinite;
}

@-webkit-keyframes shine {
    to {
        background-position-x: -200%;
    }
}

@keyframes shine {
    to {
        background-position-x: -200%;
    }
}
/*********************************
/*  Input Apperance Start
*********************************/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

input[type="number"] {
    -moz-appearance: textfield !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    border-radius: 4px;
    margin-right: 2px;
}

/*********************************
/*  Input Apperance End
*********************************/
/*********************************
/*  Custom Scroll Bar Css
*********************************/
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    border-radius: var(--radius-8);
}

::-webkit-scrollbar-track {
    background-color: rgba(var(--color-primary-rgb), 0.2);
}

::-webkit-scrollbar-thumb {
    background-color: rgba(var(--color-primary-rgb), 1);
}

/*********************************
/*  Custom Scroll Bar Css
*********************************/
/*********************************
/*  row Custom
*********************************/
.row > * {
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.7);
    padding-left: calc(var(--bs-gutter-x) * 0.7);
    margin-top: var(--bs-gutter-y);
}

@media screen and (max-width: 991px) {
    .column-reverse-lg {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }
}
@media screen and (max-width: 767px) {
    .column-reverse-md {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }
}

.row-reverse {
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: reverse !important;
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
}
@media screen and (max-width: 991px) {
    .row-reverse-lg {
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: row-reverse !important;
        flex-direction: row-reverse !important;
    }
}
@media screen and (max-width: 767px) {
    .row-reverse-md {
        -webkit-box-orient: horizontal !important;
        -webkit-box-direction: reverse !important;
        -ms-flex-direction: row-reverse !important;
        flex-direction: row-reverse !important;
    }
}

@media (min-width: 479px) and (max-width: 575px) {
    .col-xs-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 50%;
    }
}
/*********************************
/*  Heading Typography
*********************************/
h1 {
    font-family: var(--font-default);
    font-size: 40px;
    line-height: 54px;
    font-weight: var(--font-semibold);
    letter-spacing: 0.5px;
    color: var(--color-heading);
}
@media screen and (max-width: 767px) {
    h1 {
        font-size: 38px;
        line-height: 50px;
    }
}
@media screen and (max-width: 575px) {
    h1 {
        font-size: 36px;
        line-height: 50px;
    }
}
@media screen and (max-width: 375px) {
    h1 {
        font-size: 28px;
        line-height: 36px;
    }
}

h2 {
    font-family: var(--font-default);
    font-size: 32px;
    line-height: 38.4px;
    font-weight: var(--font-semibold);
    letter-spacing: 0.5px;
    color: var(--color-heading);
}
@media screen and (max-width: 400px) {
    h2 {
        font-size: 28px;
        line-height: 34px;
    }
}

h3 {
    font-family: var(--font-default);
    font-size: 32px;
    line-height: 40px;
    font-weight: var(--font-semibold);
    color: var(--color-heading);
}

h4 {
    font-family: var(--font-default);
    font-size: 20px;
    line-height: 28px;
    font-weight: var(--font-semibold);
    color: var(--color-heading);
}

/*********************************
/*  Content Typography
*********************************/
p {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
}

/*********************************
/* Scroll Up Css Start
*********************************/
.scrollTop {
    position: fixed;
    bottom: 20px;
    left: 20px;
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 20px;
    background: var(--color-heading);
    border-radius: var(--radius);
    color: var(--color-white);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.5s ease, visibility 0.5s ease,
        -webkit-transform 0.3s ease;
    transition: opacity 0.5s ease, visibility 0.5s ease,
        -webkit-transform 0.3s ease;
    transition: opacity 0.5s ease, visibility 0.5s ease, transform 0.3s ease;
    transition: opacity 0.5s ease, visibility 0.5s ease, transform 0.3s ease,
        -webkit-transform 0.3s ease;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    z-index: 999;
}
.scrollTop i {
    -webkit-animation: mover 1s linear infinite alternate;
    animation: mover 1s linear infinite alternate;
}
.scrollTop:hover {
    background-color: var(--color-primary);
}
.scrollTop.active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

@-webkit-keyframes mover {
    0% {
        -webkit-transform: translateY(3px);
        transform: translateY(3px);
    }
    100% {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px);
    }
}

@keyframes mover {
    0% {
        -webkit-transform: translateY(3px);
        transform: translateY(3px);
    }
    100% {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px);
    }
}
/*********************************
/* Scroll Up Css End
*********************************/
/*********************************
/* Swiper Navigation & Pagination
*********************************/
.swiper-pagination-bullets {
    position: absolute;
    bottom: 0;
    text-align: center;
}
.swiper-pagination-bullets .swiper-pagination-bullet {
    height: 6px;
    width: 6px;
    background: var(--color-heading);
    border-radius: 50%;
    opacity: 1;
    margin: 0 !important;
    margin-right: 8px !important;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.swiper-pagination-bullets .swiper-pagination-bullet-active {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    background: var(--color-primary);
}

.custom-navigation {
    position: absolute;
    width: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 99;
}
.custom-navigation .swiper-button-next,
.custom-navigation .swiper-button-prev {
    color: var(--color-heading);
    background: var(--color-white);
    border: 1px solid var(--color-border);
    font-size: 22px;
    height: 40px;
    width: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin: 0;
    left: -20px;
    top: -32px;
}
@media screen and (max-width: 575px) {
    .custom-navigation .swiper-button-next,
    .custom-navigation .swiper-button-prev {
        left: -10px;
    }
}
.custom-navigation .swiper-button-next.swiper-button-disabled,
.custom-navigation .swiper-button-prev.swiper-button-disabled {
    color: var(--color-border);
    opacity: 1;
}
.custom-navigation .swiper-button-next::after,
.custom-navigation .swiper-button-prev::after {
    display: none;
    font-size: 20px;
}
.custom-navigation .swiper-button-next:hover,
.custom-navigation .swiper-button-prev:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}
.custom-navigation .swiper-button-next {
    left: auto;
    right: -20px;
}
@media screen and (max-width: 575px) {
    .custom-navigation .swiper-button-next {
        right: -10px;
    }
}

/*********************************
/* Swiper Navigation & Pagination
*********************************/
/*********************************
/*  Button Start
*********************************/
.btn {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 16.8px;
    letter-spacing: 0.5px;
    padding: 11px 23px;
    border-radius: var(--radius);
    border: none;
    outline: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 8px;
    text-transform: capitalize;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.btn i {
    font-size: 18px;
}
.btn:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
}
.btn:disabled {
    background: rgba(var(--color-primary-rgb), 0.1);
    border-color: rgba(var(--color-primary-rgb), 0.1);
    color: rgba(var(--color-primary-rgb), 0.5);
    opacity: 1;
}
.btn-primary {
    background-color: var(--color-primary);
    color: var(--color-heading);
    border: 1px solid var(--color-primary);
}
.btn-primary:focus,
.btn-primary:hover {
    border-color: var(--color-heading);
    background-color: var(--color-heading);
    color: var(--color-white);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline {
    background-color: transparent;
    color: var(--color-heading);
    border: 1px solid var(--color-border);
}
.btn-outline:focus,
.btn-outline:hover {
    border-color: var(--color-heading);
    background-color: var(--color-heading);
    color: var(--color-white);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-secondary {
    background-color: var(--color-heading);
    color: var(--color-white);
    border: 1px solid var(--color-heading);
}
.btn-secondary:focus,
.btn-secondary:hover {
    background-color: var(--color-primary);
    color: var(--color-heading);
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}
.btn-gray {
    background-color: rgba(32, 33, 36, 0.1019607843);
    color: var(--color-heading);
    border: 1px solid rgba(32, 33, 36, 0.1019607843);
}
.btn-gray:focus,
.btn-gray:hover {
    background-color: var(--color-primary);
    color: var(--color-heading);
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}

.solid-btn {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    text-transform: capitalize;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    text-decoration: underline;
    text-underline-offset: 4px;
}
.solid-btn:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

/*********************************
/*  Button End
*********************************/
/*********************************
/*  Section Tittle Start
*********************************/
.section-title {
    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: 20px;
    max-width: 100%;
    margin-bottom: 30px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 991px) {
    .section-title.v2 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
@media screen and (max-width: 1199px) {
    .section-title.countdown {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
@media screen and (max-width: 767px) {
    .section-title.countdown {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}
@media screen and (max-width: 767px) {
    .section-title.countdown .wrap {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}
.section-title .wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 575px) {
    .section-title .wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
.section-title .subtitle {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: var(--font-regular);
    line-height: 24px;
    letter-spacing: 0.2px;
    color: var(--color-heading2);
    text-transform: capitalize;
    margin-bottom: 0;
    border-left: 1px solid var(--color-border);
    padding-left: 16px;
}
@media screen and (max-width: 575px) {
    .section-title .subtitle {
        padding: 0;
        border: none;
    }
}
.section-title .subtitle span {
    font-weight: var(--font-bold);
    color: var(--color-primary);
}
@media screen and (max-width: 991px) {
    .section-title .subtitle {
        font-size: 16px;
    }
}
.section-title .title {
    font-family: var(--font-default);
    font-size: 24px;
    line-height: 36px;
    letter-spacing: 0.5px;
    font-weight: var(--font-semibold);
    color: var(--color-heading);
    margin-bottom: 0;
}
@media screen and (max-width: 991px) {
    .section-title .title {
        font-size: 22px;
        line-height: 33px;
    }
}
@media screen and (max-width: 767px) {
    .section-title .title {
        font-size: 20px;
        line-height: 30px;
    }
}
.section-title .title img {
    display: inline-block;
    width: 20px;
    -webkit-animation: flash 1s linear infinite;
    animation: flash 1s linear infinite;
    margin-right: 8px;
}
.section-title p,
.section-title .desc {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 24px;
    color: var(--color-content2);
    margin: 12px 0 0;
}
.section-title .section-btn .solid-btn {
    white-space: nowrap;
}

@-webkit-keyframes flash {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.1;
    }
    100% {
        opacity: 1;
    }
}

@keyframes flash {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.1;
    }
    100% {
        opacity: 1;
    }
}
/*********************************
/*  Section Tittle End
*********************************/
/*********************************
/* Header Start
*********************************/
.headerTopbar {
    /* padding: 12px 0; */
    background: var(--color-white);
}
.headerTopbar-wrapper {
    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: 20px;
    padding: 12px 0;
    border-bottom: 1px solid var(--color-border);
}
@media screen and (max-width: 991px) {
    .headerTopbar-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px;
    }
}
.headerTopbar-wrapper .header-left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
.headerTopbar-wrapper .play-items {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: var(--color-heading);
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    border-left: 1px solid var(--color-border);
    padding-left: 16px;
}
@media screen and (max-width: 767px) {
    .headerTopbar-wrapper .play-items span {
        display: none;
    }
}
.headerTopbar-wrapper .play-items a {
    height: 18px;
    width: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 16px;
    color: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.headerTopbar-wrapper .play-items a:hover {
    color: var(--color-primary);
}
.headerTopbar-wrapper .list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px 32px;
    flex-wrap: wrap;
}

@media (max-width: 479px) {
    .headerTopbar-wrapper .list-item {
        flex-wrap: wrap;
        justify-content: center;
    }
}
.headerTopbar-wrapper .list-item li {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    position: relative;
}
.headerTopbar-wrapper .list-item li a {
    color: currentColor;
    display: inline-block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.headerTopbar-wrapper .list-item li a:hover {
    color: var(--color-primary);
}
.headerTopbar-wrapper .list-item li::after {
    content: "";
    position: absolute;
    top: 0;
    right: -16px;
    height: 19px;
    width: 1px;
    background: var(--color-border);
}
.headerTopbar-wrapper .list-item li:last-of-type::after {
    display: none;
}

.headerMiddle {
    background: var(--colo-white);
    padding: 21px 0;
}
@media screen and (max-width: 991px) {
    .headerMiddle {
        padding: 12px 0;
    }
}
.headerMiddle-wrapper {
    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;
}
.headerMiddle-wrapper .header-logo img {
    width: auto;
    display: block;
    max-width: 140px;
}

.header-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 17px;
}
@media screen and (max-width: 767px) {
    .header-action {
        gap: 10px;
    }
}
.header-action .action-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    min-width: 136px;
    width: 100%;
}
@media screen and (max-width: 991px) {
    .header-action .action-list {
        min-width: initial;
    }
}
.header-action .action-list .icon {
    height: 48px;
    width: 48px;
    border-radius: var(--radius);
    /* border: 1px solid rgba(var(--color-white-rgb), 0.1); */
    border: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
@media screen and (max-width: 767px) {
    .header-action .action-list .icon {
        height: 38px;
        width: 38px;
    }
}
.header-action .action-list .icon img,
.header-action .action-list .icon svg {
    width: 24px;
}
@media screen and (max-width: 767px) {
    .header-action .action-list .icon img,
    .header-action .action-list .icon svg {
        width: 16px;
        height: 20px;
    }
}
.header-action .action-list .icon img path,
.header-action .action-list .icon svg path {
    fill: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.header-action .action-list .icon .count {
    height: 24px;
    width: 24px;
    background: var(--color-primary);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color-heading);
    font-size: 11.2px;
    font-weight: var(--font-regular);
    line-height: 16px;
    letter-spacing: 0.4px;
    position: absolute;
    top: -10px;
    right: -10px;
}
@media screen and (max-width: 575px) {
    .header-action .action-list .icon .count {
        width: 20px;
        height: 20px;
    }
}
.header-action .action-list .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
}
.header-action .action-list .content span {
    font-size: 14px;
    margin-bottom: 6px;
    display: block;
    color: var(--color-content);
}
@media screen and (max-width: 991px) {
    .header-action .action-list .content {
        display: none;
    }
}
.header-action .action-list:hover .icon {
    background: var(--color-primary);
    border-color: var(--color-primary);
}
.header-action .action-list:hover .icon svg path {
    fill: var(--color-heading);
}

.userHeader {
    position: relative;
}
.userHeader .userProfile .action-list .content {
    color: var(--color-heading);
    white-space: nowrap;
}
.userHeader .sideBar-menu {
    position: absolute;
    top: 130%;
    background: var(--color-white);
    border-radius: var(--radius-10);
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    width: 207px;
    right: 0;
    padding: 16px;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.userHeader .sideBar-menu::before {
    content: "";
    position: absolute;
    top: -6px;
    right: 26px;
    height: 12px;
    width: 12px;
    border-radius: 1px;
    background: var(--color-white);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.userHeader .sideBar-menu.active {
    opacity: 1;
    visibility: visible;
    top: 120%;
}
.userHeader .sideBar-menu .menu-item li a {
    padding: 10px 16px;
}
@media (min-width: 576px) and (max-width: 991px) {
    .userHeader .sideBar-menu .menu-item li a {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
}
@media (min-width: 576px) and (max-width: 991px) {
    .userHeader .sideBar-menu .menu-item li a span {
        display: block;
    }
}

.headerBottom {
    background: var(--menu-background);
    /* border-top: 0.5px solid rgba(var(--color-white-rgb), 0.1); */
}
.headerBottom.sticky {
    position: sticky;
    width: 100%;
    top: 0;
    -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 99;
}
.headerBottom-wrapper {
    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;
}

.header-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 43px;
}
@media screen and (max-width: 1199px) {
    .header-menu {
        gap: 20px;
    }
}
.header-menu .main-menu {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: inherit;
    -ms-flex-pack: inherit;
    justify-content: inherit;
    gap: 40px;
}
@media screen and (max-width: 1199px) {
    .header-menu .main-menu {
        gap: 30px;
    }
}
@media screen and (max-width: 991px) {
    .header-menu .main-menu {
        display: none;
    }
}
.header-menu .main-menu li {
    position: relative;
    list-style: none;
}
.header-menu .main-menu li.has-dropdown a {
    position: relative;
}
.header-menu .main-menu li.has-dropdown a::after {
    content: "\ea4e";
    font-family: "remixicon";
    font-size: 18px;
    font-weight: var(--font-regular);
    color: var(--menu-text-color);
    position: relative;
    top: 2px;
    margin-left: 8px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.header-menu .main-menu li a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    color: var(--menu-text-color);
    display: inline-block;
    /* margin-right: 40px; */
    line-height: 55px;
    letter-spacing: 0.5px;
    padding: 0;
    text-transform: capitalize;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
}
.header-menu .main-menu li a::before {
    content: "";
    position: absolute;
    width: 0%;
    height: 1px;
    background: var(--color-primary);
    top: 0px;
    right: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
/* .header-menu .main-menu li a.router-link-active,  */
.header-menu .main-menu li a:hover,
.header-menu .main-menu li a.active {
    color: var(--menu-active-color);
}
/* .header-menu .main-menu li a.router-link-active::before,  */
.header-menu .main-menu li a:hover::before,
.header-menu .main-menu li a.active::before {
    width: 100%;
    left: 0;
    right: auto;
}
/* @media screen and (max-width: 1199px) {
  .header-menu .main-menu li a {
    margin-right: 30px;
  }
} */
.header-menu .main-menu li:hover a,
.header-menu .main-menu li.active a {
    color: var(--menu-active-color);
}
.header-menu .main-menu li:hover a::after,
.header-menu .main-menu li.active a::after {
    color: var(--menu-active-color);
}
.header-menu .main-menu li:last-child a {
    margin-right: 0;
}
.header-menu .main-menu li .sub-menu {
    position: absolute;
    left: 0;
    top: 110%;
    width: 180px;
    background: var(--color-white);
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    padding: 10px 0;
    opacity: 0;
    z-index: 99999;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    border: 1px solid var(--color-border);
    pointer-events: none;
}
.header-menu .main-menu li .sub-menu li a {
    font-size: 14px;
    line-height: 25px;
    font-family: var(--font-default);
    font-weight: var(--font-medium);
    color: var(--color-heading2);
    letter-spacing: 0.5px;
    padding: 7px 16px;
    width: 100%;
    display: block;
    position: relative;
    z-index: 1;
    text-transform: capitalize;
}
.header-menu .main-menu li .sub-menu li a::before,
.header-menu .main-menu li .sub-menu li a::after {
    display: none;
}
.header-menu .main-menu li .sub-menu li a:hover,
.header-menu .main-menu li .sub-menu li a.active {
    color: var(--color-primary);
}
.header-menu .main-menu li .sub-menu li:last-child a {
    border: none;
}
.header-menu .main-menu li .sub-menu li:focus .sub-menu {
    display: none;
}
.header-menu .main-menu li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    top: 100%;
    pointer-events: auto;
}

.header-meta {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: inherit;
    -ms-flex-pack: inherit;
    justify-content: inherit;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}
.header-meta .meta-list {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: inherit;
    -ms-flex-pack: inherit;
    justify-content: inherit;
    gap: 16px;
    list-style: none;
}
@media screen and (max-width: 767px) {
    .header-meta .header-btn {
        display: none;
    }
}
.header-meta .header-btn .btn {
    background: var(--color-white);
    color: var(--color-content2);
    border-color: var(--color-white);
    font-weight: var(--font-semibold);
    padding: 11px 17.5px;
}
.header-meta .header-btn .btn:focus,
.header-meta .header-btn .btn:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-heading);
}
.header-meta .header-toggle {
    height: 40px;
    width: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    display: none;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    z-index: 99;
}
@media screen and (max-width: 991px) {
    .header-meta .header-toggle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}
@media screen and (max-width: 479px) {
    .header-meta .header-toggle {
        margin-left: 0;
    }
}
.header-meta .header-toggle.active .toggle-bar {
    background: transparent;
}
.header-meta .header-toggle.active .toggle-bar::before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 0;
}
.header-meta .header-toggle.active .toggle-bar::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    bottom: 0;
}
.header-meta .header-toggle .toggle-bar {
    height: 2px;
    width: 25px;
    background: var(--color-primary);
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.header-meta .header-toggle .toggle-bar::after,
.header-meta .header-toggle .toggle-bar::before {
    content: "";
    position: absolute;
    top: -8px;
    height: 2px;
    width: 100%;
    background: var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.header-meta .header-toggle .toggle-bar::after {
    top: auto;
    bottom: -8px;
}

.header-category {
    position: relative;
}
.header-category .bar {
    height: 24px;
    width: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}
.header-category .category-header {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-white);
    padding: 16px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    text-transform: capitalize;
}
.header-category .category-header svg {
    width: 20px;
    height: 20px;
}
.header-category .category-header svg path {
    fill: var(--color-white);
}
.header-category .category-header.bg-primary {
    background: var(--color-primary);
    color: var(--color-heading) !important;
}
.header-category .category-header.bg-primary svg path {
    fill: var(--color-heading);
}

.category-item {
    position: absolute;
    top: 100%;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 0 0 6px 6px;
    width: 256px;
    display: block;
}
.category-item.active {
    display: none;
}
@media screen and (max-width: 991px) {
    .category-item {
        display: none !important;
    }
}
.category-item .category-list {
    background: var(--color-white);
    list-style: none;
    z-index: 99;
    position: relative;
}
.category-item .category-list li {
    position: relative;
}
.category-item .category-list li a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 17px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding: 13.8px 18px;
    border-bottom: 1px solid var(--color-border);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
    text-align: initial;
}
.category-item .category-list li a.nav-link::after {
    content: "\ea6e";
    font-family: "remixicon";
    font-size: 20px;
    font-weight: var(--font-regular);
    color: var(--color-heading);
    position: absolute;
    right: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.category-item .category-list li a.btn {
    background: var(--color-heading);
    color: var(--color-primary);
    display: block;
    border-radius: 0 0 6px 6px;
}
.category-item .category-list li a.btn::after {
    color: var(--color-primary);
}
.category-item .category-list li a .icon {
    width: 20px;
    height: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.category-item .category-list li a .icon svg path {
    fill: var(--color-heading2);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.category-item .category-list li a:hover {
    color: var(--color-primary);
}
.category-item .category-list li a:hover .icon svg path {
    fill: var(--color-primary);
}
.category-item .category-list li a:hover.nav-link::after {
    color: var(--color-primary);
}
.category-item .category-list li:last-child a {
    border: none;
}
.category-item .category-list li:hover:hover .mega-menu {
    opacity: 1;
    visibility: visible;
    left: 100%;
    pointer-events: auto;
}
.category-item .category-list .mega-menu {
    position: absolute;
    top: 0;
    left: 102%;
    background: var(--color-white);
    width: 883px;
    padding: 24px 24px 20px;
    -webkit-box-shadow: 40px 8px 40px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 40px 8px 40px 0px rgba(0, 0, 0, 0.1019607843);
    border-radius: 0px 6px 6px 0;
    border: 1px solid var(--color-border);
    /* display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start; */

    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 15px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    pointer-events: none;
    z-index: 9;
    /* height: 100%; */
    overflow: hidden;
    overflow-y: auto;
    max-height: 530px;
}
@media screen and (max-width: 1199px) {
    .category-item .category-list .mega-menu {
        width: 690px !important;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 30px;
    }
}
.category-item .category-list .mega-menu.health-width {
    width: 645px;
}
.category-item .category-list .mega-menu.jewellery-width {
    width: 765px;
}
.category-item .category-list .mega-menu.jewellery-width .sub-mega-menu img {
    max-width: 330px;
}
@media screen and (max-width: 1199px) {
    .category-item
        .category-list
        .mega-menu.jewellery-width
        .sub-mega-menu
        img {
        max-width: 254px;
    }
}
.category-item .category-list .mega-menu.grocery-width {
    width: 637px;
}
.category-item .category-list .mega-menu.electronics-width {
    width: 1038px;
}
@media screen and (max-width: 1440px) {
    .category-item .category-list .mega-menu.electronics-width {
        width: 850px;
    }
}
.category-item .category-list .mega-menu.travel-width {
    width: 630px;
}
.category-item .category-list .mega-menu .menu-title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: block;
    padding: 13px 0;
    border-bottom: 1px solid var(--color-border);
    display: inline-block;
    margin-bottom: 16px;
    text-transform: capitalize;
}
.category-item .category-list .mega-menu .sub-mega-menu {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.category-item .category-list .mega-menu .sub-mega-menu .single-menu {
    margin-bottom: 15px;
}
.category-item .category-list .mega-menu .sub-mega-menu img {
    width: auto;
    max-width: 254px;
    height: auto;
    border-radius: 4px;
}
.category-item .category-list .mega-menu .sub-mega-menu li a {
    border: none;
    padding: 0;
    font-weight: var(--font-medium);
    margin-bottom: 16px;
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.category-item .category-list .mega-menu .sub-mega-menu li a::before {
    content: "";
    position: absolute;
    width: 0;
    height: 1px;
    background: var(--color-primary);
    bottom: -3px;
    right: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.category-item .category-list .mega-menu .sub-mega-menu li a:hover::before {
    width: 100%;
    right: auto;
    left: 0;
    background: var(--color-primary);
}
.category-item .category-list .mega-menu .sub-mega-menu li:last-child a {
    margin-bottom: 0;
}

/**************************************/
/* Search Form
/**************************************/
.search-form {
    max-width: 556px;
    width: 100%;
    position: relative;
}

@media screen and (max-width: 991px) {
    .search-form {
        max-width: 340px;
    }
}
@media screen and (max-width: 767px) {
    .search-form {
        margin: auto;
        /* top: 40px; */
        max-width: 556px;
        /* position: fixed;
        top: 100px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 95%;
        z-index: 999; */
    }
}
.search-form .close {
    position: absolute;
    top: -50px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    color: var(--color-black);
    background: var(--color-primary);
    height: 34px;
    width: 34px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 4px;
    display: none;
}
@media screen and (max-width: 767px) {
    .search-form .close {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}
.search-form .input-group {
    position: relative;
}
.search-form .input-group .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-content3);
    padding: 13px 24px;
    padding-right: 30px;
    border-radius: var(--radius) !important;
    outline: none;
    /* border: none; */
}
.search-form .input-group .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    z-index: auto;
}
.search-form .input-group button {
    background: none;
    outline: none;
    border: none;
    color: var(--color-heading);
    font-size: 18px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 16px;
    height: 20px;
    width: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.search-result-wrapper {
    width: 100%;
    background: var(--color-white);
    padding: 20px 20px 18px;
    border-radius: 1px solid var(--color-border);
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1019607843);
    position: absolute;
    z-index: 999;
    border-radius: 4px;
    top: 110%;
}
.search-result-wrapper .search-overflow {
    max-height: 500px;
    overflow: auto;
}
.search-result-wrapper .search-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}
.search-result-wrapper .search-result .thumb {
    border: 1px solid var(--color-border);
    border-radius: 4px;
    max-width: 120px;
    width: 100%;
    height: 93px;
}
.search-result-wrapper .search-result .thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 4px;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 90px;
    margin: auto;
}
.search-result-wrapper .search-result .content .title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 22px;
    color: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 6px;
    display: block;
}
.search-result-wrapper .search-result .content .title:hover {
    color: var(--color-primary);
}
.search-result-wrapper .search-result .content .price-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    color: var(--color-heading3);
    margin-top: 6px;
}
.search-result-wrapper .search-result .content .price-wrap .discount {
    font-size: 12px;
    font-weight: var(--font-regular);
    text-decoration: line-through;
    color: var(--color-content3);
}
.search-result-wrapper .all-result {
    border-top: 1px solid var(--color-border);
    padding-top: 16px;
    text-align: center;
}
.search-result-wrapper .all-result .btn {
    padding: 0;
    color: var(--color-primary);
}

body.search-active {
    position: relative;
}
body.search-active::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(var(--color-black-rgb), 0.8);
    z-index: 999;
}

/**************************************/
/* Search Form End
/**************************************/
/**************************************/
/* Dropdown list Start
/**************************************/
.dropdown-list {
    position: relative;
}
.dropdown-list .selected {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 18px;
    text-transform: capitalize;
    color: var(--color-heading);
    cursor: pointer;
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    text-transform: capitalize;
}
.dropdown-list .selected img {
    height: 16px;
    width: 16px;
    border-radius: 50%;
    -o-object-fit: cover;
    object-fit: cover;
}
.dropdown-list .selected::after {
    content: "\ea4e";
    font-family: "remixicon";
    font-size: 18px;
    position: relative;
    top: 0;
    right: 0;
    font-weight: var(--font-regular);
}
.dropdown-list .dropdown-item {
    list-style: none;
    position: absolute;
    left: 0;
    top: 170%;
    min-width: 110px;
    width: 100%;
    background: var(--color-white);
    border-radius: var(--radius);
    padding: 10px 12px;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    border: 1px solid rgba(0, 0, 0, 0.1019607843);
    -webkit-box-shadow: 0px 32px 50px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 0px 32px 50px 0px rgba(0, 0, 0, 0.1019607843);
    max-height: 152px;
    overflow-y: auto;
}
.dropdown-list .dropdown-item.active {
    opacity: 1;
    visibility: visible;
    top: 140%;
}
.dropdown-list .dropdown-item li a {
    font-family: var(--font-default);
    font-size: 12px;
    line-height: 100%;
    font-weight: var(--font-medium);
    color: var(--color-heading2);
    padding: 5px 0 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    cursor: pointer;
}
.dropdown-list .dropdown-item li a img {
    width: 16px;
    height: 11px;
    display: block;
    -o-object-fit: cover;
    object-fit: cover;
}
.dropdown-list .dropdown-item li a:hover {
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.dropdown-list .dropdown-item li:last-child a {
    border: none;
}

/**************************************/
/* Dropdown list End
/**************************************/
/*********************************
/* Offcanvas Menu Start
*********************************/
.custom-offcanvas {
    background: var(--color-white);
    width: 360px !important;
}
@media screen and (max-width: 375px) {
    .custom-offcanvas {
        width: 310px !important;
    }
}
.custom-offcanvas .offcanvas-header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 15px;
    border-bottom: 1px solid var(--color-border);
}
.custom-offcanvas .offcanvas-header .close-btn {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-red);
    background: none;
    border: none;
    outline: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}
.custom-offcanvas .offcanvas-header .title {
    font-family: var(--font-default);
    font-size: 22px;
    font-weight: var(--font-semibold);
    line-height: 31.2px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
}
.custom-offcanvas .offcanvas-header .brand-logo img {
    height: 32px;
}
.custom-offcanvas .offcanvas-nav-menu {
    margin-top: 16px;
}
.custom-offcanvas .offcanvas-nav-menu li {
    position: relative;
    list-style: none;
    padding: 10px 15px;
    border-bottom: 1px solid var(--color-border);
}
.custom-offcanvas .offcanvas-nav-menu li a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    line-height: 24px;
    letter-spacing: 0.5px;
    padding: 0;
    text-transform: capitalize;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
    text-transform: capitalize;
}
.custom-offcanvas .offcanvas-nav-menu li a .icon {
    width: 20px;
    height: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.custom-offcanvas .offcanvas-nav-menu li a .icon svg path {
    fill: var(--color-heading2);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.custom-offcanvas .offcanvas-nav-menu li a:hover,
.custom-offcanvas .offcanvas-nav-menu li a.active {
    color: var(--color-primary);
}
.custom-offcanvas .offcanvas-nav-menu li a:hover .icon svg path,
.custom-offcanvas .offcanvas-nav-menu li a.active .icon svg path {
    fill: var(--color-primary);
}
.custom-offcanvas .offcanvas-nav-menu li a:hover::after,
.custom-offcanvas .offcanvas-nav-menu li a.active::after {
    color: var(--color-primary) !important;
}
.custom-offcanvas .offcanvas-nav-menu li a.btn {
    background: var(--color-heading);
    color: var(--color-primary);
    display: block;
    padding: 10px 15px;
    border-radius: 0;
    text-align: left;
}
.custom-offcanvas .offcanvas-nav-menu li a.btn::after {
    content: "\ea6e" !important;
    color: var(--color-primary) !important;
    right: 15px !important;
}
.custom-offcanvas .offcanvas-nav-menu li:last-child a {
    margin-right: 0;
}
.custom-offcanvas .offcanvas-nav-menu li.has-dropdown .nav-link::after {
    content: "\ea4e";
    font-family: "remixicon";
    font-size: 18px;
    font-weight: var(--font-regular);
    color: var(--color-heading);
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.custom-offcanvas .offcanvas-nav-menu li .sub-menu {
    position: relative;
    background: var(--color-secondary);
    z-index: 99;
    padding: 10px 16px;
    margin-top: 8px;
    border-left: 2px solid #c9c9c9;
    max-height: 200px;
    overflow: auto;
    display: none;
}
.custom-offcanvas .offcanvas-nav-menu li .sub-menu li {
    padding: 0;
    border: none;
}
.custom-offcanvas .offcanvas-nav-menu li .sub-menu li a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    color: var(--color-heading);
    display: inline-block;
    line-height: 24px;
    letter-spacing: 0.5px;
    padding: 4px 0;
    text-transform: capitalize;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
    text-transform: capitalize;
    width: 100%;
    display: block;
}
.custom-offcanvas .offcanvas-nav-menu li .sub-menu li a:hover {
    color: var(--color-primary);
}
.custom-offcanvas .offcanvas-nav-menu li .sub-menu .sub-sub-menu {
    padding-left: 15px;
    border-left: 2px solid #c9c9c9;
    display: none;
}

/*********************************
/* Offcanvas Menu End
*********************************/
/*********************************
/* Shopping cart Offcanvas Start
*********************************/
.shoppingCart-offcanvas {
    padding: 16px 24px;
    width: 440px !important;
}
@media screen and (max-width: 575px) {
    .shoppingCart-offcanvas {
        width: 95% !important;
    }
}

.shoppingCard-empty {
    text-align: center;
}
.shoppingCard-empty .thumb {
    max-width: 250px;
    margin: 0 auto 20px;
}
.shoppingCard-empty .thumb border img {
    width: auto;
    height: auto;
    display: block;
}
.shoppingCard-empty .return-btn {
    border-top: 1px solid var(--color-border);
    padding-top: 40px;
    margin-top: 30px;
}
.shoppingCard-empty .return-btn .btn {
    width: 100%;
    padding: 14px;
}

.shoppingCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: var(--radius-10);
    border: 1px solid var(--color-border);
    margin-top: 20px;
}
.shoppingCard-thumb {
    background: var(--color-secondary);
    border-radius: var(--radius);
    width: 140px;
    height: 130px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
@media screen and (max-width: 479px) {
    .shoppingCard-thumb {
        width: 120px;
        height: 110px;
    }
}
.shoppingCard-thumb img {
    width: auto;
    max-width: 100px;
    height: auto;
    display: block;
}
@media screen and (max-width: 479px) {
    .shoppingCard-thumb img {
        max-width: 80px;
    }
}
.shoppingCard-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.shoppingCard-content .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 19.6px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    margin-bottom: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.shoppingCard-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.shoppingCard-content .meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px 16px;
    margin-bottom: 6px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.shoppingCard-content .meta span {
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-content);
    display: inline-block;
}
.shoppingCard-content .price {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: block;
}
.shoppingCard-bottom {
    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;
    margin-top: 14px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 5px;
}
.shoppingCard-bottom .quantity-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.shoppingCard-bottom .quantity {
    width: 92px;
    height: 31px;
    background: var(--color-primary);
    border-radius: 4px;
    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;
}
.shoppingCard-bottom .quantity button {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 18px;
    height: 100%;
    width: 25px;
    text-align: center;
}
.shoppingCard-bottom .quantity .qnttinput {
    background: transparent;
    text-align: center;
    border: none;
    outline: none;
    height: 100%;
    width: 30px;
}
.shoppingCard-bottom .stock-item {
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-heading2);
}
.shoppingCard-bottom .remove-btn {
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-heading2);
    background: transparent;
    border: none;
    outline: none;
    border-bottom: 1px solid var(--color-heading2);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.shoppingCard-bottom .remove-btn:hover {
    color: var(--color-red);
    border-color: var(--color-red);
}
.shoppingCard-subtotal {
    padding-top: 10px;
    padding-bottom: 20px;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}
.shoppingCard-subtotal li {
    list-style: none;
    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;
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 25.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading2);
    padding: 5px 0;
}
@media screen and (max-width: 479px) {
    .shoppingCard-subtotal li {
        font-size: 16px;
    }
}
.shoppingCard-total {
    list-style: none;
    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;
    font-size: 18px;
    font-weight: var(--font-semibold);
    line-height: 28px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    padding: 20px 0;
}
@media screen and (max-width: 479px) {
    .shoppingCard-total {
        font-size: 18px;
    }
}
.shoppingCard-button {
    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;
    border-top: 1px solid var(--color-border);
    padding-top: 30px;
}
.shoppingCard-button .btn {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 14px;
}

.no-eligible {
    font-size: 14px !important;
    line-height: 19px !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    background: rgba(255, 59, 48, 0.1019607843);
    border: 1px solid rgba(255, 103, 103, 0.5019607843);
    display: inline-block !important;
    margin-top: 10px;
}

/*********************************
/* Shopping cart Offcanvas End
*********************************/
/*********************************
/*  Banner Section Start
*********************************/
.banner-wrapper {
    /* width: calc(100% - 276px);
    margin-left: auto; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 20px;
    margin-top: 20px;
}
@media screen and (max-width: 1199px) {
    .banner-wrapper {
        display: block;
    }
}
@media screen and (max-width: 991px) {
    .banner-wrapper {
        /* display: -webkit-box;
    display: -ms-flexbox;
    display: flex; */
        width: 100%;
    }
}
@media screen and (max-width: 767px) {
    .banner-wrapper {
        display: block;
    }
}
.banner-wrapper .swiper-pagination {
    position: absolute;
    bottom: 59px !important;
    text-align: start;
    left: 35px !important;
}
@media screen and (max-width: 1199px) {
    .banner-wrapper .swiper-pagination {
        bottom: 40px !important;
    }
}
.banner-wrapper .swiper-pagination-bullet {
    height: 6px;
    width: 6px;
    background: var(--color-heading);
    border-radius: 50%;
    opacity: 1;
    margin: 0 !important;
    margin-right: 8px !important;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.banner-wrapper .swiper-pagination-bullet-active {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    background: var(--color-primary);
}

.banner__card {
    /* width: calc(100% - 382px); */
    width: calc(100% - 502px);
}

@media (max-width: 1199px) {
    .banner__card {
        width: 100%;
    }
}

.hero-text {
    background: #f3f3f3;
    font-family: var(--font-default);
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    /* padding: 59px 35px 150px; */
    padding: 40px;
    border-radius: var(--radius);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 462px;
}
@media screen and (max-width: 1199px) {
    .hero-text {
        min-height: 402px;
    }
}
@media screen and (max-width: 991px) {
    .hero-text {
        /* padding: 59px 30px 160px; */
        padding: 30px;
        min-height: 462px;
    }
}
@media screen and (max-width: 767px) {
    .hero-text {
        /* padding-bottom: 100px; */
        min-height: 402px;
    }
}
.hero-text .hero-content {
    max-width: 312px;
}
.hero-text .subtitle {
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-white);
    padding: 5px 10px;
    border-radius: 4px;
    margin-bottom: 10px;
    background: var(--color-coffee);
    display: inline-block;
    text-transform: capitalize;
}
.hero-text .title {
    /* font-size: 40px; */
    font-size: 34px;
    font-weight: var(--font-semibold);
    /* line-height: 54px; */
    line-height: 44px;
    letter-spacing: 0.5px;
    color: var(--color-coffee);
    margin-bottom: 12px;
    text-transform: capitalize;
}
@media screen and (max-width: 479px) {
    .hero-text .title {
        font-size: 30px;
        line-height: 41px;
    }
}
.hero-text .desc {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
}
.hero-text .desc span {
    color: var(--color-primary);
}
.hero-text .banner-btn {
    margin-top: 32px;
}
.hero-text .banner-btn .btn {
    padding: 10px 16px;
    background: var(--color-white);
    border-color: var(--color-white);
    color: var(--color-content2);
    transition: all ease .3s;
}

.hero-text .banner-btn .btn:hover {
    background: var(--color-heading);
    border-color: var(--color-heading);
    color: var(--color-white);
}

@media screen and (max-width: 1199px) {
    .heroAds-wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        gap: 20px;
        margin-top: 20px;
    }
}
@media screen and (max-width: 767px) {
    .heroAds-wrapper {
        display: block;
        margin: 0;
    }
}
.heroAds-single {
    background: #f3f3f3;
    border-radius: 6px;
    /* padding: 66px 32px; */
    padding: 30px 30px 30px 36px;
    position: relative;
    margin-bottom: 20px;
    /* width: 362px; */
    width: 482px;
    min-height: 220px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.heroAds-single:last-of-type {
    margin-bottom: 0;
}
@media screen and (max-width: 991px) {
    .heroAds-single {
        /* width: 312px; */
        width: 100%;
    }
}
/* @media screen and (max-width: 991px) {
  .heroAds-single {
    width: 312px;
  }
} */

@media screen and (max-width: 575px) {
    .hero-text {
        background-position: right;
    }
}

@media screen and (max-width: 375px) {
    .hero-text {
        background-position: right -35px center;
    }
}

@media screen and (max-width: 767px) {
    .heroAds-single {
        width: 100%;
        margin-top: 20px;
    }
}
.heroAds-single-item {
    font-family: var(--font-default);
}
.heroAds-single-item .subtitle {
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    display: block;
    margin-bottom: 6px;
}
.heroAds-single-item .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    /* color: #666f74; */
    color: var(--color-heading);
    margin-bottom: 0;
}
.heroAds-single-item .shop-btn {
    margin-top: 16px;
}
.heroAds-single-item .shop-btn .btn {
    padding: 7px 16px;
    background: var(--color-white);
    border-color: var(--color-white);
    color: var(--color-content2);
    transition: all ease .3s;
}

.heroAds-single-item .shop-btn .btn:hover {
    background: var(--color-heading);
    border-color: var(--color-heading);
    color: var(--color-white);
}
.heroAds-image {
    position: absolute;
    right: 0;
    bottom: 0;
    max-width: 160px;
}
.heroAds-image img {
    width: 100%;
    height: auto;
    display: block;
}

.banner__card .custom-navigation {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    /* background: blue; */
    width: auto;
    top: auto;
    bottom: 20px;
    transform: translate(-50%, 0%);
    left: 50%;
    z-index: 9;

}
.banner__card .custom-navigation .swiper-button-prev,
.banner__card .custom-navigation .swiper-button-next {
    position: initial;
    top: 0;
    left: 0;
    width: 35px;
    height: 35px;
    background: rgba(var(--color-black-rgb), 0.3);
    border: 1px solid transparent !important;
    color: var(--color-white);
    font-size: 18px;
}
.banner__card .custom-navigation .swiper-button-prev:hover,
.banner__card .custom-navigation .swiper-button-next:hover {
    background: var(--color-primary);
    border: 1px solid var(--color-primary);
}

.banner__card .custom-navigation .swiper-button-next.swiper-button-disabled,
.banner__card .custom-navigation .swiper-button-prev.swiper-button-disabled {
    opacity: 0.35 !important;
}

/*********************************
/*  Banner Section End
*********************************/
/*********************************
/*  Core Feature Start
*********************************/
.featureWrapper {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px 10px;
    border: 0.5px solid var(--color-border);
    border-radius: var(--radius);
    padding: 13px;
}
@media screen and (max-width: 1199px) {
    .featureWrapper {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media screen and (max-width: 991px) {
    .featureWrapper {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .featureWrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 479px) {
    .featureWrapper {
        grid-template-columns: repeat(1, 1fr);
    }
}
.featureWrapper .featureItem {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 8px;
    border-right: 1px solid var(--color-border);
    padding-right: 10px;
}
.featureWrapper .featureItem:last-of-type {
    border-right: none;
    padding-right: 0;
}
@media screen and (max-width: 1199px) {
    .featureWrapper .featureItem {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start;
    }
}
@media screen and (max-width: 575px) {
    .featureWrapper .featureItem {
        border: 1px solid var(--color-border);
        border-radius: var(--radius);
        padding: 10px;
    }
}
.featureWrapper .featureItem .icon {
    height: 24px;
    width: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.featureWrapper .featureItem .icon img {
    width: 24px;
    height: auto;
}
.featureWrapper .featureItem .title {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 17.8px;
    color: var(--color-heading2);
    margin-bottom: 0;
    white-space: nowrap;
}
@media screen and (max-width: 1199px) {
    .featureWrapper .featureItem .title {
        white-space: wrap;
    }
}

/*********************************
/*  Core Feature End
*********************************/
/*********************************
/*  Products Item Start
*********************************/
.productItem {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    padding: 16px;
    height: 100%;
}
.productItem .productThumb {
    height: 100%;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    aspect-ratio: 2.1/2.2;
}
@media screen and (max-width: 1440px) {
    .productItem .productThumb {
        aspect-ratio: 2.1/2;
    }
}
.productItem .productThumb img {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    max-width: 140px;
}
.productItem .productThumb-wrapper {
    position: relative;
    background: var(--color-secondary);
    border-radius: var(--radius);
    overflow: hidden;
    display: block;
}
.productItem .productThumb-wrapper .badge {
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 14.4px;
    letter-spacing: 0.2px;
    color: var(--color-white);
    padding: 4px 8px;
    border-radius: 4px;
    background: var(--color-green);
    position: absolute;
    top: 10px;
    left: 10px;
}
.productItem .productThumb-wrapper .badge-success {
    background: var(--color-success);
}
.productItem .productThumb-wrapper .badge-warning {
    background: var(--color-warning);
}
.productItem .productThumb-wrapper .badge-danger {
    background: var(--color-danger);
}
.productItem .productThumb-wrapper .product-actions {
    position: absolute;
    top: 10px;
    right: 10px;
}
.productItem .productThumb-wrapper .product-actions .action-btn {
    height: 32px;
    width: 32px;
    border: 1px solid var(--color-border);
    background: var(--color-white);
    border-radius: 50%;
    font-size: 17px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 6px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: absolute;
    right: 0;
}
.productItem .productThumb-wrapper .product-actions .action-btn:last-of-type {
    margin-bottom: 0;
}
.productItem .productThumb-wrapper .product-actions .action-btn.wishlist {
    color: #fa4549;
}
.productItem .productThumb-wrapper .product-actions .action-btn:nth-of-type(1) {
    top: -7px;
}
.productItem .productThumb-wrapper .product-actions .action-btn:nth-of-type(2) {
    top: 0px;
}
.productItem .productThumb-wrapper .product-actions .action-btn:nth-of-type(3) {
    top: 0px;
}
.productItem .productThumb-wrapper .product-actions .action-btn:nth-of-type(4) {
    top: 0px;
}
.productItem .productThumb-wrapper .cart-btn {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 16.8px;
    letter-spacing: 0.5px;
    color: var(--btn-txt-color);
    background: var(--btn-bg-color);
    display: block;
    text-align: center;
    padding: 12px 20px;
    position: absolute;
    bottom: -30px;
    width: 100%;
    border-radius: 0 0 6px 6px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    opacity: 0;
    visibility: hidden;
}
.productItem .product-content {
    margin-top: 17px;
}
.productItem .product-content .product-meta {
    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;
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    padding-bottom: 6px;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 16px;
}
.productItem .product-content .product-meta .product-status {
    font-weight: var(--font-regular);
    color: #115740;
}
.productItem .product-content .title {
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 18.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    margin-bottom: 12px;
    display: block;
    -webkit-line-clamp: 2;
}
.productItem .product-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.productItem .product-content .price {
    font-size: 16px;
    font-weight: var(--font-bold);
    line-height: 19.2px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.productItem .product-content .price del {
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 14.4px;
    color: var(--color-content);
}
.productItem .product-content .quickBtn {
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 19.2px;
    color: var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
}
.productItem:hover .productThumb-wrapper .product-actions .action-btn {
    opacity: 1;
    visibility: visible;
}
.productItem:hover
    .productThumb-wrapper
    .product-actions
    .action-btn:nth-of-type(1) {
    top: 0;
}
.productItem:hover
    .productThumb-wrapper
    .product-actions
    .action-btn:nth-of-type(2) {
    top: 38px;
}
.productItem:hover
    .productThumb-wrapper
    .product-actions
    .action-btn:nth-of-type(3) {
    top: 76px;
}
.productItem:hover
    .productThumb-wrapper
    .product-actions
    .action-btn:nth-of-type(4) {
    top: 114px;
}
.productItem:hover .price {
    opacity: 0;
    visibility: hidden;
}
.productItem:hover .quickBtn {
    opacity: 1;
    visibility: visible;
}
.productItem:hover .cart-btn {
    bottom: 0;
    opacity: 1;
    visibility: visible;
}

.sale-pagination {
    position: relative;
    bottom: -30px !important;
}

/*********************************
/*  Products Item End
*********************************/
/*********************************
/*  Quantity Item End
*********************************/
.quantity {
    width: 92px;
    height: 31px;
    background: var(--color-primary);
    border-radius: 4px;
    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;
}
.quantity button {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 18px;
    height: 100%;
    width: 25px;
    text-align: center;
    color: #666666;
}
.quantity .qnttinput {
    background: transparent;
    text-align: center;
    border: none;
    outline: none;
    height: 100%;
    width: 30px;
}

/*********************************
/*  Quantity Item End
*********************************/
/*********************************
/*  Products List Item Start
*********************************/
.productlistItem {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    padding: 16px 17px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 40px;
    margin-bottom: 20px;
    height: calc(100% - 20px);
}
@media screen and (max-width: 1440px) {
    .productlistItem {
        gap: 20px;
    }
}
@media screen and (max-width: 767px) {
    .productlistItem {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 575px) {
    .productlistItem {
        display: block;
    }
}
.productlistItem .productThumb {
    height: 200px;
    width: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
@media screen and (max-width: 767px) {
    .productlistItem .productThumb {
        width: 100%;
    }
}
.productlistItem .productThumb img {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    max-width: 140px;
}
.productlistItem .productThumb-wrapper {
    position: relative;
    background: var(--color-secondary);
    border-radius: var(--radius);
    overflow: hidden;
}
@media screen and (max-width: 767px) {
    .productlistItem .productThumb-wrapper {
        width: 100%;
    }
}
.productlistItem .productThumb-wrapper .badge {
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 14.4px;
    letter-spacing: 0.2px;
    color: var(--color-white);
    padding: 4px 8px;
    border-radius: 4px;
    background: var(--color-green);
    position: absolute;
    top: 10px;
    left: 10px;
}
.productlistItem .productThumb-wrapper .badge-success {
    background: var(--color-success);
}
.productlistItem .productThumb-wrapper .badge-warning {
    background: var(--color-warning);
}
.productlistItem .productThumb-wrapper .badge-danger {
    background: var(--color-danger);
}
.productlistItem .product-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-right: 1px solid var(--color-border);
    padding-right: 60px;
}
@media screen and (max-width: 1440px) {
    .productlistItem .product-content {
        padding-right: 20px;
        -webkit-box-flex: 1;
        -ms-flex: auto;
        flex: auto;
    }
}
@media screen and (max-width: 575px) {
    .productlistItem .product-content {
        padding-right: 0;
        border: none;
        width: 100%;
        margin-top: 20px;
    }
}
.productlistItem .product-content .product-meta {
    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;
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    padding-bottom: 6px;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 10px;
}
.productlistItem .product-content .product-meta .product-status {
    font-weight: var(--font-regular);
    color: #115740;
}
.productlistItem .product-content .title {
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
    display: block;
}
.productlistItem .product-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.productlistItem .product-content .feature-list li {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    display: block;
    margin-bottom: 10px;
    list-style-type: none;
}
.productlistItem .product-content .feature-list li:last-of-type {
    margin-bottom: 0;
}
.productlistItem .pricing-wrapper {
    text-align: center;
    padding-right: 20px;
}
@media screen and (max-width: 1440px) {
    .productlistItem .pricing-wrapper {
        padding-right: 0;
    }
}
@media screen and (max-width: 575px) {
    .productlistItem .pricing-wrapper {
        text-align: left;
        margin: 20px 0;
    }
}
.productlistItem .pricing-wrapper .price {
    font-size: 24px;
    font-weight: var(--font-semibold);
    line-height: 28.8px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 18px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.productlistItem .pricing-wrapper .price del {
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 19.2px;
    color: var(--color-content);
}
@media screen and (max-width: 575px) {
    .productlistItem .pricing-wrapper .price {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start;
    }
}
.productlistItem .pricing-wrapper .btn {
    padding: 12px 34px;
    margin: 20px 0;
    white-space: nowrap;
}
.productlistItem .product-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}
@media screen and (max-width: 1440px) {
    .productlistItem .product-actions {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
@media screen and (max-width: 575px) {
    .productlistItem .product-actions {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
}
.productlistItem .product-actions .action-btn {
    font-size: 14px;
    line-height: 16.8px;
    color: var(--color-heading);
    font-weight: var(--font-medium);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    border-right: 1px solid var(--color-border);
    padding-right: 15px;
}
.productlistItem .product-actions .action-btn:last-of-type {
    padding-right: 0;
    border: none;
}
@media screen and (max-width: 1440px) {
    .productlistItem .product-actions .action-btn {
        padding: 0;
        border: none;
    }
}
@media screen and (max-width: 575px) {
    .productlistItem .product-actions .action-btn {
        border-right: 1px solid var(--color-border);
        padding-right: 15px;
    }
}
.productlistItem .product-actions .action-btn i {
    font-size: 15px;
    height: 26px;
    min-width: 26px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #dadce0;
}

.sale-pagination {
    position: relative;
    bottom: -30px !important;
}

/*********************************
/*  Products List Item End
*********************************/
/*********************************
/*  Marquee Section Start
*********************************/
.marquee-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 144px;
    padding: 17px 0;
    -webkit-animation: slide-har 15s linear infinite;
    animation: slide-har 15s linear infinite;
    -webkit-transition: -webkit-animation-duration 300ms;
    transition: -webkit-animation-duration 300ms;
    transition: animation-duration 300ms;
    transition: animation-duration 300ms, -webkit-animation-duration 300ms;
}
@media screen and (max-width: 991px) {
    .marquee-wrapper {
        -webkit-animation: slide-har 10s linear infinite;
        animation: slide-har 10s linear infinite;
    }
}
@media screen and (max-width: 575px) {
    .marquee-wrapper {
        -webkit-animation: slide-har 6s linear infinite;
        animation: slide-har 6s linear infinite;
    }
}
.marquee-wrapper:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}
.marquee-wrapper .marquee-item {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    white-space: nowrap;
    position: relative;
}
.marquee-wrapper .marquee-item::before {
    content: "";
    position: absolute;
    right: -96px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 48px;
    height: 1px;
    background: var(--color-heading);
}
.marquee-wrapper .marquee-item .title {
    font-family: var(--font-default);
    font-size: 18px;
    font-weight: var(--font-medium);
    line-height: 26.1px;
    letter-spacing: 0.2px;
    text-align: center;
    color: var(--color-heading);
    margin-bottom: 0;
    display: block;
}

@-webkit-keyframes slide-har {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

@keyframes slide-har {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}
/*********************************
/*  Marquee Section End
*********************************/
/*********************************
/*  Deals Section Start
*********************************/
.deals-wrapper {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 40px 20px;
}
@media screen and (max-width: 1199px) {
    .deals-wrapper {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media screen and (max-width: 991px) {
    .deals-wrapper {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .deals-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 479px) {
    .deals-wrapper {
        grid-template-columns: repeat(1, 1fr);
    }
}
.deals-wrapper .promo-banner {
    grid-column: span 2;
}
@media screen and (max-width: 991px) {
    .deals-wrapper .promo-banner {
        grid-column: span 3;
    }
}
@media screen and (max-width: 767px) {
    .deals-wrapper .promo-banner {
        grid-column: span 2;
    }
}
@media screen and (max-width: 479px) {
    .deals-wrapper .promo-banner {
        grid-column: span 1;
    }
}

/*********************************
/*  Deals Section End
*********************************/
/*********************************
/*  categories Section Start
*********************************/
.categoriesItem {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    padding: 20px 20px 16px !important;
}
.categoriesItem .categoriesTitle {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 15px;
}
.categoriesItem .categoriesTitle a {
    color: currentColor;
    display: block;
}
.categoriesItem .categories-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 16px 0px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.categoriesItem .single-categories {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    max-width: calc(50% - 7px);
    -ms-flex-preferred-size: calc(50% - 7px);
    flex-basis: calc(50% - 7px);
}
.categoriesItem .single-categories .categories-thumb {
    background: var(--color-secondary);
    border-radius: var(--radius);
    height: 132px;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 10px;
    overflow: hidden;
}
.categoriesItem .single-categories .categories-thumb img {
    width: auto;
    height: auto;
    max-width: 100px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.categoriesItem .single-categories .title {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 14.4px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin-bottom: 0;
}
.categoriesItem .single-categories:hover .categories-thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.categoriesItem .show-btn {
    margin-top: 32px;
}

/*********************************
/*  categories Section End
*********************************/
/*********************************
/*  Campain Section Start
*********************************/
.campain-wrapper {
    overflow: hidden;
    border-radius: var(--radius-10);
    margin-bottom: 20px;
    height: calc(100% - 20px);
}

.campain-wrapper .campain-thumb {
    /* max-height: 220px; */
    display: block;
}

.campaign-details-thumb {
    aspect-ratio: 16/5;
}

.campain-wrapper .campain-thumb img {
    border-radius: var(--radius-10);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    overflow: hidden;
    height: 100%;
    object-fit: cover;
}

/* .custom-campain-thumb img{
    height: 220px !important;
    object-fit: fill !important;
} */

.campain-wrapper .campain-thumb img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/*********************************
/*  Campain Section End
*********************************/
/*********************************
/*  Brands Start
*********************************/
.brandItem {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    text-align: center;
    /* padding-top: 10px; */
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.brandItem-thumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    padding: 10px;
}
.brandItem-thumb img {
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    max-width: 100%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.brandItem-content {
    border-top: 1px solid var(--color-border);
    padding: 40px 15px 20px;
}
.brandItem-content .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 16px;
    color: #333333;
    margin-bottom: 0;
}
.brandItem:hover {
    border-color: rgba(var(--color-primary-rgb), 0.5);
}
.brandItem:hover img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}
.brandItem.style-two {
    padding: 10px 10px 20px;
    margin-bottom: 16px;
    height: calc(100% - 16px);
}
.brandItem.style-two .brandItem-thumb {
    background: var(--color-secondary);
    height: 150px;
    border-radius: 4px;
}
.brandItem.style-two .brandItem-content {
    border: none;
    padding: 0;
    margin-top: 16px;
}
.brandItem.style-two:hover {
    border-color: var(--color-primary);
    background: var(--color-secondary);
}
.brandItem.style-two:hover .brandItem-thumb {
    background: var(--color-white);
}

/*********************************
/*  Brands End
*********************************/
/*********************************
/*  Tabs Start
*********************************/
.tabs-filter .nav {
    gap: 15px 32px;
    border: none;
}
@media screen and (max-width: 991px) {
    .tabs-filter .nav {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}
.tabs-filter .nav-item:last-child .nav-link::after {
    display: none;
}
.tabs-filter .nav-link {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-heading);
    text-transform: capitalize;
    display: inline-block;
    padding: 11px 10px;
    border-radius: var(--radius);
    border: 1px solid transparent;
    background: transparent;
    -webkit-transform: var(--transition);
    transform: var(--transition);
    position: relative;
}
.tabs-filter .nav-link::after {
    content: "";
    width: 20px;
    height: 1px;
    background: var(--color-content);
    position: absolute;
    right: -27px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.tabs-filter .nav-link:hover,
.tabs-filter .nav-link.active {
    background: rgba(var(--color-primary-rgb), 0.1);
    border-color: var(--color-primary);
}

.grid-5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 40px 20px;
}
@media screen and (max-width: 1199px) {
    .grid-5 {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media screen and (max-width: 991px) {
    .grid-5 {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .grid-5 {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}
@media screen and (max-width: 479px) {
    .grid-5 {
        grid-template-columns: repeat(1, 1fr);
    }
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 20px;
}
@media screen and (max-width: 991px) {
    .grid-4 {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .grid-4 {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}
@media screen and (max-width: 479px) {
    .grid-4 {
        grid-template-columns: repeat(1, 1fr);
    }
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
@media screen and (max-width: 991px) {
    .grid-3 {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .grid-3 {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
}
@media screen and (max-width: 575px) {
    .grid-3 {
        grid-template-columns: repeat(1, 1fr);
    }
}

.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
@media screen and (max-width: 479px) {
    .grid-2 {
        grid-template-columns: repeat(1, 1fr);
    }
}

/*********************************
/*  Tabs End
*********************************/
/*********************************
/*  Custon Tabs Start
*********************************/
.tabList-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 50px;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 24px;
}
@media screen and (max-width: 479px) {
    .tabList-item {
        gap: 10px 20px;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}
.tabList-item li {
    list-style: none;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 16px;
    color: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    padding-bottom: 10px;
    position: relative;
    cursor: pointer;
}
.tabList-item li::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background: var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.tabList-item li.active {
    color: var(--color-primary);
}
.tabList-item li.active::after {
    width: 100%;
}

/*********************************
/*  Custon Tabs End
*********************************/
/*********************************
/*  Table Start
*********************************/
.product-desc-table .desc {
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    color: var(--color-content);
    margin-bottom: 24px;
}

.table-container {
    width: 100%;
    max-width: auto;
    border: 1px solid var(--color-border);
}
.table-container table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}
.table-container table tbody {
    width: 50%;
    vertical-align: top;
    display: inline-block;
    border-right: 1px solid var(--color-border);
}
.table-container table tbody:last-of-type {
    border: none;
}
@media screen and (max-width: 575px) {
    .table-container table tbody {
        display: block;
        width: 100%;
        border: none;
    }
}
.table-container table tbody tr {
    display: block;
    border-bottom: 1px solid var(--color-border);
}
.table-container table tbody tr:last-of-type {
    border-bottom: none;
}
@media screen and (max-width: 575px) {
    .table-container table tbody tr {
        border-bottom: 1px solid var(--color-border) !important;
    }
}
.table-container table tbody tr td {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 14px;
    color: var(--color-heading2);
    padding: 17px;
}
.table-container table tbody tr td:nth-child(1) {
    font-weight: var(--font-semibold);
    color: var(--color-heading);
    width: 190px;
    border-right: 1px solid var(--color-border);
}
@media screen and (max-width: 991px) {
    .table-container table tbody tr td:nth-child(1) {
        width: 120px;
    }
}

/*********************************
/*  Table End
*********************************/
/*********************************
/*  Product review Start
*********************************/
.product-review-avarage .review-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 12px;
    display: block;
}
.product-review-avarage .avarage-rating {
    font-size: 23.98px;
    font-weight: 600;
    line-height: 23.98px;
    color: var(--color-heading);
    margin-bottom: 7px;
}
.product-review-avarage .rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    gap: 4px;
    color: var(--color-yellow);
}
.product-review-avarage .total-rating {
    font-size: 11.19px;
    font-weight: 400;
    line-height: 11.19px;
    color: var(--color-content2);
    margin-top: 12px;
}
.product-review-avarage .rating-step {
    border-top: 1px solid var(--color-border);
    margin-top: 15px;
    padding-top: 23px;
}
.product-review-avarage .rating-step .rating-steps {
    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: 15px;
}
.product-review-avarage .rating-step .rating-steps .progress {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 0;
    height: 12px;
}
.product-review-avarage .ttl-rating {
    font-size: 12.79px;
    font-weight: 500;
    line-height: 12.79px;
    color: var(--color-heading3);
}

@media screen and (max-width: 991px) {
    .review-form {
        margin-top: 40px;
    }
}
.review-form .title {
    font-size: 12px;
    font-weight: 400;
    line-height: 11.97px;
    margin-bottom: 14px;
    color: var(--color-heading2);
}
.review-form .review-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}
.review-form .review-title .rating {
    font-size: 18px;
    gap: 4px;
    color: #bcbcbc;
}

.image-upload {
    position: relative;
    margin-top: 14px;
}
.image-upload .form-control {
    width: 100%;
    font-size: 14px;
    color: #999999;
    line-height: 25px;
    border-radius: var(--radius);
}
.image-upload .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-border);
}
.image-upload .icon {
    position: absolute;
    right: 14px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #666666;
}

.preview-thumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 11px;
    margin-top: 14px;
}
.preview-thumb .single-thumb {
    position: relative;
}
.preview-thumb .single-thumb img {
    width: 74px;
    height: 74px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
}
.preview-thumb .single-thumb .close {
    height: 14px;
    width: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--color-white);
    color: #ff6767;
    font-size: 6px;
    -webkit-box-shadow: 0px -2.99px 11.22px 0px rgba(0, 0, 0, 0.1019607843);
    box-shadow: 0px -2.99px 11.22px 0px rgba(0, 0, 0, 0.1019607843);
    position: absolute;
    top: -7px;
    right: -7px;
    font-weight: 700;
    cursor: pointer;
}

.allReview-item {
    border-top: 1px solid #eeeeee;
    padding-top: 40px;
    margin-top: 32px;
}
.allReview-item .title {
    margin-bottom: 40px;
}
.allReview-item .review-item {
    background: var(--color-secondary);
    padding: 16px;
    border-radius: var(--radius-10);
    margin-bottom: 24px;
}
.allReview-item .review-item:last-of-type {
    margin-bottom: 0;
}
.allReview-item .review-item .review-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.allReview-item .review-item .review-content .rating {
    font-size: 14px;
    color: var(--color-yellow);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3px;
    margin-bottom: 10px;
}
.allReview-item .review-item .review-content .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 16px;
    color: var(--color-heading3);
    margin-bottom: 10px;
}
.allReview-item .review-item .review-content .title a {
    color: currentColor;
    display: block;
}
.allReview-item .review-item .review-content .date {
    font-size: 13px;
    font-weight: 500;
    line-height: 13px;
    color: var(--color-content);
}
.allReview-item .review-item .sub-replay {
    margin-top: 20px;
}
.allReview-item .review-item .sub-replay .review-item {
    padding: 20px 0 16px;
    background: transparent;
    border-radius: 0;
    border-top: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    gap: 20px;
    margin-bottom: 0;
}
.allReview-item .review-item .sub-replay .review-item .avatar img {
    height: 40px;
    width: 40px;
}
.allReview-item .review-item .sub-replay .review-item .review-desc .title {
    font-size: 14px;
    line-height: 16px;
}
.allReview-item .review-item .avatar img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: inline-block;
}
.allReview-item .review-item .review-para {
    margin-top: 16px;
}
.allReview-item .review-item .review-para p {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 24px;
    color: var(--color-heading2);
    margin-bottom: 0;
}
.allReview-item .review-item .reaction-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}
.allReview-item .review-item .avarage-reaction {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
    color: var(--color-heading3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.allReview-item .review-item .avarage-reaction i {
    font-size: 18px;
    color: var(--color-primary);
}
.allReview-item .review-item .avarage-reaction:hover {
    color: var(--color-primary);
}

/*********************************
/*  Product review End
*********************************/
/*********************************
/*  Full Ads Section Start
*********************************/
.fullAds-wrapper .thumb {
    display: block;
    border-radius: var(--radius-10);
}
.fullAds-wrapper .thumb img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--radius-10);
}

/*********************************
/*  Full Ads Section End
*********************************/
/*********************************
/*  Blog Section Start
*********************************/
.blogPost-item {
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    padding: 20px 16px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 30px;
    height: calc(100% - 30px);
}
.blogPost-item .blog-figure {
    position: relative;
    max-height: 260px;
    background: var(--color-secondary);
    border-radius: var(--radius);
    position: relative;
    min-height: 240px;
}
.blogPost-item .blog-figure img {
    position: relative;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.blogPost-item .post-date {
    position: absolute;
    bottom: -15px;
    right: 22px;
    font-size: 13px;
    font-weight: var(--font-semibold);
    line-height: 13px;
    color: var(--color-primary);
    background: var(--color-heading);
    padding: 10px 17px;
    border-radius: 4px;
}
.blogPost-item .blog-content {
    padding-top: 28px;
}
.blogPost-item .blog-content .title {
    font-family: var(--font-default);
    font-size: 18px;
    line-height: 24px;
    font-weight: var(--font-semibold);
    margin-bottom: 14px;
    color: var(--color-heading);
}
.blogPost-item .blog-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.blogPost-item .blog-content .title a:hover {
    color: var(--color-primary);
}
.blogPost-item .blog-content .blog-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
.blogPost-item .blog-content .blog-meta span {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 13px;
    color: var(--color-content2);
    display: inline-block;
    position: relative;
}
.blogPost-item .blog-content .blog-meta span::after {
    content: "";
    position: absolute;
    right: -11px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 5px;
    width: 5px;
    border-radius: 50%;
    background: var(--color-content2);
}
.blogPost-item .blog-content .blog-meta span a {
    display: inline-block;
    color: currentColor;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.blogPost-item .blog-content .blog-meta span a:hover {
    color: var(--color-primary);
}
.blogPost-item .blog-content .blog-meta span:last-of-type::after {
    display: none;
}
.blogPost-item .blog-content .blog-btn {
    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;
    margin-top: 30px;
}
.blogPost-item .blog-content .admin {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 13px;
    color: var(--color-content2);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 6px;
}
.blogPost-item .blog-content .admin:hover {
    color: var(--color-primary);
}
.blogPost-item:hover {
    border-color: rgba(var(--color-primary-rgb), 0.3);
}
.blogPost-item:hover .title a {
    color: var(--color-primary);
}

.postList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--color-border);
}
.postList:last-of-type {
    margin-bottom: 0;
    padding-bottom: 0;
    border: none;
}
.postList .thumb {
    width: 120px;
    height: auto;
    display: block;
}
.postList .thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 4px;
}
.postList .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: var(--font-default);
}
.postList .content .title {
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 22px;
    color: var(--color-heading);
    margin-bottom: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.postList .content .date {
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 12px;
    display: block;
    color: var(--color-heading2);
}
.postList:hover .content .title {
    color: var(--color-primary);
}

.blog-pagination {
    position: relative;
    bottom: -30px !important;
}

/*********************************
/*  Blog Section End
*********************************/
/*********************************
/*  Vendor Section Start
*********************************/
.vendorItem {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 15px 20px 20px;
    background: var(--colo-white);
    margin-top: 22px;
}
.vendorItem-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 16px;
}
.vendorItem .thumb {
    width: 77px;
    border-radius: 4px;
    position: relative;
    top: -35px;
    z-index: 9999;
}
.vendorItem .thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
}
.vendorItem .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.vendorItem .content .vendor-title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 19.2px;
    letter-spacing: 0.6px;
    color: var(--colo-heading);
    margin-bottom: 4px;
}
.vendorItem .content .vendor-item {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 14.4px;
    color: var(--color-content);
    display: block;
    margin: 0;
}
.vendorItem .vendor-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 9px;
}
.vendorItem .vendor-wrapper .single-item {
    display: block;
}
.vendorItem .vendor-wrapper .single-item img {
    border-radius: 4px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    border: 0.5px solid transparent;
}
.vendorItem .vendor-wrapper .single-item img:hover {
    border: 0.5px solid var(--color-primary);
}

/*********************************
/*  Vendor Section End
*********************************/
/*********************************
/*  Demo Start
*********************************/
.auctionItem {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding: 10px 20px 10px 10px;
    margin-bottom: 15px;
}
.auctionItem:last-of-type {
    margin-bottom: 0;
}
@media (max-width: 374px) {
    .auctionItem {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.auctionItem-thumb {
    width: 150px;
    height: 140px;
    background: var(--color-secondary);
    border-radius: var(--radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.auctionItem-thumb img {
    width: 100%;
    height: auto;
    max-width: 100px;
}
@media screen and (max-width: 1199px) {
    .auctionItem-thumb {
        height: 120px;
        width: 120px;
    }
}
@media (max-width: 374px) {
    .auctionItem-thumb {
        width: 100%;
    }
}
.auctionItem-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.auctionItem-content .title {
    font-family: var(--font-default);
    font-size: 13px;
    font-weight: var(--font-semibold);
    line-height: 18.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    margin-bottom: 6px;
}
.auctionItem-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.auctionItem-content .bid {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--color-content);
    display: block;
    margin-bottom: 6px;
}
.auctionItem-content .price {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: block;
}
.auctionItem-content .button-group {
    margin-top: 16px;
}
.auctionItem-content .button-group .btn {
    padding: 6px 10px;
    line-height: 19.6px;
    border-radius: 4px;
}

.auction-feature img {
    width: 100%;
    height: 100%;
    border-radius: var(--radius-10);
}
@media screen and (max-width: 767px) {
    .auction-feature {
        margin: 30px 0;
    }
}

/*********************************
/*  Demo End
*********************************/
/*********************************
/*  AdsProductItem Item Start
*********************************/
.classifiedAds-wrapper {
    padding: 24px 16px 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
}
@media screen and (max-width: 991px) {
    .classifiedAds-wrapper {
        margin-bottom: 20px;
    }
}
.classifiedAds-wrapper .title-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    gap: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 26px;
}
.classifiedAds-wrapper .title-wrapper .title-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
@media screen and (max-width: 1199px) {
    .classifiedAds-wrapper .title-wrapper .title-inner {
        gap: 8px;
    }
}
@media screen and (max-width: 479px) {
    .classifiedAds-wrapper .title-wrapper .title-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
.classifiedAds-wrapper .title-wrapper .title {
    font-family: var(--font-default);
    font-size: 18px;
    font-weight: var(--font-semibold);
    line-height: 21.6px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    text-transform: capitalize;
    margin-bottom: 0;
}
.classifiedAds-wrapper .title-wrapper .subtitle {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 19.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading2);
    text-transform: capitalize;
    margin-bottom: 0;
    border-left: 1px solid var(--color-border);
    padding-left: 16px;
}
@media screen and (max-width: 1199px) {
    .classifiedAds-wrapper .title-wrapper .subtitle {
        padding-left: 8px;
    }
}
@media screen and (max-width: 479px) {
    .classifiedAds-wrapper .title-wrapper .subtitle {
        border: none;
        padding: 0;
    }
}

.classifiedAds-flex.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
@media screen and (max-width: 1199px) {
    .classifiedAds-flex.grid-2 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .classifiedAds-flex.grid-2 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 400px) {
    .classifiedAds-flex.grid-2 {
        grid-template-columns: repeat(1, 1fr);
    }
}
.classifiedAds-flex.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
@media screen and (max-width: 1199px) {
    .classifiedAds-flex.grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 991px) {
    .classifiedAds-flex.grid-3 {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .classifiedAds-flex.grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 400px) {
    .classifiedAds-flex.grid-3 {
        grid-template-columns: repeat(1, 1fr);
    }
}

.adsProductItem {
    background: var(--color-white);
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.adsProductItem-wrapper {
    position: relative;
}
.adsProductItem-wrapper .badge {
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 14.4px;
    letter-spacing: 0.2px;
    color: var(--color-white);
    padding: 4px 8px;
    border-radius: 4px;
    background: #3c4043;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 9;
}
.adsProductItem-wrapper .badge-success {
    background: var(--color-success);
}
.adsProductItem-wrapper .badge-warning {
    background: var(--color-warning);
}
.adsProductItem-wrapper .badge-danger {
    background: var(--color-danger);
}
.adsProductItem .adsProductThumb {
    height: 100%;
    width: 100%;
    aspect-ratio: 1/1;
    border-radius: var(--radius);
    position: relative;
}
.adsProductItem .adsProductThumb img {
    width: 100%;
    height: auto;
    display: block;
    margin: auto;
    border-radius: var(--radius);
}
.adsProductItem-content {
    margin-top: 10px;
}
.adsProductItem-content .meta {
    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;
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 14.4px;
    letter-spacing: 0.2px;
    color: var(--color-content3);
    margin-bottom: 8px;
}
.adsProductItem-content .title {
    font-size: 13px;
    font-weight: var(--font-medium);
    line-height: 18.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    margin-bottom: 14px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.adsProductItem-content .title a {
    color: currentColor;
    background-image: -webkit-gradient(
        linear,
        left top,
        left bottom,
        color-stop(72%, transparent),
        color-stop(0, var(--color-heading))
    );
    background-image: linear-gradient(
        180deg,
        transparent 72%,
        var(--color-heading) 0
    );
    background-size: 0 3px;
    background-repeat: no-repeat;
    background-position: 0 100%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.adsProductItem-content .author {
    font-size: 12px;
    font-weight: var(--font-medium);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    color: var(--content);
    margin-bottom: 6px;
}
.adsProductItem-content .price {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 19.2px;
    color: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.adsProductItem:hover {
    border: 1px solid var(--color-primary);
}
.adsProductItem:hover .title a {
    background-size: 100% 3px;
}
.adsProductItem:hover .price {
    color: var(--color-primary);
}

/*********************************
/*  AdsProductItem Item End
*********************************/
/*********************************
/*  RecentView Start
*********************************/
.recentViewItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
@media (max-width: 374px) {
    .recentViewItem {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.recentViewItem-thumb {
    width: 120px;
    height: 120px;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.recentViewItem-thumb .thumb-inner {
    width: 100px;
    height: 100px;
    background: var(--color-secondary);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.recentViewItem-thumb .thumb-inner img {
    width: 100%;
    height: auto;
    max-width: 60px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.recentViewItem-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.recentViewItem-content .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 18.2px;
    letter-spacing: 0.2px;
    color: var(--color-heading);
    margin-bottom: 0px;
}
.recentViewItem-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.recentViewItem-content .price {
    font-size: 14px;
    font-weight: var(--font-bold);
    line-height: 16.8px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
}
.recentViewItem-content .price del {
    font-size: 12px;
    line-height: 14.4px;
    color: var(--color-content);
    font-weight: var(--font-regular);
}
.recentViewItem-content .rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: var(--font-regular);
    color: var(--color-content);
    line-height: 15.6px;
    letter-spacing: 0.2px;
    margin-bottom: 10px;
}
.recentViewItem-content .rating .count {
    color: var(--color-heading2);
    font-weight: var(--font-semibold);
    margin-right: 3px;
}
.recentViewItem-content .rating i {
    font-size: 13px;
    color: #dadce0;
    margin-right: 5px;
}
.recentViewItem-content .rating i.active {
    color: var(--color-rating);
}
.recentViewItem:hover .thumb-inner img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}
.recentViewItem:hover .title a {
    color: var(--color-primary);
}

.recent-pagination {
    position: relative;
    text-align: end;
    width: auto !important;
    bottom: 0 !important;
}

/*********************************
/*  RecentView End
*********************************/
/*********************************
/*  Meta Desc Start
*********************************/
.metaDesc-wrapper {
    border-top: 1px solid var(--color-border);
    padding-top: 32px;
}
.metaDesc-wrapper .wrapper-item {
    font-family: var(--font-default);
    margin-bottom: 20px;
}
.metaDesc-wrapper .wrapper-item:last-of-type {
    margin-bottom: 0;
}
.metaDesc-wrapper .wrapper-item .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0px;
}
.metaDesc-wrapper .wrapper-item .desc {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin-bottom: 0;
    margin-top: 20px;
}

/*********************************
/*  Meta Desc End
*********************************/
/*********************************
/*  Footer Section Start
*********************************/
.footer-section {
    background: var(--color-heading);
    padding-top: 60px;
}

.footer-top {
    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: 20px;
    padding: 28px 0;
    border-bottom: 1px solid rgba(var(--color-primary-rgb), 0.1);
}
@media screen and (max-width: 767px) {
    .footer-top {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.footer-top .socialLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
.footer-top .socialLink .title {
    color: var(--color-white);
}
.footer-top .socialLink .social-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    list-style: none;
}
.footer-top .socialLink .social-list li a {
    font-size: 15px;
    color: var(--color-white);
    display: inline-block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.footer-top .socialLink .social-list li a:hover {
    color: var(--color-primary);
}
.footer-top .title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 22px;
    color: var(--color-white);
    display: inline-block;
    margin-bottom: 0;
}
.footer-top .payment-gataway {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
@media screen and (max-width: 575px) {
    .footer-top .payment-gataway .title {
        display: none;
    }
}

.footer-top .payment-gataway .payment__icon {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.footer-top .payment-gataway .payment__icon img {
    height: 20px;
    width: auto;
}

.footer-slogun .main-title {
    font-size: 26px;
    font-weight: 600;
    line-height: 36px;
    color: var(--color-white);
    margin-bottom: 35px;
}

.applist {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 25px;
}
.applist a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-white) !important;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.applist a img {
    width: 20px;
}
.applist a:hover {
    color: var(--color-primary);
}

.widget-title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-white);
    margin-bottom: 10px;
}

.footer-widget p {
    color: #fff;
}

.footer-wrapper {
    padding: 32px 0;
}

.footer-widget .widget-list {
    list-style: none;
}
.footer-widget .widget-list.list-none li {
    padding-left: 0;
    margin-bottom: 18px;
}
.footer-widget .widget-list.list-none li a::before {
    display: none;
}
.footer-widget .widget-list li {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    list-style: none;
    padding: 0px 18px;
    margin-bottom: 10px;
    color: var(--color-white);
    text-transform: capitalize;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 10px;
}
.footer-widget .widget-list li .icon {
    height: 18px;
    width: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 20px;
}
.footer-widget .widget-list li a {
    position: relative;
    color: currentColor;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.footer-widget .widget-list li a::before {
    content: "";
    position: absolute;
    left: -18px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: var(--color-white);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.footer-widget .widget-list li a::after {
    content: "";
    position: absolute;
    width: 0;
    height: 1px;
    background: var(--color-white);
    bottom: -3px;
    right: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.footer-widget .widget-list li a:hover {
    color: var(--color-primary);
}
.footer-widget .widget-list li a:hover::before {
    background: var(--color-primary);
}
.footer-widget .widget-list li a:hover::after {
    width: 100%;
    right: auto;
    left: 0;
    background: var(--color-primary);
}
.footer-widget .widget-list li:last-of-type {
    margin-bottom: 0;
}
.footer-widget .desc {
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-white);
    margin-bottom: 0;
}

.footer-search {
    margin-top: 17px;
}
.footer-search .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-content);
    display: block;
    padding: 11.5px 13px;
    background: rgba(var(--color-white-rgb), 0.1);
    border: 1px solid rgba(var(--color-white-rgb), 0.1);
    border-radius: var(--radius);
}
.footer-search .form-control:focus {
    box-shadow: none;
}
.footer-search .btn {
    width: 100%;
    padding: 13px 23px;
    margin-top: 13px;
    border: 1px solid var(--color-white);
    background: var(--color-white);
    color: var(--color-heading3);
}
.footer-search .btn:hover {
    background: var(--color-primary);
    border: 1px solid var(--color-primary);
}

.footer-bottom {
    padding: 34px 0;
    border-top: 1px solid rgba(var(--color-primary-rgb), 0.1);
}
.footer-bottom .content p {
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 12px;
    color: var(--color-white);
    margin-bottom: 0;
}

/*********************************
/*  Footer Section End
*********************************/
/*********************************
/*  PopupModal Start
*********************************/
.PopupModal .modal-dialog {
    max-width: 1320px;
}
.PopupModal .modal-dialog .modal-content .modal-body {
    padding: 30px 10px;
}
.PopupModal .modal-header {
    position: absolute;
    top: 14px;
    right: 17px;
    z-index: 9;
    padding: 0;
    border: none;
}
.PopupModal .modal-header .close {
    background: transparent;
    border: none;
    outline: none;
    color: #ff3b30;
    font-size: 22px;
    z-index: 9;
    position: relative;
    width: 22px;
    height: 22px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}

/*********************************
/*  PopupModal End
*********************************/
/*********************************
/*  ProductDetail Start
*********************************/
.productThumb-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    position: relative;
}
@media screen and (max-width: 1199px) {
    .productThumb-wrapper {
        display: block;
    }
}
.productThumb-wrapper .swiper-button-prev,
.productThumb-wrapper .swiper-button-next {
    display: none;
}

.swiper .swiper-slide {
    height: auto;
}
.productThumb-wrapper .swiperSlide {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: auto;
    border-radius: 1px solid var(--color-border);
    border-radius: 8px;
    background: #f4f4f4;
}
.productThumb-wrapper .swiperThumb {
    width: 120px;
    height: 620px;
}
@media screen and (max-width: 1199px) {
    .productThumb-wrapper .swiperThumb {
        width: 100%;
        height: auto;
        margin-top: 20px;
    }
}
.productThumb-wrapper .swiperThumb .swiper-slide {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 10px;
    width: 120px;
    height: 140px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
@media screen and (max-width: 1199px) {
    .productThumb-wrapper .swiperThumb .swiper-slide {
        height: auto;
        width: auto;
    }
}
.productThumb-wrapper .swiperThumb .swiper-slide-thumb-active {
    border: 1px solid var(--color-primary);
}
.productThumb-wrapper .product-thumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.productThumb-wrapper .countdown {
    position: absolute;
    left: 155px;
    top: 17px;
    z-index: 9;
}
@media screen and (max-width: 1199px) {
    .productThumb-wrapper .countdown {
        left: 20px;
    }
}
.productThumb-wrapper .product-actions {
    position: absolute;
    top: 18px;
    right: 23px;
    z-index: 99;
}
.productThumb-wrapper .product-actions .action-btn {
    height: 32px;
    width: 32px;
    border: 1px solid var(--color-border);
    background: var(--color-white);
    border-radius: 50%;
    font-size: 17px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.productThumb-wrapper .product-actions .action-btn:last-of-type {
    margin-bottom: 0;
}
.productThumb-wrapper .product-actions .action-btn.wishlist {
    color: #fa4549;
}

.productThumb-wrapper .sliderContent {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    /* max-height: 500px; */
    padding: 50px;
}

.productThumb-wrapper .sliderContent img {
    max-height: 400px;
    object-fit: contain;
}

@media screen and (max-width: 991px) {
    .productDetail-wrapper {
        margin-top: 30px;
    }
}
.productDetail-wrapper .productDetail-title {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 28px;
    color: var(--color-heading);
}
@media screen and (max-width: 991px) {
    .productDetail-wrapper .productDetail-title {
        font-size: 18px;
    }
}
@media screen and (max-width: 479px) {
    .productDetail-wrapper .productDetail-title {
        font-size: 16px;
        line-height: 24px;
    }
}
.productDetail-wrapper .productDetail-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px 40px;
    margin-top: 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.productDetail-wrapper .productDetail-meta .meta-item {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    position: relative;
}
.productDetail-wrapper .productDetail-meta .meta-item::after {
    content: "";
    position: absolute;
    right: -20px;
    width: 1px;
    height: 14px;
    background: #999999;
}

.productDetail-wrapper .productDetail-meta .meta-item:last-of-type:after {
    /* display: none; */
}
.productDetail-wrapper .productDetail-meta .meta-item span {
    font-weight: var(--font-semibold);
}
.productDetail-wrapper .productDetail-meta .meta-item .rating {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
}
.productDetail-wrapper .productDetail-meta .meta-item .rating i {
    color: #fec800;
}
.productDetail-wrapper .productDetail-meta .meta-item .total-rating {
    font-size: 12px;
    line-height: 12px;
}
.productDetail-wrapper .productDetail-meta:last-child .meta-item::after {
    display: none;
}
.productDetail-wrapper .productDetail-price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    font-family: var(--font-montserrat);
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    color: var(--color-primary);
    margin: 5px 0 20px;
}
.productDetail-wrapper .productDetail-price del {
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 16px;
    color: #999999;
}
.productDetail-wrapper .product-attr {
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    padding: 20px 0;
}
.productDetail-wrapper .product-attr .list {
    font-family: var(--font-montserrat);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}
.productDetail-wrapper .product-attr .list:last-of-type {
    margin-bottom: 0;
}
.productDetail-wrapper .product-attr .list span {
    font-weight: var(--font-medium);
}

.product-attr-color {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}
.product-attr-color li {
    position: relative;
    height: 30px;
    width: 30px;
    border-radius: 4px;
    border: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}
.product-attr-color li label {
    cursor: pointer;
}
.product-attr-color li .box {
    height: 20px;
    width: 20px;
    border-radius: 2px;
    background: #999999;
}
.product-attr-color li .box.selected:after {
    content: "";
    display: block;
    width: 6px;
    height: 12px;
    border: solid var(--color-white);
    border-width: 0 1px 1px 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: relative;
    left: 7px;
    top: 2px;
}

.bg-gray {
    background: #999999 !important;
}

.bg-yellow {
    background: var(--color-primary) !important;
}

.bg-black {
    background: var(--color-heading) !important;
}

.product-attr-size {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}
.product-attr-size li {
    position: relative;
    height: 30px;
    width: 40px;
    border-radius: 4px;
    border: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: #333333;
}
.product-attr-size li.selected {
    border-color: var(--color-primary);
}

.total-price {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
    margin-top: 20px;
}
.total-price span {
    font-weight: var(--font-regular);
}

.product-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    gap: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 24px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.product-group .product-btn-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 14px;
}
@media screen and (max-width: 375px) {
    .product-group .product-btn-group .btn {
        padding: 11px 18px;
    }
}

.socialLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}
.socialLink.white * {
    color: var(--color-white) !important;
}
.socialLink .title {
    font-family: var(--font-montserrat);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    color: var(--color-heading);
    display: inline-block;
    margin-bottom: 0;
}
.socialLink .social-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    list-style: none;
}
.socialLink .social-list li a {
    font-size: 15px;
    color: var(--color-heading);
    display: inline-block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.socialLink .social-list li a:hover {
    color: var(--color-primary);
}

.product-store-wrapper {
    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;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 10px;
    margin-top: 30px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 479px) {
    .product-store-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}
.product-store-wrapper .product-store-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
    border-right: 1px solid var(--color-border);
    padding-right: 12px;
}
@media screen and (max-width: 479px) {
    .product-store-wrapper .product-store-info {
        border: none;
        padding: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.product-store-wrapper .product-store-info .icon {
    width: 78px;
    height: 78px;
    background: var(--color-secondary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.product-store-wrapper .product-store-info .icon img {
    width: 100%;
    height: auto;
    max-width: 62px;
}
.product-store-wrapper .product-store-info .content .title {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 10.98px;
    color: #333333;
    margin-bottom: 7px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
}
.product-store-wrapper .product-store-info .content .title span {
    font-weight: var(--font-semibold);
}
.product-store-wrapper .product-store-info .content .title .rating {
    color: var(--color-yellow);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 3px;
}
.product-store-wrapper .product-store-info .content .title .total-rating {
    margin-left: 10px;
    font-family: var(--font-montserrat);
    font-size: 12px;
    font-weight: 400;
    line-height: 9.41px;
    color: #333333;
}
.product-store-wrapper .product-store-info .visit-btn a {
    font-family: var(--font-default);
    font-size: 10.98px;
    font-weight: var(--font-semibold);
    line-height: 10.98px;
    color: var(--color-primary);
    display: inline-block;
}
.product-store-wrapper .chat-seller {
    font-family: var(--font-default);
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 10.98px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.product-store-wrapper .chat-seller img {
    width: 30px;
}
.product-store-wrapper .chat-seller:hover {
    color: var(--color-primary);
}

.productThumb-wrapper .vel-modal {
    background: rgba(var(--color-black-rgb), 0.8);
}
.productThumb-wrapper .vel-modal .vel-btns-wrapper .button {
    left: 12px;
    background: var(--color-white);
    opacity: 1;
}
.productThumb-wrapper .vel-modal .vel-btns-wrapper .button .vel-icon {
    fill: var(--color-black);
}
.productThumb-wrapper .vel-img {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.product-offer tr td {
    font-size: 14px;
    line-height: 14px;
    font-weight: 500;
    font-family: var(--font-montserrat);
}
.product-offer tr td .a-size-base.a-text-bold {
    font-weight: 600 !important;
}
/*********************************
/*  ProductDetail End
*********************************/
/*********************************
/*  Breadcrumb Section Start
*********************************/
.breadcrumb-section .breadcrumb-area .list {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    gap: 5px 20px;
}
.breadcrumb-section .breadcrumb-area .list li {
    position: relative;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 23.2px;
    text-transform: capitalize;
    color: var(--color-primary);
}
.breadcrumb-section .breadcrumb-area .list li.linked a,
.breadcrumb-section .breadcrumb-area .list li.linked {
    color: var(--color-black);
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    display: inline-block;
    cursor: pointer;
}
.breadcrumb-section .breadcrumb-area .list li.linked a:hover,
.breadcrumb-section .breadcrumb-area .list li.linked:hover {
    color: var(--color-primary);
}
.breadcrumb-section .breadcrumb-area .list li:not(:last-child)::after {
    content: ">";
    position: absolute;
    left: auto;
    right: -15px;
    top: 0%;
    width: auto;
    height: auto;
    color: var(--color-heading);
}

/*********************************
/*  Breadcrumb Section End
*********************************/
/*********************************
/* Product Filter Start
*********************************/
.productFilter-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 16px;
}
@media screen and (max-width: 991px) {
    .productFilter-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.productFilter-wrapper .productFilter-sidebar {
    width: 318px;
    height: auto;
    top: 20px;
}
@media screen and (max-width: 1199px) {
    .productFilter-wrapper .productFilter-sidebar {
        width: 290px;
    }
}
@media screen and (max-width: 991px) {
    .productFilter-wrapper .productFilter-sidebar {
        width: 100%;
        position: static !important;
        top: 0;
    }
}
.productFilter-wrapper .productFilter-item {
    width: calc(100% - 318px);
}
@media screen and (max-width: 1199px) {
    .productFilter-wrapper .productFilter-item {
        width: calc(100% - 290px);
    }
}
@media screen and (max-width: 991px) {
    .productFilter-wrapper .productFilter-item {
        width: 100%;
    }
}

.filter-range .selected-range-display {
    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;
    color: #eeeeee;
}
.filter-range .selected-range-display .form-group .form-control,
.filter-range .selected-range-display span {
    border: 1px solid var(--color-border);
    border-radius: 4px;
    width: 125px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px;
    font-family: var(--font-default);
    font-size: 15px;
    font-weight: var(--font-regular);
    line-height: 18px;
    color: var(--color-content2);
    text-align: center;
}
.filter-range .slider-container {
    position: relative;
    margin-top: 22px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
}
.filter-range .slider-container .slider {
    width: 100%;
    -moz-appearance: none;
    appearance: none;
    height: 5px;
    background: rgba(var(--color-primary-rgb), 0.4);
    border-radius: 30px 0 0 30px;
    outline: none;
    -webkit-appearance: none;
    /* position: absolute;
  top: 0; */
    pointer-events: none;
}
.filter-range .slider-container .slider:last-of-type {
    /* background: transparent; */
    border-radius: 0 30px 30px 0;
}
.filter-range .slider-container .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 16px;
    background: var(--color-white);
    border: 3px solid var(--color-primary);
    border-radius: 50%;
    pointer-events: auto;
    cursor: pointer;
    z-index: 999;
}

.filterList {
    max-height: 330px;
    overflow: hidden;
    overflow-y: auto;
}
.filterList li {
    list-style: none;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
    padding-right: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.filterList li label {
    color: currentColor;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-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;
    width: 100%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    cursor: pointer;
}

.filterList li a {
    color: currentColor;
}
.filterList li a:hover {
    color: var(--color-primary);
}

.filterList li span {
    font-size: 11.2px;
    font-weight: var(--font-bold);
    line-height: 16px;
    letter-spacing: 0.4px;
    background: var(--color-primary);
    color: var(--color-heading);
    padding: 4px 10px;
    height: 24px;
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    /* opacity: 0;
  visibility: hidden; */
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.filterList li:last-of-type {
    margin-bottom: 0;
}
.filterList li.active label,
.filterList li:hover label {
    color: var(--color-primary);
}
.filterList li.active label span,
.filterList li:hover label span {
    opacity: 1;
    visibility: visible;
}

.filterList.checkbox li input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    background-color: transparent;
    border: 1px solid var(--color-content3);
    padding: 0;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border-radius: 4px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    transition: background 0.3s ease;
}

.filterList.checkbox li input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 5.5px;
    top: 2px;
    width: 5.5px;
    height: 10px;
    border: solid var(--color-primary);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.filterList.checkbox li input[type="checkbox"]:checked {
    border-color: var(--color-primary);
}
.filterList.checkbox li:checked {
    color: var(--colo-primary);
}

.filterList.checkbox li label {
    position: relative;
    /* padding-left: 26px; */
    cursor: pointer;
}

.filterList.checkbox li label img {
    width: auto;
    height: 16px;
}
.filterList.tagItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 10px;
}
.filterList.tagItem li {
    margin: 0;
    font-size: 15px;
    font-weight: var(--font-regular);
    line-height: 16px;
    background: var(--color-secondary);
    border-radius: 4px;
    padding: 7px 12px;
}
.filterList.color {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 12px;
}
.filterList.color li {
    margin: 0;
    padding: 0;
}
.filterList.color li.active label {
    position: relative;
}
.filterList.color li.active label::after {
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    left: 11px;
    width: 7px;
    height: 11px;
    border: solid var(--color-heading);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.filterList.color li .colorBox {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    border: 1px solid var(--color-border);
}

.social-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.social-icon li {
    list-style: none;
}
.social-icon li a {
    height: 50px;
    width: 50px;
    border-radius: var(--radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--color-secondary);
}

.searchInput {
    position: relative;
}
.searchInput .form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 30px !important;
}
.searchInput button {
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: transparent;
    border: none;
    outline: none;
    color: var(--color-heading2);
    height: 20px;
    width: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 9;
}
.searchInput button:focus {
    color: var(--color-heading2);
}

/*********************************
/* Product Filter End
*********************************/
/*********************************
/* Product Filter Thumb Start
*********************************/
.productFilter-ads .ads-thumb {
    display: block;
}
.productFilter-ads .ads-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--radius-10);
}

/*********************************
/* Product Filter Thumb End
*********************************/
/*********************************
/* Product Filter Select Start
*********************************/
.productFilter-title {
    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: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--color-border);
    margin-top: 32px;
}
@media screen and (max-width: 767px) {
    .productFilter-title {
        gap: 15px;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 767px) {
    .productFilter-title .title-wrap {
        -webkit-box-ordinal-group: -2;
        -ms-flex-order: -3;
        order: -3;
    }
}
.productFilter-title .title-wrap .title {
    font-size: 18px;
    font-weight: var(--font-medium);
    line-height: 18px;
    color: var(--color-heading);
    margin-bottom: 12px;
    display: block;
}
.productFilter-title .title-wrap .showItem {
    font-size: 15px;
    font-weight: 400;
    line-height: 15px;
    color: #5f6368;
    display: block;
    margin: 0;
}

.filterRight {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px;
    margin-left: auto;
}
@media screen and (max-width: 767px) {
    .filterRight {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
    }
}

.filterOption {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}
@media screen and (max-width: 479px) {
    .filterOption {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        font-size: 14px;
        gap: 8px;
    }
}

.filterOption .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    transition: var(--transition);
    /* border: none; */
    padding: 5px 10px;
}
.filterOption .vue-select {
    width: auto !important;
}
.filterOption .vue-select .menu {
    width: 166px !important;
    border: 1px solid var(--color-primary) !important;
    border-radius: var(--radius) !important;
    margin-top: 4px !important;
}
@media screen and (max-width: 479px) {
    .filterOption .vue-select .menu {
        width: 100% !important;
    }
}
.filterOption .vue-select .control {
    border-radius: 4px !important;
    width: 105px !important;
    padding: 5px 5px 5px 10px;
}
@media screen and (max-width: 479px) {
    .filterOption .vue-select .control {
        width: 130px !important;
    }
}
.filterOption .vue-select .control .single-value {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: absolute;
    width: 100%;
    color: var(--color-heading3);
}
.filterOption .vue-select .control button.clear-button {
    display: none !important;
}
.filterOption .vue-select .control.focused {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-color: var(--color-primary) !important;
}

.listGrid-view {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}
@media screen and (max-width: 767px) {
    .listGrid-view {
        -webkit-box-ordinal-group: -2;
        -ms-flex-order: -3;
        order: -3;
    }
}
.listGrid-view .grid,
.listGrid-view .list {
    width: 20px;
    height: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}
.listGrid-view .grid svg path,
.listGrid-view .list svg path {
    stroke: var(--color-heading3);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.listGrid-view .grid svg:hover path,
.listGrid-view .list svg:hover path {
    stroke: var(--color-primary);
}
.listGrid-view .grid.active svg path,
.listGrid-view .list.active svg path {
    stroke: var(--color-primary);
}

.filterShow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding-top: 16px;
}
.filterShow .showTitle {
    font-size: 15px;
    font-weight: var(--font-regular);
    line-height: 15px;
    color: var(--color-heading3);
    margin-bottom: 0;
    white-space: nowrap;
}
.filterShow-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    overflow: hidden;
}
.filterShow .filterList {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    overflow: auto;
    cursor: -webkit-grab;
    cursor: grab;
}
.filterShow .filterList li {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 15px;
    color: var(--color-heading3);
    border-radius: 4px;
    border: 1px solid var(--color-border);
    padding: 6px 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
}
.filterShow .filterList li .close {
    font-size: 12px;
    height: 15px;
    width: 15px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color-primary);
    cursor: pointer;
}
.filterShow .clear-btn {
    color: var(--color-primary);
    display: inline-block;
    white-space: nowrap;
}

/*********************************
/* Product Filter Select End
*********************************/
/*********************************
/* Custom Select Start
*********************************/
.customDropdown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
    position: relative;
}
.customDropdown .title {
    font-size: 16px;
    font-weight: 500;
    line-height: 15px;
    color: var(--color-heading3);
    margin: 0;
}
.customDropdown .dropdownItem {
    border: 1px solid var(--color-border);
    border-radius: 4px;
    background: var(--color-white);
    padding: 3.5px 20px;
    min-width: 127px;
    position: relative;
}
.customDropdown .dropdownItem::after {
    content: "\ea4d";
    font-family: "remixicon";
    font-size: 20px;
    font-weight: var(--font-regular);
    color: currentColor;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.customDropdown .dropdownItem .selected {
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    color: var(--color-heading3);
    position: relative;
}
.customDropdown .dropdownItem .filterList {
    width: 190px;
    background: var(--color-white);
    border: 1px solid var(--color-primary);
    border-radius: var(--radius);
    padding: 16px;
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: 10px;
    z-index: 99;
}
.customDropdown .dropdownItem .filterList li {
    padding-right: 0;
}
.customDropdown .dropdownItem .filterList li.active label {
    color: var(--color-primary);
}
.customDropdown .dropdownItem .filterList li.active label::before {
    background: var(--color-primary);
    border-color: var(--color-primary);
}
.customDropdown .dropdownItem .filterList li.active label::after {
    top: 4px;
    border-color: var(--color-heading);
}
.customDropdown .dropdownItem .filterList label {
    color: var(--color-content);
    white-space: nowrap;
}
.customDropdown .dropdownItem .filterList label::before {
    border-radius: 2px;
}

/*********************************
/* Custom Select End
*********************************/
/*********************************
/* Accordion Start
*********************************/
.accordion-item {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    margin-bottom: 20px;
}
.accordion-item:last-of-type {
    margin-bottom: 0;
}
.accordion-header .accordion-button {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    background: var(--color-secondary);
    border-radius: var(--radius);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    padding: 16px;
    padding-right: 40px;
    border: none;
}
.accordion-header .accordion-button:focus {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.accordion-header .accordion-button:not(.collapsed) {
    background: var(--color-secondary);
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    border-radius: 6px 6px 0 0;
}
.accordion-header .accordion-button:not(.collapsed)::after {
    content: "\f1ae";
}
.accordion-header .accordion-button::after {
    content: "\ea12";
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-family: "remixicon";
    font-weight: 400;
    font-size: 19px;
    background: none;
    height: auto;
    width: auto;
}
.accordion-body {
    padding: 20px 16px;
}

.payment-accordion .accordion-item {
    padding: 0 16px;
    border-radius: 0 !important;
    border: none;
    background-color: transparent;
}
.payment-accordion .accordion-header .accordion-button {
    font-size: 14px;
    line-height: 20px;
    padding: 0;
    padding-left: 28px;
}
.payment-accordion .accordion-header .accordion-button::after {
    left: 0;
}
.payment-accordion .accordion-body {
    border: 1px solid var(--color-border);
    border-width: 0 1px 0;
}
.payment-accordion .addressForm {
    padding-top: 0;
    border: none;
}

.faq-accordion .accordion-item {
    border: none;
}
.faq-accordion .accordion-item.active {
    background: rgba(var(--color-primary-rgb), 0.06);
    border-radius: 12px;
    border: 1px solid var(--color-primary);
}
.faq-accordion .accordion-item.active .accordion-button {
    color: var(--color-primary);
}
.faq-accordion .accordion-header .accordion-button {
    font-size: 18px;
    line-height: 26px;
    background: transparent;
    border-radius: 12px;
    padding: 16px 20px;
    padding-right: 40px;
}
@media screen and (max-width: 575px) {
    .faq-accordion .accordion-header .accordion-button {
        font-size: 16px;
        line-height: 20px;
    }
}
.faq-accordion .accordion .accordion-body {
    padding: 0 20px 20px;
}
.faq-accordion .accordion .accordion-body .desc {
    font-size: 16px;
    line-height: 24px;
}
@media screen and (max-width: 575px) {
    .faq-accordion .accordion .accordion-body .desc {
        font-size: 14px;
        line-height: 22px;
    }
}

/*********************************
/* Accordion End
*********************************/
/*********************************
/* Step Progress Start
*********************************/
.step-progress {
    position: relative;
    max-width: 520px;
    margin: auto;
    padding-bottom: 70px;
}
.step-progress .nav {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.step-progress .step {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 16px;
    color: #3c4043;
    cursor: pointer;
    background: transparent;
    border: none;
    outline: none;
}
@media screen and (max-width: 400px) {
    .step-progress .step {
        font-size: 13px;
    }
}
.step-progress .step .icon {
    margin-bottom: 12px;
}
.step-progress .step .icon svg {
    width: 24px;
    height: 24px;
}
@media screen and (max-width: 479px) {
    .step-progress .step .icon svg {
        width: 18px;
        height: 20px;
    }
}
.step-progress .step .icon svg path {
    fill: #3c4043;
}
.step-progress .step.active {
    color: var(--color-primary);
}
.step-progress .step.active .icon svg path {
    fill: var(--color-primary);
}
.step-progress .progress-bar {
    position: absolute;
    bottom: 33px;
    left: 0;
    right: 0;
    height: 8px;
    width: 100%;
    background-color: var(--color-secondary);
}
.step-progress .progress {
    width: 33%;
    height: 100%;
    background-color: var(--color-primary); /* Yellow for active progress */
    -webkit-transition: width 0.3s;
    transition: width 0.3s;
    position: relative;
    border-radius: 30px;
}

/*********************************
/* Step Progress Start
*********************************/
/*********************************
/* Cart Section Start
*********************************/
.cart-header {
    background: var(--color-secondary);
    border-radius: 6px 6px 0 0;
    padding: 20px;
}
.cart-header .store-title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
}

.cart-form {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    margin-bottom: 16px;
}
.cart-form:last-of-type {
    margin-bottom: 0;
}
.cart-form table {
    width: 100%;
}
.cart-form table.table-v2 tbody tr .cart-pd-thumb .product-image {
    height: 90px;
    width: 70px;
    border: 1px solid var(--color-border);
}
.cart-form table.table-v2 tbody tr .cart-pd-thumb .product-image img {
    height: 64px;
}
.cart-form table.table-v2 tbody tr .product-card--inline {
    gap: 23px;
}
.cart-form table thead {
    border: 1px solid var(--color-border);
    border-width: 1px 0px;
    width: 100%;
}
.cart-form table thead tr {
    width: 100%;
}
.cart-form table thead tr th {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    border-right: 1px solid var(--color-border);
    padding: 16px;
    padding-right: 16px;
    text-transform: capitalize;
}
.cart-form table tbody {
    width: 100%;
}
.cart-form table tbody tr {
    border-bottom: 1px solid var(--color-border);
    width: 100%;
}
.cart-form table tbody tr td {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    padding: 10px 15px;
    border-right: 1px solid var(--color-border);
    text-transform: capitalize;
}
.cart-form table tbody tr td.cart-pd-thumb {
    padding: 10px 15px;
}
.cart-form table tbody tr td .product-id {
    font-weight: var(--font-bold);
    margin-bottom: 10px;
    display: block;
    color: var(--color-heading);
}
.cart-form table tbody tr td .product-price {
    font-weight: var(--font-medium);
    display: block;
    margin-top: 10px;
    color: var(--color-heading);
}
.cart-form table .product-card--inline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}
.cart-form table .product-card--inline .product-image {
    width: 60px;
    height: 44px;
    border-radius: 4px;
    background: var(--color-secondary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.cart-form table .product-card--inline .product-image img {
    width: auto;
    height: 34px;
    display: block;
}
.cart-form table .product-card--inline .product-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
@media screen and (max-width: 1440px) {
    .cart-form table .product-card--inline .product-content .product-title {
        width: 280px;
    }
}
.cart-form .action-btn {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 400;
    line-height: 10.14px;
    color: #ff6767;
    border: none;
    outline: none;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 9px;
}
.cart-form .action-btn svg path {
    stroke: #ff6767;
}
.cart-form .total-price {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: inline-block;
    margin: 0;
    padding: 21px 15px;
    width: 100%;
}
.cart-form .action-wrapper {
    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;
    padding: 11px 16px;
    border-top: 1px solid var(--color-border);
}
@media screen and (max-width: 767px) {
    .cart-form .action-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
.cart-form .action-wrapper .coupon-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
@media screen and (max-width: 479px) {
    .cart-form .action-wrapper .coupon-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100%;
    }
}
.cart-order .action-wrapper .coupon-box .form-control,
.cart-form .action-wrapper .coupon-box .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: #999999;
    padding: 11px 15px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    width: 209px;
}
@media screen and (max-width: 479px) {
    .cart-form .action-wrapper .coupon-box .form-control {
        width: 100%;
    }
}
.cart-order
    .action-wrapper
    .coupon-box
    .form-control::-webkit-input-placeholder,
.cart-form
    .action-wrapper
    .coupon-box
    .form-control::-webkit-input-placeholder {
    color: #999999;
}
.cart-order .action-wrapper .coupon-box .form-control::-moz-placeholder,
.cart-form .action-wrapper .coupon-box .form-control::-moz-placeholder {
    color: #999999;
}
.cart-order .action-wrapper .coupon-box .form-control:-ms-input-placeholder,
.cart-form .action-wrapper .coupon-box .form-control:-ms-input-placeholder {
    color: #999999;
}
.cart-order .action-wrapper .coupon-box .form-control::-ms-input-placeholder,
.cart-form .action-wrapper .coupon-box .form-control::-ms-input-placeholder {
    color: #999999;
}
.cart-order .action-wrapper .coupon-box .form-control::placeholder,
.cart-form .action-wrapper .coupon-box .form-control::placeholder {
    color: #999999;
}
.cart-order .action-wrapper .coupon-box .form-control:focus,
.cart-form .action-wrapper .coupon-box .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}
.cart-form .action-wrapper .coupon-box .btn {
    padding: 13px 17px;
    line-height: 14px;
    white-space: nowrap;
}
@media screen and (max-width: 479px) {
    .cart-form .action-wrapper .coupon-box .btn {
        width: 100%;
    }
}
@media screen and (max-width: 479px) {
    .cart-form .action-wrapper .check-out {
        width: 100%;
    }
}
.cart-form .action-wrapper .check-out .btn {
    padding: 11px 14px;
}
@media screen and (max-width: 479px) {
    .cart-form .action-wrapper .check-out .btn {
        width: 100%;
    }
}

.cart-order {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
}
@media screen and (max-width: 991px) {
    .cart-order {
        margin-top: 30px;
    }
}
.cart-order .cart-subtotal {
    padding: 24px 20px;
}
.cart-order .cart-subtotal li {
    list-style: none;
    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;
    font-size: 14px;
    font-weight: 400;
    line-height: 9.94px;
    padding: 6px 0;
    margin-bottom: 18px;
}
.cart-order .cart-subtotal li:last-of-type {
    margin-bottom: 0;
    padding-top: 20px;
}
.cart-order .cart-subtotal li .value {
    font-weight: var(--font-medium);
    width: 90px;
    text-align: end;
}
.cart-order .cart-total {
    border-top: 1px solid var(--color-border);
    font-weight: var(--font-semibold) !important;
}
.cart-order .cart-btns {
    padding: 24px 20px;
    padding-top: 0;
}
.cart-order .cart-btns .btn {
    padding: 13px 23px;
    width: 100%;
}
.cart-order.v2 .cart-subtotal {
    padding: 16px;
}
.cart-order.v2 .cart-subtotal li {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 21px 0;
}
@media screen and (max-width: 479px) {
    .cart-order.v2 .cart-subtotal li {
        font-size: 14px;
    }
}
.cart-order.v2 .cart-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 24px;
}
@media screen and (max-width: 400px) {
    .cart-order.v2 .cart-btns {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px;
    }
}
.cart-order.v2 .cart-btns .btn {
    padding: 11px 8px;
    max-width: 170px;
}
@media screen and (max-width: 400px) {
    .cart-order.v2 .cart-btns .btn {
        max-width: 100%;
    }
}

.defaultCheck {
    padding: 16px;
    border: 1px solid var(--color-border);
    border-width: 0 1px 0 1px;
}

.shopPurchase {
    border-bottom: 1px solid var(--color-border);
    margin: 16px 16px 0;
}
.shopPurchase li {
    list-style: auto;
    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;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    padding: 13px 0;
}
@media screen and (max-width: 479px) {
    .shopPurchase li {
        font-size: 14px;
    }
}

/*********************************
/* Cart Section End
*********************************/
/*********************************
/* Address Start
*********************************/
.addressWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
    .addressWrapper {
        gap: 15px;
    }
}
.addressWrapper .customCheckbox label {
    border-bottom: 1px solid var(--color-border);
}

.addressItem {
    border: 1px solid var(--color-border);
    padding: 16px;
    padding-top: 0;
    margin-top: -1px;
    position: relative;
    min-height: 250px;
}
@media screen and (max-width: 767px) {
    .addressItem:nth-of-type(odd) {
        border-color: var(--color-border);
    }
}
.addressItem.active {
    border-color: var(--color-primary);
    background: rgba(var(--color-primary-rgb), 0.06);
}
@media screen and (max-width: 767px) {
    .addressItem {
        width: 100%;
    }
}
.addressItem .addressHeader {
    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;
    padding: 20px 0 18px;
    height: 60px;
    width: 100%;
}
.addressItem .addressHeader .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.addressItem .addressHeader .title svg {
    width: 18px;
}
.addressItem .addressHeader .badge-btn {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-primary);
    background: rgba(var(--color-primary-rgb), 0.1);
    border: 1px solid rgba(var(--color-primary-rgb), 0.2);
    padding: 0 3px;
    border-radius: 2px;
}
.addressItem .addressList {
    list-style: none;
}
.addressItem .addressList li {
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-top: 18px;
}
.addressItem .addressList li span {
    text-transform: capitalize;
}

.cart-form .subtitle {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
    padding: 20px 16px;
}
.cart-form .delivery-btn {
    padding-bottom: 20px;
    padding-left: 16px;
}
.cart-form .delivery-btn .btn {
    padding: 18px;
    max-width: 300px;
    width: calc(100% - 16px);
}
@media screen and (max-width: 479px) {
    .cart-form .delivery-btn .btn {
        padding: 13px;
    }
}

/*********************************
/* Address End
*********************************/
/*********************************
/* payment Item Satrt
*********************************/
.payment-wrapper {
    gap: 16px;
    padding: 16px;
    padding-top: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.paymentItem {
    position: relative;

    input[type="radio"] {
        display: none;
    }

    label {
        border: 1px solid var(--color-border);
        border-radius: var(--radius);
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--color-white);
        width: auto;
        height: 112px;
        cursor: pointer;

        img {
            width: auto;
            height: auto;
            display: block;
            max-width: 80px;
        }
    }

    input[type="radio"]:checked + label {
        background: rgba(var(--color-primary-rgb), 0.06);
        border: 1px solid var(--color-primary);
    }
}

/*********************************
/* payment Item End
*********************************/
/*********************************
/* Custom CheckBox Start
*********************************/
.customCheckbox input {
    display: none;
}
.customCheckbox input:checked + label::before {
    background: var(--color-primary);
    border-color: var(--color-primary);
}
.customCheckbox input:checked + label::after {
    content: "";
    display: block;
    position: absolute;
    top: 46%;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid var(--color-heading);
    border-width: 0 1.5px 1.5px 0;
    -webkit-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
}
.customCheckbox label {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.customCheckbox label::before {
    content: "";
    height: 16px;
    width: 16px;
    border-radius: 2px;
    border: 1px solid var(--color-border);
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
}

/*********************************
/* Custom CheckBox End
*********************************/
.addressForm {
    border-top: 1px solid var(--color-border);
    padding-top: 16px;
}

/*********************************
/* Purchase Confirm Start
*********************************/
.orderConfirm-wrapper {
    max-width: 400px;
    margin: auto;
}
.orderConfirm-wrapper .icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--color-primary);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 50px;
    margin-bottom: 24px;
}
@media screen and (max-width: 767px) {
    .orderConfirm-wrapper .icon {
        width: 60px;
        height: 60px;
        font-size: 40px;
        margin-bottom: 15px;
    }
}
.orderConfirm-wrapper .title {
    font-family: var(--font-default);
    font-size: 32px;
    font-weight: var(--font-semibold);
    line-height: 38.4px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
}
@media screen and (max-width: 767px) {
    .orderConfirm-wrapper .title {
        font-size: 22px;
        line-height: 32px;
        margin-bottom: 10px;
    }
}
.orderConfirm-wrapper .desc {
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin-bottom: 0;
}
.orderConfirm .order-details {
    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;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 30px 0;
    border: 1px dashed var(--color-content);
    border-radius: var(--radius);
    padding: 30px 60px;
}
@media screen and (max-width: 1199px) {
    .orderConfirm .order-details {
        padding: 30px;
    }
}
@media screen and (max-width: 991px) {
    .orderConfirm .order-details {
        gap: 20px;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
}
.orderConfirm .order-details .order-info {
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 19px;
}
@media screen and (max-width: 1199px) {
    .orderConfirm .order-details .order-info {
        font-size: 14px;
        line-height: 14px;
    }
}
@media screen and (max-width: 991px) {
    .orderConfirm .order-details .order-info {
        gap: 10px;
        -ms-flex-preferred-size: 30%;
        flex-basis: 30%;
    }
}
@media screen and (max-width: 767px) {
    .orderConfirm .order-details .order-info {
        gap: 10px;
        -ms-flex-preferred-size: 45%;
        flex-basis: 45%;
    }
}
@media screen and (max-width: 375px) {
    .orderConfirm .order-details .order-info {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    }
}
.orderConfirm .order-details .order-info.count {
    font-size: 30px;
    line-height: 100%;
    color: var(--color-primary);
}
@media screen and (max-width: 767px) {
    .orderConfirm .order-details .order-info.count {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    }
}
.orderConfirm .order-details .order-info span {
    font-size: 20px;
    color: var(--color-heading);
}
@media screen and (max-width: 1199px) {
    .orderConfirm .order-details .order-info span {
        font-size: 16px;
    }
}

.table-header {
    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;
    border-bottom: 1px solid var(--color-border);
    padding: 13px 0;
    margin: 0 16px;
}
.table-header .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
}

/*********************************
/* Purchase Confirm End
*********************************/
/*********************************
/*  Track Order Start
*********************************/
.track-order {
    padding: 40px 0 200px;
}
@media screen and (max-width: 991px) {
    .track-order {
        padding: 40px 0 60px;
    }
}

@media screen and (max-width: 767px) {
    .trackThumb {
        margin-bottom: 30px;
    }
}
.trackThumb img {
    width: 100%;
    height: 100%;
    display: block;
    aspect-ratio: 6.5/5.6;
    border-radius: var(--radius-10);
}

.track-content {
    max-width: 600px;
    margin-left: auto;
}
.track-content .title {
    font-family: var(--font-default);
    font-size: 32px;
    line-height: 38.4px;
    font-weight: var(--font-semibold);
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
}
@media screen and (max-width: 991px) {
    .track-content .title {
        font-size: 28px;
        line-height: 32px;
    }
}
.track-content .desc {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 26px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
}
@media screen and (max-width: 991px) {
    .track-content .desc {
        font-size: 14px;
    }
}
.track-content .track-form {
    margin-top: 32px;
}
@media screen and (max-width: 991px) {
    .track-content .track-form {
        margin-top: 20px;
    }
}
.track-content .track-form .btn {
    font-size: 14px;
    line-height: 14px;
    font-weight: var(--font-medium);
    padding: 12px 29px;
    margin-top: 16px;
}

/*********************************
/*  Track Order End
*********************************/
/*********************************
/*  Track Order Details Start
*********************************/
.tracking-header {
    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;
    padding-bottom: 32px;
    margin-bottom: 32px;
    border-bottom: 1px solid var(--color-border);
}
@media screen and (max-width: 991px) {
    .tracking-header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}
@media screen and (max-width: 575px) {
    .tracking-header .left {
        width: 100%;
    }
}
.tracking-header .title {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: var(--color-black);
    margin-bottom: 16px;
}
.tracking-header .search-option {
    border-radius: var(--radius-8);
    border: 1px solid var(--color-primary);
    width: 441px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    padding: 5px 7px;
}
@media screen and (max-width: 575px) {
    .tracking-header .search-option {
        width: 100%;
    }
}
.tracking-header .search-option .form-control {
    font-size: 16px;
    font-weight: 400;
    line-height: 28.8px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    padding: 0;
    padding-left: 9px;
    border: none;
    outline: none;
    background: transparent;
}
.tracking-header .search-option .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}
.tracking-header .search-option .btn {
    white-space: nowrap;
}
.tracking-header .desc {
    color: var(--color-heading);
    margin-bottom: 0;
}

.orderDetails {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
}
.orderDetails-header {
    background: var(--color-secondary);
    padding: 19px 15px;
    border-bottom: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: var(--radius) var(--radius) 0 0;
}
.orderDetails-header .title {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
}
.orderDetails-header .btn {
    padding: 0;
}

.timeline-wrapper {
    padding: 20px 16px;
}
.timeline-wrapper .order-timeline .timeline-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    padding-bottom: 18px;
    border-bottom: 1px solid var(--color-border);
}
.timeline-wrapper .order-timeline .timeline-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 86px;
    gap: 18px;
}
.timeline-wrapper .order-timeline .timeline-item:last-of-type .tracking-status {
    top: 0;
}
.timeline-wrapper
    .order-timeline
    .timeline-item:last-of-type
    .tracking-status-line {
    display: none;
}
.timeline-wrapper .order-timeline .date {
    font-family: Figtree;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: var(--color-heading2);
    text-align: end;
    margin-bottom: 0;
    min-width: 70px;
}
.timeline-wrapper .order-timeline .date span {
    display: block;
    margin-top: 12px;
}
.timeline-wrapper .order-timeline .statusItem .status {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: block;
    margin-bottom: 0;
}
.timeline-wrapper .order-timeline .statusItem .details {
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: var(--color-heading2);
    margin-top: 12px;
    margin-bottom: 0;
}
.timeline-wrapper .order-timeline .tracking-status {
    position: relative;
    left: 0;
    top: 30px;
}
.timeline-wrapper .order-timeline .tracking-status:last-of-type {
    display: none;
}
.timeline-wrapper .order-timeline .tracking-status-dot {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--color-white);
    position: relative;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1607843137);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1607843137);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.timeline-wrapper .order-timeline .tracking-status-dot i {
    background: var(--color-primary);
    width: 80%;
    height: 80%;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 12px;
}
.timeline-wrapper .order-timeline .tracking-status-line {
    display: block;
    margin: 0 auto;
    width: 1px;
    height: 77px;
    border-left: 1px dashed var(--color-primary);
    position: relative;
    top: 0;
    z-index: -1;
}
.timeline-wrapper .timeline-footer {
    font-family: Figtree;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    text-align: center;
    padding-top: 16px;
    border-top: 1px solid var(--color-border);
}
.timeline-wrapper .timeline-footer span {
    font-size: 16px;
    font-weight: var(--font-semibold);
    color: var(--color-primary);
    display: block;
}

.tracking-product {
    padding: 18px;
    border-radius: var(--radius);
    border: 1px solid var(--color-border);
    margin-top: 20px;
}
.tracking-product .shoppingCard {
    border: none;
    padding: 0;
    border-radius: 0;
}
@media screen and (max-width: 479px) {
    .tracking-product .shoppingCard {
        display: block;
    }
}
@media screen and (max-width: 479px) {
    .tracking-product .shoppingCard-thumb {
        width: 100%;
        height: 130px;
        margin-bottom: 20px;
    }
}
.tracking-product .shoppingCard-content .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.tracking-product .shoppingCard-content .meta {
    display: block;
}
.tracking-product .shoppingCard-content .meta .meta-flex {
    margin-bottom: 16px;
    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;
}
.tracking-product .shoppingCard-content .meta .meta-flex:last-of-type {
    margin-bottom: 0;
}
.tracking-product .button-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px 16px;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    padding-top: 16px;
    margin-top: 16px;
    border-top: 1px solid var(--color-border);
}
@media screen and (max-width: 375px) {
    .tracking-product .button-group {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .tracking-product .button-group .btn {
        width: 100%;
    }
}
.tracking-product .button-group .btn-pink {
    background: #ff6767;
    border-color: #ff6767;
    color: var(--color-white);
}
.tracking-product .button-group .btn-pink:hover {
    background: var(--color-heading);
    border-color: var(--color-heading);
    color: var(--color-white);
}

.active-badge {
    background: rgba(40, 180, 70, 0.1019607843);
    border: 1px solid rgba(40, 180, 70, 0.3019607843);
    padding: 4px;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 14px !important;
    color: #28b446 !important;
    border-radius: 2px;
}

/*********************************
/*  Track Order Details End
*********************************/
/*********************************
/*  Error Section Start
*********************************/
.errorPage-wrapper {
    max-width: 600px;
    margin: auto;
}
.errorPage-wrapper .errorPage-thumb img {
    width: auto;
    height: auto;
    display: block;
    max-width: 500px;
    margin: auto;
}
.errorPage-wrapper .errorPage-content {
    margin-top: 32px;
}
@media screen and (max-width: 991px) {
    .errorPage-wrapper .errorPage-content {
        margin-top: 20px;
    }
}
.errorPage-wrapper .errorPage-content .title {
    font-family: var(--font-default);
    font-size: 32px;
    line-height: 38.4px;
    font-weight: var(--font-semibold);
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
}
@media screen and (max-width: 991px) {
    .errorPage-wrapper .errorPage-content .title {
        font-size: 28px;
        line-height: 32px;
    }
}
.errorPage-wrapper .errorPage-content .desc {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-regular);
    line-height: 26px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin-bottom: 0;
}
@media screen and (max-width: 991px) {
    .errorPage-wrapper .errorPage-content .desc {
        font-size: 14px;
    }
}
.errorPage-wrapper .back-btn {
    margin-top: 32px;
}
.errorPage-wrapper .back-btn .btn {
    font-size: 14px;
    line-height: 14px;
    font-weight: var(--font-medium);
    padding: 12px 29px;
}

/*********************************
/*  Error Section End
*********************************/
/*********************************
/* All Categories Start
*********************************/
.allCategories-item {
    margin-bottom: 16px;
}
.allCategories-item .allCategories-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 25px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-10);
    padding: 16px 12px 16px 16px;
}
@media screen and (max-width: 1199px) {
    .allCategories-item .allCategories-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.allCategories-item .allCategories-inner .thumb {
    min-width: 200px;
    max-width: 200px;
    height: 190px;
    background: var(--color-secondary);
    border-radius: var(--radius);
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
@media screen and (max-width: 1440px) {
    .allCategories-item .allCategories-inner .thumb {
        min-width: 130px;
        width: 130px;
    }
}
@media screen and (max-width: 1199px) {
    .allCategories-item .allCategories-inner .thumb {
        min-width: 100%;
        max-width: 100%;
        width: 100%;
        height: auto;
    }
}
.allCategories-item .allCategories-inner .thumb img {
    width: 100%;
    height: 100%;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    object-fit: cover;
}
.allCategories-item .allCategories-list {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.allCategories-item .allCategories-list .title a {
    font-family: var(--font-default);
    font-size: 18px;
    font-weight: var(--font-medium);
    line-height: 18px;
    color: var(--color-heading);
    margin-bottom: 16px;
    display: block;
}
.allCategories-item .allCategories-list .global-list li {
    list-style: none;
    font-size: 14px;
    font-weight: 400;
    line-height: 15px;
    color: var(--color-heading);
    margin-bottom: 10px;
    position: relative;
    padding-left: 12px;
}
.allCategories-item .allCategories-list .global-list li a {
    color: currentColor;
    display: inline-block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.allCategories-item .allCategories-list .global-list li a:hover {
    color: var(--color-primary);
}
.allCategories-item .allCategories-list .global-list li::after {
    content: "\ea6d";
    font-family: "remixicon";
    font-size: 18px;
    font-weight: var(--font-regular);
    color: currentColor;
    position: absolute;
    left: -6px;
    top: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.allCategories-item .allCategories-list .global-list li:last-of-type {
    margin-bottom: 0;
}
.allCategories-item .allCategories-list .global-list li:hover .submenu {
    opacity: 1;
    visibility: visible;
}
.allCategories-item .allCategories-list .global-list .submenu {
    list-style: none;
    padding: 10px;
    margin: 0;
    width: 130px;
    position: absolute;
    top: 100%;
    left: 40px;
    background: var(--color-secondary);
    border-radius: var(--radius);
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.allCategories-item .allCategories-list .global-list .submenu li {
    margin: 0;
    padding: 5px;
    border-radius: 4px;
}
.allCategories-item .allCategories-list .global-list .submenu li a {
    padding: 0;
    line-height: 17px;
}
.allCategories-item .allCategories-list .global-list .submenu li::after {
    display: none;
}
.allCategories-item .allCategories-list .global-list .submenu li a:hover {
    background-color: rgba(var(--color-primary-rgb), 0.05);
}
.allCategories-item .allCategories-list .solid-btn {
    font-weight: 400;
    margin-top: 12px;
    display: block;
}
.allCategories-item:hover .thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/*********************************
/* All Categories End
*********************************/
/*********************************
/*  Store Section Start
*********************************/
.storeItem {
    padding: 16px;
    border-radius: var(--radius);
    border: 1px solid var(--color-border);
    background: var(--color-white);
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 30px;
    height: calc(100% - 30px);
}
.storeItem:hover {
    background: var(--color-secondary);
    border-color: var(--color-primary);
}
.storeItem-thumb {
    position: relative;
}
.storeItem-thumb .main-thumb {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 2.86/1.8;
    border-radius: 4px 4px 0 0;
}
.storeItem-thumb .storeLogo {
    height: 60px;
    width: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #fff;
    border-radius: 4px;
    position: absolute;
    top: 13px;
    right: 13px;
}
.storeItem-thumb .storeLogo img {
    width: auto;
    height: auto;
    display: block;
    max-width: 40px;
}
.storeItem-content {
    margin-top: 18px;
}
.storeItem-content .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading3);
    margin-bottom: 10px;
}
.storeItem-content .avarage-rating {
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 12px;
    color: var(--color-content2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 9px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 10px;
}
.storeItem-content .rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2px;
    list-style: none;
    color: var(--color-yellow);
    font-weight: 300;
}
.storeItem-content .storeItem-meta {
    font-size: 12px;
    font-weight: var(--font-semibold);
    line-height: 12px;
    color: var(--color-content2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 9px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.storeItem-content .storeItem-meta .product-count {
    border-right: 1px solid var(--color-content2);
    padding-right: 9px;
}

/*********************************
/*  Store Section End
*********************************/
/*********************************
/*  Srore Details Start
*********************************/
.storeBanner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 1;
    border-radius: 10px;
    overflow: hidden;
    padding: 66px;
    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: 20px;
}
@media screen and (max-width: 991px) {
    .storeBanner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
@media screen and (max-width: 767px) {
    .storeBanner {
        padding: 50px 30px;
    }
}
.storeBanner::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(var(--color-black-rgb), 0.6);
    z-index: -1;
}

.storeInfo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
}
@media screen and (max-width: 767px) {
    .storeInfo {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
    }
}
.storeInfo .storeLogo {
    height: 100px;
    width: 100px;
    background: var(--color-heading);
    border: 1px solid rgba(var(--color-primary-rgb), 0.5);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
@media screen and (max-width: 991px) {
    .storeInfo .storeLogo {
        height: 80px;
        width: 80px;
    }
}
.storeInfo .storeLogo img {
    width: auto;
    height: auto;
    display: block;
    max-width: 56px;
    border-radius: 50%;
}
.storeInfo .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.storeInfo .content .title {
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    letter-spacing: 0.5px;
    color: var(--color-white);
    margin-bottom: 12px;
}
.storeInfo .content .title i {
    display: inline-block;
    font-weight: 400;
    color: #4ac26b;
    padding-left: 5px;
}
.storeInfo .content .rating {
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    color: var(--color-white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
    .storeInfo .content .rating {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}
.storeInfo .content .rating .ratings {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3px;
    font-weight: 400;
    color: var(--color-primary);
}
.storeInfo .content .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.storeInfo .content .list .data {
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    color: var(--color-white);
    position: relative;
    padding-right: 10px;
}
.storeInfo .content .list .data::after {
    content: "";
    position: absolute;
    right: 0;
    height: 100%;
    width: 1px;
    background: var(--color-white);
}
.storeInfo .content .list .data:last-of-type {
    padding: 0;
}
.storeInfo .content .list .data:last-of-type::after {
    display: none;
}

.storeContact {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 18px;
}
@media screen and (max-width: 479px) {
    .storeContact {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
    }
}
.storeContact .followBtn {
    border-left: 1px solid var(--color-white);
    padding-left: 18px;
}
@media screen and (max-width: 479px) {
    .storeContact .followBtn {
        padding: 0;
        border: none;
    }
}
.storeContact .followBtn .btn {
    padding: 10px 38px;
}
.storeContact .followBtn .btn:hover {
    background: var(--color-white);
    border-color: var(--color-white);
    color: var(--color-heading);
}

/*********************************
/*  Srore Details End
*********************************/
/*********************************
/* Flash Sale Start
*********************************/
.flashSale-item {
    position: relative;
    padding: 16px;
    background: var(--color-white);
    border-radius: var(--radius-10);
    border: 1px solid var(--color-border);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 16px;
    height: calc(100% - 16px);
}
.flashSale-item:hover {
    border-color: var(--color-primary);
    background: var(--color-secondary);
}
.flashSale-item .flash-header {
    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: 15px;
    margin-bottom: 24px;
}
.flashSale-item .badge {
    background: var(--color-primary);
    color: var(--color-heading);
    font-size: 12px;
    font-weight: var(--font-regular);
    line-height: 14.4px;
    padding: 7px 12px;
    border-radius: 4px;
}
.flashSale-item .timer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}
.flashSale-item .timer .time-box {
    background: var(--color-heading);
    border-radius: 4px;
    width: 39px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.flashSale-item .timer .time-box p {
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 23.44px;
    margin: 0;
    color: var(--color-white);
}
.flashSale-item .timer .time-box span {
    font-size: 8px;
    font-weight: var(--font-semibold);
    line-height: 9.38px;
    letter-spacing: 0.2em;
    color: rgba(var(--color-white-rgb), 0.6);
}
.flashSale-item .flashSale-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 40px;
}
@media screen and (max-width: 479px) {
    .flashSale-item .flashSale-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 20px;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
    }
}
.flashSale-item .flashSale-inner .flashSaleThumb {
    max-width: 170px;
}
.flashSale-item .flashSale-inner .flashSaleThumb img {
    width: 100%;
    height: auto;
    display: block;
}
.flashSale-item .flashSale-inner .rating {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
    color: var(--color-yellow);
    margin-bottom: 10px;
}
.flashSale-item .flashSale-inner .title {
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    display: block;
    margin-bottom: 10px;
}
.flashSale-item .flashSale-inner .desc {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin-bottom: 0;
}
.flashSale-item .flashSale-inner .price {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 18px;
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 19.2px;
    color: var(--color-heading3);
    margin-top: 20px;
}
.flashSale-item .flashSale-inner .price .original-price {
    font-size: 13px;
    line-height: 15.6px;
    color: #888888;
    font-weight: var(--font-regular);
    text-decoration: line-through;
}

/*********************************
/* Flash Sale End
*********************************/
/*********************************
/* Contact Form Start
*********************************/
form .btn {
    padding: 10px 35px;
}

.contact-wrapper .contact-bg img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--radius-10);
}
.contact-wrapper .contact-inner {
    max-width: 1208px;
    margin: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    margin-top: -200px;
}
@media screen and (max-width: 1440px) {
    .contact-wrapper .contact-inner {
        margin: -140px 20px 0;
    }
}
@media screen and (max-width: 991px) {
    .contact-wrapper .contact-inner {
        margin-top: -100px;
    }
}
@media screen and (max-width: 767px) {
    .contact-wrapper .contact-inner {
        margin-top: -80px;
        display: block;
    }
}
.contact-wrapper .contact-inner .contact-form {
    background: var(--color-white);
    border-radius: 6px 0 0 6px;
    border: 1px solid var(--color-border);
    padding: 25px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
@media screen and (max-width: 767px) {
    .contact-wrapper .contact-inner .contact-form {
        border-radius: 6px 6px 0 0;
    }
}
.contact-wrapper .contact-inner .contact-form .contact-title {
    font-family: var(--font-default);
    font-size: 18px;
    font-weight: var(--font-medium);
    line-height: 18px;
    color: var(--color-heading);
    padding: 20px 0;
    border-bottom: 1px solid var(--color-border);
}
.contact-wrapper .contact-inner .contact-form .input-group {
    margin-top: 20px;
}
.contact-wrapper .contact-inner .contact-form .grid-2 {
    gap: 0 20px;
}
.contact-wrapper .contact-inner .contact-form .btn {
    padding: 11px 40px;
}
.contact-wrapper .contact-inner .contact-information {
    padding: 21px 45px;
    background: var(--color-primary);
    max-width: 438px;
    border-radius: 0 6px 6px 0;
}
@media screen and (max-width: 991px) {
    .contact-wrapper .contact-inner .contact-information {
        max-width: 335px;
    }
}
@media screen and (max-width: 767px) {
    .contact-wrapper .contact-inner .contact-information {
        max-width: 100%;
        border-radius: 0 0 6px 6px;
    }
}
@media screen and (max-width: 479px) {
    .contact-wrapper .contact-inner .contact-information {
        padding: 20px 25px;
    }
}
.contact-wrapper .contact-inner .contact-information .title {
    font-family: var(--font-default);
    font-size: 18px;
    font-weight: var(--font-medium);
    line-height: 18px;
    color: var(--color-heading);
    padding: 20px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--color-black);
}
.contact-wrapper .contact-inner .contact-information .address-list li {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 400;
    line-height: 25px;
    color: var(--color-heading);
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
}
.contact-wrapper
    .contact-inner
    .contact-information
    .address-list
    li:last-of-type {
    margin-bottom: 0;
}
.contact-wrapper .contact-inner .contact-information .address-list li i {
    font-size: 16px;
}
.contact-wrapper .contact-inner .contact-information .address-list li a {
    color: currentColor;
    display: inline-block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.contact-wrapper .contact-inner .contact-information .address-list li a:hover {
    color: var(--color-white);
}
.contact-wrapper .contact-inner .contact-information .social-icon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}
.contact-wrapper .contact-inner .contact-information .social-icon a {
    color: var(--color-heading);
    font-size: 18px;
}
.contact-wrapper .contact-inner .contact-information .map-area .title {
    border-top: 1px solid var(--color-heading);
    border-bottom: none;
}
.contact-wrapper
    .contact-inner
    .contact-information
    .map-area
    .map-location
    iframe {
    border: 0;
    width: 100%;
    height: 180px;
    border-radius: 4px;
}

.input-group {
    display: block;
}
.input-group label {
    display: block;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 10px;
    text-transform: capitalize;
}
.input-group .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: #999999;
    padding: 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius) !important;
    min-height: auto;
    width: 100%;
}
.input-group .form-control.focused,
.input-group .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}
.input-group .form-control::-webkit-input-placeholder {
    color: #999999;
    text-transform: capitalize;
}
.input-group .form-control::-moz-placeholder {
    color: #999999;
    text-transform: capitalize;
}
.input-group .form-control:-ms-input-placeholder {
    color: #999999;
    text-transform: capitalize;
}
.input-group .form-control::-ms-input-placeholder {
    color: #999999;
    text-transform: capitalize;
}
.input-group .form-control::placeholder {
    color: #999999;
    text-transform: capitalize;
}

/*********************************
/* Contact Form End
*********************************/
/*********************************
/* Select Start
*********************************/
.vue-select .control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: #999999;
    padding: 10px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    min-height: auto;
}
.vue-select .control.focused {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-color: var(--color-primary) !important;
    border-radius: 6px 6px 0 0;
}
.vue-select .control .single-value,
.vue-select .control input.search-input {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: #999999;
    padding: 0 !important;
    border: none;
}
.vue-select .control .single-value {
    padding: 0 !important;
    color: #999999;
}
.vue-select .menu {
    width: 100%;
    background: var(--color-white);
    border: 1px solid var(--color-primary) !important;
    border-radius: 0 0 6px 6px !important;
    margin-top: 0 !important;
    border-top: none !important;
}
.vue-select .menu .menu-option {
    font-family: var(--font-default) !important;
    font-size: 14px !important;
    font-weight: var(--font-regular) !important;
    line-height: 14px !important;
    color: var(--color-heading);
}
.vue-select .menu .menu-option:hover,
.vue-select .menu .menu-option.selected {
    background: rgba(var(--color-primary-rgb), 0.3) !important;
}
.vue-select .menu .menu-option.focused {
    background-color: #f1f1f1 !important;
}

/*********************************
/* Select End
*********************************/
/*********************************
/* About Section Start
*********************************/
.aboutThumb-wrapper {
    display: grid;
    grid-template-columns: 60% 40%;
    gap: 16px;
}
@media screen and (max-width: 575px) {
    .aboutThumb-wrapper {
        grid-template-columns: auto;
    }
}
.aboutThumb-wrapper .about-thumb {
    width: 100%;
    height: auto;
}
.aboutThumb-wrapper .about-thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 100%;
    border-radius: var(--radius);
}
.aboutThumb-wrapper .about-thumb:first-of-type {
    grid-row: span 2;
}

.aboutContent {
    margin-top: 40px;
}
.aboutContent .title {
    margin-bottom: 16px;
}
.aboutContent .desc {
    letter-spacing: normal;
    margin-bottom: 20px;
}
.aboutContent .desc:last-of-type {
    margin-bottom: 0;
}

/*********************************
/* About Section End
*********************************/
/*********************************
/*  team Section Start
*********************************/
.teamCard-thumb {
    position: relative;
}
.teamCard-thumb::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(var(--color-black-rgb), 0.5);
    border-radius: var(--radius);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.teamCard-thumb::before {
    content: "";
    background: radial-gradient(
        circle,
        rgba(254, 189, 13, 0.3) 0.5%,
        rgba(255, 255, 255, 0) 100%
    );
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.teamCard-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--radius);
}
.teamCard-thumb .social-overlay {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-40%);
    transform: translateY(-40%);
    text-align: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    gap: 8px;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.teamCard-thumb .social-overlay a {
    height: 40px;
    width: 40px;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--color-primary);
    color: var(--color-heading);
    font-size: 20px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.teamCard-thumb .social-overlay a:hover {
    background: var(--color-white);
}
.teamCard-content {
    margin-top: 20px;
}
.teamCard-content .title {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 10px;
}
.teamCard-content .title a {
    color: currentColor;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.teamCard-content .title a:hover {
    color: var(--color-primary);
}
.teamCard-content .designation {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading2);
    margin: 0;
}
.teamCard:hover .teamCard-thumb::after {
    opacity: 1;
    visibility: visible;
}
.teamCard:hover .teamCard-thumb::before {
    opacity: 1;
    visibility: visible;
}
.teamCard:hover .social-overlay {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

/*********************************
/*  team Section End
*********************************/
/*********************************
/*  CountDown Start
*********************************/
.countdown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 479px) {
    .countdown {
        gap: 6px;
    }
}
.countdown .time-box {
    border: 1px solid var(--color-primary);
    background: rgba(var(--color-primary-rgb), 0.1);
    height: 36px;
    min-width: 40px;
    padding: 4px 8px;
    border-radius: var(--radius);
    margin: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    gap: 3px;
}
@media screen and (max-width: 479px) {
    .countdown .time-box {
        height: 32px;
        padding: 4px 6px;
    }
}
.countdown .time-box::after {
    content: ":";
    position: absolute;
    right: -12px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 20px;
}
@media screen and (max-width: 479px) {
    .countdown .time-box::after {
        display: none;
    }
}
.countdown .time-box:last-of-type::after {
    display: none;
}
.countdown .time-box span {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-heading);
    text-transform: capitalize;
}
@media screen and (max-width: 479px) {
    .countdown .time-box span {
        font-size: 12px;
    }
}

/*********************************
/*  CountDown End
*********************************/
/*********************************
/*  Blog Single Start
*********************************/
@media screen and (max-width: 991px) {
    .blogPost-single {
        margin-top: 40px;
    }
}
.blogPost-single .main-title {
    font-family: var(--font-default);
    font-size: 24px;
    font-weight: var(--font-medium);
    line-height: 24px;
    color: var(--color-heading);
    margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
    .blogPost-single .main-title {
        font-size: 20px;
    }
}
.blogPost-single .blog-single-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}
@media screen and (max-width: 375px) {
    .blogPost-single .blog-single-meta {
        gap: 10px;
    }
}

.blogPost-single .blog-single-meta span {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: var(--color-heading2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    border-right: 1px solid var(--color-border);
    padding-right: 20px;
}
.blogPost-single .blog-single-meta span:last-of-type {
    padding: 0;
    border: none;
}
@media screen and (max-width: 375px) {
    .blogPost-single .blog-single-meta span {
        padding-right: 10px;
    }
}
.blogPost-single .blog-single-meta span i {
    font-size: 16px;
    color: var(--color-primary);
}
.blogPost-single .blog-single-meta span a {
    color: currentColor;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.blogPost-single .blog-single-meta span a:hover {
    color: var(--color-primary);
}
.blogPost-single .thumb {
    margin-top: 32px;
    aspect-ratio: 8.6/4.5;
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--radius);
}
.blogPost-single .thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--radius);
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top;
}
.blogPost-single .content p {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 22px;
    color: var(--color-heading2);
    margin: 20px 0;
}
.blogPost-single .content .titles {
    font-size: 18px;
    font-weight: var(--font-semibold);
    line-height: 18px;
    color: var(--color-heading3);
    margin-bottom: 0;
}
.blogPost-single blockquote {
    background: var(--color-secondary);
    padding: 40px;
    border-radius: var(--radius);
    font-size: 16px;
    font-style: italic;
    font-weight: var(--font-regular);
    line-height: 26px;
    color: var(--color-heading2);
    margin: 0;
}
.blogPost-single .image-group {
    gap: 16px;
}
.blogPost-single .image-group img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: var(--radius);
}
.blogPost-single .list-item .list {
    padding-left: 30px;
    margin-top: 20px;
}
.blogPost-single .list-item .list li {
    font-size: 14px;
    font-weight: 400;
    line-height: 40px;
    color: var(--color-content2);
    margin-bottom: 0px;
}

.shareOption {
    margin-top: 20px;
}
.shareOption .shareTitle {
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
}

.all-comments .input-group {
    margin-bottom: 20px;
}
.all-comments .input-group .form-control {
    background: #f4f4f4;
}
.all-comments .btn {
    padding: 11px 35px;
}

/*********************************
/*  Blog Single End
*********************************/
/*********************************
/* Cupon Card Start
*********************************/
.cuponCard {
    background: #dddddd;
    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;
    height: 203px;
    position: relative;
    z-index: 1;
    margin-bottom: 15px;
}
.cuponCard::before {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    height: 187px;
    width: 20px;
    background: url("/public/frontend/assets/images/shape-ball-left.svg");
    background-repeat: no-repeat;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.cuponCard::after {
    content: "";
    position: absolute;
    right: -13px;
    top: 50%;
    height: 187px;
    width: 20px;
    background: url("/public/frontend/assets/images/shape-ball-right.svg");
    background-repeat: no-repeat;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.cuponCard .cupon-content {
    font-family: var(--font-default);
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 30px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
@media screen and (max-width: 479px) {
    .cuponCard .cupon-content {
        padding: 20px;
        padding-right: 10px;
    }
}
.cuponCard .cupon-content .title {
    font-size: 19.49px;
    font-weight: 600;
    line-height: 19.49px;
    color: var(--color-heading3);
    text-transform: uppercase;
    margin-bottom: 15px;
}
@media screen and (max-width: 479px) {
    .cuponCard .cupon-content .title {
        font-size: 16px;
    }
}
.cuponCard .cupon-content .desc {
    font-size: 11.37px;
    font-weight: 400;
    line-height: 14.62px;
    color: var(--color-heading3);
    margin-bottom: 15px;
}
.cuponCard .cupon-content .dates {
    font-family: Figtree;
    font-size: 11.37px;
    font-weight: 400;
    line-height: 11.37px;
    color: var(--color-heading3);
}
.cuponCard .cupon-content .copy-btn {
    font-size: 11.37px;
    font-weight: 500;
    line-height: 11.37px;
    padding: 8px 12px;
    color: var(--color-heading3);
    background: var(--color-white);
    border: none;
    outline: none;
    border-radius: 4px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.cuponCard .cupon-content .copy-btn:hover {
    color: var(--color-heading3);
    background: var(--color-primary);
}
.cuponCard .coupon-discount {
    background: var(--color-heading3);
    font-size: 16.24px;
    font-weight: 600;
    line-height: 16.24px;
    color: var(--color-white);
    text-align: center;
    text-transform: uppercase;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px;
    width: 145px;
}
@media screen and (max-width: 479px) {
    .cuponCard .coupon-discount {
        width: 130px;
        font-size: 14px;
    }
}
@media screen and (max-width: 375px) {
    .cuponCard .coupon-discount {
        width: 120px;
    }
}
.cuponCard .coupon-discount span {
    font-size: 32.48px;
    line-height: 32.48px;
    display: block;
    margin-bottom: 9px;
}
@media screen and (max-width: 479px) {
    .cuponCard .coupon-discount span {
        font-size: 24px;
    }
}

/*********************************
/* Cupon Card End
*********************************/
/*********************************
/*  Counter Section Start
*********************************/
.counterItem {
    font-family: var(--font-default);
    font-size: 50px;
    font-weight: var(--font-semibold);
    line-height: 60px;
    letter-spacing: 0.5px;
    color: var(--color-primary);
}
.counterItem .title {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 24px;
    color: var(--color-heading2);
    margin-top: 16px;
    display: block;
}

/*********************************
/*  Counter Section End
*********************************/
/*********************************
/*  Sign Up Section Start
*********************************/
.signupForm-wrapper {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
}
.signupForm-wrapper form {
    padding: 40px 24px 30px;
}

.signup-thumb {
    width: 100%;
    height: 100%;
    display: block;
    /* aspect-ratio: 3 / 4; */
}

@media (max-width: 991px) {
    /* .signup-thumb {
        aspect-ratio: 7/6;
    } */
}
.signup-thumb img {
    width: 100%;
    height: 100%;
    /* display: block;
    object-fit: cover; */
}

.signup-form .title {
    font-family: var(--font-montserrat);
    font-size: 24px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    color: var(--color-heading);
    margin-bottom: 24px;
}
.signup-form .instant-login .login-action {
    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 16px;
}
@media screen and (max-width: 1440px) {
    .signup-form .instant-login .login-action {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}
.signup-form .instant-login .login-action a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 13px 14px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    white-space: nowrap;
}
.signup-form .instant-login .login-action a img {
    width: 18px;
    height: auto;
    display: block;
}
.signup-form .devider {
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: var(--color-heading3);
    display: block;
    text-transform: uppercase;
    position: relative;
    margin-top: 24px;
}
.signup-form .devider::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--color-border);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.signup-form .devider span {
    background: var(--color-white);
    z-index: 1;
    position: relative;
    padding: 0 15px;
    line-height: 100%;
}
.signup-form .input-group {
    margin-top: 16px;
}
.signup-form .input-group label {
    font-size: 14px;
    line-height: 14px;
    margin-bottom: 8px;
}
.signup-form .input-group .form-control {
    color: #999999;
}
.signup-form .input-group .form-control::-webkit-input-placeholder {
    color: #999999;
}
.signup-form .input-group .form-control::-moz-placeholder {
    color: #999999;
}
.signup-form .input-group .form-control:-ms-input-placeholder {
    color: #999999;
}
.signup-form .input-group .form-control::-ms-input-placeholder {
    color: #999999;
}
.signup-form .input-group .form-control::placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #999999;
}
.signup-form .input-group .vue-tel-input::-webkit-input-placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input::-moz-placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input:-ms-input-placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input::-ms-input-placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input::placeholder {
    color: #999999;
}
.signup-form .input-group .vue-tel-input .vti__dropdown {
    padding: 0;
}
.signup-form .input-group .vue-tel-input:focus-within {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}
.signup-form .change-type {
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: var(--color-heading2);
    display: block;
    margin-top: 8px;
    cursor: pointer;
}
.signup-form .btn {
    padding: 14px;
}
.signup-form .account {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: var(--color-heading);
    margin-top: 24px;
}
.signup-form .account a {
    color: var(--color-primary);
    display: inline-block;
}

.password-container {
    position: relative;
}
.password-container button {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    color: #999999;
    right: 16px;
}
.password-container .form-control {
    padding-right: 40px;
}

.flex-input {
    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;
}
.flex-input .forget {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 14px;
    color: var(--color-primary);
}

.default-checkbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    margin: 16px 0 24px;
}
.default-checkbox .form-check-input {
    margin-top: 0;
    height: 16px;
    width: 16px;
    min-width: 16px;
    border: 1px solid var(--color-heading2);
    border-radius: 2px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.default-checkbox .form-check-input:checked {
    border-color: var(--color-primary);
    background-color: var(--color-primary);
}
.default-checkbox .form-check-input:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.default-checkbox .form-check-label {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 18px;
    color: var(--color-heading2);
    display: inline-block;
    cursor: pointer;
    text-transform: capitalize;
}
.default-checkbox .form-check-label a {
    color: var(--color-primary);
    display: inline-block;
}

.login-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #eeeeee;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.login-type .btn {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-transform: uppercase;
}

.forget-thumb img {
    max-width: 250px;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
}

/* Otp Input */
.otp-input-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
    margin: auto;
    margin-top: 32px;
}
.otp-input-container .otp-input {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font--bold);
    line-height: 14px;
    color: var(--color-heading);
    width: 100px;
    height: 60px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    outline: none;
    text-align: center;
}
.otp-input-container .otp-input:focus {
    outline: none;
    border-color: var(--color-primary);
}

.otp-duration {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    text-align: center;
    color: var(--color-heading);
    display: block;
    margin-top: 40px;
}

/*********************************
/*  Sign Up Section End
*********************************/
/*********************************
/*  Terms Conditions Start
*********************************/
.terms-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 32px;
}
@media screen and (max-width: 575px) {
    .terms-wrapper {
        display: block;
    }
}
.terms-wrapper .vertical-tabs {
    width: 207px;
    border-right: 1px solid var(--color-border);
}
@media screen and (max-width: 575px) {
    .terms-wrapper .vertical-tabs {
        width: 100%;
        border-right: none;
    }
}
.terms-wrapper .terms-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.terms-wrapper .terms-content .content {
    margin-top: 40px;
}
.terms-wrapper .terms-content .content:first-of-type {
    margin-top: 0;
}
.terms-wrapper .terms-content .content .subtitle {
    font-family: var(--font-default);
    font-size: 24px;
    font-weight: var(--font-semibold);
    line-height: 28.8px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 16px;
    text-transform: capitalize;
}
.terms-wrapper .terms-content .content p {
    font-size: 14px;
    line-height: 24px;
    color: var(--color-heading2);
    margin-bottom: 30px;
}
.terms-wrapper .terms-content .content p:last-of-type {
    margin-bottom: 0;
}

.vertical-tabs .title {
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0.5px;
    margin-bottom: 32px;
    color: var(--color-black);
}
.vertical-tabs .tabList-item {
    gap: 10px 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
@media screen and (max-width: 575px) {
    .vertical-tabs .tabList-item li {
        font-size: 14px;
    }
}
@media (min-width: 576px) {
    .vertical-tabs .tabList-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        gap: 20px 0;
        border: none;
    }
    .vertical-tabs .tabList-item li {
        padding-bottom: 0;
        width: 100%;
        display: block;
    }
    .vertical-tabs .tabList-item li::after {
        width: 3px;
        height: 0;
        left: auto;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .vertical-tabs .tabList-item li.active::after {
        height: 100%;
    }
}

/*********************************
/*  Terms Conditions End
*********************************/
/*********************************
/*  Compare table Start
*********************************/
.compare-table {
    width: 100%;
    border-collapse: collapse;
}
.compare-table table {
    width: 100%;
}
.compare-table table tbody {
    margin-bottom: 30px;
    display: block;
}

.compare-table table tbody tr {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.compare-table th,
.compare-table td {
    font-family: var(--font-default);
    font-size: 16.4px;
    font-weight: var(--font-medium);
    line-height: 26.65px;
    letter-spacing: 0.5124223828px;
    color: var(--color-heading);
    border: 1px solid var(--color-border);
    padding: 20px;
    min-width: 200px;
}
.compare-table th {
    min-width: 300px;
    /* max-width: 300px; */
    background: var(--color-secondary);
}
@media screen and (max-width: 991px) {
    .compare-table th {
        max-width: 200px;
        min-width: 200px;
    }
}
.compare-table td {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.compare-table .title {
    font-variant: var(--font-semibold);
    text-transform: uppercase;
    vertical-align: baseline;
}
.compare-table .product-header {
    position: relative;
    margin-bottom: 24px;
}

.compare-table .product-header a {
    color: var(--colo-heading);
}

.compare-table .product-header a span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.compare-table .product-header .compare-thumb {
    max-width: 204px;
    margin: 0 auto 40px;
    height: 180px;
    object-fit: contain;
    padding: 20px;
}
.compare-table .product-header .brand {
    font-size: 14.35px;
    font-weight: 500;
    line-height: 20.5px;
    letter-spacing: 0.5124223828px;
    color: var(--color-heading);
    margin-bottom: 12px;
}
.compare-table .product-header .name {
    font-size: 16.4px;
    font-weight: 600;
    line-height: 26.65px;
    letter-spacing: 0.5124223828px;
    color: var(--color-heading);
}
.compare-table .product-header .removeBtn {
    height: 24px;
    width: 24px;
    background: rgba(var(--color-primary-rgb), 0.06);
    border: 1.5px solid rgba(var(--color-primary-rgb), 0.3);
    border-radius: 2px;
    color: var(--color-primary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}
.compare-table .all-rating {
    white-space: nowrap;
}
.compare-table .price-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
    font-family: Montserrat;
    font-size: 16.4px;
    font-weight: var(--font-semibold);
    line-height: 16.4px;
    color: var(--color-heading);
}
.compare-table .price-wrap .discount {
    font-weight: var(--font-regular);
    text-decoration: line-through;
    color: var(--color-content3);
}
.compare-table .in-stock {
    color: #28b446;
    font-weight: var(--font-medium);
}
.compare-table .feature-list {
    padding-left: 20px;
}
.compare-table .feature-list li {
    margin-bottom: 10px;
    font-weight: var(--font-medium);
}

.all-rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    font-size: 12.3px;
    font-weight: 600;
    line-height: 12.3px;
    color: var(--color-heading2);
}
.all-rating .rating {
    color: var(--color-primary);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3px;
}

/*********************************
/*  Compare table End
*********************************/
/*********************************
/*  Demo Start
*********************************/
/*********************************
/*  Demo Start
*********************************/
.chatBox-main {
    position: fixed;
    bottom: 20px;
    z-index: 999;
    right: 20px;
    width: 600px;
    max-width: 100%;
    /* height: 100%; */
    max-height: 800px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    gap: 10px;
}
@media screen and (max-width: 991px) {
    .chatBox-main {
        width: 700px;
    }
}

@media screen and (max-width: 767px) {
    .chatBox-main {
        width: 90%;
        /* height: calc(100% - 150px); */
    }
}

.chatBox-bubble {
    width: 90px;
    height: 70px;
    background: var(--color-primary);
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 6px;
    position: fixed;
    bottom: 20px;
    right: 20px;
}

.chatBox-bubble:hover {
    color: var(--color-heading);
}
.chatBox-bubble img {
    width: 18px;
    display: block;
}

.chat-container {
    width: 100%;
    height: 717px;
    padding: 0px 14px 0px;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    -webkit-box-shadow: 0px 0px 32.23px 0px rgba(0, 0, 0, 0.0784313725);
    box-shadow: 0px 0px 32.23px 0px rgba(0, 0, 0, 0.0784313725);

    position: absolute;
    z-index: 999;
    bottom: 80px;
    right: 0;
}
@media screen and (max-width: 1440px) {
    .chat-container {
        height: 600px;
    }
}

/* @media screen and (max-width: 1440px) {
  .chat-container {
    height: 100%;
  }
} */
.chat-container .chat-header {
    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;
    padding: 16px 0;
    border-bottom: 1px solid var(--color-border);
}
.chat-container .chat-header .logo img {
    width: auto;
    display: block;
    max-width: 100px;
}
.chat-container .chat-header-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 13px;
}
.chat-container .chat-header .header-search {
    position: relative;
}
.chat-container .chat-header .header-search .form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 30px !important;
    padding: 10px;
}
.chat-container .chat-header .header-search button {
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: transparent;
    border: none;
    outline: none;
    color: var(--color-heading2);
    height: 20px;
    width: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 9;
}
.chat-container .chat-header .header-search button:focus {
    color: var(--color-heading2);
}
.chat-container .chat-header .userProfile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 9px;
    max-width: 180px;
}
.chat-container .chat-header .userProfile .thumb img {
    width: 38px;
    height: 38px;
    display: block;
    border-radius: 50%;
}
.chat-container .chat-header .userProfile .user-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.chat-container .chat-header .userProfile .user-info .user-name {
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /* width: 160px; */
}
.chat-container .chat-header .userProfile .user-info .designation {
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0.4px;
    color: var(--color-content2);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /* width: 160px; */
}
.chat-container .chat-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(100% - 102px);
}
@media screen and (max-width: 767px) {
    .chat-container .chat-wrapper {
        display: block;
    }
}
.chat-container .chat-wrapper .chat-sidebar {
    /* width: 288px; */
    width: 210px;
    padding-right: 16px;
    border-right: 1px solid var(--color-border);
    overflow: auto;
}
@media screen and (max-width: 991px) {
    .chat-container .chat-wrapper .chat-sidebar {
        width: 210px;
    }
}
@media screen and (max-width: 767px) {
    .chat-container .chat-wrapper .chat-sidebar {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 10px;
        padding: 10px 0;
        border: none;
    }
}
.chat-container .chat-wrapper .chat-user {
    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;
    padding: 8px 6px;
    /* padding: 12px; */
    padding-right: 20px;
    border: 1px solid transparent;
}
@media screen and (max-width: 767px) {
    .chat-container .chat-wrapper .chat-user {
        padding: 0px;
        border: none !important;
    }
}
.chat-container .chat-wrapper .chat-user.active {
    background: var(--color-secondary);
    border-radius: var(--radius);
    border: 1px solid var(--color-border);
}
.chat-container .chat-wrapper .chat-user-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}
.chat-container .chat-wrapper .chat-user-thumb {
    position: relative;
}
.chat-container .chat-wrapper .chat-user-thumb img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: block;
}
.chat-container .chat-wrapper .chat-user-thumb .dot {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background: #28b446;
    position: absolute;
    bottom: 0;
    right: 6px;
    border: 1px solid #fff;
    display: none;
}
@media screen and (max-width: 991px) {
    .chat-container .chat-wrapper .chat-user-thumb .dot {
        display: block;
    }
}
@media screen and (max-width: 767px) {
    .chat-container .chat-wrapper .chat-user .content {
        display: none;
    }
}
.chat-container .chat-wrapper .chat-user .content .name {
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 3px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 110px;
}
.chat-container .chat-wrapper .chat-user .content .message {
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0.4px;
    color: var(--color-content2);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 110px;
}
.chat-container .chat-wrapper .chat-user .status {
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0.5px;
    color: var(--color-black);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.chat-container .chat-wrapper .chat-user .status .dot {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background: #28b446;
}
@media screen and (max-width: 991px) {
    .chat-container .chat-wrapper .chat-user .status {
        display: none;
    }
}
.chat-container .chat-wrapper .chat-inner {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 16px;
    height: 100%;
}
@media screen and (max-width: 767px) {
    .chat-container .chat-wrapper .chat-inner {
        height: calc(100% - 65px);
    }
}

.chat-container .chat-wrapper .chat-inner .chat-window {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.chat-container .chat-wrapper .chat-inner .chat-window-header {
    padding: 15px 0;
    border-bottom: 1px solid var(--color-border);
    width: 100%;
    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;
}
.chat-container .chat-wrapper .chat-inner .chat-window-header .chat-user {
    padding: 0;
}
.chat-container .chat-wrapper .chat-inner .chat-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
}
.chat-container .chat-wrapper .chat-inner .chat-action .action {
    height: 40px;
    width: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: 50%;
}
.chat-container .chat-wrapper .chat-inner .chat-action .action img {
    width: 15px;
    height: auto;
    display: block;
}

.chat-scroll {
    height: 100%;
    overflow-y: auto;
}

.chatList {
    padding: 24px 0 16px;
    /* height: 100%; */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    overflow: auto;
}
.chatList .message {
    margin-bottom: 10px;
}
.chatList .message:last-of-type {
    margin: 0;
}
.chatList .message-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.chatList .message-reply {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    gap: 10px;
    width: 90%;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    margin-left: auto;
}
.chatList .message-reply.seller {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-left: inherit;
}
.chatList .message-reply-avatar img {
    width: 25px;
    height: 25px;
    border-radius: 50%;
}
.chatList .message-reply .reply-text {
    font-size: 12.4px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-black);
    padding: 8px 16px;
    background: var(--color-secondary);
    border-radius: 4px;
}
.chatList .message-reply.self .reply-text {
    background: var(--color-heading);
    color: var(--color-white);
}
.chatList .message-reply.seller .reply-text {
    background: var(--color-secondary);
}

/* Chat Input Start */
.chat-send-area {
    padding-top: 20px;
    border-top: 1px solid var(--color-border);
}
.chat-send-area .message-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: rgba(var(--color-primary-rgb), 0.06);
    border: 1px solid rgba(var(--color-primary-rgb), 0.3);
    border-radius: var(--radius-8);
    padding-left: 16px;
}
.chat-send-area .message-input .input-groups {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.chat-send-area .message-input .input-groups .form-control {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    color: #a19791;
    background: transparent;
    border: none;
    border-radius: 0;
    outline: none;
}
.chat-send-area .message-input .input-groups .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    border: none;
}
.chat-send-area .message-input .chat-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.chat-send-area .message-input .chat-input .input-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}
.chat-send-area .message-input .chat-input .input-list li {
    list-style: none;
    width: 18px;
    height: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.chat-send-area .message-input .chat-input .input-list li button {
    background: transparent;
    border: none;
    outline: none;
    cursor: pointer;
}
.chat-send-area .message-input .chat-input .input-list li button:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    border: none;
}
.chat-send-area .send-button {
    margin-left: 30px;
}
.chat-send-area .send-button button {
    width: 47px;
    height: 48px;
    border-radius: var(--radius-8);
    background: var(--color-primary);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: none;
    outline: none;
}
.chat-send-area .send-button button img {
    width: 18px;
}

/*********************************
/*  Demo End
*********************************/

/*********************************
/*  Demo End
*********************************/
/*********************************
/*  Dashboard Start
*********************************/
.dashboard-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}
.dashboard-head .header-toggle {
    height: 36px;
    width: 46px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    background: rgba(var(--color-primary-rgb), 0.06);
    display: none;
    border: 1px solid var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    z-index: 99;
}
@media screen and (max-width: 575px) {
    .dashboard-head .header-toggle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}
@media screen and (max-width: 479px) {
    .dashboard-head .header-toggle {
        margin-left: 0;
    }
}
.dashboard-head .header-toggle.active .toggle-bar {
    background: transparent;
}
.dashboard-head .header-toggle.active .toggle-bar::before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 0;
}
.dashboard-head .header-toggle.active .toggle-bar::after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    bottom: 0;
}
.dashboard-head .header-toggle .toggle-bar {
    height: 2px;
    width: 25px;
    background: var(--color-primary);
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.dashboard-head .header-toggle .toggle-bar::after,
.dashboard-head .header-toggle .toggle-bar::before {
    content: "";
    position: absolute;
    top: -8px;
    height: 2px;
    width: 100%;
    background: var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.dashboard-head .header-toggle .toggle-bar::after {
    top: auto;
    bottom: -8px;
}
.dashboard-head .dashboard-banner {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.dashboard-wrapper {
    margin-top: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 30px;
}
@media (min-width: 576px) and (max-width: 991px) {
    .dashboard-wrapper {
        gap: 15px;
    }
}
.dashboard-wrapper .dashboard-sidebar {
    width: 210px;
    min-width: 210px;
    position: sticky;
    top: 20px;
    background: var(--color-white);
}
@media (min-width: 576px) and (max-width: 991px) {
    .dashboard-wrapper .dashboard-sidebar {
        min-width: 70px;
        width: 70px;
        border: 1px solid var(--color-border);
        padding: 10px;
        border-radius: 6px;
        height: -webkit-max-content;
        height: -moz-max-content;
        height: max-content;
    }
}
@media screen and (max-width: 575px) {
    .dashboard-wrapper .dashboard-sidebar {
        width: 250px;
        min-width: 250px;
        position: fixed;
        top: 0;
        right: 0;
        right: 0;
        padding: 15px;
        z-index: 999;
        height: 100vh;
        -webkit-box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1019607843);
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1019607843);
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-transition: -webkit-transform 0.3s ease;
        transition: -webkit-transform 0.3s ease;
        transition: transform 0.3s ease;
        transition: transform 0.3s ease, -webkit-transform 0.3s ease;
    }
    .dashboard-wrapper .dashboard-sidebar.active {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}
.dashboard-wrapper .dashboard-content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: calc(100% - 240px);
}
@media (min-width: 576px) and (max-width: 991px) {
    .dashboard-wrapper .dashboard-content {
        width: calc(100% - 85px);
    }
}

.sideBar {
    position: sticky;
    top: 20px;
}

.userProfile .action-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px;
    min-width: 136px;
    width: 100%;
}
@media (min-width: 576px) and (max-width: 991px) {
    .userProfile .action-list {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}
@media screen and (max-width: 991px) {
    .userProfile .action-list {
        min-width: initial;
    }
}
.userProfile .action-list .thumb {
    height: 48px;
    width: 48px;
    border-radius: var(--radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
@media screen and (max-width: 767px) {
    .userProfile .action-list .thumb {
        height: 38px;
        width: 38px;
    }
}
.userProfile .action-list .thumb img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
}
.userProfile .action-list .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: var(--font-semibold);
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
}
@media (min-width: 576px) and (max-width: 991px) {
    .userProfile .action-list .content {
        display: none;
    }
}
.userProfile .action-list .content span {
    font-size: 12px;
    margin-top: 6px;
    margin-bottom: 0;
    display: block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: var(--font-regular);
    gap: 4px;
}
.userProfile .action-list .content span i {
    height: 20px;
    width: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 16px;
}

.sideBar-menu {
    padding-top: 24px;
}
.sideBar-menu .menu-item li {
    list-style: none;
    margin-bottom: 5px;
}
.sideBar-menu .menu-item li:last-of-type {
    margin-bottom: 0;
}
.sideBar-menu .menu-item li a {
    padding: 15px 16px;
    border-radius: 6px;
    color: var(--color-heading);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 13px;
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    color: var(--color-heading);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.sideBar-menu .menu-item li a .icon {
    width: 16px;
    height: auto;
    display: block;
}
@media (min-width: 576px) and (max-width: 991px) {
    .sideBar-menu .menu-item li a {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}
@media (min-width: 576px) and (max-width: 991px) {
    .sideBar-menu .menu-item li a span {
        display: none;
    }
}
.sideBar-menu .menu-item li a.router-link-exact-active,
.sideBar-menu .menu-item li a.active,
.sideBar-menu .menu-item li a:hover {
    background: var(--color-primary);
}
.sideBar-menu .menu-item li .logoutBtn {
    color: #ff3b30;
}
.sideBar-menu .menu-item li .logoutBtn.router-link-exact-active,
.sideBar-menu .menu-item li .logoutBtn.active,
.sideBar-menu .menu-item li .logoutBtn:hover {
    background: transparent;
}

/*********************************
/*  Dashboard End
*********************************/
/*********************************
/*  OrderBox Item Start
*********************************/
.orderBox {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}
@media screen and (max-width: 1440px) {
    .orderBox {
        margin-bottom: 20px;
    }
}
.orderBox .icon {
    height: 100px;
    width: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--color-secondary);
    border-radius: 4px;
}
@media screen and (max-width: 1440px) {
    .orderBox .icon {
        width: 80px;
        height: 80px;
    }
}
.orderBox .icon svg {
    width: 37px;
}
.orderBox .content {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.orderBox .content .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 14px;
    color: var(--color-heading2);
    margin-bottom: 24px;
    display: block;
}
.orderBox .content .count {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    color: var(--color-heading);
    display: block;
}

/*********************************
/*  OrderBox Item End
*********************************/
/*********************************
/*  walletHistory Item Start
*********************************/
.walletHistory {
    background: var(--color-secondary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 20px 10px;
    text-align: center;
    display: block;
}
@media screen and (max-width: 1440px) {
    .walletHistory {
        margin-bottom: 20px;
    }
}
.walletHistory .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 14px;
    color: var(--color-heading2);
    margin-bottom: 24px;
    display: block;
}
.walletHistory .count {
    font-family: var(--font-default);
    font-size: 20px;
    font-weight: var(--font-semibold);
    line-height: 24px;
    color: var(--color-heading);
    display: block;
}
.walletHistory .addIcon svg {
    width: 24px;
    height: 24px;
}
.walletHistory .addIcon svg path {
    fill: var(--color-primary);
}
.walletHistory.highlight {
    background: rgba(var(--color-primary-rgb), 0.06);
    border: 1px solid var(--color-primary);
}
.walletHistory.highlight .title {
    color: var(--color-primary);
    margin-bottom: 22px;
}

/*********************************
/*  walletHistory Item End
*********************************/
/*********************************
/*  Address Wrapper Item Start
*********************************/
.address-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
@media screen and (max-width: 991px) {
    .address-wrapper {
        display: block;
    }
}
.address-wrapper .addressWith-title {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.address-wrapper .addressWith-title .mainHeader {
    background: var(--color-secondary);
    padding: 20px;
    border-radius: 6px 0 0;
    border-right: 1px solid var(--color-border);
}
.address-wrapper .addressWith-title .mainHeader .mainTitle {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading);
    margin-bottom: 0;
}
.address-wrapper .addressWith-title:last-of-type {
    border: none;
}
.address-wrapper .addressWith-title:last-of-type .mainHeader {
    border-radius: 0 6px 0;
}

/*********************************
/*  Address Wrapper Item End
*********************************/
/*********************************
/*  Dashboard Table Start
*********************************/
.custom-table {
    margin-top: 24px;
}
.custom-table .table-header {
    padding: 20px 16px;
    background: var(--color-secondary);
    border: 1px solid var(--color-border);
    border-radius: 6px 6px 0 0;
}
.custom-table .table-header .title {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0.5px;
    color: var(--color-heading3);
    margin-bottom: 0;
}
.custom-table .table {
    white-space: nowrap;
    border-collapse: initial;
    border-radius: 8px;
    border-spacing: 0;
    margin-bottom: 0;
}
.custom-table .table tbody {
    border: 1px solid #eee;
}
.custom-table .table tr th {
    font-family: var(--font-default);
    font-size: 14px;
    line-height: 14px;
    font-weight: var(--font-semibold);
    border: none;
    color: var(--color-heading);
    padding: 16px;
    border-bottom: 1px solid var(--color-border) !important;
    text-transform: capitalize;
}
.custom-table .table tr th:first-of-type {
    border-radius: 8px 0 0 0;
    border-left: 1px solid var(--color-border);
}
.custom-table .table tr th:last-of-type {
    border-radius: 0 8px 0 0;
    border-right: 1px solid var(--color-border);
}
.custom-table .table td {
    font-family: var(--font-default);
    font-size: 14px;
    line-height: 23px;
    font-weight: var(--font-medium);
    color: var(--color-content);
    padding: 10px 12px;
    border: none;
    border-bottom: 1px solid rgba(var(--color-heading), 0.06);
    text-transform: capitalize;
    vertical-align: middle;
}
.custom-table .table td:first-of-type {
    border-left: 1px solid rgba(var(--color-heading), 0.06);
}
.custom-table .table td:last-of-type {
    border-right: 1px solid rgba(var(--color-heading), 0.06);
    text-align: end;
}
.custom-table .table .btn-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid rgba(var(--color-heading), 0.06);
    border-radius: 4px;
    padding: 4px 6px;
}
.custom-table .table .btn-group a {
    position: relative;
}
.custom-table .table .btn-group a::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 100%;
    right: 0;
    background: rgba(var(--color-heading), 0.06);
    top: 0;
    right: -5px;
}
.custom-table .table .btn-group a:last-of-type::after {
    display: none;
}
.custom-table .table .btn-group img {
    width: 16px;
    height: auto;
}
.custom-table .table .date {
    color: var(--color-heading);
    text-transform: capitalize;
    margin-bottom: 4px;
}
.custom-table .table .date span {
    color: var(--color-content);
}
.custom-table .table .time {
    font-weight: var(--font-regular);
    font-size: 12px;
    line-height: 14px;
    color: var(--color-content);
}

/*********************************
/*  Dashboard Table End
*********************************/
/*********************************
/*  All Badge Satrt
*********************************/
.text-primary {
    color: var(--color-primary);
}

.text-danger {
    color: #ff6767;
}

.badges {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    padding: 4px;
    border-radius: 2px;
    color: #28b446;
    display: inline-block;
}
.badges-success {
    color: #28b446;
    background: rgba(40, 180, 70, 0.1019607843);
    border: 1px solid rgba(40, 180, 70, 0.3019607843);
}
.badges-danger {
    color: #ff6767;
    background: rgba(255, 103, 103, 0.1019607843);
    border: 1px solid rgba(255, 103, 103, 0.3019607843);
}
.badges-warning {
    color: #febd0d;
    background: rgba(254, 189, 13, 0.1019607843);
    border: 1px solid rgba(254, 189, 13, 0.3019607843);
}

/*********************************
/*  All Badge End
*********************************/
/*********************************
/*  Default Dropdown Start
*********************************/
.defaultDropdown .dropdown-toggle {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-medium);
    line-height: 14px;
    color: var(--color-heading2);
    padding: 10px 15px;
    background: var(--color-secondary);
    border: 1px solid var(--color-border);
    border-radius: 4px;
}
.defaultDropdown .dropdown-toggle::after {
    content: "";
    border-style: solid;
    border-width: 1px 1px 0 0 !important;
    border-color: var(--color-heading2);
    display: inline-block;
    height: 6px;
    width: 6px;
    margin-left: 3px;
    position: relative;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    vertical-align: middle;
    top: -2px;
}
.defaultDropdown .dropdown-menu {
    width: 159px;
    border: 1px solid var(--color-border);
    padding: 10px 20px 18px;
    background: var(--color-white);
    border-radius: 4px;
    top: 10px !important;
    min-height: 154px;
}
.defaultDropdown .dropdown-menu li a {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-regular);
    line-height: 30px;
    text-align: right;
    color: var(--color-content2);
    padding: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.defaultDropdown .dropdown-menu li a:hover {
    color: #ff3b30;
    background: transparent;
}
.defaultDropdown .dropdown-menu .btn {
    font-size: 12px;
    font-weight: 500;
    line-height: 14.4px;
    letter-spacing: 0.5px;
    padding: 6px 12px;
    border-radius: 4px;
    width: 100%;
    margin-top: 10px;
}

/*********************************
/*  Default Dropdown End
*********************************/
/*********************************
/*  Empty Status Start
*********************************/
.empty-status {
    padding-bottom: 30px;
}
.empty-status .thumb {
    margin: auto;
}
.empty-status .thumb img {
    width: 100%;
    height: auto;
    max-width: 300px;
    display: inline-block;
}

/*********************************
/*  Empty Status Start
*********************************/
/*********************************
/*  photoUpload Style Start
*********************************/
.editProfile-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    padding: 20px 16px;
}
@media screen and (max-width: 991px) {
    .editProfile-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}

.photoUpload-wrapper {
    width: 216px;
}
@media screen and (max-width: 991px) {
    .photoUpload-wrapper {
        width: 100%;
    }
}
.photoUpload-wrapper .title {
    font-family: var(--font-default);
    font-size: 14px;
    font-weight: var(--font-semibold);
    line-height: 14px;
    color: var(--color-heading);
    margin-bottom: 8px;
}
.photoUpload-wrapper .upload-input {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 33px;
}
.photoUpload-wrapper .image-upload {
    width: 150px;
    margin: auto;
}
.photoUpload-wrapper .image-upload .upload-area {
    width: 150px;
    height: 150px;
    border-radius: 4px;
    border: 1px solid var(--color-border);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 50px;
}
.photoUpload-wrapper .image-upload .upload-area .preview-image {
    border-radius: 4px;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top;
}
.photoUpload-wrapper .image-upload .btn {
    margin-top: 10px;
    padding: 10px 15px;
    border-radius: 4px;
    background: var(--color-heading3);
    border-color: var(--color-heading3);
    width: 150px;
}
.photoUpload-wrapper .image-upload .btn:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

/*********************************
/*  photoUpload Style End
*********************************/
/*********************************
/*  LogOut Popup MOdal Start
*********************************/
.LogoutModal .modal-dialog {
    max-width: 600px;
    height: 360px;
}
.LogoutModal .modal-content {
    padding: 32px 21px;
    border-radius: var(--radius);
    border: 1px solid var(--color-primary);
    background: var(--color-white);
}
.LogoutModal .logout-content .thumb {
    margin-bottom: 43px;
    display: inline-block;
}
.LogoutModal .logout-content .thumb img {
    width: auto;
    height: auto;
    max-width: 109px;
}
.LogoutModal .logout-content .title {
    font-family: var(--font-default);
    font-size: 21.86px;
    font-weight: 500;
    line-height: 26.23px;
    letter-spacing: 0.5464481115px;
    color: var(--color-heading);
    margin-bottom: 0;
}
.LogoutModal .logout-content .btn-groups {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 17px;
    margin-top: 36px;
}
.LogoutModal .logout-content .btn-groups .btn {
    padding: 10px 15px;
    width: 120px;
}
.LogoutModal .logout-content .btn-groups .btn-primary {
    background: #ff6767;
    border-color: #ff6767;
    color: var(--color-white);
}
.LogoutModal .logout-content .btn-groups .btn-primary:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-heading);
}

/*********************************
/*  LogOut Popup MOdal End
*********************************/
/*********************************
/*  LogOut Popup MOdal Start
*********************************/
.customModal .modal-dialog {
    max-width: 560px;
    position: relative;
}
.customModal .modal-header {
    font-family: var(--font-default);
    font-size: 16px;
    font-weight: 500;
    line-height: 14px;
    border: none;
    padding: 0;
    color: var(--color-heading2);
    margin-bottom: 24px;
    text-align: center;
    display: block;
}
.customModal .modal-header .close {
    position: absolute;
    top: 14px;
    right: 17px;
    padding: 0;
    background: transparent;
    border: none;
    outline: none;
    color: #ff3b30;
    font-size: 22px;
    z-index: 9;
    width: 22px;
    height: 22px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}
.customModal .modal-content {
    padding: 40px;
    border-radius: var(--radius);
    border: 1px solid var(--color-primary);
    background: var(--color-white);
}
.customModal .wallet-wrapper .form-control {
    font-family: var(--color-heading);
    font-size: 32px;
    font-weight: 600;
    line-height: 40px;
    color: var(--color-heading);
    border-radius: var(--radius);
    padding: 21px;
    border: 1px solid var(--color-border);
    outline: none;
    text-align: center;
}
.customModal .wallet-wrapper .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: var(--color-primary);
}
.customModal .wallet-wrapper .form-control::-webkit-input-placeholder {
    font-size: 20px;
    line-height: 100%;
    opacity: 0.5;
}
.customModal .wallet-wrapper .form-control::-moz-placeholder {
    font-size: 20px;
    line-height: 100%;
    opacity: 0.5;
}
.customModal .wallet-wrapper .form-control:-ms-input-placeholder {
    font-size: 20px;
    line-height: 100%;
    opacity: 0.5;
}
.customModal .wallet-wrapper .form-control::-ms-input-placeholder {
    font-size: 20px;
    line-height: 100%;
    opacity: 0.5;
}
.customModal .wallet-wrapper .form-control::placeholder {
    font-size: 20px;
    line-height: 100%;
    opacity: 0.5;
}
.customModal .wallet-wrapper .exchange-icon {
    margin: 16px 0 20px;
    display: block;
}
.customModal .wallet-wrapper .exchange-icon svg {
    width: 20px;
    height: 20px;
}
.customModal .wallet-wrapper .exchange-icon svg path {
    fill: var(--color-heading);
}
.customModal .wallet-wrapper .total-value {
    font-family: var(--color-heading);
    font-size: 24px;
    font-weight: 600;
    line-height: 14px;
    color: var(--color-heading);
    display: block;
}
.customModal .wallet-wrapper .convertBtn {
    margin-top: 24px;
}
.customModal .wallet-wrapper .convertBtn .btn {
    padding: 14px;
}

.amount-wrapper .amount-select {
    margin: 16px 0;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-border);
    gap: 16px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(107px, 1fr));
}
.amount-wrapper .amount-select li {
    list-style: none;
}
.amount-wrapper .amount-select li label {
    border: 1px solid var(--color-border);
    width: 100%;
    height: 44px;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}
.amount-wrapper .amount-select li label.selected {
    border: 1px solid var(--color-primary);
}
.amount-wrapper .payment-select {
    margin: 16px 0;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-border);
    gap: 16px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}
.amount-wrapper .payment-select li {
    list-style: none;
}
.amount-wrapper .payment-select li:last-of-type {
    grid-column: span 2;
}
.amount-wrapper .payment-select li label {
    border: 1px solid var(--color-border);
    width: 100%;
    height: 46px;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}
.amount-wrapper .payment-select li label img {
    width: auto;
    max-height: 20px;
    display: block;
}
.amount-wrapper .payment-select li label.selected {
    border: 1px solid var(--color-primary);
}
.amount-wrapper .payment-select li .btn {
    height: 44px;
    border-radius: 3px;
    border: none;
}

.storeItem {
    position: relative;
}

.storeItem .favorite-icon {
    width: 40px;
    height: 40px;
    background: #ffffff;
    position: absolute;
    top: 30px;
    left: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0px 0px 10px #a8a7a7;
}

.storeItem .favorite-icon a {
    color: #df0b0b;
}

.storeItem .favorite-icon a i {
    line-height: 0;
}

/*********************************
/*  LogOut Popup MOdal End
*********************************/

.discount-price-show p {
    margin-bottom: 0 !important;
    border: 1px solid #ddd;
    padding: 5px 10px;
}

table .dropdown {
    position: inherit;
}

.plyr.plyr--full-ui.plyr--video.plyr--html5.plyr--fullscreen-enabled.plyr--pip-supported.plyr__poster-enabled.plyr--paused {
    height: 500px;
}

.plyr--video {
    overflow: hidden;
    height: 500px;
}

.plyr.plyr--full-ui.plyr--video.plyr--html5.plyr--fullscreen-enabled.plyr--pip-supported.plyr__poster-enabled.plyr--playing.plyr--hide-controls {
    height: 500px;
}

/*********************************
/*  Toolbar Start
*********************************/
.template__toolbar {
    background: var(--color-white);
    width: 282px;
    position: fixed;
    right: -282px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 6669991;
    transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
    box-shadow: 0 0 9.8px 0.2px rgba(0, 0, 0, 0.14);
    transition-delay: 100ms;
    border-radius: 0 0 0 10px;
}
.template__toolbar.active {
    transform: translate(-100%, -50%);
}
.template__toolbar.active .toolbar__dropdown {
    left: -42px;
}
.template__toolbar .toolbar__dropdown {
    position: absolute;
    top: 0;
    left: -42px;
    z-index: 6669992;
    font-size: 10px;
    letter-spacing: 0.5px;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    z-index: -1;
}
.template__toolbar .toolbar__dropdown .toolbar__btn {
    height: 42px;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--color-primary);
    color: var(--color-heading);
    cursor: pointer;
    border-radius: 4px 0 0 4px;
    transition: var(--transition);
}



.template__toolbar .toolbar__dropdown .toolbar__btn:hover {
    background-color: var(--color-heading);
    color: var(--color-white);
}

.template__toolbar .toolbar__dropdown .toolbar__btn:hover .toolbar__icon{
    /* color: #fff; */
}



.template__toolbar .toolbar__dropdown .toolbar__name {
    font-size: 10px;
    color: var(--color-white);
    text-transform: uppercase;
    font-weight: var(--font-semibold);
    white-space: nowrap;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}
.template__toolbar .toolbar__dropdown .toolbar__icon {
    /* color: var(--color-heading); */
    width: 42px;
    height: 42px;
    font-size: 18px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 1 !important;
    text-align: center;
    vertical-align: middle;
    position: relative;
    transition: all ease .3s;
}







.template__toolbar .toolbar__dropdown .toolbar__icon i {
    -webkit-animation: rotating 3s infinite linear !important;
    animation: rotating 3s infinite linear !important;
}
.template__toolbar .toolbar__list {
    padding: 24px;
    font-weight: 400;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: var(--color-white);
    border-radius: 0 0 0 10px !important;
}
.template__toolbar .toolbar__related {
    font-size: 12px;
    color: var(--color-black);
    font-weight: 500;
    display: block;
    margin: 0px 0 10px;
    text-transform: uppercase;
}
.template__toolbar .color__boxed {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    margin-bottom: 20px;
}
.template__toolbar .color__boxed .input-group input {
    width: 100%;
    height: 35px;
    border-radius: 6px !important;
    border: none;
    padding: 6px;
    outline: none;
    cursor: pointer;
}
.template__toolbar .option__box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}
.template__toolbar .option__box .btn {
    border-radius: 4px;
    font-size: 12px;
    line-height: 22px;
    padding: 6px 10px;
    width: 100%;
}
.template__toolbar .option__box .btn.active {
    background: var(--color-heading);
    border: 1px solid var(--color-heading);
    color: var(--color-white);
}

[dir="rtl"] .template__toolbar .toolbar__related {
    text-align: end;
}
[dir="rtl"] .template__toolbar .color__boxed {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
[dir="rtl"] .option__box {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

@-webkit-keyframes rotating {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/*********************************
/*  Toolbar End
*********************************/

/*********************************
/*  Purchase Button Start
*********************************/
.sg-yoori-purchase-btn {
    position: fixed;
    left: 20px;
    bottom: 20px;
    background: #82b440;
    border-radius: 50%;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.3);
    z-index: 70;
}

.sg-yoori-purchase-price > span {
    font-size: 14px;
    margin: 6px -10px 0 0;
    vertical-align: top;
}

.sg-yoori-purchase,
.sg-yoori-purchase .em-logo {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}
.sg-yoori-purchase {
    position: relative;
    height: 75px;
    width: 75px;
}

.sg-yoori-purchase-price {
    font-size: 35px;
    margin-top: 3px;
    color: #fff;
}

.sg-yoori-purchase .em-logo {
    position: absolute;
    left: -16px;
    bottom: -2px;
    height: 35px;
    width: 35px;
    background: #6c9635;
    border-radius: 50%;
}
.sg-yoori-purchase .em-logo svg {
    height: 18px;
    width: 18px;
    -webkit-animation: flip 10s ease-in-out infinite;
    animation: flip 10s ease-in-out infinite;
}

.coupon-code {
    display: flex;
    justify-content: space-between;
    gap: 5px;
    margin: 10px;
    align-items: center;
}

.text-center .mt-3 img {
    width: 500px;
    text-align: left;
}


.deals-wrapper .promo-banner .banner-thumb img {
    border-radius: 10px;
    overflow: auto;
}


/* .sg-yoori-purchase-btn {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
}

 .sg-yoori-purchase-btn .sg-yoori-purchase {
    font-size: 16px;
    color: #fff;
    width: 100px;
    height: 100px;
    background: var(--color-primary);
    z-index: 99999;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sg-yoori-purchase-btn .sg-yoori-purchase .em-logo {
    width: 30px;
    display: block;
}  */
/*********************************
/*  Purchase Button End
*********************************/
