:root {
    --bg-primary-color: #FD9B09;
    --bg-secondary-color: #AF2F81;
    --bg-tertiary-color: #F16A23;
    --bg-light-color: #fff;
    --bg-dark-color: #000;
    --bg-light-gray-color: #E5E7EB;
    --bg-gray-color: #87818a;
    --text-dark-color: #212529;
    --text-light-color: #fff;
    --text-gray-color: #87818a;
}

@media all and (min-width: 992px) {
    .dropdown-menu {
        width: 13rem;
    }

    .mega-submenu {
        left: 100%;
        top: 0;
        min-width: 25rem;
    }

    .ktm-mega-menu {
        position: static;
    }

    .mega-menu {
        left: 0;
        right: 0;
        width: 100%;
    }

    .dropdown-menu li {
        position: relative;
    }

    .dropdown-menu .submenu {
        display: none;
        left: 100%;
        top: 0;
    }

    .dropdown-menu>li:hover>.submenu,
    .dropdown:hover>.dropdown-menu {
        display: block;
    }
}

.mega-menu a {
    transition: all 0.2s ease-in-out;
}

.mega-menu a:hover {
    transform: scale(1.05);
}

.mega-menu a:hover span {
    color: #FD9B09;
}

.navbar .shop .mega-menu a img,
.offcanvas .shop .mega-menu a img {
    width: 45px;
    height: 45px;
}

.navbar .brand .mega-menu a img,
.offcanvas .brand .mega-menu a img {
    width: 120px;
    height: 40px;
}

.navbar .b2b .mega-menu a img,
.offcanvas .b2b .mega-menu a img {
    width: 45px;
    height: 45px;
}

.navbar .innovation .mega-menu a img,
.offcanvas .innovation .mega-menu a img {
    width: 45px;
    height: 45px;
}

.navbar .navbar-brand img,
.offcanvas .navbar-brand img {
    /* width: 120px; */
    width: 75px;
    height: 40px;
    /* object-fit: contain; */
}

.navbar .action-icon i,
.offcanvas .action-icon i {

    /* color: #fff; */
    color: #000;
    font-size: 1rem;

}

/* .navbar .nav-link.active{
	color: #FD9B09;
	font-weight: bold;
} */

.navbar .nav-link,
.offcanvas .nav-link {
    /* color: #fff; */
    color: #000;
    font-size: 1rem;
    text-transform: capitalize;
    transition: color 0.2s ease-in-out;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: #000000;
}

.navbar .nav-link:hover,
.offcanvas .nav-link:hover {
    color: #FD9B09;
}

.navbar .nav-item.count,
.offcanvas .nav-item.count {
    position: relative;
}

.navbar .nav-item.count .count-box,
.offcanvas .nav-item.count .count-box {
    position: absolute;
    top: 22px;
    right: 1px;
    background-color: #FD9B09;
    color: #fff;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 500;
}

.search-bar {
    /* background-color: #484848; */
    background-color: #F8F9FA;
    width: 100%;
    /* height: 400px; */
    min-height: 400px;
    position: absolute;
    top: -1000px;
    z-index: 1000;
    left: 0;
    right: 0;
    /* transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1); */
    transition: top 0.3s ease-in-out;
    /* overflow-y: scroll; */
}

.search-bar.active {
    /* background-color: #484848; */
    background-color: #F8F9FA;
    width: 100%;
    /* height: 400px; */
    min-height: 400px;
    position: absolute;
    top: 50px !important;
    z-index: 1000;
    left: 0;
    /* overflow-y: scroll; */
}

.global-search-section{
    /* width: 100%;
    height: 100%; */
    /* overflow-y: scroll; */
    /* height: 350px; */
    /* overflow-y: scroll; */
}

/* .global-search{
    height: 200px;
    overflow-y: scroll;
} */

.search-bar-inner {
    padding: 50px 0;
}

.search-box {
    position: relative;
    width: 100%;
    /* max-width: 600px; */
    margin: 0 auto;
    background-color: transparent;
    border-bottom: 1px solid #c3c3c3;
}

.search-box input {
    border: none;
    outline: 0;
    box-shadow: none;
    width: 95%;
    height: 50px;
    background-color: transparent;
    font-size: 28px;
    /* color: #fff; */
    /* color: #c3c3c3; */
    color: #060607;
}

.search-bar .card{
    transition: all 0.3s ease-in-out;
}

.search-bar .card:hover{
    transform: scale(1.05);
}

.search-box input:focus {
    border: none;
    outline: 0;
    box-shadow: none;
    width: 95%;
    height: 50px;
    background-color: transparent;
    font-size: 28px;
    /* color: #fff; */
    /* color: #c3c3c3; */
    color: #060607;
}

.search-box input::placeholder {
    /* color: #c3c3c3; */
    color: #060607;
    font-size: 28px;
}

.search-box .icon {
    position: absolute;
    width: 5%;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    /* color: #fff; */
    /* color: #c3c3c3; */
    color: #060607;
    font-size: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: end;
}

.action-md-icon {
    display: none;
}

@media (max-width: 991px) {
    .action-md-icon {
        display: flex;
        align-items: center;
        justify-content: end;
        gap: 20px;
        margin: 0 10px;
        /* width: 40px; */
    }

    .navbar .nav-item.count .count-box,
    .offcanvas .nav-item.count .count-box {
        position: absolute;
        top: 13px;
        right: -8px;
        background-color: #FD9B09;
        color: #fff;
        border-radius: 50%;
        width: 17px;
        height: 17px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.8rem;
        font-weight: 500;
    }

    /* .action-md-icon .navbar-nav{
		display: flex;
		align-items: center;
		justify-content: center;
	} */
}

/* ***************************************************Top Image****************************************************/

.top-image {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    height: 450px;
    position: relative;
}

@media (min-width: 300px) and (max-width: 500px) {
    .top-image {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        text-align: center;
        background-size: cover;
        background-position: center center;
        width: 100%;
        height: 300px;
        background-repeat: no-repeat;
        position: relative;
    }
}

/*******************************************All Btn Design*****************************************/

.custom-btn {
    padding: 10px 30px;
    border-radius: 25px;
    text-decoration: none;
    border: none;
    outline: none;
    font-size: 16px;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.custom-btn-primary {
    /* background-color: #01A98E; */
    background-color: #AF2F81;
    color: #fff;
}

.custom-btn-secondary {
    /* background-color: #AF2F81; */
    background-color: #F16A23;
    color: #fff;
}

.custom-btn-secondary:hover {
    /* background-color: #AF2F81; */
    background-color: #212529;
    color: #fff;
}

.custom-btn-primary:hover {
    /* background-color: #FD9B09; */
    background-color: #212529;
    color: #fff;
}

.custom-box-design {
    position: absolute;
    bottom: -2px;
    /* left: 50%; */
    /* transform: translateX(-50%); */
    background-color: #fff;
    padding: 22px 60px;
    overflow: visible;
    border-radius: 30px 30px 0 0;
}

@media (min-width: 300px) and (max-width: 500px) {
    .custom-btn {
        padding: 8px 30px;
        /* width: 100px;
		height: 40px; */
        border-radius: 25px;
        text-decoration: none;
        font-size: 14px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
    }

    .custom-btn-primary {
        /* background-color: #01A98E; */
        background-color: #AF2F81;
        color: #fff;
    }

    .custom-btn-primary:hover {
        background-color: #FD9B09;
        color: #fff;
    }

    .custom-box-design {
        position: absolute;
        bottom: 0;
        /* left: 50%; */
        /* transform: translateX(-50%); */
        background-color: #fff;
        padding: 20px 60px;
        overflow: visible;
        border-radius: 30px 30px 0 0;
    }

}

/* .custom-box-design::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translateX(-50%);
    width: 140px;
    height: 40px;
    background: #fff;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
    z-index: 0;
}

.custom-box-design .white-box {
    position: relative;
    z-index: 1;
} */

/* ********************************************************* Category Section ****************************************************** */

.category-section {

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    padding: 30px 20px;
    /* background-color: #f8f9fa; */
    background-color: #FFFFFF;
    border-radius: 10px;

}

.heading .title {
    font-size: 28px;
    font-weight: bold;
    color: #A1A4A7;
    text-align: center;
    margin-bottom: 20px;
    display: inline-flex;
}

.heading a {
    text-decoration: none;
}

.heading .text {
    font-size: 18px;
    color: #666;
    text-align: center;
    /* margin-bottom: 20px; */
}

.heading .icon {
    width: 55px;
    height: 55px;
    background-color: #000;
    border-radius: 50%;
    padding: 5px;
    margin-left: 5px;
    /* display: flex;
	align-items: center;
	justify-content: center; */
    cursor: pointer;
    transform: background 0.3s ease-in-out;
}

.heading .icon:hover {
    background-color: #FD9B09;
}

.heading .icon i {
    font-size: 16px;
    color: #fff;
}

.category-section .category-item {
    padding: 22px 15px;
    background-color: #E5E7EB;
    border-radius: 40%;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.category-section .category-item:hover {
    /* background-color: rgba(204, 215, 237, 1); */
    background-color: #AD2989;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2);
}

.category-section .category-item img {
    width: auto;
    height: 70px;
    border-radius: 10px;
    transition: transform 0.3s ease-in-out;
}

.category-section .category-item img:hover {
    transform: scale(1.05);
}

.category-section .category-item .text {
    font-size: 16px;
    color: #333;
    text-align: center;
}

.category-section .category-item:hover .text {
    color: #fff;
}

@media(min-width: 300px) and (max-width: 500px) {
    .category-section {

        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
        padding: 30px 10px;
        /* background-color: #f8f9fa; */
        background-color: #FFFFFF;
        border-radius: 10px;

    }
}

/* *********************************************************** Banner Section ************************************************************* */
.banner-section {
    /* padding: 30px 10px; */
    padding: 30px 20px;
    background-color: #FFFFFF;
}

.banner-section .banner-image img {
    width: 100%;
    height: 250px;
    border-radius: 30px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

@media(min-width: 300px) and (max-width: 500px) {
    .banner-section {
        /* padding: 30px 10px; */
        padding: 30px 10px;
        background-color: #FFFFFF;
    }
}

/* ********************************************************* Flash Sale Section **************************************************************** */

.flash-sale-section {
    padding: 30px;
    background-color: #FFFFFF;
}

.flash-sale-banner img {
    width: 100%;
    height: 260px;
    border-radius: 60px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.right-arrow-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: var(--bg-tertiary-color);
    border-radius: 50%;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

@media (min-width: 300px) and (max-width: 500px) {
    .right-arrow-icon {
        width: 40px;
        height: 35px;
        border-radius: 50%;
        font-size: 14px;
    }
}

.right-arrow-icon:hover {
    background-color: var(--bg-secondary-color);
    color: #fff;
}

/* todo: ******************************** Swiper Js Slider CSS ********************************* */

.flash-sale .swiper {
    position: relative;
    width: 100%;
    height: 100%;
    padding-bottom: 40px;
    background-color: transparent;
}

/* Position pagination 20px below the slider */
.swiper-pagination {
    bottom: -1px !important;
    left: 0;
    width: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Change pagination bullet color */
.swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    /* background: var(--bg-primary-color);  */
    background-color: var(--bg-light-gray-color);
    opacity: 1;
    margin: 0 6px;
}

/* Change active bullet color */
.swiper-pagination-bullet-active {
    background: var(--bg-secondary-color);
    /* Or any color you want */
}

@media(min-width: 300px) and (max-width: 500px) {
    .flash-sale-section {
        padding: 30px 10px;
        background-color: #FFFFFF;
    }
}

/************************************************************Second Banner Section****************************************************************/

.second-banner-section {
    padding: 30px;
    background-color: #FFFFFF;
    position: relative;
}

@media(min-width: 300px) and (max-width: 500px) {
    .second-banner-section {
        padding: 30px 10px;
        background-color: #FFFFFF;
    }
}

.second-banner-section .comming-soon {
    /* position: relative; */
    width: 100%;
    height: 300px;
    background-color: #F3F2F7;
    border-radius: 35px;
    /* z-index: 100; */
}

.second-banner-section .custom-box-design {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    padding: 20px 60px;
    overflow: visible;
    border-radius: 30px 30px 0 0;
}

.second-banner-box {
    border-radius: 30px;
}

.second-banner-box .card {
    border: none;
    outline: none;
    border-radius: 30px;
    position: relative;
}


.second-banner-box .card img {
    width: 100%;
    height: 300px;
    border-radius: 30px;
}

.second-banner-box .second-banner-box-content {

    width: 220px;
    height: 180px;
    background-color: rgba(139, 123, 113, 0.6);
    padding: 15px;
    border-radius: 30px;

}

.second-banner-box .second-banner-box-content .title {
    font-size: 28px;
    color: #fff;
    font-weight: 400;
    text-transform: capitalize;
    /* margin-bottom: 10px; */
}

.second-banner-box .second-banner-box-content .text {
    font-size: 12px;
    color: #fff;
    font-weight: 300;
    text-transform: capitalize;
    /* margin-bottom: 10px; */
}

/* .second-banner-section .comming-soon .comming-soon-box {
	position: absolute;
	padding: 10px;
	background-color: #5b3636;
	border-radius: 25px;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	height: 100%;
	z-index: 300;
} */

/************************************************************Limited Stock Section****************************************************************/

.limited-stock-section {
    padding: 30px 20px;
    background-color: #FFFFFF;
}

.product-item {
    width: 100%;
    padding: 15px;
    background-color: #F3F2F7;
    position: relative;
    border-radius: 25px;
    /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.product-item:hover {
    background-color: #FFFFFF;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px;
    transform: scale(1.015);
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.product-item .top-tag {
    text-decoration: none;
    color: #87818a;
    font-size: 14px;
    font-weight: 400;
    position: absolute;
    top: 12px;
    left: 15px;
    display: block;
}

.product-item .featured-tag {
    padding: 3px 10px;
    background-color: var(--bg-tertiary-color);
    color: var(--text-light-color);
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    top: 38px;
    left: 15px;
    display: block;
    border-radius: 8px;
}

.product-item .low-stock-tag {
    padding: 3px 10px;
    background-color: var(--bg-tertiary-color);
    color: var(--text-light-color);
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    top: 38px;
    left: 85px;
    display: block;
    border-radius: 8px;
}

.product-item .bg-svg img {
    position: absolute;
    top: 10px;
    right: 15px;
    width: 125px;
    height: 125px;
    z-index: 1;
}

.product-item .product-img {
    position: relative;
    z-index: 2;
    padding-bottom: 15px;
}

.product-item .product-img img {
    width: 100%;
    height: 150px;
}

.product-item .name-type .product-name {
    font-size: 16px;
    color: #87818a;
    font-weight: 500;
    text-transform: capitalize;
}

.product-item .name-type .product-name:hover {
    color: #FD9B09;
    text-decoration: none;
}

.product-item .name-type .product-type {
    font-size: 14px;
    color: #87818a;
    font-weight: 400;
    text-transform: capitalize;
}

.product-item .name-type .product-type:hover {
    color: #FD9B09;
    text-decoration: none;
}

.product-item .price {
    font-size: 20px;
    color: #000;
    font-weight: 500;
    /* margin-top: 10px; */
}

.product-item .main-price {
    font-size: 16px;
    color: #87818a;
    font-weight: 400;
    text-decoration: line-through;
    margin-left: 1px;
}

.product-item .off {
    padding: 2px 5px;
    border-radius: 15px;
    font-size: 14px;
    background-color: #F16D27;
    color: #fff;
    font-weight: 400;
    margin-top: 5px;
    margin-left: 1px;
    margin-right: 1px;
}

.product-item .add-to-cart {
    background-color: #e5e7eb;
    /* color: #fff; */
    /* padding: 10px 20px; */
    width: 45px;
    height: 45px;
    border-radius: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.product-item .add-to-cart i {
    color: #000;
    font-size: 16px;
}

.product-item .add-to-cart:hover {
    background-color: #FD9B09;
    color: #fff;
}

.product-item .add-to-cart:hover i {
    color: #fff;
}

@media(min-width: 300px) and (max-width: 500px) {

    .limited-stock-section {
        padding: 30px 10px;
        background-color: #FFFFFF;
    }

    .product-item {
        width: 100%;
        padding: 5px;
        background-color: #F3F2F7;
        position: relative;
        border-radius: 20px;
        /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    }

    /* .product-item:hover {
		background-color: #FFFFFF;
		box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px;
		transform: scale(1.015);
		transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
	} */

    .product-item .top-tag {
        text-decoration: none;
        color: #87818a;
        font-size: 12px;
        font-weight: 400;
        position: absolute;
        top: 10px;
        left: 10px;
        display: block;
    }

    .product-item .featured-tag {
        padding: 2px 8px;
        background-color: var(--bg-tertiary-color);
        color: var(--text-light-color);
        font-size: 10px;
        font-weight: 400;
        position: absolute;
        top: 32px;
        left: 10px;
        display: block;
        border-radius: 8px;
    }

    .product-item .bg-svg img {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 75px;
        height: 75px;
        z-index: 1;
    }

    .product-item .product-img {
        position: relative;
        z-index: 2;
        padding-bottom: 15px;
    }

    .product-item .product-img img {
        width: 100%;
        height: 120px;
    }

    .product-item .name-type .product-name {
        font-size: 14px;
        color: #87818a;
        font-weight: 500;
        text-transform: capitalize;
    }

    .product-item .name-type .product-name:hover {
        color: #FD9B09;
        text-decoration: none;
    }

    .product-item .name-type .product-type {
        font-size: 12px;
        color: #87818a;
        font-weight: 400;
        text-transform: capitalize;
    }

    .product-item .name-type .product-type:hover {
        color: #FD9B09;
        text-decoration: none;
    }

    .product-item .price {
        font-size: 12px;
        color: #000;
        font-weight: 500;
        /* margin-top: 10px; */
    }

    .product-item .main-price {
        font-size: 10px;
        color: #87818a;
        font-weight: 400;
        text-decoration: line-through;
        margin-left: 1px;
    }

    .product-item .off {
        padding: 2px 5px;
        border-radius: 15px;
        font-size: 9px;
        background-color: #F16D27;
        color: #fff;
        font-weight: 400;
        margin-top: 5px;
        margin-left: 1px;
        margin-right: 1px;
    }

    .product-item .add-to-cart {
        background-color: #e5e7eb;
        /* color: #fff; */
        /* padding: 10px 20px; */
        width: 35px;
        height: 35px;
        border-radius: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
    }

    .product-item .add-to-cart i {
        color: #000;
        font-size: 14px;
    }

    .product-item .add-to-cart:hover {
        background-color: #FD9B09;
        color: #fff;
    }

    .product-item .add-to-cart:hover i {
        color: #fff;
    }

}

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


    .product-item {
        width: 100%;
        padding: 15px;
        background-color: #F3F2F7;
        position: relative;
        border-radius: 25px;
        /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    }

    .product-item:hover {
        background-color: #FFFFFF;
        box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px;
        transform: scale(1.015);
        transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    }

    .product-item .top-tag {
        text-decoration: none;
        color: #87818a;
        font-size: 16px;
        font-weight: 400;
        position: absolute;
        top: 12px;
        left: 15px;
        display: block;
    }

    .product-item .bg-svg img {
        position: absolute;
        top: 10px;
        right: 15px;
        width: 145px;
        height: 145px;
        z-index: 1;
    }

    .product-item .product-img {
        position: relative;
        z-index: 2;
        padding-bottom: 15px;
    }

    .product-item .product-img img {
        width: 100%;
        height: 180px;
    }

    .product-item .name-type .product-name {
        font-size: 18px;
        color: #87818a;
        font-weight: 500;
        text-transform: capitalize;
    }

    .product-item .name-type .product-name:hover {
        color: #FD9B09;
        text-decoration: none;
    }

    .product-item .name-type .product-type {
        font-size: 16px;
        color: #87818a;
        font-weight: 400;
        text-transform: capitalize;
    }

    .product-item .name-type .product-type:hover {
        color: #FD9B09;
        text-decoration: none;
    }

    .product-item .price {
        font-size: 22px;
        color: #000;
        font-weight: 500;
        /* margin-top: 10px; */
    }

    .product-item .add-to-cart {
        background-color: #e5e7eb;
        /* color: #fff; */
        /* padding: 10px 20px; */
        width: 55px;
        height: 55px;
        border-radius: 55px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
    }

    .product-item .add-to-cart i {
        color: #000;
        font-size: 18px;
    }

    .product-item .add-to-cart:hover {
        background-color: #FD9B09;
        color: #fff;
    }

    .product-item .add-to-cart:hover i {
        color: #fff;
    }

}

/* ***************************************** Featured Products *********************************************************** */
/* ***************************************** Featured Products Banner **************************************************** */

.featured-products-section {
    padding: 20px;
    background-color: #FFFFFF;
}

@media(min-width: 300px) and (max-width: 500px) {
    .featured-products-section {
        padding: 30px 10px;
        background-color: #FFFFFF;
    }
}

.featured-products-section .featured-product-banner {
    padding-bottom: 50px;
}

.featured-product-banner .custom-box-design {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    padding: 20px 60px;
    overflow: visible;
    border-radius: 30px 30px 0 0;
}

/* ************************************************************** Campaign Section ************************************************************* */

.campaign-section {
    padding: 20px;
    background-color: #FFFFFF;
}

.campaign-section .campaign-item {
    padding-bottom: 40px;
}

.campaign-item .card {
    border: none;
    outline: none;
    border-radius: 30px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px;
}

.campaign-item img {
    width: 100%;
    height: 160px;
    border-radius: 30px;
}

.campaign-item .campaign-item-box {
    padding: 8px 20px;
    background-color: rgba(61, 63, 67, 0.7);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    border-radius: 25px;
    /* position: absolute;
	bottom: 10px;
	left: 25%; */
}

.campaign-item .campaign-item-box .title {
    font-size: 42px;
    color: #fff;
    font-weight: 500;
    text-transform: capitalize;
    letter-spacing: 0.5rem;
    text-align: center !important;
}

.campaign-item .campaign-item-box .text {
    font-size: 18px;
    color: #fff;
    font-weight: 400;
    text-transform: capitalize;
    text-align: center !important;
}

/* ********************************************************** Get To Know ********************************************************************* */
.get-to-know-section {
    padding: 20px;
    background-color: #FFFFFF;
}

.get-to-know .heading {
    font-size: 42px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}

.get-to-know .text {
    font-size: 28px;
    color: #666;
    text-align: center;
    margin-bottom: 28px;
}

.get-to-know .get-to-know-item img {
    width: 100%;
    height: 330px;
    border-radius: 15px;
}

@media (min-width: 1030px) and (max-width: 1440px) {
    .get-to-know .get-to-know-item img {
        width: 100%;
        height: 380px;
        border-radius: 15px;
    }
}

@media (min-width: 1441px) and (max-width: 2560px) {
    .get-to-know .get-to-know-item img {
        width: 100%;
        height: 500px;
        border-radius: 15px;
    }
}

/* ********************************************************* Footer Section ********************************************************** */
.footer-section {
    padding: 40px 20px;
    background-color: #212529;
}

.footer .top {
    padding-bottom: 20px;
    border-bottom: 1px solid #ff9900;
}

.footer .top img {
    height: 25px;
}

.footer .top a {
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease-in-out;
}

.footer .top a:hover {
    text-decoration: underline;
}

.footer .heading-title {
    font-size: 20px;
    color: #ff9900;
    font-weight: 500;
    margin: 20px 0;
}

.footer a {
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease-in-out;
}

.footer a:hover {
    color: #ff9900;
    text-decoration: underline;
}

.footer .icon svg {
    width: 24px;
    height: 24px;
    color: #fff;
    margin-right: 5px;
    transition: color 0.2s ease-in-out;
}

.footer .icon svg:hover {
    color: #ff9900;
}

.footer .certified-by img {
    width: 60px;
    height: 25px;
}

.footer .we-accept img {
    width: 35px;
    height: 25px;
}

/* ***************************** Splide Js ***************************** */

.product-sliders .swiper {
    width: 100%;
    height: 100%;
    /* margin: 0 !important; */
}

.product-sliders .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #444;
    display: flex;
    justify-content: center;
    align-items: center;
}

.product-sliders .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-sliders .swiper {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
}

.product-sliders .swiper-slide {
    background-size: cover;
    background-position: center;
}

.product-sliders #product-main-swiper {
    height: 80%;
    width: 100%;
}

.product-sliders #product-thumbs-swiper {
    height: 20%;
    box-sizing: border-box;
    padding: 10px 0;
}

.product-sliders #product-thumbs-swiper .swiper-slide {
    width: 25%;
    height: 100%;
    opacity: 0.8;
    /* opacity: 1; */
}

.product-sliders #product-thumbs-swiper .swiper-slide-thumb-active {
    opacity: 1;
    outline: 2px solid #FDAF3E;
}

.product-sliders .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-main-next,
.product-main-prev {
    width: 32px;
    height: 32px;
    font-size: 18px;
    padding: 4px;
    border-radius: 50%;
    background: #fff;
    color: #212529;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-main-next::after,
.product-main-prev::after {
    display: none;
}

.product-main-next i,
.product-main-prev i {
    font-size: 18px;
    color: #212529;
    margin: 0 auto;
}

/* ********************************************************* Product Modal ******************************************************* */

.modal-content button.btn-close.text-end {
    position: absolute;
    top: 4px;
    right: 12px;
}

.modal-content {
    border-radius: 35px;
}

.product-modal .product-name {
    font-size: 26px;
    font-weight: 500;
    color: rgb(81 81 81);
}


.product-modal .price,
.product-moda .off {
    font-size: 18px;
    font-weight: 400;
    color: rgb(81 81 81);
}

.product-modal .main-price {
    padding: 1px 10px;
    background-color: rgb(255 153 0);
    color: white;
    border-radius: 10px;
    font-size: 18px;
}

.product-modal .brand img {
    width: 100px;
    padding-top: 5px;
}

.product-modal .brand-text {
    font-size: 18px;
    font-weight: 400;
    color: rgb(81 81 81);
}

.product-modal .description {
    margin: 15px 0;
    padding: 25px;
    background-color: rgb(231 233 235);
    font-size: 14px;
    line-height: 22px;
    border-radius: 25px;
    min-height: 220px;
    font-weight: 400;
}

.product-modal .stock-in {
    color: #AA2A88;
    font-size: 18px;
    font-weight: 400;
}

.product-modal .color {
    color: rgb(81 81 81);
    font-weight: 500;
    font-size: 18px;
}

.product-modal .color-name {
    color: rgb(59 130 246);
    font-weight: 400;
    font-size: 18px;
}

.product-modal .custom-btn {
    /* padding: 10px 30px; */
    /* width: 180px; */
    width: 100%;
    text-align: center;
    border-radius: 25px;
    text-decoration: none;
    font-size: 16px;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.product-modal .custom-btn-primary {
    /* background-color: #01A98E; */
    background-color: #AF2F81;
    color: #fff;
}

.product-modal .custom-btn-secondary {
    /* background-color: #AF2F81; */
    /* background-color: #F16A23; */
    background-color: var(--bg-tertiary-color);
    color: #fff;
}

.product-modal .custom-btn-light {
    /* background-color: #AF2F81; */
    /* background-color: #F16A23; */
    background-color: var(--bg-light-gray-color);
    color: #000;
}

.product-modal .custom-btn-secondary:hover {
    /* background-color: #AF2F81;
	color: #fff; */
    background-color: #484848;
    color: #fff;
}

.product-modal .custom-btn-primary:hover {
    /* background-color: #FD9B09;
	color: #fff; */
    background-color: #484848;
    color: #fff;
}

.product-modal .custom-btn-light:hover {
    background-color: #484848;
    color: #fff;
}

/* *************************************************************************************************************************************** */
/*todo: ************************************************** Category Page CSS ************************************************************* */
/* *************************************************************************************************************************************** */

.single-page-top-image .card-img-overlay {
    display: flex;
    align-items: center;
    justify-content: center;
}

.single-page-top-image .page-name {
    padding: 10px 35px;
    background-color: rgba(95, 100, 101, 0.6);
    font-size: 28px;
    font-weight: 500;
    border-radius: 30px;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
}

.product-info-outer {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 10px;
}

/* .product-info-outer .heading-icon{
	width: 45px;
	height: 45px;
	background-color: #212529;
	border-radius: 10px;
} */

.page .page-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: #212529;
    border-radius: 10px;
}

.page .page-icon img {
    width: 35px;
    height: 35px;
}

.product-info-outer .img-div {
    width: 45px;
    height: 45px;
    border-radius: 8px;
    background-color: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-info-outer img {
    width: 35px;
    /* height: 35px; */
}

.product-info-outer .brand-name {
    font-size: 18px;
    color: rgba(61, 63, 67, 0.7);
}

.product-info-outer .product-name {
    font-size: 16px;
    color: rgba(61, 63, 67, 0.7);
}

.breadcrumb span,
.breadcrumb a {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.8);
    text-decoration: none;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

/* *************************************************************** Brands ************************************************************** */

.brand-lists .brand .display-img img {
    width: 100%;
    height: 200px;
    border-radius: 20px;
}

.brand-lists .brand .display-img {
    position: relative;
}

.brand-lists .brand .display-img-overlay {
    display: none;
    transition: all 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.brand-lists .brand .display-img:hover .display-img-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 10;
    border-radius: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: #fff;
}

.brand-lists .brand .brand-img {
    width: 55px;
    height: 60px;
    background-color: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.brand-lists .brand .brand-img img {
    width: 40px;
}

.brand-lists .brand .name {
    font-size: 22px;
    color: rgba(95, 100, 101, 0.8);
    text-decoration: none;
    font-weight: 500;
}

.brand-lists .brand .title {
    font-size: 18px;
    color: rgba(95, 100, 101, 0.6);
    text-decoration: none;
    font-weight: 400;
}

/* ************************************************************** Single Brand Page Product ************************************************** */

.brand-isotop {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    flex-wrap: wrap;
}

.brand-isotop .brand-isotop-item {
    text-decoration: none;
    padding: 10px 20px;
    background-color: #F3F2F7;
    color: #666;
    border-radius: 10px;
    font-size: 16px;
}

.brand-isotop .brand-isotop-item.active {
    text-decoration: none;
    padding: 10px 20px;
    background-color: #FAAB18;
    color: #fff;
    border-radius: 10px;
    font-size: 16px;
}

/* ************************************************************Single Product Details********************************************************** */

.product-all-details {
    position: relative;
}

/* .product-details {
	position: relative;
} */

.product-details .top-img img {

    width: 100%;
    height: 400px;

}

/* .product-details-card-section{
	background-color: #F3F2F7;
	border-radius: 150px;
	position: absolute;
	bottom: 60px;
	bottom: 0;
	width: 100%;
	margin: 0;
	left: 0;
	right: 0;
	z-index: 500;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
} */

.product-details-card-section {
    /* background-color: #F3F2F7; */
    position: relative;
}

.product-details-card {
    background-color: #F3F2F7;
    border-radius: 100px;
    position: relative;
    /* bottom: 60px; */
    top: -80px;
    width: 100%;
    margin: 0;
    left: 0;
    right: 0;
    z-index: 500;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.product-details-card .container-fluid {
    padding: 50px;
}

.products-details .product-name {
    font-size: 26px;
    font-weight: 500;
    color: rgba(95, 100, 101, 1);
}

.products-details .product-type {
    font-size: 18px;
    font-weight: 400;
    color: rgba(95, 100, 101, 1);
}

.products-details .off {
    font-size: 18px;
    font-weight: 500;
    color: rgb(60, 64, 65);
}

.products-details .regular-price {
    padding: 5px 10px;
    background-color: #FF9900;
    color: #fff;
    border-radius: 10px;
    text-decoration: line-through;
    font-size: 18px;
    font-weight: 500;
}

.products-details .price {
    font-size: 18px;
    font-weight: 500;
}

.products-details .in-stock {
    font-size: 20px;
    color: #00CC8D;
    font-weight: 500;
    text-transform: capitalize;
}

.quantity {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    padding: 0 10px;
    border: 1px solid #000;
    border-radius: 10px;
}

.quantity .minus,
.quantity .plus {
    font-size: 28px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

.qty {
    width: 40px;
    text-align: center;
    border-radius: 10px;
    height: 42px;
    background-color: transparent;
    overflow: hidden;
    border: 1px solid #000;
}

.qty:focus,
.qty:active {
    background-color: #fff;
    overflow: hidden;
    border: 1px solid #000;
}

/* .product-details-card{
	padding: 30px;
} */

.featured-products-section.related-products {
    position: relative;
    padding-top: 150px;
}

/* Adjust the height as needed */
.productDetailsSwiper {
    width: 100%;
    max-width: 100%;
    height: 350px;
    padding-bottom: 40px;
}

.productDetailsSwiper .swiper-slide img {
    width: 90%;
    height: 90%;
    object-fit: contain;
    /* or 'cover' if you want to fill the area */
    display: block;
    margin: 0 auto;
}

.products-details .social {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
}

@media(max-width: 768px) {
    .products-details .social {
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 10px;
    }
}

.products-details .social a {
    text-decoration: none;
}

.products-details .social a img {
    width: 35px;
    height: 35px;
}

.products-details .social .whatsapp {
    padding: 8px;
    background-color: #4ECC5C;
    border-radius: 5px;
}

.products-details .social .whishlist {
    padding: 8px;
    background-color: #FFAA00;
    border-radius: 5px;
}

.products-details .social .share {
    padding: 8px;
    background-color: #3E3B36;
    border-radius: 5px;
}

/* todo: ****************************** rating ************************* */


.rate {
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px
}

.rating {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center
}

.rating>input {
    display: none
}

.rating>label {
    position: relative;
    width: 0.8em;
    font-size: 26px;
    font-weight: 300;
    color: #FFD600;
    cursor: pointer
}

.rating>label::before {
    content: "\2605";
    position: absolute;
    opacity: 0
}

.rating>label:hover:before,
.rating>label:hover~label:before {
    opacity: 1 !important
}

.rating>input:checked~label:before {
    opacity: 1
}

.rating:hover>input:checked~label:before {
    opacity: 0.4
}

.buttons {
    top: 36px;
    position: relative
}

.rating-submit {
    border-radius: 8px;
    color: #fff;
    height: auto
}

.rating-submit:hover {
    color: #fff
}

.products-details .rating-review {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
}

@media(max-width: 768px) {
    .products-details .rating-review {
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 10px;
    }
}

.products-details .rating-review .review {
    color: #9AA3DB;
    font-size: 16px;
    font-weight: 400;
}

.brand .title {
    font-size: 20px;
    font-weight: 400;
}

.brand .name {
    font-size: 18px;
    font-size: 400;
    color: #4C61FC;
}

.brand img {
    width: 80px;
    height: auto;
}

.products-details .rating-icon {
    width: 30px;
}

.products-details .booking-money-icon {
    width: 30px;
}

.products-details .emi-icon {
    width: 50px;
}

.products-details .review-text,
.products-details .booking-money-text,
.products-details .emi-text {
    font-size: 14px;
    font-weight: 400;
    color: #87818a;
    padding-top: 5px;
}

.products-details .hr-line {

    width: 2px;
    height: 80px;
    background-color: #CBD5E1;

}

.product-additional-details-section {

    background-color: #E9EAEC;
    /* position: relative; */
}

.product-additional-details {

    /* padding: 30px; */
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;

}

.product-additional-details-section {
    /* background-color: #E9EAEC; */
    position: relative;
}

.product-additional-details-card {
    background-color: #E9EAEC;
    /* border-radius: 100px; */
    border-bottom-left-radius: 100px;
    border-bottom-right-radius: 100px;
    position: absolute;
    /* bottom: 60px; */
    top: -160px;
    width: 100%;
    margin: 0;
    left: 0;
    right: 0;
    z-index: 400;
    /* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
}

.product-additional-details-card .container-fluid {
    padding-top: 110px;
    padding-bottom: 50px;
    padding-left: 50px;
    padding-right: 50px;
}

.product-details-tab a {
    text-decoration: none;
    padding: 8px 15px;
    background-color: #FFFFFF;
    color: black;
    border-radius: 15px;
}

.product-details-tab a.active {
    background-color: #FF9900;
    color: #FFFFFF;
}

.product-details-tab-content {
    background-color: #FFFFFF;
    padding-top: 280px;
}

@media(min-width: 375px) and (max-width: 500px) {
    .product-details-tab-content {
        background-color: #FFFFFF;
        padding-top: 350px !important;
    }
}

@media(min-width: 300px) and (max-width: 375px) {
    .product-details-tab-content {
        background-color: #FFFFFF;
        padding-top: 450px !important;
    }
}

.product-details-tab-content .additional-specifications img {
    width: 100%;
    height: 450px;
    padding: 10px 0;
}

/* ******************************************** Login ************************************************ */

.login {
    padding: 20px;
}

.login .forgot-password {
    text-decoration: none;
    color: #3E3B36;
    font-weight: 500;
}

.login .forgot-password:hover {
    text-decoration: underline;
}

.login .sign-up {
    text-decoration: none;
    color: #334155;
    font-weight: 500;
}

.login .sign-up:hover {
    text-decoration: underline;
}

.single-page-top-image img {
    width: 100%;
    height: 250px;
}

/* ************************************************************ Wishlist *********************************************************** */

.wishlist-section {
    background-color: #FFFFFF;
    padding: 20px;
}

.wishlist .wishlist-item {
    padding-bottom: 8px;
    margin-bottom: 20px;
    border-bottom: 1px solid #e5e7eb;
}

.wishlist .wishlist-item .img {
    width: 105px;
    padding: 5px;
    border: 1px solid #e5e7eb;
}

.wishlist .wishlist-item .name {
    font-size: 18px;
    color: #000;
    font-weight: 400;
    text-decoration: none;
}

.wishlist .wishlist-item .price {
    font-size: 18px;
    color: #000;
    font-weight: 400;
}

.wishlist .wishlist-item .main-price {
    padding: 3px 6px;
    font-size: 16px;
    background-color: #F16A23;
    color: #fff;
    font-weight: 400;
    border-radius: 20px;
    text-decoration: line-through;
}

.wishlist .wishlist-item .delete-icon-link {
    display: flex;
    align-items: center;
    justify-content: end;
}

.wishlist .wishlist-item .delete-icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background color 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.wishlist .wishlist-item .delete-icon svg {
    color: rgb(239 68 68);
    /* color: white; */
    width: 25px;
    height: 25px;
    transition: color 0.2s ease-in-out;
}

.wishlist .wishlist-item .delete-icon:hover {
    background-color: rgb(239 68 68);
}

.wishlist .wishlist-item .delete-icon:hover svg {
    color: white;
    width: 25px;
    height: 25px;
}

/* ****************************************************** Cart Section *********************************************************** */

/* .cart-section{
	margin-bottom: 160px;
} */

.cart-section .cart-item-list {
    background-color: #F3F2F7;
    padding: 50px 30px;
    border-radius: 50px;
}

.cart-section .cart-item-list .table,
.cart-section .cart-item-list table,
.cart-section .cart-item-list table tbody,
.cart-section .cart-item-list table tr,
.cart-section .cart-item-list table td,
.cart-section .cart-item-list table th {
    background-color: #F3F2F7 !important;
}

.cart-section .cart-item-list table thead tr {
    font-size: 18px;
    font-weight: 500;
    color: rgb(60, 64, 65);
}

.cart-section .cart-item-list table tbody tr {
    font-size: 16px;
    font-weight: 400;
    color: rgb(60, 64, 65);
}



.cart-section .cart-item-box {
    position: relative;
    margin-bottom: 160px;
}

.cart-section .cart-item-box .cart-details {
    background-color: #F3F2F7;
    padding: 20px;
    border-radius: 60px;
    position: relative;
    z-index: 300;
}

.cart-item-box .cart-details .close-icon {
    text-decoration: none;
    font-size: 18px;
    color: #334155;
    display: flex;
    align-items: start;
    justify-content: end;
    gap: 10px;
    padding: 5px;
    transition: color 0.2s ease;
}

.cart-item-box .cart-details .close-icon:hover {
    color: #F69025;
}

.cart-item-box .cart-details .img {
    align-items: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}


.cart-item-box .cart-details img {
    height: 180px;
}

.cart-item-box .cart-details .name {
    font-size: 20px;
    color: #5C5C5C;
    font-weight: 500;
}

.cart-item-box .cart-details .feature {
    font-size: 16px;
}

.cart-item-box .cart-additional-details {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -160px;
    z-index: 200;
    background-color: #E8E9EB;
    padding: 80px 20px 30px 20px;
    border-bottom-left-radius: 60px;
    border-bottom-right-radius: 60px;
}

.cart-additional-details .brand {
    padding: 5px 0;
}

.cart-additional-details .brand .title {
    font-size: 18px;
    font-weight: 500;
    color: #334155;
}

.cart-additional-details .brand img {
    width: 100px;
}

.cart-additional-details .price {
    padding: 5px 0;
}

.cart-additional-details .price .title {
    font-size: 18px;
    font-weight: 500;
    color: #334155;
}

.cart-additional-details .price .number {
    font-size: 18px;
    font-weight: 400;
    color: #334155;
}

.cart-additional-details .quantity-box .title {
    font-size: 18px;
    font-weight: 500;
    color: #334155;
    padding: 5px 0;
}

.cart-additional-details .quantity-box .quantity {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
    border: 1px solid #A72987;
    padding: 0 8px;
    border-radius: 5px;
    /* padding: 5px; */
}

.cart-additional-details .quantity-box .quantity .qty-input,
.cart-additional-details .quantity-box .quantity .qty-input:focus,
.cart-additional-details .quantity-box .quantity .qty-input:active {
    width: 40px;
    text-align: center;
    border: 1px solid #A72987;
    padding: 2px 0;
    background-color: transparent;
    border-radius: 5px;
    color: #6a6c6d;
}

.cart-additional-details .quantity-box .quantity .minus i,
.cart-additional-details .quantity-box .quantity .plus i {
    font-size: 14px;
    cursor: pointer;
    color: #6a6c6d;
}

.contact-us-section {
    background-color: #FFFFFF;
}

.contact-us {
    padding: 20px;
}

@media(max-width: 430px) {
    .contact-us {
        padding: 20px 10px;
    }
}

.contact-us .google-map iframe {
    width: 100%;
    height: 400px;
}

.contact-us .contact-details a {
    text-decoration: none;
    font-size: 18px;
    color: #334155;
}

/* *********************************************************** abous-us-section *********************************************************** */

.abous-us-section {
    background-color: #fff;
    padding: 60px 20px;
}

@media (max-width: 430px) {

    .abous-us-section {
        background-color: #fff;
        padding: 60px 5px;
    }

}

.about-us .title {
    font-size: 52px;
    color: #707070;
    font-weight: 500;
}

.about-us .sub-title {
    font-size: 32px;
    color: #707070;
    font-weight: 500;
}

.about-us .title-border {
    display: inline-flex;
    padding-bottom: 15px;
    border-bottom: 5px solid #707070;
}

.about-us .details {
    font-size: 18px;
    color: #707070;
    padding-top: 10px;
}

.about-us .details-sm {
    font-size: 14px;
    color: #707070;
    padding-top: 10px;
}

.about-us .owner-img {
    position: relative;
}

.about-us .owner-img img {
    width: 100%;
    height: 480px;
    border-radius: 35px;
    position: relative;
    z-index: 8;
}

.about-us .owner-img .owner-img-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    padding: 10px 20px;
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 35px;
}

.about-us .owner-img .owner-img-overlay .name {
    font-size: 28px;
    color: #fff;
    margin: 0;
    padding: 0;
    padding-top: 5px;
}

.about-us .owner-img .owner-img-overlay .designation {
    font-size: 18px;
    color: #fff;
    margin: 0;
    padding: 0;
    padding: 10px 0;
}

.about-us-tab {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: start;
    gap: 10px;
    /* padding-top: 80px; */
}

.about-us-tab .link {
    padding: 15px 30px;
    background-color: #F3F2F6;
    border-radius: 15px;
    font-size: 18px;
    cursor: pointer;
    transition: background color 0.3s ease-in-out;
}

.about-us-tab .link:hover {
    background-color: #FF9900;
    color: #fff;
}

.gray-box-div {
    padding: 30px;
    background-color: #F3F2F6;
    border-radius: 35px;
    margin: 20px 0;
}

.yearly-achievement .bullet-line-design {
    margin-top: 25px;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 10px;
}

.yearly-achievement .bullet-line-design .bullet {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #707070;
}

.yearly-achievement .bullet-line-design .line {
    width: 35px;
    height: 8px;
    background-color: #DDDCDE;
}

.about-us .social-media-presence img {
    width: 100%;
    height: 500px;
    border-radius: 50px;
}

.about-us .our-certifications img {
    width: 280px;
    height: 400px;
    border-radius: 50px;
    margin-bottom: 10px;
}

.about-us .our-partners img {
    width: 150px;
    height: auto;
    /* border-radius: 50px; */
    margin: 10px;
}

.brand-authentication .certifications {

    background-color: #F3F2F6;
    padding: 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 15px;
    border-radius: 25px;

}

.brand-onboard .img {
    width: 100%;
    height: 350px;
    border-radius: 60px;
}

.brand-onboard .brand-img {
    width: 120px;
}

.brand-authentication .certifications img {
    width: 180px;
}

.about-us .collaborated-with {
    width: 100%;
    padding: 10px 20px;
    background-color: #F3F3F7;
    border-radius: 25px;
}

.about-us .collaborated-with img {
    width: 100%;
}

.about-us .our-features img {
    width: 100%;
    height: 380px;
    border-radius: 60px;
}

/* todo: Isotope */

.payment-method .method input {
    border: none;
    outline: none;
    display: none;
    background-color: transparent;
    box-shadow: none;
}

.payment-method .method input:focus {
    border: none;
    outline: none;
    display: none;
    background-color: transparent;
    box-shadow: none;
}

.payment-method .method label {
    background-color: #F3F4F6;
    padding: 10px 15px;
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
}

.payment-method .method label.active {
    outline: 2px solid var(--bg-secondary-color);
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.payment-method .method label:hover {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}


.bkash-payment-img {
    width: 60px;
    height: 22px;
}

.order-overview {
    background-color: #F3F4F6;
    padding: 20px;
    border-radius: 30px;
}

/* .order-overview .order-item{
	display: flex;
	align-items: center;
	justify-content: space-between;
} */

.order-overview .order-item img {
    height: 100px;
}

.order-overview .quantity-box {
    position: relative;
    width: 120px;
}

.order-overview .quantity-box .qty {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 100;
    width: 25px;
    height: 25px;
    border-radius: 25px;
    background-color: #060607;
    color: white;
    text-align: center;
}

.order-overview .product-name {
    font-size: 16px;
    color: rgba(61, 63, 67, 0.7);
    font-weight: 500;
}

.order-overview .color {
    font-size: 16px;
    color: rgba(61, 63, 67, 0.7);
    font-weight: 400;
}

.order-overview .price {
    font-size: 18px;
    color: #060607;
    font-weight: 500;
}

/* ************************************************************* User Dashboard ************************************************************ */
.user-dashboard-section {
    background-color: #fff;
    padding: 30px;
}

@media (max-width: 430px) {
    .user-dashboard-section {
        background-color: #fff;
        padding: 30px 10px;
    }
}

div#v-pills-tab {
    min-width: 300px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border: none;
}

@media (min-width: 300px) and (max-width: 991px) {
    div#v-pills-tab {
        width: 100%;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
        border: none;
    }
}

.user-dashboard .nav button.nav-link {
    /* border: none !important; */
    outline: none !important;
    border-radius: 0 !important;
    border: 1px solid #E5E7EB;
    background-color: #fff;
    color: #181818;
    transition: all 0.3s ease-in-out;
    text-align: start;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 8px;
    padding: 10px;
}

.user-dashboard .nav button.nav-link.active {

    /* border: none !important; */
    outline: none !important;
    /* background-color: #E5E7EB !important; */
    color: #000 !important;
    border-radius: 0;
    border: 1px solid #E5E7EB;

}

.user-dashboard .nav button.nav-link:hover {
    background-color: #E5E7EB;
    border-radius: 0;
}

.user-dashboard .nav-link.profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* gap: 10px; */
}

.user-dashboard .nav-link.profile .profile-data {
    padding: 20px 0;
}

.user-dashboard .avatar {
    outline: 2px solid #F79725;
    outline-offset: 10px;
    border-radius: 50%;
}

.user-dashboard .avatar img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
}

.user-dashboard .nav-link svg {
    color: #F9A226;
}

.user-dashboard .nav-link span {
    font-size: 14px;
}

.user-dashboard .nav-link.profile .name {
    font-size: 18px;
}

.user-dashboard .nav-link.profile .email {
    font-size: 16px;
}

.user-dashboard .nav-link.logout {
    background-color: #fff !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
}

.user-dashboard .nav-link.logout:hover {
    background-color: #fff !important;
}

.user-dashboard .nav-link.logout a svg {
    width: 20px;
    height: 20px;
    color: #fff;
}

.tab-content {
    width: 100%;
}

.user-dashboard .user-dashboard-card .card-box {
    padding: 20px;
    border-radius: 10px;
    color: #fff;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.user-dashboard .user-dashboard-card .card-box .text {
    border-bottom: 1px solid #fff;
    padding-bottom: 10px;
    margin-bottom: 5px;
}

.user-dashboard .user-dashboard-card .card-box.products-in-cart {
    background-color: #5E35B1;
}

.user-dashboard .user-dashboard-card .card-box.products-wishlist {
    background-color: #1565C0;
}


.user-dashboard .user-dashboard-card .card-box.total-order {
    background-color: #2E4A8B;
}


/* todo: New Custom CSS */

/* Add to your CSS file or <style> block */
.custom-hidden-select {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 30px;
    width: 120px;
    pointer-events: none;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}


.success-card {
    max-width: 500px;
    margin: 50px auto;
    border-radius: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.success-icon {
    font-size: 80px;
    color: #28a745;
}


.swiper-button-next {
    color: black;
}

.swiper-button-prev {
    color: black;
}