/*TYPOGRAPHY*/
body {
    /*font-family: "Roboto", sans-serif;*/
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
    overflow-x: hidden;
}
/* navbar css start */

.secondary-nav-wrapper {
    display: flex;
    justify-content: center;
    padding: 0 1rem;
    width: 100%;
}

.secondary-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 1280px;
    margin-left: -5vw;
}

@media (max-width: 1280px) {
    .secondary-nav {
        margin-left: -1vw;
    }
}

.mobile-logo-container,
.mobile-search-container,
.cart-counter-container {
    flex-shrink: 0;
}

.secondary-nav-center {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 5px;
    margin-left: 50vw;
}


.secondary-nav-wrapper.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    /* border-bottom: 1px solid #ddd; */
}
.sticky-sidebar.is-sticky {
    position: fixed;
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    height: 100vh;
    top: 50rem;
    /* border-bottom: 1px solid #ddd; */
}

/* navbar css end */

/* homepage css start */

.scrolling-text-section {
    padding: 5px 0; /* Optional: Padding for the section */
    overflow: hidden; /* Hide any overflow content */
    font-size: 12px;
    position: relative;
}

.scrolling-text {
    white-space: nowrap;
    display: inline-block;
    animation-name: scroll-left;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state: running;
    border: none;
    width: 100%!important;
}

@keyframes scroll-left {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

.scrolling-text p {
    display: inline-block;
    font-size: 15px;
    color: #616161;
    /*letter-spacing: 1px;*/
    font-weight: 600;
}

.scrolling-text i {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    color: rgba(104,161,100,0.9);
    margin-right: 3px;
}

.scrolling-text:hover {
    animation-play-state: paused;
}

@keyframes scroll-left {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}



.box-info-h1 {
    background-color: #f8f8f8;
    padding: 20px 20px;
    text-align: center;
}

.contact-o {
    border-radius: 15px;
}

.elementor-section {
    background-color: #434343;
    position: relative;
}

.elementor-heading-title {
    text-align: center;
    color: #333;
    font-size: 24px;
    font-weight: bold;
}

.elementor-text-editor p {
    text-align: center;
    color: #555;
    font-size: 16px;
}

.mini-box-info-h1 {
    margin-top: 20px;
}

.centered-row {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.centered-icon-box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    max-width: 300px;
    flex: 1 1 45%;
    box-sizing: border-box;
    padding: 20px;
    margin: 0 10px;
    background-color: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 1px 15px 0 rgba(236, 236, 236, 0.08);
}

.icon-box-h1 {
    display: flex;
    align-items: center;
}

.icon-box-left, .icon-box-right {
    text-align: left;
}

.elementor-icon {
    font-size: 45px;
    color: #29A56C;
}


.icon-box-h1:hover {
    background-color: #e9e9e9;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* Styling for the icon box wrapper to use flex layout */
.elementor-icon-box-wrapper {
    display: flex;
    align-items: center;
    /* padding: 20px; */
    /* border: 1px solid #ddd;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin: 10px;
    max-width: 400px;
    box-sizing: border-box;
    border-radius: 10px; */
}


/* Ensuring the icon appears on the left */
.elementor-icon-box-icon {
    flex-shrink: 0;
    margin-right: 15px;
    font-size: 24px;
    color: var(--primary-color);
    display: flex;
    align-items: center;
}

/* Styling for the text content */
.elementor-icon-box-content {
    text-align: left;
}

.elementor-icon-box-title {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    margin: 0;
}

.elementor-icon-box-description {
    color: #777;
    font-size: 14px;
    margin: 0;
}

/* Centering the icon boxes within the container */
.elementor-row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 2px 0;
}

/* homepage slider product card start */
.product-bs__container:not(.product-card) {
    margin: 3px;
    /*background-color: rgba(var(--primary-color-rgb), .1);*/
    background-color: var(--section-bg-color);
    /*box-shadow: 5px 5px 15px rgba(209, 255, 204, 0.2);*/
    border-radius:8px;
    width: 215px;
    border: 1px solid var(--border-color);
    transition: .5s;
}

.product-bs__container.product-card {
    margin: 3px;
    background-color: #ffffff;
}

.product-container-extra-width:not(.product-card) {
    width: 225px;
}

.product-container-extra-width.product-card {
    width: 100%;
    max-width: 100%;
}


.product-container-extra-width:not(.product-card):hover{
    width: 225px!important;
    scale: 1.05;
    transition: .5s;
}

.product_auto_width{
    width: auto!important;
}

.product-bs__container:not(.product-card):hover {
    /*background-color: #f8f8f8;*/
    /*box-shadow: 1px 1px 5px 8px rgb(239, 239, 239);*/
    transition: .5s;
    width: 215px;
    border: 1px solid var(--border-color);
    /*scale: 1.03;*/
}

@media (min-width: 768px) {
    .product-bs__container:not(.product-card) {
        height: 340px !important;
    }
    .product-container-extra-width:not(.product-card) {
        height: 350px !important;
    }
}

@media (max-width: 820px) {
    .product-bs__container:not(.product-card) {
        width: 160px!important;
        height: 100%!important;
        max-width: 220px!important;
        margin: 0 auto;
    }
}

@media (min-width: 800px) and (max-width: 1200px) {
    .product-bs__container:not(.product-card) {
        width: 100%!important;
        max-width: 220px!important;
        height: 100%!important;
        margin: 0 auto;
    }
}

.product-o__action-list {
    font-size: 10px;
}

.product-o__name > a:hover {
    color: var(--primary-color);
    transition: .2s;
    text-decoration: none!important;
}

.product-short {
    /* background-color: #fbfbfb; */
    background-color: #fff;
    border: 1px solid #ececec;
    border-radius: 15px;
    transition: -webkit-transform 0.7s ease-in-out;
    transition: transform 0.7s ease-in-out, -webkit-transform 0.7s ease-in-out;
}

.product-short:hover {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
}

.product-short__name {
    display: block;
}

.product-short__name > a {
    display: -webkit-box; /* Required for webkit browsers */
    -webkit-box-orient: vertical; /* Set the box orientation to vertical */
    -webkit-line-clamp: 2; /* Limit the text to 2 lines */
    overflow: hidden;
    text-overflow: ellipsis; /* Add the ellipsis */
    border: none;
    font-weight: 600;
    font-size: 14px;
    color: var(--text-dark);
    padding: 5px 0;
}

.product-o__name > a {
    display: -webkit-box; /* Required for webkit browsers */
    -webkit-box-orient: vertical; /* Set the box orientation to vertical */
    -webkit-line-clamp: 2; /* Limit the text to 2 lines */
    text-overflow: ellipsis; /* Add the ellipsis */
    border: none;
    font-weight: 500;
    font-size: 16px;
    color: var(--text-dark);
    /*padding: 5px 0;*/
    height: auto;
    overflow-y: auto;
    scrollbar-width: thin;
}

.product-short__name > a:hover {
    transition: .2s;
}

.article__name > a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    border: none;
    font-weight: 500;
    font-size: 15px;
    color: #565656!important;
    padding: 5px 0;
    max-height: 60px;
    text-transform: capitalize;
    letter-spacing: .5px;
}

.article__name > a:hover {
    transition: .2s;
    text-decoration: underline;
}

.star_rating {
    font-size: 9px !important;
    margin-left: -3px!important;
}

.star_rating:before {
    font-size: 120%;
}

/* homepage slider product card end */
.product-l__name > a {
    font-size: 13px;
    font-weight: 700;
}

.product-short__container {
    padding: 18px 15px;
}

.product-short__info {
    margin-top: 5px;
}

/* homepage css end */

@media (min-width: 1300px) {
    .container {
        max-width: 1250px !important;
    }
}

.tool-style__form-wrap select {
    border-radius: 8px;
    /*border: 1px solid #ccc;*/
    padding: 10px 20px;
    box-shadow: 1px 2px 5px rgba(85, 195, 126, 0.7);
    background-color: var(--primary-color);
    color: #f1f1f1;
    letter-spacing: 1px;
}

.product-o__discount {
    font-size: 12px;
}

.input-text--style-1 {
    color: #333;
    transition: all 0.6s linear;
    border: 1px solid #ddd;
    background-color: #f5f5f5;
    padding: 0.5rem;
    border-radius: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.promotion-o .aspect {
    border-radius: 5px;
    overflow: hidden; /* Ensures the image doesn't spill out of the container */
}

.promotion-o .aspect__img {
    border-radius: 5px;
}

.promotion-o .aspect__img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.aspect__img {
    object-fit: contain;
    border-radius: 0!important;
}

/* For large devices (>= 1200px) - 5 items per row (20% width) */
@media (min-width: 1200px) {
    .col-lg-2-4 {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

/* For medium devices (>= 768px and < 1200px) - 5 items per row (20% width) */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .col-md-2-4 {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

/* For large devices (>= 1200px) - 5 items per row (20% width) */
@media (min-width: 1200px) {
    .col-lg-2-3 {
        flex: 0 0 16.66%;
        max-width: 16.66%;
    }
}

/* For medium devices (>= 768px and < 1200px) - 6 items per row (16.66% width) */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .col-md-2-3 {
        flex: 0 0 16.66%;
        max-width: 16.66%;
    }
}

/* For small devices (>= 576px and < 768px) - 3 items per row (33.33% width) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .col-sm-4 {
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }
}

.load-more > button {
    background-color: #fff;
}

.aspect--square {
    background-color: transparent;
}

/*.newsletter-footer {*/
/*    background: -webkit-linear-gradient(top, rgba(244,156,69,1), #434343);*/
/*    background: -moz-linear-gradient(top, rgba(244,156,69,1), #434343);*/
/*    background: -o-linear-gradient(top, rgba(244,156,69,1), #434343);*/
/*    background: linear-gradient(to bottom, rgba(244,156,69,1), #434343);*/
/*    padding: 10px 0;*/
/*}*/

.newsletter-footer {
    background: var(--border-color);
    /*background-color: rgba(244,156,69,1);*/
    padding: 0 0 20px 0;
    border-bottom: 1px solid var(--primary-color);
    border-radius: 5px!important;
}


@media (max-width: 820px) {
    .newsletter-footer  {
        text-align: center!important;
    }

    .product-o__name > a {
        height: 80px!important;
        font-size: 14px!important;
    }


    .product-bs__price {
        font-size: 18px !important;
        white-space: nowrap!important;
    }

    /*.product-o__discount{*/
    /*    white-space: nowrap!important;*/
    /*    font-size: 14px !important;*/
    /*    margin-top: -10px;*/
    /*    margin-left: -20px;*/
    /*}*/

    .product-o__discount{
        white-space: nowrap!important;
        font-size: 14px !important;
        position: relative;
        left: -50%;
        top: 19px;
    }

    .bg_section{
        padding: 0!important;
    }
}





.newsletter_title{
    font-size: 20px;
    color: #6a6a6a;
    font-weight: 700;
    letter-spacing: 1px;
}

.newsletter_subtitle{
    font-size: 12px;
    color: #6a6a6a;
    font-weight: 500;
    margin-top: -3px;

}

.newsletter-footer__content{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}


@media (max-width: 820px) {
    .newsletter-footer  {
        text-align: center!important;
    }

    .product-o__name > a {
        height: 80px!important;
        font-size: 14px!important;
    }


    .product-bs__price {
        font-size: 18px !important;
        white-space: nowrap!important;
    }

    /*.product-o__discount{*/
    /*    white-space: nowrap!important;*/
    /*    font-size: 14px !important;*/
    /*    margin-top: -10px;*/
    /*    margin-left: -20px;*/
    /*}*/

    .product-o__discount{
        white-space: nowrap!important;
        font-size: 14px !important;
        position: relative;
        left: -50%;
        top: 19px;
    }

    .bg_section{
        padding: 0!important;
    }
}



@media (max-width: 991px) {
    .outer-footer__content {
        text-align: center !important;
    }

    .outer-footer__social {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center !important;
        margin-left: 0 !important;
        width: 100%;
    }

    .outer-footer__social ul.footer-social-list {
        justify-content: center !important;
        width: 100%;
    }

    .outer-footer__social ul.footer-social-list > li {
        margin-right: 0 !important;
    }
}

@media (min-width: 992px) {
    .outer-footer__content {
        text-align: left !important;
    }

    .outer-footer__social {
        display: block;
        text-align: left !important;
        margin-left: 0 !important;
        width: auto;
    }

    .outer-footer__social ul.footer-social-list {
        justify-content: flex-start !important;
        width: auto;
    }
}

.footer_about {
    margin: 10px 0;
    color: #F3F3F3;
}

/* footer start */
.outer-footer {
    /*background-color: #434343 !important;*/
    background: linear-gradient(to bottom, var(--primary-color),rgba(var(--primary-color-rgb),.95));
    padding-bottom: 10px;
}

@media (max-width: 991px) {
    .outer-footer {
        padding-top: 48px;
        padding-bottom: 32px;
    }
}

@media (max-width: 575px) {
    .outer-footer {
        padding-top: 40px;
        padding-bottom: 28px;
    }
}

.outer-footer__text-wrap > i {
    color: #e4e4e4 !important;
}

.outer-footer__text-wrap span {
    color: #e4e4e4 !important;
}

.outer-footer__list-wrap ul > li > a {
    color: #e4e4e4 !important;
}

.newsletter__text {
    color: #e4e4e4 !important;
}

.outer-footer__social ul > li > a {
    color: #e4e4e4 !important;
    font-size: 22px!important;
}

.mega-text {
    position: absolute;
    white-space: nowrap;
}

.lower-footer {
    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.12) 0%,
            rgba(0, 0, 0, 0.22) 50%,
            rgba(0, 0, 0, 0.32) 100%
        ),
        rgba(var(--primary-color-rgb), 0.95) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.lower-footer__copyright span {
    color: #ededed !important;
}

.newsletter__btn {
    border-radius: 1rem;
    padding: 12px;
}

.input-text--only-white {
    border-radius: 1rem;
}


/* shop page start */
.is-grid-active .product-m__name > a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    border: none;
    font-weight: 500;
    font-size: 16px;
    height: 40px!important;
    color: var(--text-dark);
}

@media (max-width: 1024px) {
    .col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
    .col-auto, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7,
    .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto, .col-md, .col-md-1,
    .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
    .col-md-10, .col-md-11, .col-md-12, .col-md-auto, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3,
    .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11,
    .col-sm-12, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5,
    .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-auto {
        padding-right: 5px;
        padding-left: 5px;
    }
}

@media (max-width: 1024px) {
    .col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
    .col-auto, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7,
    .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-auto, .col-md, .col-md-1,
    .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
    .col-md-10, .col-md-11, .col-md-12, .col-md-auto, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3,
    .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11,
    .col-sm-12, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5,
    .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-auto {
        padding-right: 5px;
        padding-left: 5px;
    }
}

@media (max-width: 1024px) {
    w-r__link {
        text-align: start;
    }
}

/* shop page start */

/* footer end */

.shop-w-master__heading {
    /*box-shadow: 1px 2px 5px rgba(85, 195, 126, 0.7);*/
    background-color: var(--primary-color);
    letter-spacing: 1px;
    color: #f1f1f1;
    padding: 15px 20px;
    font-size: 18px;
    font-weight: 700;
    line-height: 20px;
    border-radius: 8px;
}

.is-grid-active .product-m {
    position: relative;
    margin-bottom: 30px;
    /* transition: 0.3s; */
    background-color: transparent;
    border: 1px solid var(--border-color);
    /*box-shadow: 5px 5px 15px rgba(209, 255, 204, 0.2);*/
    border-radius:8px;
    overflow: hidden;
    transition: .2s;
    -moz-transition: .2s;
    -webkit-transition: .2s;
    -o-transition: .2s;
    height: 395px !important;
    width: 225px!important;

    &:hover {
        box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
        /* border: 1px solid #BCE3C9; */
        transition: .2s;
    }
}

/* Media query for large devices */
@media (min-width: 1920px) {
    .is-grid-active .product-m {
        height: 25rem !important;
        width: 225px!important;
    }
}

/* Media query for large devices */
@media (min-width: 1200px) and (max-width: 1400px) {
    .is-grid-active .product-m {
        width: 205px!important;
        height: 24rem !important;
    }
}

/* Media query for large devices */
@media (min-width: 800px) and (max-width: 1200px) {
    .is-grid-active .product-m {
        width: 245px!important;
        padding: 0 20px;
    }
}


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

.paddingX{
    padding: 0 50px;
}

.mobile-menu-container{
    display: none;
}
.mobile-account-menu{
    display: none;
}
.mobile-account-toggle{
    display: none;
}

/* Media query for large devices */
@media (min-width: 800px) and (max-width: 1100px) {
    .mobile-menu-container{
        display: block;
    }

    .mobile-account-menu{
        display: block;
    }

    .mobile-account-toggle{
        display: block;
        margin-right: 40px;
    }

    .containerCustom{
        padding-top: 0;
    }

    .paddingX{
        padding: 0;
    }

    .is-grid-active {
        padding: 0 0!important;
        margin: 0!important;
    }

    .is-grid-active .product-m__name > a {
        margin-left: -10px;
    }

    .is-grid-active .product-m__category {
        margin-left: -10px;
    }
}

/* Media query for large devices */
@media (max-width: 800px) {
    .is-grid-active .product-m {
        /*width: 180px!important;*/
        height: 400px!important;
        margin: 3px 0!important;
        width: 100%!important;
        max-width: 285px!important;
        /*padding: 20px;*/
        padding: 0 5px!important;
    }

    .mobile-menu-container{
        display: block;
    }

    .mobile-account-menu{
        display: block;
    }

    .mobile-account-toggle{
        display: block;
    }

    .containerCustom{
        padding-top: 0;
    }

    .paddingX{
        padding: 0;
    }

    .is-grid-active {
        padding: 0 0!important;
        margin: 0!important;
    }

    .is-grid-active .product-m__name > a {
        margin-left: -10px;
    }

    .is-grid-active .product-m__category {
        margin-left: -10px;
    }
}

.w-r__link {
    border-radius: 5px;
    font-weight: 600;
    font-size: 12px;
    color: var(--primary-color);
    background-color:transparent;
    display: inline-block;
    padding: 7px 5px;
    border: 1px solid rgb(250, 250, 250);
    /*border: none;*/
    /*min-width: 60px;*/
    width: fit-content;

    &:hover {
        background-color: var(--primary-color);
        color: #fff;
        transition: .2s;
    }
}

.add-to-cart-link {
    border-radius: 5px;
    font-weight: 600;
    font-size: 12px;
    color: var(--primary-color);
    background-color:transparent;
    display: inline-block;
    padding: 5px 3px;
    border: 1px solid rgb(250, 250, 250);
    /*border: none;*/
    /*min-width: 60px;*/
    width: fit-content;
    margin-right: 4px!important;

    &:hover {
        background-color: var(--primary-color);
        color: #fff;
        transition: .2s;
    }
}

.request-stock-link {
    border-radius: 5px;
    font-weight: 600;
    font-size: 11px;
    color: var(--secondary-color);
    background-color:transparent;
    display: inline-block;
    padding: 5px 5px;
    border: 1px solid rgb(250, 250, 250)!important;
    /*border: none;*/
    /*min-width: 60px;*/
    width: fit-content;
    margin-right: 1px!important;

    &:hover {
        background-color: var(--secondary-color);
        border: 1px solid rgb(250, 250, 250)!important;
        color: #fff;
        transition: .2s;
    }
}

.w-r__link_padded {
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    color: var(--primary-color);
    background-color:transparent;
    display: inline-block;
    border: 1px solid rgb(250, 250, 250);
    /*border: none;*/
    min-width: 60px;
    width: fit-content;
    padding: 16px;

    &:hover {
        background-color: var(--primary-color);
        color: #fff;
        transition: .2s;
    }
}

.w-r__link_padded-secondary {
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    color: var(--secondary-color);
    background-color: rgba(241, 241, 241, 0.8);
    display: inline-block;
    /*border: 1px solid rgb(250, 250, 250);*/
    border: none;
    min-width: 60px;
    width: fit-content;
    padding: 16px;

    &:hover {
        background-color: var(--secondary-color);
        color: #fff;
        transition: .2s;
    }
}


.w-r__link_orange {
    border-radius: 7px;
    font-weight: 600;
    font-size: 11px;
    color: var(--secondary-color);
    background-color:transparent;
    display: inline-block;
    padding: 7px 5px;
    min-width: 80px;
    width: fit-content;
    border: 1px solid rgb(250, 250, 250);

    &:hover {
        background-color: var(--secondary-color);
        border: 1px solid rgb(250, 250, 250);
        color: #fff;
        transition: .2s;
    }
}


.w-r__link_dark {
    border-radius: 7px;
    font-weight: 600;
    font-size: 12px;
    color: var(--buying-option-color);
    background-color:transparent;
    display: inline-block;
    padding: 7px 5px;
    min-width: 80px;
    width: fit-content;
    border: 1px solid var(--border-light);

    &:hover {
        background-color: var(--primary-color);
        border: 1px solid var(--primary-transparent);
        color: var(--light-color);
        transition: .2s;
    }
}


.shop-w--style {
    border-radius: 8px;
}

.subcategory-list li,
.shop-w__list-2 li,
.shop-w__list li {
    border: none;
    border-bottom: 1px solid #f0f0f0;
    padding: 10px;
    margin-bottom: 5px;
    list-style: none;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Hover effect for list items */
.subcategory-list li:hover,
.shop-w__list-2 li:hover,
.shop-w__list li:hover {
    border-color: #d4f4d4; /* Even lighter green on hover */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Thinner gray shadow on hover */
}

input[type="button"]:hover {
    background-color: var(--secondary-color); /* Darker green on hover */
}

.check-box__label {
    font-size: 15px;
    font-weight: 500;
}

.shop-w__category-list,
.shop-w__list-2,
.shop-w__list {
    /*background-color: rgba(var(--primary-color-rgb),0.01);*/
    padding-left: 0; /* Remove default padding for all lists */
}

.subcategory-list {
    padding-left: 15px; /* Add indentation to the subcategory list if desired */
}

.shop-p__collection {
    margin-top: 34px;
}

.ah-list--design2 > li > a {
    font-size: 14px;
}

/* contact page start */
.contact-f {
    margin: 0 auto;
    width: 100%;
    padding: 2rem 5rem;
    /*background-color: #fefefe;*/
    border-radius: 8px;
    border: 1px solid var(--border-light);
}

.contact-f .input-text, .contact-f .text-area {
    border-radius: 6px;
    width: 100%;
    height: 3.5rem;
    border: 1px solid var(--border-color);
    background-color: #ffebeb;
}

.contact-f .text-area {
    height: 185px;
}

.input-text {
    font-size: 16px;
    background-clip: padding-box;
    padding: 0 18px;
    height: 40px;
}

.text-area {
    font-size: 16px;
}

.contact-area__heading h2 {
    background-color: #F2F2F2;
}

/* contact page end */

/* breadcrumb start*/
.breadcrumb-wrap {
    /*background-color: rgba(48,171,95,.03);*/
    background-color: transparent;
    /*padding: 15px 0;*/
    /*border-top: 1px solid #e6e6e6;*/
    /*border-bottom: 1px solid #e6e6e6;*/
}

.breadcrumb {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #666666;
}

.breadcrumb a {
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
}

.breadcrumb a:hover {
    color: var(--primary-hover);
    text-decoration: underline;
}

.breadcrumb i {
    margin-right: 5px;
}

.breadcrumb span {
    margin: 0 10px;
    color: #999999;
}

.breadcrumb-wrap .container {
    max-width: 1200px;
    margin: 0 auto;
}

.breadcrumb-wrap {
    margin-bottom: 20px;
}

.breadcrumb span i, .breadcrumb span {
    margin: 0px 5px;
    color: #999999;
    font-size: 6px;
    padding-top: 1px;
}

/* breadcrumb end*/


/* General pagination-custom Styling */
.pagination-custom {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* Pagination links */
.pagination-custom li a,
.pagination-custom li span {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 38px;
    text-align: center;
    font-weight: 500;
    text-decoration: none;
    border-radius: 4px;
    border: 1px solid #ccc;
    color: #333!important;
    background-color: #e0e0e0!important;
    transition: all 0.3s ease;
}

/* Hover effect */
.pagination-custom li a:hover {
    background-color: #cfcfcf!important;
    color: #000;
}

/* Active page styling */
.pagination-custom .active span {
    background-color: var(--primary-color)!important; /* Green */
    color: white!important;
    border-color: var(--primary-color)!important;
}

/* Disable prev/next */
.pagination-custom .disabled span,
.pagination-custom .disabled a {
    background-color: #f2f2f2!important;
    color: #aaa!important;
    pointer-events: none!important;
}



.checkout-address-section {
    padding: 2rem 0;
    /*background: #f9f9f9;*/
    border-radius: 8px;
}

.section-title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.address-cards {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.address-card {
    /*background-color: #ffffff;*/
    padding: 1.2rem 1.5rem;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    border: 1px solid transparent;
    transition: all 0.3s ease;
    position: relative;
}

.minimizedAddressCard{
    padding: 0 5px;
    margin: 0 20px;
    border-radius: 0;
    box-shadow: none;
}

.address-card:hover {
    border-color: #ffffff;
    transform: translateY(-4px);
}

.address-card.default {
    /*background-color: #f5fff7;*/
    border: 1px solid #edfff4;
}

.default-tag {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background-color: rgba(var(--primary-color),.1);
    color: white;
    padding: 0.3rem 0.6rem;
    border-radius: 12px;
    font-size: 0.75rem;
}

.address-info p {
    margin: 0.3rem 0;
    font-size: 0.95rem;
    color: #333;
}

.address-actions {
    display: flex;
    gap: 0.8rem;
    margin-top: 1rem;
}

.btn-custom {
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.btn-edit {
    background-color: transparent;
    color: var(--primary-color);
}

.btn-edit:hover {
    background-color: #f6fffc;
}

.btn-delete {
    background-color: transparent;
    color: var(--secondary-color);
}

.btn-delete:hover {
    background-color: #fff1f1;
}

.add-address {
    margin:20px 0px;
    text-align: left;
}

.btn-add {
    text-align: left;
    background-color: #f0f0f0;
    color: var(--primary-hover);
    border: 1px dashed var(--secondary-bg-color);
    font-weight: bold;
    border-radius: 8px;
}

.btn-add:hover {
    background-color: #eaeaea;
}



/*Search result div*/
#searchModal {
    max-height:70vh;
    overflow-y: auto;
    scrollbar-width:thin;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999999;
    max-width: 600px;
    background: linear-gradient(0deg, var(--primary-color), #f8f8f8, #f8f8f8);
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    padding: 20px 10px;
    transition: all 0.3s ease;
}


@media (max-width: 556px) {
    #searchModal {
        margin-left: 10px!important;
    }
}

#searchModal a.hoverBg {
    text-decoration: none;
    transition: background-color 0.2s ease;
    border-radius: 10px;
    display: block;
    padding: 0 10px;
    /*margin-bottom: 15px;*/
}

#searchModal a.hoverBg:hover {
    /*background-color: #f9f9f9;*/
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

.search-result-card {
    display: flex;
    align-items: center;
    gap: 15px;
    border-radius: 10px;
    padding: 10px;
    border-bottom: 1px solid #efefef;
}

.search-result-card img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: 5px;
    background: transparent;
}

.search-result-content {
    flex: 1;
}

.search-result-content p {
    margin: 0;
    line-height: 1.4;
}

.search-result-content .product-name {
    font-size: 16px;
    font-weight: 600;
    color: #393939;
}

.search-result-content .product-price {
    font-size: 14px;
    color: #666;
}



/* Main Container */
.product-specifications-container {
    margin: 20px 0;
    border-radius: 8px;
    overflow: hidden;
}

/* Specification Group */
.specification-group {
    margin-bottom: 30px;
    background: #fbfbfb;
    border-radius: 8px;
    /*box-shadow: 0 2px 10px rgba(0,0,0,0.05);*/
    overflow: hidden;
    transition: all 0.3s ease;
}

/*.specification-group:hover {*/
/*    box-shadow: 0 5px 15px rgba(0,0,0,0.1);*/
/*}*/

/* Group Header */
.group-header {
    background: linear-gradient(-135deg, #fafafa 0%, rgba(255, 255, 255, 1) 100%);
    padding: 12px 20px;
    border-bottom: 1px solid #efefef;
}

.group-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 0;
    display: flex;
    align-items: center;
}

.group-title i{
  margin-right: 5px;
}

/* Specification Table */
.specification-table-container {
    padding: 0;
}

.specification-table {
    width: 100%;
    border-collapse: collapse;
}

.specification-row {
    border-bottom: 1px solid #fcfcfc;
    transition: background-color 0.2s ease;
}

.specification-row:last-child {
    border-bottom: none;
}

.specification-row:hover {
    background-color: #f2fff9;
}

.spec-title {
    width: 30%;
    padding: 12px 20px;
    font-weight: 600;
    color: #444;
    border-right: 1px solid #eaeaea;
    vertical-align: top;
}

.grey-bg{
    background-color: #f6f6f6;
}

.title-text {
    display: inline-block;
    position: relative;
    padding-left: 15px;
}

.title-text:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background-color: var(--primary-color);
    border-radius: 50%;
}

.spec-value {
    width: 70%;
    padding: 12px 20px;
    color: #666;
    font-weight: 600;
    font-size: 14px;
}

/* No Specifications */
.no-specifications {
    text-align: center;
    padding: 40px 20px;
    color: #6c757d;
}

.no-specifications i {
    color: #dee2e6;
}

/* Responsive Design */
@media (max-width: 768px) {
    .spec-title {
        width: 35%;
        padding: 10px 15px;
    }

    .spec-value {
        width: 65%;
        padding: 10px 15px;
    }

    .group-title {
        font-size: 1rem;
    }
}

@media (max-width: 576px) {
    .spec-title, .spec-value {
        display: block;
        width: 100%;
        border-right: none;
    }

    .spec-title {
        padding-bottom: 5px;
        border-bottom: 1px dashed #eee;
    }

    .spec-value {
        padding-top: 5px;
    }

    .specification-row {
        padding: 10px 0;
    }
}

.signInButton{
    background-color: var(--secondary-color)
}

.signInButton:hover{
    background-color: #494949
}

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

.signUpButton:hover{
    background-color: #292929
}



/* Modern Dashboard Styles */
.dashboard-orders {
    background: #fefefe;
    border-radius: 8px;
    /*box-shadow: 0 2px 16px rgba(0,0,0,0.08);*/
    padding: 2rem;
}

.order-card {
    /*border: 1px solid #eee;*/
    border-radius: 10px;
    margin-bottom: 1.5rem;
    transition: transform 0.2s ease;
}

.order-card:hover {
    transform: translateY(-2px);
    /*box-shadow: 0 4px 12px rgba(0,0,0,0.1);*/
}

.order-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid #eaeaea;
    background: #fafafa;
    border-radius: 10px 10px 0 0;
}

.order-meta {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.order-number {
    font-weight: 600;
    color: #2c3e50;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.order-date {
    color: #687171;
    font-size: 0.9rem;
}

.order-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.manage-btn {
    background: rgb(75, 156, 132, .1);
    color: var(--primary-color) !important;
    padding: 4px 10px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.2s ease;
}

.manage-btn:hover {
    background: var(--primary-hover);
    text-decoration: none;
    color: #eeeeee !important;
}

.status-badge {
    padding: 0.4rem 0.8rem;
    border-radius: 8px;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.status--delivered { background: #e8f6ef; color: #27ae60; }
.status--packed { background: #fef5e7; color: #f39c12; }
.status--shipped { background: #e8f4fc; color: #2980b9; }
.status--canceled { background: #fdedec; color: #c0392b; }
.status--pending { background: #eee8bd; color: #2c2707; }
.status--ordered { background: #eee8bd; color: #2c2707; }

.order-items {
    padding: 5px 20px;
}

.order-item {
    display: flex;
    gap: 1.5rem;
    padding: 5px 0;
    border-bottom: 1px solid #f5f5f5;
}

.order-item:last-child {
    border-bottom: none;
}

.product-thumbnail {
    width: 80px;
    height: 80px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid #eee;
}

.product-info {
    flex: 1;
}

.product-name,.responsive-name {
    font-weight: 500;
    /*margin-bottom: 0.5rem;*/
    color: #34495e;
    height: 46px!important;
    overflow: hidden!important;
}

.product-meta {
    display: flex;
    gap: 1.5rem;
    color: #7f8c8d;
    font-size: 0.9rem;
}

.modern-select {
    padding: 0.6rem 1rem;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: white;
    width: 200px;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1em;
}

.order-pagination {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
}

/* Empty State */
.empty-order {
    text-align: center;
    padding: 4rem 0;
}

.summary-total {
    display: flex;
    justify-content: space-between;
    margin-top: 0.8rem;
    padding: 0 20px;
    font-weight: 500;
    color: #2c3e50;

}

.summary-line{
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #f0f0f0;
    padding: 15px 20px 0 20px;
    font-weight: 500;
    color: #2c3e50;
}

.order-card{
    border: 1px solid #eee;
    padding: 20px 0;
    background: #f9f9f9;
}

@media (max-width: 768px) {
    .order-header {
        flex-direction: column;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 5px;
        padding: 20px;
        text-align: center;
        background: whitesmoke;
        border-bottom: 1px solid #eaeaea;
        /*border-top: 1px solid #eaeaea;*/
        /*border-right: 1px solid #eaeaea;*/
    }

    .summary-total {
        display: flex;
        justify-content: space-between;
        margin-top: 0.8rem;
        padding: 0 20px;
        font-weight: 500;
        color: #2c3e50;
    }

    .summary-line{
        display: flex;
        justify-content: space-between;
        border-top: 1px solid #f0f0f0;
        padding: 15px 20px 0 20px;
        font-weight: 500;
        color: #2c3e50;
    }

    .order-card{
        border: 1px solid #eee;
        padding: 20px 0;
        background: #f9f9f9;
    }

    .order-actions {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
}

.btn-print, .btn-manage {
    padding: 0.5rem 1rem;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #efefef; color: #525252;
}

.btn-print:hover {
    background-color: #94816d !important;
    color: white!important;
    transform: translateY(-1px);
}

.btn-manage {
    background-color: #f0f0ff; color: #525252;
}

.btn-manage:hover {
    background-color: #7a9990 !important;
    color: white!important;
    transform: translateY(-1px);
}


/*product compare*/


.compare-container {
    max-width: 1200px;
    margin: 40px auto;
    padding: 20px;
    font-family: 'Segoe UI', sans-serif;
}

.category-select,
.search-section {
    margin-bottom: 24px;
}

.select-input,
.search-input {
    width: 100%;
    padding: 12px 16px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 8px;
    transition: 0.3s border-color;
}

.select-input:focus,
.search-input:focus {
    border-color: var(--primary-color);
    outline: none;
}

.search-results {
    position: absolute;
    width: 100%;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    margin-top: 4px;
    z-index: 10;
}

.search-item {
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.search-item:hover {
    background: #f6f6f6;
}

.compare-slots {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px;
}

.compare-slot {
    flex: 1;
    min-height: 180px;
    background: #f8f8f8;
    border: 1px solid #f8f8f8;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    position: relative;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.04);*/
    transition: 0.3s all ease;
}

.compare-slot:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

.compare-slot.empty {
    border: 2px solid #ccc;
    color: #bbb;
}

.empty-text {
    font-size: 16px;
    color: #999;
}

.compare-table-wrapper {
    width: 100%;
    padding-bottom: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    touch-action: pan-x;
}

.compare-table-wrapper::after {
    content: "← scroll →";
    position: absolute;
    right: 16px;
    bottom: 0;
    font-size: 12px;
    color: #888;
}

/* Ensure each product column is at least 160px */
.compare-table th.product-header {
    min-width: 160px;
    width: 160px;
}

.compare-table {
    min-width: calc(160px * 5); /* adjust based on max expected products */
    border-collapse: collapse;
    table-layout: auto; /* auto layout for dynamic sizing */
}

.compare-scroll-buttons {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
    gap: 8px;
}

.compare-scroll-overlay {
    position: relative;
}

.compare-table-container {
    position: relative;
    width: 100%;
}

.compare-table-wrapper {
    overflow-x: auto;
    width: 100%;
}

.compare-scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid #ccc;
    padding: 8px 12px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
    color: #444;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    transition: background-color 0.2s;
}

.compare-scroll-left {
    left: -20px; /* adjust based on padding/margin */
}

.compare-scroll-right {
    right: -20px; /* adjust as needed */
}

.compare-scroll-btn:hover {
    background-color: #f1f1f1;
}



.compare-table th,
.compare-table td {
    width: 200px; /* adjust as needed */
    padding: 16px;
    border: 1px solid #e5e7eb;
    text-align: left;
    vertical-align: top;
    word-wrap: break-word;
}

.compare-table th.spec-header,
.compare-table td.spec-title {
    position: sticky;
    left: 0;
    background: #f9fafb;
    z-index: 1;
    min-width: 200px;
    width: 200px;
}

.compare-table-wrapper.dragging {
    cursor: grabbing;
    cursor: -webkit-grabbing;
}
.compare-table-wrapper {
    cursor: grab;
    cursor: -webkit-grab;
}

.compare-table thead {
    background-color: #f9fafb;
}

.compare-table thead tr {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #f9fafb;
}

.product-header-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    min-width: 160px;
}

.compare-image-wrapper {
    position: relative;
    width: 100%;
    height: 200px;
    overflow: hidden;
    border-radius: 8px;
    margin-bottom: 8px;
    background: transparent;
}

.compare-image-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
}

.remove-btn {
    position: absolute;
    top: 6px;
    right: 6px;
    background: #964e4e;
    color: white;
    border: none;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.remove-btn:hover {
    background: #c0392b;
}

.product-name {
    text-align: left;
    font-weight: 600;
    color: #4a4a4a;
    font-size: 15px;
}

.product-name-center {
    text-align: center;
    font-weight: 600;
    color: var(--primary-color);
    font-size: 15px;
}

.compare-warning span{
    margin: 20px 0;
    color: #858585;
}

@media (max-width: 768px) {
    .compare-container {
        padding: 0 10px;
    }

    .compare-slots {
        flex-direction: column;
        gap: 12px;
    }

    .compare-slot {
        min-height: auto;
    }

    .compare-scroll-btn {
        display: none;
    }

    .compare-scroll-buttons {
        display: none;
    }

    .compare-table {
        min-width: unset;
        width: 100%;
    }

    .compare-table th.product-header,
    .compare-table td.spec-value {
        min-width: 100%;
        width: 100%;
        display: block;
    }

    .compare-table th.spec-header,
    .compare-table td.spec-title {
        position: static;
        width: 100%;
        display: block;
        background: #f1f1f1;
    }

    .compare-table-wrapper::after {
        display: none;
    }

    .compare-table th,
    .compare-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }

    .product-header-box {
        width: 100%;
        flex-direction: row;
        justify-content: flex-start;
        gap: 12px;
        align-items: center;
    }

    .compare-image-wrapper {
        width: 80px;
        height: 80px;
        flex-shrink: 0;
    }

    .compare-image-wrapper img {
        object-fit: contain;
        width: 100%;
        height: 100%;
        position: static;
    }

    .product-name-center {
        text-align: left;
    }
}

.trending-image{
    width:400px;
    margin-left: -60px;
    height: 600px;
}

@media (max-width: 767px) {
    .trending-image {
        margin-left: 0;
        width: 90vw;
    }
}

.productDetailImage{
    object-fit: fill;
}


.productDetailImageList{
    object-fit:cover;
    height: 110px!important;
}

@media (max-width: 767px) {

    .productDetailImage{
        object-fit: contain;
    }

    .productDetailImageList {
        object-fit: contain;
        height: 80px!important;
    }

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


.product-action-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
}

.add-to-cart-shop{
    position: relative;
    top: -3px;
    left: -5px;
    text-align: left;
    bottom: 0;
}

.add-to-cart-shop .buyNow{
    margin-right: -15px!important;
}

.addToCartCard{
    display: flex;
    justify-content: space-between;
    width: 180px;
}

.add-to-cart-btn{
    position: relative;
    top: -3px;
    left: -5px;
    text-align: left;
    bottom: 0;
}

.ratings-shop{
    text-align: left;
    padding-right: 0;
}

.addToCart{
    /*box-shadow: 1px 2px 3px 1px #eeffee;*/
    /*background-color: rgba(219, 219, 219, 0.2);*/
    opacity: .9;
}

@media (max-width: 1290px)  {
    .addToCartCard{
        gap: 0;
        width: auto;
    }
}


@media (max-width: 800px) {
    .product-action-wrapper {
        flex-direction: column;
    }

    .add-to-cart-btn{
        top: 0;
        text-align: left;
        right: 0;
    }

    .addToCartCard{
        display: flex;
        justify-content: space-between;
        width: 140px;
    }

    .w-r__link_dark{
        font-size: 11px;
        display: inline-block;
        min-width: 50px;
        margin-right: 8px;
        width: fit-content;
    }

    .w-r__link_orange {
        font-size: 11px;
        margin-top: -4px;
        margin-left: 5px!important;
        width: fit-content;
    }

    .addToCart{
        width: fit-content !important;
        background-color: rgba(193, 193, 193, 0.2);
        margin-left: -3px;
    }

    .add-to-cart-shop{
        text-align: left;
    }

}

@media (max-width: 1300px) {
    .buyNow{
        margin-right: 15px!important;
    }

}


@media (min-width: 1920px) {
    .buyNow{
        margin-right: -8px!important;
    }
}


.product-bs__container.no-price {
    height: 315px !important;
}

.product-bs__container.no-price .product-o {
    height: 100%;
}

.product-bs__container.no-price .aspect--square {
    padding-bottom: 100%;
}

.product-m.no-price {
    height: fit-content !important;
}

.product-m.no-price .product-o {
    height: 100%;
}

.product-m.no-price .aspect--square {
    padding-bottom: 100%;
}

@media (max-width: 820px) {

    .product-m.no-price {
        height: 280px !important;
    }

    .product-bs__container.no-price {
        height: 255px !important;
    }
}


.fa-facebook{
    color: #2b60ae !important;
    font-size: 26px!important;
}

.fa-twitter{
    color: #1DA1F2 !important;
    font-size: 26px!important;
}

.fa-youtube{
    color: #7e0606 !important;
    font-size: 26px!important;
}

.fa-instagram{
    color: #c62776 !important;
    font-size: 26px!important;
}

.fa-linkedin{
    color: #30719f !important;
    font-size: 26px!important;
}

.fa-youtube{
    color: #7e0606 !important;
    font-size: 26px!important;
}

.fa-linkedin{
    color: #30719f !important;
    font-size: 26px!important;
}

.custom .fa-whatsapp{
    color: #37a242 !important;
    font-size: 26px!important;
}

.tag-item {
    background-color: #f0f0f0;
    color: #333;
    padding: 5px 10px;
    border-radius: 16px;
    font-size: 14px;
    display: inline-block;
    margin: 2px;
    border: 1px solid #ccc;
    transition: background-color 0.3s ease;
}

.tag-item:hover {
    background-color: #f6f6f6;
    color: var(--secondary-color);
}

.partner-bg {
    position: relative;
    overflow: hidden; /* keep blur inside container */
}

.partner-bg::before {
    content: "";
    position: absolute;
    inset: 0; /* shorthand for top:0; right:0; bottom:0; left:0 */
    background-image: url("/assets/images/partner-bg-2.jpg"); /* no {{ asset() }} */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(0.1) blur(4px);
    transform: scale(1.1); /* prevent blur cutoff on edges */
    z-index: 0;
}

/* Make sure all content inside stays sharp */
.partner-bg > * {
    position: relative;
    z-index: 1;
}


.register-bg {
    position: relative;
    overflow: hidden; /* keep blur inside container */
}

.register-bg::before {
    content: "";
    position: absolute;
    inset: 0; /* shorthand for top:0; right:0; bottom:0; left:0 */
    background-image: url("/assets/images/register-bg.jpg"); /* no {{ asset() }} */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(0) blur(4px);
    transform: scale(1.1); /* prevent blur cutoff on edges */
    z-index: 0;
}

/* Make sure all content inside stays sharp */
.register-bg > * {
    position: relative;
    z-index: 1;
}


.login-bg {
    position: relative;
    overflow: hidden; /* keep blur inside container */
}

.login-bg::before {
    content: "";
    position: absolute;
    inset: 0; /* shorthand for top:0; right:0; bottom:0; left:0 */
    background-image: url("/assets/images/partner-bg.jpg"); /* no {{ asset() }} */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: saturate(0.1) blur(6px);
    transform: scale(1.1); /* prevent blur cutoff on edges */
    z-index: 0;
}

/* Make sure all content inside stays sharp */
.login-bg > * {
    position: relative;
    z-index: 1;
}

#password-change-modal.modal {
    z-index: 100000; /* Ensure modal is above everything */
}
#password-change-modal.modal-backdrop {
    z-index: 99999; /* Ensure backdrop is below modal but above other content */
}
#upload-photo-modal.modal {
    z-index: 100001; /* Ensure backdrop is below modal but above other content */
}


.fa-telegram{
    color: #0088cc !important;
    font-size: 26px!important;
}
.luxury-categories-section {
    margin-top: 20px;
}



.luxury-categories-section {
    padding: 2rem 20px 0 20px;
    border-top-left-radius: 10px;
    /*border-top-left-radius: 230px;*/
    border-top-right-radius: 10px;
    /*border-top: 3px solid var(--primary-color);*/
    position: relative;
}

.luxury-categories-section::before {
    content: '';
    position: absolute;
    top: -25px;
    left: 0;
    right: 0;
    height: 30px;
    background:
        linear-gradient(90deg,
        #8B0000 0%,
        var(--primary-color) 25%,
        #FF2400 50%,
        var(--primary-color) 75%,
        #8B0000 100%),
        repeating-linear-gradient(45deg,
        transparent 0px,
        transparent 4px,
        rgba(255, 255, 255, 0.1) 4px,
        rgba(255, 255, 255, 0.1) 6px);
    background-blend-mode: overlay;
    clip-path: polygon(
        0% 100%,
        0.5% 70%, 1% 95%, 1.5% 60%, 2% 90%,
        2.5% 50%, 3% 85%, 3.5% 65%, 4% 100%,
        4.5% 40%, 5% 80%, 5.5% 55%, 6% 75%,
        6.5% 45%, 7% 100%, 7.5% 35%, 8% 70%,
        8.5% 60%, 9% 90%, 9.5% 30%, 10% 65%,
            /* Continue to 90% */
        90% 75%, 90.5% 45%, 91% 85%, 91.5% 55%,
        92% 95%, 92.5% 40%, 93% 100%, 93.5% 50%,
        94% 70%, 94.5% 60%, 95% 90%, 95.5% 35%,
        96% 80%, 96.5% 65%, 97% 100%, 97.5% 30%,
        98% 75%, 98.5% 55%, 99% 85%, 99.5% 45%,
        100% 100%
    );
    filter: drop-shadow(0 3px 5px rgba(139, 0, 0, 0.3));
}


/*.luxury-categories-section::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: -12px;*/
/*    left: 0;*/
/*    right: 0;*/
/*    height: 24px;*/
/*    background:*/
/*        linear-gradient(90deg,*/
/*        var(--primary-color),*/
/*        var(--primary-color),*/
/*        var(--primary-color)),*/
/*        repeating-linear-gradient(90deg,*/
/*        transparent 0px,*/
/*        transparent 8px,*/
/*        rgba(255, 255, 255, 0.5) 8px,*/
/*        rgba(239, 239, 239, 0.5) 10px);*/
/*    background-blend-mode: overlay;*/
/*    clip-path: polygon(*/
/*        0% 100%,*/
/*        0.5% 60%, 1% 90%, 1.5% 40%, 2% 80%,*/
/*        2.5% 30%, 3% 70%, 3.5% 50%, 4% 100%,*/
/*        4.5% 20%, 5% 85%, 5.5% 35%, 6% 75%,*/
/*        6.5% 25%, 7% 65%, 7.5% 55%, 8% 95%,*/
/*        8.5% 15%, 9% 100%, 9.5% 45%, 10% 60%,*/
/*            !* Continue this pattern across... *!*/
/*        90% 70%, 90.5% 30%, 91% 80%, 91.5% 40%,*/
/*        92% 90%, 92.5% 20%, 93% 100%, 93.5% 50%,*/
/*        94% 60%, 94.5% 35%, 95% 85%, 95.5% 25%,*/
/*        96% 75%, 96.5% 45%, 97% 95%, 97.5% 15%,*/
/*        98% 65%, 98.5% 55%, 99% 100%, 99.5% 40%,*/
/*        100% 100%*/
/*    );*/
/*}*/


/*.luxury-categories-section::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: -10px;*/
/*    left: 5%;*/
/*    right: 5%;*/
/*    height: 20px;*/
/*    background:*/
/*        repeating-linear-gradient(90deg,*/
/*        transparent,*/
/*        transparent 10px,*/
/*        var(--primary-color) 10px,*/
/*        var(--primary-color) 20px),*/
/*        repeating-linear-gradient(90deg,*/
/*        transparent,*/
/*        transparent 15px,*/
/*        var(--primary-color) 15px,*/
/*        var(--primary-color) 25px);*/
/*    background-blend-mode: overlay;*/
/*    mask-image: linear-gradient(90deg,*/
/*    transparent 0%,*/
/*    black 20%,*/
/*    black 80%,*/
/*    transparent 100%);*/
/*}*/

.luxury-section-header {
    text-align: center;
    margin-bottom: 3.5rem;
}

.luxury-section-title {
    font-size: 2.5rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
    letter-spacing: 1px;
}

.luxury-section-subtitle {
    font-size: 1.1rem;
    color: var(--secondary-light);
    font-weight: 300;
    letter-spacing: 0.5px;
}

.luxury-categories-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 15px;
    max-width: 1400px;
    margin: 0 auto;
}

.luxury-category-card {
    display: block;
    text-decoration: none;
    color: inherit;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.4s ease;
    position: relative;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.08);
}

.luxury-category-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);
}

.luxury-image-container {
    position: relative;
    padding-top: 120%; /* Slightly taller aspect ratio */
    overflow: hidden;
}

.luxury-category-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 280px;
    height: 335px;
    /*object-fit: cover;*/
    border-radius: 0!important;
    transition: transform 0.6s ease;
}

.luxury-category-card:hover .luxury-category-image {
    transform: scale(1.1);
}

.luxury-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.5), transparent 60%);
    z-index: 1;
}

.luxury-category-content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1.5rem;
    z-index: 2;
    color: white;
    background-color: rgba(255, 255, 255, 0.1);

}

.luxury-category-name {
    font-size: 1.2rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    letter-spacing: 0.5px;
}

.luxury-explore-btn {
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: 1px;
    opacity: 0.9;
    transition: all 0.3s ease;
}

.luxury-category-card:hover .luxury-explore-btn {
    transform: translateX(5px);
    opacity: 1;
}

/* Responsive Adjustments */
@media (max-width: 1200px) {
    .luxury-categories-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }
}

@media (max-width: 768px) {
    .luxury-section-title {
        font-size: 2rem;
    }

    .luxury-categories-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 1.5rem;
    }
}

@media (max-width: 480px) {
    .luxury-categories-section {
        padding: 3rem 0;
    }

    .luxury-categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .luxury-category-name {
        font-size: 1rem;
    }
}

/* ================================
   TOASTR BASE & ANIMATIONS
================================ */
#toast-container > div {
    opacity: 1 !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    border-radius: 12px; /* Smoother corners */
    padding: 18px 22px 18px 60px !important;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    line-height: 1.4;
    min-height: 52px;
    background-position: 22px center !important;
    background-size: 24px !important;

    /* Animation Entrance */
    animation: toast-slide-in 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

/* Slide-in Keyframes */
@keyframes toast-slide-in {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* ================================
   ANIMATED PROGRESS BAR
================================ */
.toast-progress {
    height: 6px !important; /* Slightly thicker for visibility */
    background-color: rgba(255, 255, 255, 0.4) !important;
    opacity: 1 !important;
    bottom: 0;
    left: 0;
    border-radius: 0 0 0 12px;
    /* This makes the bar feel "fluid" as it drains */
    transition: width linear;
}

/* Success bar color variation */
.toast-success .toast-progress {
    background-color: rgba(0, 0, 0, 0.1) !important;
}

/* ================================
   TEXT & CONTENT
================================ */
#toast-container > div .toast-message,
#toast-container > div .toast-title {
    display: block;
    word-wrap: break-word;
    white-space: normal;
}

.toast-title {
    font-weight: 700;
    color: #fff;
    margin-bottom: 2px;
    letter-spacing: 0.3px;
}

.toast-message {
    font-weight: 400;
    color: rgba(255, 255, 255, 0.95);
}

/* ================================
   CONTEXTUAL STYLES
================================ */
#toast-container > .toast-success { background-color: #00c853; }
#toast-container > .toast-error { background-color: #ff5252; }
#toast-container > .toast-info { background-color: #2196F3; }

#toast-container > .toast-warning {
    background-color: #ffc107;
    color: #333 !important;
}
#toast-container > .toast-warning .toast-title,
#toast-container > .toast-warning .toast-message,
#toast-container > .toast-warning .toast-close-button {
    color: #333 !important;
}

/* ================================
   INTERACTION
================================ */
#toast-container > div:hover {
    transform: scale(1.02);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
    cursor: pointer;
}

.toast-close-button {
    top: 10px !important;
    right: 12px !important;
    transition: transform 0.2s ease;
}

.toast-close-button:hover {
    transform: rotate(90deg);
}

/* ================================
   MOBILE RESPONSIVE
================================ */
@media (max-width: 600px) {
    #toast-container { width: 95% !important; }
    #toast-container > div { margin-bottom: 8px !important; }
}

/* ================================
   Products grid (responsive)
================================ */
.products-grid {
    display: grid;
    width: 100%;
    gap: clamp(10px, 2vw, 16px);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-grid-item {
    display: flex;
    min-width: 0;
    width: 100%;
}

.product-grid-item .product-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

@media (min-width: 576px) {
    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .products-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 992px) {
    .products-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .products-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    body.sidebar-collapsed .products-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

@media (min-width: 1400px) {
    body:not(.sidebar-collapsed) .products-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

/* Shop listing: max 4 products per row */
.shop-p__collection .products-grid,
.shop-products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 768px) {
    .shop-p__collection .products-grid,
    .shop-products-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 992px) {
    .shop-p__collection .products-grid,
    .shop-products-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .shop-p__collection .products-grid,
    .shop-products-grid,
    body.sidebar-collapsed .shop-p__collection .products-grid,
    body.sidebar-collapsed .shop-products-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 1400px) {
    body:not(.sidebar-collapsed) .shop-p__collection .products-grid,
    body:not(.sidebar-collapsed) .shop-products-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.shop-p__collection {
    width: 100%;
}

.shop-p__collection .product-grid-item {
    min-width: 0;
}

/* ================================
   Product card (grid & slider)
================================ */
.product-card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    margin: 0;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid var(--section-border, var(--border-color));
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--section-card-shadow, 0 4px 16px rgba(var(--primary-color-rgb), 0.08));
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    min-width: 0;
}

.product-card:hover {
    transform: translateY(-4px);
    border-color: var(--section-border-hover, #e8a8a8);
    box-shadow: var(--section-card-shadow-hover, 0 10px 28px rgba(var(--primary-color-rgb), 0.14));
}

.product-card.product-container-extra-width,
.product-card.product-container-extra-width:hover {
    width: 100%;
    max-width: 100%;
    scale: none;
}

.product-card__badge.product-sale-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    right: auto;
    z-index: 4;
    float: none;
    border-radius: 20px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
}

.product-card__image-wrap {
    position: relative;
    z-index: 2;
    width: 100%;
    background: #ffffff;
    overflow: hidden;
}

.product-card__image-link {
    border-radius: 0;
    position: relative;
    z-index: 1;
    cursor: pointer;
    display: block;
}

.product-card__image-link:hover .product-card__image {
    opacity: 0.92;
}

.product-card .product-o__wrap:before {
    display: none !important;
}

.product-card .aspect--square {
    padding-bottom: 88%;
}

.product-card .aspect__img,
.product-card__image {
    border-radius: 13px 13px 0 0 !important;
    object-fit: contain;
    padding: 8px;
    transition: opacity 0.2s ease;
}

.product-card__category-badge {
    position: relative;
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 6px;
    max-width: 100%;
    margin: 0 0 8px;
    padding: 5px 12px 5px 10px;
    border-radius: 9999px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.product-card__category-icon {
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    color: #4b5563;
    stroke: #4b5563;
}

.product-card__category-badge > a {
    color: #374151;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    text-decoration: none;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.product-card__category-badge > a:hover {
    color: #1f2937;
}

.product-card__body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 6px;
    padding: 12px 12px 12px;
    min-width: 0;
    background: #ffffff;
}

@media (min-width: 768px) {
    .product-card__body {
        padding: 14px 14px 14px;
    }
}

.product-card__title {
    margin: 0;
    min-height: 0;
}

.product-card__title-link {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: clamp(13px, 2.5vw, 15px);
    font-weight: 600;
    line-height: 1.35;
    color: var(--text-dark);
    text-decoration: none;
    height: auto;
    word-break: break-word;
}

.product-card__title-link:hover,
.product-card .product-o__name > a:hover {
    color: #1f1f1f;
    text-decoration: none;
}

.product-card__price {
    margin: 2px 0 4px;
}

.product-card .product-bs__price {
    color: var(--section-accent, var(--primary-color)) !important;
    font-size: clamp(16px, 3vw, 18px) !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
}

.product-card .product-bs__price span {
    color: var(--section-accent, var(--primary-color)) !important;
}

.product-card .product-bs__price [style*="color"] {
    color: var(--section-accent, var(--primary-color)) !important;
}

.product-card .product-o__discount {
    color: var(--text-color) !important;
    font-size: 13px !important;
    font-weight: 500;
    text-decoration: line-through;
    position: static;
    left: auto;
    top: auto;
}

.product-card__actions {
    margin-top: auto;
    padding-top: 4px;
}

.product-card .product-buttons-container {
    display: flex;
    gap: 8px;
    padding: 0;
    margin-top: 0;
}

.product-card .btn-responsive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-width: 0;
    min-height: 38px;
    margin-top: 0;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: clamp(12px, 2.5vw, 14px);
    font-weight: 600;
    gap: 6px;
    text-decoration: none;
}

.product-card .btn-responsive i {
    margin-right: 0;
    font-size: 13px;
}

.product-card-btn-icon {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
}

.product-card .btn-add-to-cart {
    background: #ffffff;
    border: none;
    color: #3d4451;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.product-card .btn-add-to-cart:hover {
    background: #ffffff;
    color: var(--text-dark);
    border: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.product-card .btn-add-to-cart .product-card-btn-icon {
    stroke: #3d4451;
}

.product-card .btn-buy-now {
    background: #ffffff;
    color: #3d4451;
    border: 1px solid var(--section-accent, var(--primary-color));
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.product-card .btn-buy-now:hover {
    background: #ffffff;
    color: var(--section-accent, var(--primary-color));
    border: 1px solid var(--section-accent, var(--primary-color));
    box-shadow: 0 4px 12px rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.12);
}

.product-card .btn-buy-now .product-card-btn-icon {
    stroke: #3d4451;
}

.product-card .btn-buy-now:hover .product-card-btn-icon {
    stroke: var(--section-accent, var(--primary-color));
}

.product-card .btn-buying-options {
    width: 100%;
}

.product-card .btn-buying-options .product-card-btn-icon {
    stroke: #3d4451;
}

.product-card .btn-buying-options:hover .product-card-btn-icon {
    stroke: var(--section-accent, var(--primary-color));
}

/* Vertical actions overlay (image area only, right side) */
.product-card__toolbar {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 46px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px 6px;
    border-left: 1px solid var(--border-light);
    background: #ffffff;
    box-shadow: -4px 0 12px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateX(4px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
    z-index: 5;
}

.product-card:hover .product-card__toolbar,
.product-card__image-wrap:hover .product-card__toolbar,
.product-card:focus-within .product-card__toolbar {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}

.product-card__toolbar-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.product-card__toolbar-list > li {
    margin: 0;
    opacity: 1;
    transform: none;
    list-style: none;
}

.product-card__toolbar-btn,
.product-card__toolbar-list > li > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    color: #4b5563;
    font-size: 13px;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.2s ease;
    cursor: pointer;
}

.product-card__toolbar-btn:hover,
.product-card__toolbar-list > li > a:hover {
    background: #ffffff;
    border-color: var(--section-accent, var(--primary-color));
    color: var(--section-accent, var(--primary-color));
    box-shadow: 0 4px 12px rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.15);
    transform: scale(1.06);
}

.product-card__toolbar-list .animate-class a {
    border-color: var(--section-accent, var(--primary-color));
    color: var(--section-accent, var(--primary-color));
    background: rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.06);
}

.product-slider__item {
    padding: 4px 6px;
    min-width: 0;
}

.product-slider__item .product-card,
.product-slider .owl-item .product-card {
    width: 100%;
    max-width: 100%;
}

.product-slider .owl-item {
    padding: 0 5px;
}

/* ================================
   Product slider navigation
================================ */
.product-slider-wrap {
    position: relative;
    padding: 0 28px;
}

.product-slider {
    position: relative !important;
}

.product-slider-wrap .p-prev,
.product-slider-wrap .p-next,
.section__content .product-slider-wrap .p-prev,
.section__content .product-slider-wrap .p-next {
    opacity: 1;
    visibility: visible;
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    height: 44px;
    width: 44px;
    line-height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.2);
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.12);
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    z-index: 5;
}

.product-slider-wrap .p-prev:hover,
.product-slider-wrap .p-next:hover {
    background: rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.08);
    border-color: rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.35);
    box-shadow: 0 6px 20px rgba(var(--section-accent-rgb, var(--primary-color-rgb)), 0.18);
}

.product-slider-wrap .p-prev {
    left: -8px;
    border-radius: 50%;
}

.product-slider-wrap .p-next {
    right: -8px;
    border-radius: 50%;
}

.product-slider-wrap .p-prev > i,
.product-slider-wrap .p-next > i {
    color: var(--section-accent, var(--primary-color));
    font-size: 15px;
    left: 50%;
    right: auto;
    transform: translate(-50%, -50%);
}

.product-slider-wrap .owl-nav.disabled {
    display: none;
}

@media (max-width: 767px) {
    .product-slider-wrap .p-prev,
    .product-slider-wrap .p-next {
        width: 36px;
        height: 36px;
        line-height: 36px;
    }

    .product-slider-wrap .p-prev {
        left: -4px;
    }

    .product-slider-wrap .p-next {
        right: -4px;
    }
}

/* ================================
   Weekly bestsellers layout
================================ */
.weekly-bestsellers-section .section-heading,
.new-arrivals-section .section-heading {
    margin-top: 24px;
    margin-bottom: 20px;
}

.weekly-bestsellers-layout,
.product-showcase-layout {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 20px;
    align-items: stretch;
}

.weekly-bestsellers-layout--slider-only,
.product-showcase-layout--slider-only {
    grid-template-columns: minmax(0, 1fr);
}

/* Banner on the left, product slider on the right */
.product-showcase-layout--banner-left {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
}

.product-showcase-layout--banner-left .product-showcase-banner,
.product-showcase-layout--banner-left .weekly-bestsellers-banner {
    order: 1;
}

.product-showcase-layout--banner-left .product-showcase-slider,
.product-showcase-layout--banner-left .weekly-bestsellers-slider {
    order: 2;
}

.product-showcase-layout--banner-left .product-showcase-banner img,
.product-showcase-layout--banner-left .product-showcase-banner video,
.product-showcase-layout--banner-left .product-showcase-banner .media-banner-video-wrap,
.product-showcase-layout--banner-left .product-showcase-banner .media-banner-embed,
.product-showcase-layout--banner-left .weekly-bestsellers-banner img,
.product-showcase-layout--banner-left .weekly-bestsellers-banner video,
.product-showcase-layout--banner-left .weekly-bestsellers-banner .media-banner-video-wrap,
.product-showcase-layout--banner-left .weekly-bestsellers-banner .media-banner-embed {
    object-position: left center;
}

.product-showcase-layout--banner-left .product-showcase-slider .product-slider-wrap,
.product-showcase-layout--banner-left .weekly-bestsellers-slider .product-slider-wrap {
    padding-right: 0;
    padding-left: 12px;
}

.weekly-bestsellers-banner,
.product-showcase-banner {
    position: relative;
    overflow: hidden;
    border-radius: 14px;
    align-self: stretch;
    min-height: 0;
}

.weekly-bestsellers-banner img,
.weekly-bestsellers-banner video,
.weekly-bestsellers-banner .media-banner-video-wrap,
.product-showcase-banner img,
.product-showcase-banner video,
.product-showcase-banner .media-banner-video-wrap {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right center;
    display: block;
    background: #f0f0f0;
}

.weekly-bestsellers-banner .media-banner-video-wrap,
.product-showcase-banner .media-banner-video-wrap,
.home-standalone-banner > .media-banner-video-wrap {
    object-fit: unset;
    background: #0a0a12;
    overflow: hidden;
    line-height: 0;
    z-index: 1;
}

.media-banner-video-wrap > .media-banner-video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    object-position: center;
    display: block;
    background: #0a0a12;
    /* Keep native control bar visible */
    z-index: 1;
}

.home-standalone-banner > .media-banner-video-wrap {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    display: block;
}

.home-standalone-banner > .media-banner-video-wrap > .media-banner-video {
    object-fit: contain;
}

/* Always-visible play / pause icon (mobile + desktop) */
.media-banner-video-btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: rgba(13, 10, 68, 0.72);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28);
    cursor: pointer;
    pointer-events: auto;
    transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
}

.media-banner-video-btn:hover,
.media-banner-video-btn:focus-visible {
    background: rgba(42, 36, 128, 0.9);
    outline: none;
}

.media-banner-video-btn__pause {
    display: none;
}

.media-banner-video-wrap.is-playing .media-banner-video-btn__play {
    display: none;
}

.media-banner-video-wrap.is-playing .media-banner-video-btn__pause {
    display: block;
}

.media-banner-video-wrap.is-playing .media-banner-video-btn {
    opacity: 0.55;
}

.media-banner-video-wrap.is-playing:hover .media-banner-video-btn,
.media-banner-video-wrap.is-paused .media-banner-video-btn {
    opacity: 1;
}

@media (max-width: 767px) {
    .media-banner-video-btn {
        width: 48px;
        height: 48px;
    }

    .media-banner-video-btn svg {
        width: 22px;
        height: 22px;
    }
}

/* Ensure banner videos remain tappable on touch devices */
.weekly-bestsellers-banner video.media-banner-video,
.product-showcase-banner video.media-banner-video,
.home-standalone-banner video.media-banner-video,
.media-banner-video-wrap {
    pointer-events: auto;
    cursor: pointer;
}

/*
 * Embedded videos: in-flow 16:9 box (service-page pattern).
 * Do NOT absolute-fill like images — that collapses the iframe to a blank panel.
 */
.weekly-bestsellers-banner.product-showcase-banner--embed,
.product-showcase-banner.product-showcase-banner--embed,
.weekly-bestsellers-banner:has(> .media-banner-embed),
.product-showcase-banner:has(> .media-banner-embed) {
    position: relative;
    align-self: center;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto;
    overflow: hidden;
    background: #000;
}

.weekly-bestsellers-banner .media-banner-embed,
.product-showcase-banner .media-banner-embed,
.home-standalone-banner .media-banner-embed,
.media-banner-embed {
    position: relative !important;
    inset: auto !important;
    display: block;
    width: 100%;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0;
    padding: 0 0 56.25% 0; /* 16:9 */
    overflow: hidden;
    background: #000;
    border-radius: inherit;
    line-height: 0;
}

.weekly-bestsellers-banner .media-banner-embed__frame,
.product-showcase-banner .media-banner-embed__frame,
.home-standalone-banner .media-banner-embed__frame,
.media-banner-embed__frame {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    border: 0 !important;
    display: block !important;
}

/* Standalone homepage banners (slots 2 & 3) */
.home-standalone-banner {
    margin: 20px 0;
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
    line-height: 0;
}

.home-standalone-banner > img,
.home-standalone-banner > video {
    width: 100%;
    height: auto;
    display: block;
    object-fit: fill;
}

.home-standalone-banner > .media-banner-embed {
    position: relative !important;
    width: 100%;
    height: 0 !important;
    padding: 0 0 56.25% 0;
    background: #000;
    line-height: 0;
}

.home-standalone-banner .media-banner-embed__frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 767px) {
    .home-standalone-banner {
        border-radius: 10px;
        margin: 16px 0;
    }
}

.weekly-bestsellers-slider,
.product-showcase-slider {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.weekly-bestsellers-slider .product-slider-standalone,
.weekly-bestsellers-slider .section__content,
.product-showcase-slider .product-slider-standalone,
.product-showcase-slider .section__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 0 !important;
    padding: 0;
}

.weekly-bestsellers-slider .product-slider-wrap,
.product-showcase-slider .product-slider-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 0;
    padding-right: 12px;
}

.product-slider-standalone > .section__content > div {
    width: 100%;
}

@media (max-width: 991px) {
    .weekly-bestsellers-layout,
    .weekly-bestsellers-layout--slider-only,
    .product-showcase-layout,
    .product-showcase-layout--slider-only,
    .product-showcase-layout--banner-left {
        grid-template-columns: 1fr;
    }

    .product-showcase-layout--banner-left .product-showcase-banner,
    .product-showcase-layout--banner-left .weekly-bestsellers-banner,
    .product-showcase-layout--banner-left .product-showcase-slider,
    .product-showcase-layout--banner-left .weekly-bestsellers-slider {
        order: unset;
    }

    .weekly-bestsellers-banner,
    .product-showcase-banner {
        min-height: 260px;
    }

    .weekly-bestsellers-banner.product-showcase-banner--embed,
    .product-showcase-banner.product-showcase-banner--embed,
    .weekly-bestsellers-banner:has(> .media-banner-embed),
    .product-showcase-banner:has(> .media-banner-embed) {
        min-height: 0 !important;
        height: auto !important;
    }

    .weekly-bestsellers-slider .product-slider-wrap,
    .product-showcase-slider .product-slider-wrap,
    .product-showcase-layout--banner-left .product-showcase-slider .product-slider-wrap,
    .product-showcase-layout--banner-left .weekly-bestsellers-slider .product-slider-wrap {
        padding-right: 0;
        padding-left: 0;
    }
}

.product-card.no-price .product-card__body {
    justify-content: flex-start;
}

@media (max-width: 767px) {
    .product-card .product-buttons-container {
        flex-direction: row;
        gap: 6px;
    }

    .product-card .btn-responsive {
        padding: 8px 6px;
    }

    .product-card .btn-responsive span {
        display: inline;
    }

    .product-card__category-badge {
        margin-bottom: 6px;
        padding: 4px 10px 4px 8px;
        gap: 5px;
    }

    .product-card__category-badge > a {
        font-size: 11px;
    }

    .product-card__category-icon {
        width: 12px;
        height: 12px;
    }

    .product-card__toolbar {
        width: 40px;
        padding: 8px 4px;
    }

    .product-card__toolbar-btn,
    .product-card__toolbar-list > li > a {
        width: 28px;
        height: 28px;
        font-size: 12px;
    }

    .product-card__toolbar-list {
        gap: 8px;
    }
}

@media (max-width: 399px) {
    .products-grid {
        gap: 8px;
    }

    .product-card__body {
        padding: 10px 10px 10px;
    }

    .product-card .btn-responsive span {
        font-size: 12px;
    }
}

@media (max-width: 820px) {
    .product-card .product-o__name > a,
    .product-card .product-card__title-link {
        height: auto !important;
        min-height: 0 !important;
    }

    .product-card .product-o__discount {
        font-size: 12px !important;
        position: static !important;
        left: auto !important;
        top: auto !important;
        white-space: normal !important;
    }

    .product-card .product-bs__price {
        white-space: normal !important;
    }
}

/* ================================
   Section themes (headings + cards)
================================ */
.section-theme {
    --section-accent: var(--primary-color);
    --section-accent-rgb: var(--primary-color-rgb);
    --section-border: rgba(var(--primary-color-rgb), 0.16);
    --section-border-hover: rgba(var(--primary-color-rgb), 0.32);
    --section-card-shadow: 0 4px 16px rgba(var(--primary-color-rgb), 0.08);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--primary-color-rgb), 0.14);
}

.section-theme--popular {
    --section-accent: var(--theme-popular-accent);
    --section-accent-rgb: var(--theme-popular-accent-rgb);
    --section-border: rgba(var(--theme-popular-accent-rgb), 0.18);
    --section-border-hover: rgba(var(--theme-popular-accent-rgb), 0.36);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-popular-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-popular-accent-rgb), 0.16);
}

.section-theme--categories {
    --section-accent: var(--theme-categories-accent);
    --section-accent-rgb: var(--theme-categories-accent-rgb);
    --section-border: rgba(var(--theme-categories-accent-rgb), 0.18);
    --section-border-hover: rgba(var(--theme-categories-accent-rgb), 0.34);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-categories-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-categories-accent-rgb), 0.15);
}

.section-theme--new {
    --section-accent: var(--theme-new-accent);
    --section-accent-rgb: var(--theme-new-accent-rgb);
    --section-border: rgba(var(--theme-new-accent-rgb), 0.18);
    --section-border-hover: rgba(var(--theme-new-accent-rgb), 0.34);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-new-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-new-accent-rgb), 0.15);
}

.section-theme--flash {
    --section-accent: var(--theme-flash-accent);
    --section-accent-rgb: var(--theme-flash-accent-rgb);
    --section-border: rgba(var(--theme-flash-accent-rgb), 0.2);
    --section-border-hover: rgba(var(--theme-flash-accent-rgb), 0.38);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-flash-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-flash-accent-rgb), 0.16);
}

.section-theme--suggestions {
    --section-accent: var(--theme-suggestions-accent);
    --section-accent-rgb: var(--theme-suggestions-accent-rgb);
    --section-border: rgba(var(--theme-suggestions-accent-rgb), 0.18);
    --section-border-hover: rgba(var(--theme-suggestions-accent-rgb), 0.34);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-suggestions-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-suggestions-accent-rgb), 0.15);
}

.section-theme--bestsellers {
    --section-accent: var(--theme-bestsellers-accent);
    --section-accent-rgb: var(--theme-bestsellers-accent-rgb);
    --section-border: rgba(var(--theme-bestsellers-accent-rgb), 0.18);
    --section-border-hover: rgba(var(--theme-bestsellers-accent-rgb), 0.34);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-bestsellers-accent-rgb), 0.1);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-bestsellers-accent-rgb), 0.15);
}

.section-theme--blog {
    --section-accent: var(--theme-blog-accent);
    --section-accent-rgb: var(--theme-blog-accent-rgb);
    --section-border: rgba(var(--theme-blog-accent-rgb), 0.16);
    --section-border-hover: rgba(var(--theme-blog-accent-rgb), 0.3);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-blog-accent-rgb), 0.08);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-blog-accent-rgb), 0.13);
}

.section-theme--featured {
    --section-accent: var(--theme-featured-accent);
    --section-accent-rgb: var(--theme-featured-accent-rgb);
    --section-border: rgba(var(--theme-featured-accent-rgb), 0.16);
    --section-border-hover: rgba(var(--theme-featured-accent-rgb), 0.32);
    --section-card-shadow: 0 4px 16px rgba(var(--theme-featured-accent-rgb), 0.08);
    --section-card-shadow-hover: 0 10px 28px rgba(var(--theme-featured-accent-rgb), 0.14);
}

.section-theme .product-card__category-badge {
    border-color: rgba(var(--section-accent-rgb), 0.12);
    background: rgba(var(--section-accent-rgb), 0.06);
}

.section-theme .product-card__category-icon {
    color: var(--section-accent);
    stroke: var(--section-accent);
}

.section-theme .product-card__category-badge > a:hover {
    color: var(--section-accent);
}

/* ================================
   Homepage section headings
================================ */
.section-heading {
    --sh-accent: var(--section-accent, var(--primary-color));
    --sh-accent-rgb: var(--section-accent-rgb, var(--primary-color-rgb));
    --sh-icon-bg: rgba(var(--sh-accent-rgb), 0.1);
    --sh-icon-shadow: rgba(var(--sh-accent-rgb), 0.18);
    --sh-line-start: var(--sh-accent);
    --sh-line-end: rgba(var(--sh-accent-rgb), 0.08);
    --sh-deco: rgba(var(--sh-accent-rgb), 0.35);

    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    margin: 36px 0 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    position: relative;
    overflow: visible;
}

.section-heading::before {
    display: none;
}

.section-heading--center {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.section-heading--center .section-heading__main {
    align-items: center;
}

.section-heading--center .section-heading__row {
    flex-direction: column;
    text-align: center;
}

.section-heading--center .section-heading__text {
    align-items: center;
}

.section-heading--center .section-heading__line {
    margin-left: auto;
    margin-right: auto;
}

.section-heading--center .section-heading__deco {
    display: none;
}

.section-heading--right {
    flex-direction: row-reverse;
    justify-content: flex-start;
    text-align: right;
}

.section-heading--right .section-heading__main {
    align-items: flex-end;
    margin-left: auto;
}

.section-heading--right .section-heading__row {
    flex-direction: row-reverse;
    text-align: right;
}

.section-heading--right .section-heading__text {
    align-items: flex-end;
}

.section-heading--right .section-heading__subtitle {
    text-align: right;
}

.section-heading--right .section-heading__eyebrow {
    flex-direction: row-reverse;
}

.section-heading--right .section-heading__eyebrow::before {
    background: linear-gradient(270deg, var(--sh-accent), transparent);
}

.section-heading--right .section-heading__line {
    margin-left: auto;
    background: linear-gradient(270deg, var(--sh-line-start) 0%, var(--sh-line-end) 100%);
}

.section-heading--right .section-heading__deco {
    order: -1;
    padding-bottom: 6px;
    flex-direction: row-reverse;
}

.section-heading__main {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.section-heading__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--sh-accent);
}

.section-heading__eyebrow::before {
    content: '';
    width: 28px;
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--sh-accent), transparent);
}

.section-heading--center .section-heading__eyebrow::before {
    display: none;
}

.section-heading__row {
    display: flex;
    align-items: center;
    gap: 16px;
}

.section-heading__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: var(--sh-icon-bg);
    color: var(--sh-accent);
    font-size: 20px;
    box-shadow: 0 10px 28px var(--sh-icon-shadow);
    position: relative;
    overflow: hidden;
}

.section-heading__svg {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
}

.section-heading__icon::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid rgba(var(--sh-accent-rgb), 0.12);
    pointer-events: none;
}

.section-heading__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.section-heading__title {
    margin: 0;
    padding: 0;
    font-size: clamp(1.35rem, 3vw, 1.85rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.035em;
    color: var(--text-dark);
    text-transform: none;
}

.section-heading__subtitle {
    margin: 0;
    max-width: 42ch;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: #7a7a85;
}

.section-heading__line {
    width: min(220px, 55%);
    height: 3px;
    margin-top: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--sh-line-start) 0%, var(--sh-line-end) 100%);
}

.section-heading__deco {
    display: flex;
    align-items: center;
    gap: 7px;
    padding-bottom: 6px;
    flex-shrink: 0;
}

.section-heading__deco span {
    display: block;
    border-radius: 50%;
    background: var(--sh-deco);
}

.section-heading__deco span:nth-child(1) {
    width: 7px;
    height: 7px;
    opacity: 0.9;
}

.section-heading__deco span:nth-child(2) {
    width: 11px;
    height: 11px;
    opacity: 0.55;
}

.section-heading__deco span:nth-child(3) {
    width: 15px;
    height: 15px;
    opacity: 0.25;
}

/* Variants — inherit from :root theme tokens */
.section-heading--popular {
    --sh-accent: var(--theme-popular-accent);
    --sh-accent-rgb: var(--theme-popular-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-popular-accent-rgb), 0.14) 0%, rgba(255, 138, 101, 0.2) 100%);
    --sh-icon-shadow: rgba(var(--theme-popular-accent-rgb), 0.22);
    --sh-line-end: rgba(var(--theme-popular-accent-rgb), 0.06);
    --sh-deco: rgba(var(--theme-popular-accent-rgb), 0.4);
}

.section-heading--categories {
    --sh-accent: var(--theme-categories-accent);
    --sh-accent-rgb: var(--theme-categories-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-categories-accent-rgb), 0.12) 0%, rgba(251, 191, 36, 0.18) 100%);
    --sh-icon-shadow: rgba(var(--theme-categories-accent-rgb), 0.2);
    --sh-line-end: rgba(var(--theme-categories-accent-rgb), 0.06);
    --sh-deco: rgba(var(--theme-categories-accent-rgb), 0.38);
}

.section-heading--new {
    --sh-accent: var(--theme-new-accent);
    --sh-accent-rgb: var(--theme-new-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-new-accent-rgb), 0.12) 0%, rgba(245, 158, 11, 0.2) 100%);
    --sh-icon-shadow: rgba(var(--theme-new-accent-rgb), 0.2);
    --sh-line-end: rgba(245, 158, 11, 0.08);
    --sh-deco: rgba(var(--theme-new-accent-rgb), 0.38);
}

.section-heading--flash {
    --sh-accent: var(--theme-flash-accent);
    --sh-accent-rgb: var(--theme-flash-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-flash-accent-rgb), 0.14) 0%, rgba(var(--theme-flash-accent-2-rgb), 0.2) 100%);
    --sh-icon-shadow: rgba(var(--theme-flash-accent-rgb), 0.24);
    --sh-line-end: rgba(var(--theme-flash-accent-2-rgb), 0.08);
    --sh-deco: rgba(var(--theme-flash-accent-rgb), 0.42);
}

.section-heading--flash .section-heading__icon {
    animation: sh-flash-pulse 2.4s ease-in-out infinite;
}

@keyframes sh-flash-pulse {
    0%, 100% { box-shadow: 0 10px 28px rgba(var(--theme-flash-accent-rgb), 0.22); }
    50% { box-shadow: 0 10px 36px rgba(var(--theme-flash-accent-2-rgb), 0.35); }
}

.section-heading--suggestions {
    --sh-accent: var(--theme-suggestions-accent);
    --sh-accent-rgb: var(--theme-suggestions-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-suggestions-accent-rgb), 0.12) 0%, rgba(167, 139, 250, 0.2) 100%);
    --sh-icon-shadow: rgba(var(--theme-suggestions-accent-rgb), 0.22);
    --sh-line-end: rgba(167, 139, 250, 0.1);
    --sh-deco: rgba(var(--theme-suggestions-accent-rgb), 0.38);
}

.section-heading--bestsellers {
    --sh-accent: var(--theme-bestsellers-accent);
    --sh-accent-rgb: var(--theme-bestsellers-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-bestsellers-accent-rgb), 0.12) 0%, rgba(52, 211, 153, 0.18) 100%);
    --sh-icon-shadow: rgba(var(--theme-bestsellers-accent-rgb), 0.22);
    --sh-line-end: rgba(52, 211, 153, 0.08);
    --sh-deco: rgba(var(--theme-bestsellers-accent-rgb), 0.38);
}

.section-heading--blog {
    --sh-accent: var(--theme-blog-accent);
    --sh-accent-rgb: var(--theme-blog-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-blog-accent-rgb), 0.1) 0%, rgba(148, 163, 184, 0.16) 100%);
    --sh-icon-shadow: rgba(var(--theme-blog-accent-rgb), 0.16);
    --sh-line-end: rgba(148, 163, 184, 0.1);
    --sh-deco: rgba(var(--theme-blog-accent-rgb), 0.32);
}

.section-heading--featured {
    --sh-accent: var(--theme-featured-accent);
    --sh-accent-rgb: var(--theme-featured-accent-rgb);
    --sh-icon-bg: linear-gradient(135deg, rgba(var(--theme-featured-accent-rgb), 0.1) 0%, rgba(var(--theme-featured-accent-rgb), 0.18) 100%);
    --sh-icon-shadow: rgba(var(--theme-featured-accent-rgb), 0.2);
    --sh-line-end: rgba(var(--theme-featured-accent-rgb), 0.06);
    --sh-deco: rgba(var(--theme-featured-accent-rgb), 0.35);
}

.section-heading--default {
    --sh-accent: var(--primary-color);
    --sh-accent-rgb: var(--primary-color-rgb);
}

/* Legacy class — map old banners to new style */
.section_gradient.section__heading,
h1.section_gradient {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 36px 0 28px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--text-dark) !important;
    font-size: clamp(1.35rem, 3vw, 1.85rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.035em !important;
    text-transform: none !important;
    text-shadow: none !important;
    animation: none !important;
    background-size: auto !important;
    transform: none !important;
    position: relative !important;
    overflow: visible !important;
}

.section_gradient.section__heading::before,
h1.section_gradient::before {
    display: none;
}

.section_gradient.section__heading i,
h1.section_gradient i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: rgba(var(--primary-color-rgb), 0.1);
    color: var(--primary-color);
    font-size: 20px;
    margin-right: 0;
    box-shadow: 0 10px 28px rgba(var(--primary-color-rgb), 0.18);
}

@media (max-width: 767px) {
    .section-heading {
        margin: 28px 0 22px;
        gap: 16px;
        align-items: flex-start;
    }

    .section-heading__deco {
        display: none;
    }

    .section-heading__icon {
        width: 46px;
        height: 46px;
        font-size: 17px;
        border-radius: 14px;
    }

    .section-heading__svg {
        width: 22px;
        height: 22px;
    }

    .section-heading__row {
        gap: 12px;
    }

    .section-heading__title {
        font-size: 1.3rem;
    }

    .section-heading__subtitle {
        font-size: 13px;
    }

    .section-heading__line {
        width: min(160px, 70%);
    }
}

/* ================================
   Product details v2
================================ */
.pd-v2 {
    --pd-accent: var(--primary-color);
    --pd-accent-rgb: var(--primary-color-rgb);
    --pd-surface: rgba(var(--primary-color-rgb), 0.04);
    --pd-border: rgba(var(--primary-color-rgb), 0.12);
    --pd-border-strong: rgba(var(--primary-color-rgb), 0.22);
    --pd-muted: rgba(var(--primary-color-rgb), 0.55);
    --pd-cream: #f8f6f3;
    --pd-cream-soft: #fdfcfb;
    --pd-neutral-border: rgba(15, 23, 42, 0.07);
    --pd-radius: 12px;
    --pd-policy-collapse-max: clamp(1620px, 292vh, 4400px);
    /*--pd-policy-collapse-max: clamp(1760px, 336vh, 4800px);*/
    padding-bottom: 40px;
}

.pd-v2__row {
    align-items: flex-start;
}

.pd-v2__gallery {
    position: sticky;
    top: 108px;
}

.pd-v2__policy {
    margin-top: 20px;
    padding: 20px 22px;
    background: var(--pd-cream-soft);
    border: none;
    border-radius: 10px;
}

.pd-v2__policy-title {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pd-accent);
}

.pd-v2__policy-body {
    font-size: 13px;
    line-height: 1.75;
    color: var(--text-color);
    white-space: pre-line;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.pd-v2__policy-body strong,
.pd-v2__policy-body b {
    font-weight: 600;
    color: #334155;
}

.pd-v2__policy-wrap {
    position: relative;
}

.pd-v2__policy-wrap:not(.is-expanded):not(.is-no-clamp) .pd-v2__policy-body,
.pd-v2__policy-body.is-clamped {
    max-height: var(--pd-policy-collapse-max);
    overflow: hidden;
}

.pd-v2__policy-wrap.is-expanded .pd-v2__policy-body,
.pd-v2__policy-wrap.is-no-clamp .pd-v2__policy-body {
    max-height: none;
    overflow: visible;
}

.pd-v2__policy-fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 72px;
    background: linear-gradient(
        to bottom,
        rgba(253, 252, 251, 0) 0%,
        rgba(253, 252, 251, 0.88) 45%,
        var(--pd-cream-soft) 100%
    );
    pointer-events: none;
}

.pd-v2__policy-more {
    margin-top: 8px;
}

.pd-v2__policy--desktop {
    display: block;
}

.pd-v2__policy--tab {
    margin-top: 0;
    padding: 0;
    background: transparent;
}

.pd-v2__tab-item--mobile-policy {
    display: none;
}

.pd-v2__main {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: 10px;
}

.pd-v2__purchase-card {
    padding-bottom: 4px;
}

.pd-v2__purchase-card .pd-detail {
    padding: 0;
}

.pd-v2__title {
    font-size: clamp(1.35rem, 2.4vw, 1.75rem);
    font-weight: 700;
    line-height: 1.3;
    color: #000000;
    margin: 0 0 14px;
    letter-spacing: -0.02em;
}

.pd-v2__purchase-card .pd-detail__price {
    font-size: clamp(1.4rem, 2.5vw, 1.85rem) !important;
    font-weight: 700 !important;
    color: var(--primary-color) !important;
    margin-bottom: 8px;
}

.pd-v2__purchase-card .pd-detail__stock {
    display: inline-block;
    font-size: 13px;
    font-weight: 500;
    color: var(--pd-accent);
    background: rgba(var(--pd-accent-rgb), 0.08);
    padding: 4px 10px;
    border-radius: 6px;
}

.pd-v2__purchase-card .pd-detail__left {
    font-size: 13px;
    font-weight: 500;
    color: var(--pd-accent);
    background: rgba(var(--pd-accent-rgb), 0.06);
    padding: 4px 10px;
    border-radius: 6px;
}

.pd-v2__label {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.pd-v2__meta-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #000000;
    margin-bottom: 16px;
}

/* Product detail — title & description: solid black (desktop + mobile; beats theme grays / inline HTML colors) */
.pd-v2 .pd-detail__name,
.pd-v2 .pd-v2__title {
    color: #000000 !important;
}

.pd-v2 .pd-v2__meta-desc,
.pd-v2 .pd-purchase__desc-content,
.pd-v2 .pd-purchase__desc-label,
.pd-v2 .pd-purchase__desc-html,
.pd-v2 .pd-v2__desc-content,
.pd-v2 .pd-v2__desc-label,
.pd-v2 .pd-v2__desc-html {
    color: #000000 !important;
}

.pd-v2 .pd-purchase__desc-html :where(p, span, li, div, strong, em, b, i, u, h1, h2, h3, h4, h5, h6, blockquote, td, th, label):not(a),
.pd-v2 .pd-v2__desc-html :where(p, span, li, div, strong, em, b, i) {
    color: #000000 !important;
}

/* Purchase meta — description, wishlist, share */
.pd-purchase__desc {
    margin: 16px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--pd-neutral-border);
}

.pd-purchase__desc-wrap {
    position: relative;
}

.pd-purchase__desc-content {
    font-size: 14px;
    line-height: 1.7;
    color: #000000;
}

.pd-purchase__desc-label {
    display: block;
    margin: 0 0 6px;
    color: #000000;
    font-weight: 600;
}

.pd-purchase__desc-html {
    color: #000000;
}

.pd-purchase__desc-html p {
    margin: 0 0 0.5em;
}

.pd-purchase__desc-html.is-clamped,
.pd-purchase__desc-wrap:not(.is-expanded):not(.is-no-clamp) .pd-purchase__desc-html {
    max-height: 6.8em;
    overflow: hidden;
}

.pd-purchase__desc-wrap.is-expanded .pd-purchase__desc-html,
.pd-purchase__desc-wrap.is-no-clamp .pd-purchase__desc-html {
    max-height: none;
    overflow: visible;
}

.pd-purchase__desc-fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
    pointer-events: none;
}

.pd-purchase__view-more {
    margin-top: 8px;
}

.pd-purchase__meta {
    padding: 14px 0 18px;
    border-bottom: 1px solid var(--pd-neutral-border);
    margin-bottom: 4px;
}

.pd-purchase__utility-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.pd-purchase__utility-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #475569;
}

.pd-purchase__utility-item i {
    color: #94a3b8;
    font-size: 15px;
}

.pd-purchase__utility-item a {
    color: #475569 !important;
    text-decoration: none;
    font-weight: 500;
}

.pd-purchase__utility-item a:hover {
    color: #1e293b !important;
    text-decoration: underline;
}

.pd-purchase__share {
    width: 100%;
    margin-top: 12px;
}

.pd-purchase__share .pd-share {
    width: 100%;
}

/* Purchase action buttons */
.pd-v2 .product-actions {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 20px 0 0;
}

.pd-v2 .action-buttons {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 12px;
    width: 100%;
    margin-bottom: 24px;
}

.pd-v2 .add-to-cart-modal-btn,
.pd-v2 .buy-now-btn,
.pd-v2 .request-stock-btn {
    flex: 1 1 0;
    min-width: 0;
    min-height: 48px;
    height: auto !important;
    padding: 12px 16px !important;
    border-radius: 12px;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.01em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    border: none;
    line-height: 1.2;
    white-space: nowrap;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.pd-v2 .add-to-cart-modal-btn {
    background: var(--buying-option-color, #687d77);
    color: #ffffff;
}

.pd-v2 .add-to-cart-modal-btn:hover {
    background: #5a6d68;
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
    transform: translateY(-1px);
}

.pd-v2 .buy-now-btn {
    background: var(--primary-color);
    color: #ffffff;
}

.pd-v2 .buy-now-btn:hover {
    background: var(--primary-hover, #c40010);
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(var(--primary-color-rgb), 0.25);
    transform: translateY(-1px);
}

.pd-v2 .request-stock-btn {
    flex: 1 1 100%;
    background: #64748b;
    color: #ffffff;
}

.pd-v2 .request-stock-btn:hover {
    background: #475569;
    color: #ffffff;
}

@media (min-width: 992px) {
    .pd-v2 .action-buttons {
        gap: 16px;
        margin-bottom: 28px;
    }

    .pd-v2 .add-to-cart-modal-btn,
    .pd-v2 .buy-now-btn,
    .pd-v2 .request-stock-btn {
        min-height: 52px;
        padding: 14px 28px !important;
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .pd-v2 .action-buttons {
        flex-direction: row;
        margin-bottom: 20px;
    }

    .pd-v2 .add-to-cart-modal-btn,
    .pd-v2 .buy-now-btn {
        min-height: 46px;
        font-size: 13px;
        padding: 10px 12px !important;
    }
}

/* Expandable description (legacy) */
.pd-v2__desc {
    margin: 18px 0 20px;
    padding-top: 18px;
    border-top: 1px solid var(--pd-border);
}

.pd-v2__desc-wrap {
    position: relative;
}

.pd-v2__desc-wrap.is-collapsed .pd-v2__desc-content {
    max-height: 88px;
    overflow: hidden;
}

.pd-v2__desc-wrap.is-expanded .pd-v2__desc-content {
    max-height: none;
}

.pd-v2__desc-content {
    font-size: 14px;
    line-height: 1.7;
    color: #000000;
}

.pd-v2__desc-label {
    color: #000000;
    font-weight: 600;
    margin-right: 4px;
}

.pd-v2__desc-html {
    display: inline;
}

.pd-v2__desc-full.pd-v2__desc-html {
    display: block;
    max-height: 300px;
    overflow-y: auto;
    margin-top: 4px;
    padding-right: 4px;
    scrollbar-width: thin;
}

.pd-v2__desc-full.pd-v2__desc-html p {
    display: block;
    margin: 0 0 0.75em;
}

.pd-v2__desc-html p {
    display: inline;
    margin: 0;
}

.pd-v2__desc-fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 56px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 50%, #ffffff 100%);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    pointer-events: none;
}

.pd-v2__view-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 0;
    border: none;
    background: none;
    color: var(--pd-accent);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s ease;
}

.pd-v2__view-more:hover {
    color: var(--primary-hover);
}

.pd-v2__view-more-icon {
    font-size: 10px;
    line-height: 1;
}

.pd-v2__desc-wrap.is-expanded + .pd-v2__view-more {
    margin-top: 12px;
}

/* Utility links + share */
.pd-v2__utility {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0 20px;
    border-bottom: 1px solid var(--pd-border);
}

.pd-v2__utility-links {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.pd-v2__utility-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #475569;
}

.pd-v2__utility-item i {
    color: #94a3b8;
    font-size: 15px;
}

.pd-v2__utility-item a {
    color: #475569 !important;
    text-decoration: none;
    font-weight: 500;
}

.pd-v2__utility-item a:hover {
    color: #1e293b !important;
    text-decoration: underline;
}

/* Social share buttons */
.pd-share {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pd-share__label {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
}

.pd-share__buttons {
    display: flex;
    gap: 10px;
}

.pd-share__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.12);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pd-share__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.16);
    color: #ffffff;
}

.pd-share__btn i {
    font-size: 16px;
}

.pd-share__svg {
    width: 18px;
    height: 18px;
    display: block;
    flex-shrink: 0;
}

.pd-share__btn--facebook { background: #1877f2; }
.pd-share__btn--whatsapp { background: #25d366; }
.pd-share__btn--linkedin { background: #0a66c2; }
.pd-share__btn--telegram { background: #229ed9; }
.pd-share__btn--twitter { background: #1da1f2; }
.pd-share__btn--default { background: #64748b; }

/* Tabs card */
.pd-v2__tabs-card {
    background: var(--pd-cream-soft);
    border: none;
    border-radius: var(--pd-radius);
    overflow: hidden;
    box-shadow: none;
}

.pd-v2__tabs {
    display: flex;
    margin: 0;
    padding: 0 20px;
    list-style: none;
    background: var(--pd-cream);
    border-bottom: 1px solid var(--pd-neutral-border);
}

.pd-v2__tabs .nav-item {
    margin: 0;
}

.pd-v2__tab {
    display: block;
    position: relative;
    padding: 14px 20px !important;
    margin-bottom: -1px;
    border: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    letter-spacing: 0.01em;
    transition: color 0.2s ease, background 0.2s ease;
}

.pd-v2__tab::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 3px;
    background: transparent;
    border-radius: var(--pd-radius) var(--pd-radius) 0 0;
    transition: background 0.2s ease;
}

.pd-v2__tab:hover {
    color: #334155 !important;
    background: rgba(255, 255, 255, 0.55) !important;
}

.pd-v2__tab.active {
    color: var(--pd-accent) !important;
    background: var(--pd-cream-soft) !important;
    font-weight: 600 !important;
}

.pd-v2__tab.active::after {
    background: var(--pd-accent);
}

.pd-v2__tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    margin-left: 6px;
    padding: 0 6px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.06);
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
}

.pd-v2__tab.active .pd-v2__tab-badge {
    background: rgba(15, 23, 42, 0.08);
    color: var(--pd-accent);
}

.pd-v2__tab-panels {
    padding: 22px 24px 26px;
}

.pd-v2__spec-scroll {
    max-height: 360px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.pd-v2__tabs-card .specification-group {
    margin-bottom: 16px;
    border: none;
    border-radius: 8px;
    background: #ffffff;
}

.pd-v2__tabs-card .group-header {
    background: var(--pd-cream);
    padding: 10px 16px;
    border-bottom: none;
}

.pd-v2__tabs-card .group-title {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #334155;
    margin: 0;
}

.pd-v2__tabs-card .spec-title,
.pd-v2__tabs-card .spec-value {
    padding: 9px 16px;
    font-size: 13px;
}

.pd-v2__tabs-card .spec-title {
    color: #64748b;
    width: 40%;
    border-right: 1px solid var(--pd-neutral-border);
}

.pd-v2__tabs-card .specification-row:hover {
    background-color: var(--pd-cream);
}

.pd-v2__tabs-card .spec-value {
    color: #1e293b;
}

.pd-v2__empty {
    margin: 0;
    font-size: 14px;
    color: #94a3b8;
}

/* Reviews — tech professional */
.pd-v2__reviews-wrap .pd-v2-reviews {
    max-width: none;
    margin: 0;
}

.pd-v2-reviews .section-title {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--pd-accent);
    border-bottom: 1px solid var(--pd-neutral-border);
    padding-bottom: 10px;
    margin-bottom: 16px;
}

.pd-v2-reviews .reviews-container {
    max-height: 280px;
    margin-bottom: 24px;
    padding-right: 4px;
}

.pd-v2-reviews .reviews-container--empty {
    max-height: none;
    margin-bottom: 16px;
    padding-right: 0;
}

.pd-v2-reviews__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 24px 12px 8px;
}

.pd-v2-reviews__empty-icon {
    width: 56px;
    height: 56px;
    color: rgba(var(--pd-accent-rgb), 0.35);
    margin-bottom: 14px;
}

.pd-v2-reviews__empty-title {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 600;
    color: #334155;
}

.pd-v2-reviews__empty-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: #94a3b8;
    max-width: 320px;
}

.pd-v2-reviews .review-card {
    background: #ffffff;
    border: none;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 12px;
}

.pd-v2-reviews .user-avatar {
    font-size: 1.75rem;
    color: #94a3b8;
}

.pd-v2-reviews .user-name {
    font-size: 14px;
    color: #1e293b;
}

.pd-v2-reviews .review-meta {
    font-size: 12px;
    color: #94a3b8;
}

.pd-v2-reviews .star-rating {
    color: #f59e0b;
}

.pd-v2-reviews .review-text {
    font-size: 14px;
    line-height: 1.6;
    color: #475569;
}

.pd-v2-reviews .write-review {
    background: #ffffff;
    border: none;
    border-radius: 10px;
    padding: 20px;
}

.pd-v2-reviews .review-textarea {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    font-size: 14px;
    min-height: 96px;
}

.pd-v2-reviews .review-textarea:focus {
    border-color: var(--pd-accent);
    box-shadow: 0 0 0 3px rgba(var(--pd-accent-rgb), 0.12);
}

.pd-v2-reviews .upload-label {
    background: #ffffff;
    border: 1px dashed rgba(var(--pd-accent-rgb), 0.25);
    border-radius: 8px;
    font-size: 13px;
    color: var(--pd-muted);
}

.pd-v2-reviews .submit-button {
    background: var(--pd-accent);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    max-width: 200px;
    width: auto;
    padding: 10px 24px;
}

.pd-v2-reviews .submit-button:hover:not(:disabled) {
    background: var(--primary-hover);
}

.pd-v2-reviews .auth-required {
    padding: 12px 0;
}

.pd-v2-reviews .auth-button.signin {
    background: var(--pd-accent);
}

.pd-v2-reviews .auth-button.signup {
    border-color: var(--pd-accent);
    color: var(--pd-accent);
}

/* Media — right column */
.pd-v2__media {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pd-v2__media-item {
    border: none;
    border-radius: 0;
    overflow: visible;
    background: transparent;
    box-shadow: none;
}

.pd-v2__media-img {
    width: 100%;
    height: auto;
    max-height: 560px;
    object-fit: contain;
    display: block;
    border: none;
    box-shadow: none;
}

.pd-v2__video-wrap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border: 1px solid var(--pd-border);
    border-radius: 10px;
    background: #000;
    box-shadow: 0 2px 12px rgba(var(--pd-accent-rgb), 0.06);
}

.pd-v2__video-wrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 10px;
}

/*
 * Below Bootstrap `lg` (992px), col-lg-5/7 stack full-width.
 * Keep gallery-column policy only in the side-by-side desktop layout;
 * on tablet + phone use the Policy tab so policy never appears between images and title.
 */
@media (max-width: 991px) {
    .pd-v2__gallery {
        position: static;
    }

    .pd-v2__main {
        padding-left: 0;
        margin-top: 12px;
    }

    .pd-v2__utility {
        flex-direction: column;
        align-items: flex-start;
    }

    .pd-v2__policy--desktop {
        display: none !important;
    }

    .pd-v2__tab-item--mobile-policy {
        display: list-item;
    }

    /* Tablet: slightly tighten purchase / tabs so stacked layout stays readable */
    .pd-v2__purchase-card .pd-detail {
        padding-left: 12px;
        padding-right: 12px;
    }

    .pd-v2__tab-panels {
        padding: 16px 12px;
    }

    .pd-v2__tabs {
        padding: 0 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .pd-v2__tab {
        white-space: nowrap;
    }

    .pd-v2__media {
        padding: 0 12px;
    }
}

@media (max-width: 767px) {
    .pd-v2__purchase-card .pd-detail {
        padding-left: 16px;
        padding-right: 16px;
    }

    .pd-v2__tab-panels {
        padding: 16px;
    }

    .pd-v2__media {
        padding: 0 16px;
    }

    .pd-v2__tabs {
        padding: 0 12px;
    }

    .pd-v2__tab {
        padding: 12px 14px !important;
        font-size: 13px !important;
    }
}

/* Quick Look modal */
.ql-modal__dialog {
    max-width: 960px;
    width: calc(100% - 24px);
}

.ql-modal__content {
    position: relative;
    border: none;
    border-radius: 14px;
    overflow: hidden;
}

.ql-modal__close {
    color: #ffffff;
    background-color: #dd6969;
    border-radius: 6px;
    right: 12px;
    top: 12px;
}

.ql-modal__body {
    padding: 24px 22px 28px;
}

.ql-modal__grid {
    display: grid;
    grid-template-columns: minmax(0, 42%) minmax(0, 58%);
    gap: 24px;
    align-items: start;
}

.ql-modal__gallery-col {
    min-width: 0;
}

.ql-modal__purchase-col {
    min-width: 0;
}

.ql-modal__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    text-decoration: none;
}

.ql-modal__brand img {
    width: 30px;
    height: 30px;
    object-fit: contain;
    border-radius: 50%;
}

.ql-modal__brand span {
    font-weight: 600;
    color: #357e69;
}

.ql-modal__guest-desc {
    white-space: pre-wrap;
    padding: 12px 0;
    color: var(--text-dark);
}

/* Quick Look gallery */
.ql-gallery {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ql-gallery__main-wrap {
    width: 100%;
}

.ql-gallery__main {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: #ffffff;
    cursor: zoom-in;
    position: relative;
}

.ql-gallery__main-img {
    width: 100%;
    height: auto;
    max-height: 360px;
    object-fit: contain;
    display: block;
    border-radius: 10px;
    background: #fafafa;
}

.ql-gallery__zoom-hint {
    position: absolute;
    left: 50%;
    bottom: 10px;
    transform: translateX(-50%);
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.55);
    color: #ffffff;
    font-size: 12px;
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.ql-gallery__main:hover .ql-gallery__zoom-hint {
    opacity: 1;
}

.ql-gallery__thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ql-gallery__thumb {
    flex: 0 0 calc(25% - 6px);
    min-width: 64px;
    max-width: 88px;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    background: #ffffff;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ql-gallery__thumb.is-active {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 1px rgba(var(--primary-color-rgb), 0.15);
}

.ql-gallery__thumb img {
    width: 100%;
    height: 64px;
    object-fit: contain;
    display: block;
    background: #fafafa;
}

.ql-gallery__overlay.zoom-overlay {
    position: fixed;
    inset: 0;
    background: rgba(10, 10, 10, 0.82);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10050;
    cursor: zoom-out;
}

.ql-gallery__overlay .zoomed-image {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    border-radius: 10px;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.5);
}

.ql-gallery__overlay .zoom-hint-text {
    position: absolute;
    bottom: 16px;
    width: 100%;
    text-align: center;
    color: #ffffff;
    font-size: 14px;
    opacity: 0.85;
}

.quickModal .pd-purchase__desc,
.quickModal .pd-purchase__meta {
    margin-top: 12px;
}

.quickModal .pd-detail__name.pd-v2__title {
    font-size: 1.15rem;
    line-height: 1.35;
    margin-bottom: 10px;
    display: block;
}

@media (max-width: 767px) {
    .ql-modal__grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .ql-gallery__main-img {
        max-height: 280px;
    }

    .ql-gallery__thumb {
        flex: 0 0 calc(20% - 7px);
    }
}

/* Order Details & User Panel Pricing */
.order-details-page {
    padding: 1.5rem 0 3rem;
}

.order-details-shell {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.order-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem 1.15rem;
    border-radius: 14px;
    font-size: 0.95rem;
}

.order-alert i {
    margin-top: 0.15rem;
}

.order-alert--success {
    background: rgba(59, 183, 126, 0.1);
    color: #1f7a55;
    border: 1px solid rgba(59, 183, 126, 0.25);
}

.order-alert--danger {
    background: rgba(231, 76, 60, 0.08);
    color: #b03a2e;
    border: 1px solid rgba(231, 76, 60, 0.2);
}

.order-hero {
    background: linear-gradient(135deg, #fff 0%, #fff8f8 55%, #fff 100%);
    border: 1px solid #f0e8e8;
    border-radius: 20px;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 12px 40px rgba(180, 40, 40, 0.08);
}

.order-hero__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.order-hero__eyebrow {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #b42828;
    margin-bottom: 0.35rem;
}

.order-hero__title {
    font-size: 1.85rem;
    font-weight: 800;
    color: #1f2937;
    margin: 0 0 0.65rem;
    line-height: 1.1;
}

.order-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    color: #6b7280;
    font-size: 0.9rem;
}

.order-hero__amount {
    text-align: right;
    min-width: 150px;
}

.order-hero__amount-label {
    display: block;
    font-size: 0.78rem;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

.order-hero__amount strong {
    display: block;
    font-size: 1.65rem;
    color: #b42828;
    line-height: 1.1;
}

.order-hero__amount small {
    display: block;
    margin-top: 0.35rem;
    color: #059669;
    font-weight: 600;
    font-size: 0.82rem;
}

.order-hero__payment {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.order-payment-chip {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 14px;
    padding: 0.85rem 1rem;
    min-width: 220px;
    flex: 1;
}

.order-payment-chip i {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(180, 40, 40, 0.08);
    color: #b42828;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.order-payment-chip__label {
    display: block;
    font-size: 0.72rem;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.order-payment-chip__value {
    display: block;
    font-size: 0.92rem;
    color: #374151;
    font-weight: 600;
    word-break: break-all;
}

.order-status-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.7rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: capitalize;
}

.order-status-pill--ordered,
.order-status-pill--pending {
    background: #fff7db;
    color: #9a6700;
}

.order-status-pill--packed {
    background: #fef3c7;
    color: #b45309;
}

.order-status-pill--shipped {
    background: #dbeafe;
    color: #1d4ed8;
}

.order-status-pill--delivered {
    background: #d1fae5;
    color: #047857;
}

.order-status-pill--cancelled,
.order-status-pill--returned {
    background: #fee2e2;
    color: #b91c1c;
}

.order-panel {
    background: #fff;
    border: 1px solid #efefef;
    border-radius: 18px;
    padding: 1.25rem 1.35rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.order-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid #f3f4f6;
}

.order-panel__header h2 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.order-panel__header h2 i {
    color: #b42828;
}

.order-print-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.85rem;
    border-radius: 10px;
    background: #f8fafc;
    color: #475569 !important;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid #e2e8f0;
}

.order-print-link:hover {
    background: #b42828;
    color: #fff !important;
    border-color: #b42828;
}

.order-tracker {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    position: relative;
}

.order-tracker__step {
    position: relative;
    text-align: center;
    z-index: 1;
}

.order-tracker__icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 0.55rem;
    border-radius: 50%;
    background: #f3f4f6;
    color: #9ca3af;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: all 0.25s ease;
}

.order-tracker__step span {
    display: block;
    font-size: 0.82rem;
    color: #9ca3af;
    font-weight: 600;
}

.order-tracker__line {
    position: absolute;
    top: 24px;
    left: calc(50% + 24px);
    width: calc(100% - 48px);
    height: 3px;
    background: #e5e7eb;
    z-index: 0;
}

.order-tracker__step.is-done .order-tracker__icon,
.order-tracker__step.is-active .order-tracker__icon {
    background: linear-gradient(135deg, #3BB77E, #2d9d6e);
    color: #fff;
    box-shadow: 0 8px 18px rgba(59, 183, 126, 0.25);
}

.order-tracker__step.is-done .order-tracker__line,
.order-tracker__step.is-active .order-tracker__line {
    background: linear-gradient(90deg, #3BB77E, #86efac);
}

.order-tracker__step.is-done span,
.order-tracker__step.is-active span {
    color: #374151;
}

.order-tracker__step.is-cancelled .order-tracker__icon {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.25);
}

.order-items-grid {
    display: grid;
    gap: 0.85rem;
}

.order-item-card {
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: 1rem;
    padding: 0.95rem;
    border: 1px solid #f1f5f9;
    border-radius: 14px;
    background: #fcfcfd;
}

.order-item-card__image img {
    width: 88px;
    height: 88px;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid #ececec;
}

.order-item-card__body h3 {
    margin: 0 0 0.55rem;
    font-size: 0.98rem;
    color: #1f2937;
    line-height: 1.35;
}

.order-item-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.order-qty-badge {
    display: inline-flex;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 0.78rem;
    font-weight: 600;
}

.order-bottom-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.order-address-card {
    display: grid;
    gap: 0.75rem;
}

.order-address-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    color: #4b5563;
    font-size: 0.92rem;
    line-height: 1.5;
}

.order-address-row i {
    width: 18px;
    color: #b42828;
    margin-top: 0.15rem;
}

.order-summary-block {
    display: grid;
    gap: 0.55rem;
}

.order-summary-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.92rem;
    color: #6b7280;
}

.order-summary-row span:last-child {
    color: #374151;
    font-weight: 600;
}

.order-summary-row--savings span:last-child {
    color: #059669;
}

.order-summary-row--total {
    margin-top: 0.35rem;
    padding-top: 0.85rem;
    border-top: 1px dashed #e5e7eb;
    font-size: 1rem;
}

.order-summary-row--total span {
    color: #111827;
    font-weight: 800;
}

.order-summary-row--total span:last-child {
    color: #b42828;
    font-size: 1.15rem;
}

.order-summary-saved {
    margin-top: 0.35rem;
    padding: 0.65rem 0.85rem;
    border-radius: 10px;
    background: rgba(5, 150, 105, 0.08);
    color: #047857;
    font-size: 0.82rem;
    font-weight: 600;
    text-align: center;
}

.order-summary-muted {
    text-decoration: line-through;
    color: #9ca3af !important;
}

.order-price-display {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.order-price-display--inline {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.order-price-unit,
.order-price-line-total {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.order-price-current {
    color: #b42828;
    font-weight: 700;
}

.order-price-original {
    color: #9ca3af;
    text-decoration: line-through;
    font-size: 0.85em;
}

.order-price-badge {
    display: inline-flex;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    background: rgba(5, 150, 105, 0.1);
    color: #047857;
    font-size: 0.72rem;
    font-weight: 700;
}

.order-price-each {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.78rem;
    color: #6b7280;
    font-weight: 500;
}

.dashboard-orders__header {
    margin-bottom: 1.25rem;
}

.dashboard-orders__title {
    margin: 0 0 0.35rem;
    font-size: 1.45rem;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.dashboard-orders__title i {
    color: #b42828;
}

.dashboard-orders__subtitle {
    margin: 0;
    color: #6b7280;
    font-size: 0.92rem;
}

.order-card--modern {
    background: #fff;
    border: 1px solid #ececec !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.order-card--modern .order-header {
    background: linear-gradient(180deg, #fff, #fafafa);
}

.dashboard-orders .order-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    min-width: 0;
}

.dashboard-orders .order-card-badges,
.dashboard-orders .order-card-buttons {
    display: contents;
}

.dashboard-orders .summary-line--payment {
    margin-top: 0;
    padding-top: 0.95rem;
    padding-bottom: 1rem;
    border-top: 1px solid #f0f2f5;
}

.dashboard-orders .summary-line--payment .summary-line__label {
    color: #64748b;
    font-weight: 500;
}

.dashboard-orders .summary-line--payment .summary-line__value {
    font-weight: 700;
}

.dashboard-orders .summary-line__value--paid {
    color: #047857;
}

.dashboard-orders .summary-line__value--partial {
    color: #1d4ed8;
}

.dashboard-orders .summary-line__value--unpaid {
    color: #c2410c;
}

.dashboard-orders .product-name {
    height: auto !important;
    overflow: visible !important;
    word-break: break-word;
    line-height: 1.4;
    margin-bottom: 0.35rem;
}

.dashboard-orders .product-meta {
    flex-wrap: wrap;
    row-gap: 0.35rem;
}

.dashboard-orders .order-status-pill {
    padding: 0.42rem 0.9rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    border: 1px solid transparent;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    gap: 0.4rem;
}

.dashboard-orders .order-status-pill__dot {
    font-size: 0.42rem;
    opacity: 0.9;
}

.dashboard-orders .order-status-pill--ordered,
.dashboard-orders .order-status-pill--pending {
    background: #fff8e8;
    color: #9a6700;
    border-color: #f5d98b;
}

.dashboard-orders .order-status-pill--packed {
    background: #fff4e5;
    color: #b45309;
    border-color: #f6c56b;
}

.dashboard-orders .order-status-pill--shipped {
    background: #eff6ff;
    color: #1d4ed8;
    border-color: #93c5fd;
}

.dashboard-orders .order-status-pill--delivered {
    background: #ecfdf5;
    color: #047857;
    border-color: #6ee7b7;
}

.dashboard-orders .order-status-pill--cancelled,
.dashboard-orders .order-status-pill--returned {
    background: #fef2f2;
    color: #b91c1c;
    border-color: #fca5a5;
}

.dashboard-orders .order-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.95rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid transparent;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
    white-space: nowrap;
}

.dashboard-orders .order-action-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.dashboard-orders .order-action-btn--primary {
    background: #1f3b57;
    color: #fff;
    border-color: #1f3b57;
    box-shadow: 0 4px 12px rgba(31, 59, 87, 0.18);
}

.dashboard-orders .order-action-btn--primary:hover {
    background: #163049;
    border-color: #163049;
    color: #fff;
    box-shadow: 0 6px 16px rgba(31, 59, 87, 0.24);
}

.dashboard-orders .order-action-btn--secondary {
    background: #fff;
    color: #475569;
    border-color: #d7dee8;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.dashboard-orders .order-action-btn--secondary:hover {
    background: #f8fafc;
    color: #1e293b;
    border-color: #b8c4d4;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

@media (max-width: 768px) {
    .dashboard-orders .order-header {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        text-align: left;
        background: linear-gradient(180deg, #fff, #fafafa);
    }

    .dashboard-orders .order-meta,
    .dashboard-orders .order-number,
    .dashboard-orders .order-date {
        text-align: left;
        justify-content: flex-start;
    }

    .dashboard-orders .order-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
    }

    .dashboard-orders .order-card-badges {
        display: block;
        width: 100%;
    }

    .dashboard-orders .order-card-buttons {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        gap: 0.55rem;
    }

    .dashboard-orders .order-status-pill {
        width: 100%;
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    .dashboard-orders .order-action-btn {
        width: 100%;
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    .dashboard-orders .order-item {
        align-items: flex-start;
    }

    .dashboard-orders .product-info {
        min-width: 0;
    }

    .dashboard-orders .product-name {
        font-size: 0.95rem;
    }
}

.summary-line--savings .value {
    color: #059669 !important;
    font-weight: 700;
}

@media (max-width: 992px) {
    .order-bottom-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .order-hero__top {
        flex-direction: column;
    }

    .order-hero__amount {
        text-align: left;
    }

    .order-tracker {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 1rem;
    }

    .order-tracker__line {
        display: none;
    }

    .order-item-card {
        grid-template-columns: 72px 1fr;
    }

    .order-item-card__image img {
        width: 72px;
        height: 72px;
    }

    .order-panel__header {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ================================
   Section heading backgrounds only
   (banners_section_background / products_section_background)
================================ */
.section-heading--has-bg {
    --section-heading-bg-overlay: linear-gradient(
        120deg,
        rgba(13, 10, 68, 0.78) 0%,
        rgba(13, 10, 68, 0.62) 55%,
        rgba(6, 5, 36, 0.72) 100%
    );
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-top: 28px;
    margin-bottom: 24px;
    padding: clamp(1.15rem, 2.8vw, 1.75rem) clamp(1rem, 2.5vw, 1.5rem);
    box-sizing: border-box;
    align-items: center;
    border-radius: 12px;
    overflow: hidden;
    background-color: rgba(13, 10, 68, 0.08);
    background-image: var(--section-heading-bg-overlay), var(--section-heading-bg);
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
}

.section-heading--has-bg .section-heading__main,
.section-heading--has-bg .section-heading__deco {
    position: relative;
    z-index: 1;
}

.section-heading--has-bg .section-heading__eyebrow {
    color: rgba(255, 255, 255, 0.9);
}

.section-heading--has-bg .section-heading__eyebrow::before {
    background: rgba(255, 255, 255, 0.9);
}

.section-heading--has-bg .section-heading__title {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}

.section-heading--has-bg .section-heading__subtitle {
    color: rgba(255, 255, 255, 0.88);
}

.section-heading--has-bg .section-heading__icon {
    background: rgba(255, 255, 255, 0.14);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.22);
}

.section-heading--has-bg .section-heading__svg {
    stroke: currentColor;
    color: #fff;
}

.section-heading--has-bg .section-heading__line {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.1));
}

.section-heading--has-bg .section-heading__deco span {
    background: rgba(255, 255, 255, 0.5);
}

@media (max-width: 767px) {
    .section-heading--has-bg {
        margin-top: 20px;
        margin-bottom: 18px;
        padding: 1.1rem 1rem;
        border-radius: 10px;
    }

    .section-heading--has-bg .section-heading__title {
        font-size: clamp(1.1rem, 5vw, 1.4rem);
    }
}