.range-slider {
    position: relative;
    width: 100%;
    height: 40px;
  }

  .range-slider input[type="range"] {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background: none;
    pointer-events: none; /* Disable mouse for now */
    -webkit-appearance: none;
    z-index: 3;
  }

  .range-slider input[type="range"]::-webkit-slider-thumb {
    pointer-events: all; /* Enable pointer on thumb */
    width: 20px;
    height: 20px;
    background: #28a745;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    -webkit-appearance: none;
    cursor: pointer;
  }

  .range-slider .slider-track {
    position: absolute;
    height: 6px;
    background: #ddd;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    border-radius: 5px;
  }

  .range-slider .slider-fill {
    position: absolute;
    height: 6px;
    background: #28a745;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    border-radius: 5px;
  }

  .price-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    font-weight: bold;
    color: #28a745;
  }.elementor-image-box-title {
    margin-bottom: 0px;
    margin-top: revert;
}

      .has-mega-menu {
      text-align: center;
    }
    ul{
      margin: 0;
      padding: 0;
    }
.submenu {
    display: flex;
    position: absolute;
    left: 60px;
    top: 88%;
    background: #efb13e; 
    z-index: 999;
    border-radius: 3px;
    padding: 10px 0;
    width: 907px; 
    justify-content: flex-start;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 
    background: #efb13e;
/*    backdrop-filter: blur(4px);*/
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(25, 135, 84, 0.5);

}
.has-mega-menu {
    position: static; /* Parent relative na ho to submenu screen ke left jaye */
}

.submenu li {
    margin: 0;
    padding: 10px 20px;
    list-style: none;
}

.submenu li a {
    text-decoration: none;
    display: block;
   color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* Soft shadow for depth */
    font-weight: 600; /* Slight bold */
}

.submenu li a:hover {
    color: black !important;
}
.submenu {
    display: none;
}


.treatment-text {
    font-family: "Gill Sans" sans-serif;
    font-size: 17px;
    font-weight: 400;
    font-weight: bold;
    color: white;
    transition: color 0.3s;
}

.treatment-text:hover {
    color: #A67C00; /* Golden color on hover */
}

.treatment-text.active {
    color: #A67C00; /* Golden color on click */
}
 .submit-button
    {
        margin-top:20px;
        vertical-align:top;
        background:#FF583C!important;
        border:none;
        padding:9px 33px!important;
        font-weight:500;
        text-transform:capitalize;
        font-size:17px;
        color:#fff;
        cursor:pointer;
        height:40px;
    }
    .bottom-left {
    position: absolute;
    bottom: 100px;
    left: 94px;
    font-size: 31px;
    color: white;
    font-weight: bold;
}
.bottom-left1{
    position: absolute;
    bottom: 70px;
    left: 94px;
    font-size: 18px;
    color: white;
}

.card-body-hair-loss
{
    height:225px;
}

.card-body-join-pain
{
    height:300px;
}



.text-404 {
    margin-top: 80px;
    font-size: 200px;
    line-height: 200px;
    text-align: center;
    letter-spacing: 5px;
    background: #efb13e;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.text {
    text-align: center;
    font-size: 20px;
    color: #f6f6e3;
    letter-spacing: 5px;
    margin-top: 0px;
}

.text-btn {
    text-align: center;
    margin-top: 75px;
}

.btn-outline-primary {
    border-color: #efb13e;
    color: #efb13e;
    border-radius: 0px;
    font-weight: bold;
    letter-spacing: 1px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.btn-outline-primary:hover {
    background-color: #efb13e;
    right: 0px;
    border-color: #efb13e;
    color: #141829;
}

.sr-only {
    position: absolute;
    width: 5px!important;
    height: 5px!important;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.dropdown-item {
    font-size: 16px!important;
    display: block!important;
    width: 100%!important;
/*    padding: 1.0rem 1.5rem!important;*/
    clear: both!important;
    font-weight: 400!important;
    color: #212529!important;
    text-align: inherit!important;
    white-space: nowrap!important;
    background-color: transparent!important;
    border: 0!important;
}
  .required {color: #FF0000;}
            .error {color: #FF0000;}
            
span.fa.fa-star.checked {
    color: #fd8d27;
}
.modal-backdrop.show {
    opacity: 0!important;
}
.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0!important;
    background-color: #000;
}
@media screen and (max-width:500px) {
    .text-404 {
        font-size: 150px;
    }
}

@media screen and (max-width:345px) {
    .text-404 {
        font-size: 120px;
    }
}
/* Default - Mobile & Small Screens */
.ps-home--13 .ps-section--banner .ps-banner__imagebg {
    object-fit: unset;
}

/* Desktop and Large Screens Only */
@media (min-width: 768px) {
    .ps-home--13 .ps-section--banner .ps-banner__imagebg {
        width: 100%;
    height: 100%;
        object-fit: cover;
    }
}

#open-menu, #close-menu {
    display: none;
}

@media (max-width: 767px) {
    #open-menu {
        display: inline-block;
    }
    #close-menu {
        display: none;
    }
}

@media (min-width: 768px) {
    #open-menu, #close-menu {
        display: none;
    }
}

.ps-banner.banner-weight-loss {
    position: relative;
    width: 100%;
    min-height: 350px;
    overflow: hidden;
}

.ps-banner.banner-weight-loss img {
     padding-top: 20px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bottom-left {
    position: absolute;
    bottom: 147px;
    left: 110px;
    color: white;
    font-size: 40px;
    font-weight: bold;
}

.bottom-left1 {
    position: absolute;
    bottom: 125px;
    left: 100px;
    color: white;
    font-size: 20px;
}

@media (max-width: 767px) {
    .ps-banner.banner-weight-loss {
        min-height: 200px;
    }

    .bottom-left {
        font-size: 18px;
        bottom: 37px;
        left: 27px;
    }

    .bottom-left1 {
        font-size: 12px;
        bottom: 23px;
        left: 15px;
    }
}


 .submit-button {
        padding: 10px 20px;
        background: #FFA500;
        color: #fff;
        border: none;
        border-radius: 5px;
        cursor: pointer;
        width: 100%;
        transition: background 0.3s ease, transform 0.2s ease;
    }

    .submit-button:hover {
        background: #ff8c00;
        transform: scale(1.05);
    }

    .slider-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.slide {
  display: none;
  width: 100%;
}

.slide img {
  width: 100%;
  display: block;
}

.slide.active {
  display: block;
}

.owl-dots .owl-dot span {
    width: 12px;
    height: 12px;
    background: #FFA500 !important;
    opacity: 1;
    margin: 5px;
    border-radius: 50%;
}

.owl-dots .owl-dot.active span {
    background: #FFA500 !important;
}


.ps-menu--slidebar.active li {
    position: relative;
    transition: all 0.3s ease;
}

.ps-menu--slidebar.active li:hover {
    cursor: pointer;
    transform: translateX(8px); /* Moves li 5px to the right */
}

.ps-menu--slidebar.active li a {
    color: #000000;
    transition: color 0.3s ease;
}

.ps-menu--slidebar.active li a:hover {
    color: #FFA500; /* Text color changes only when hovering over the text */
    cursor: pointer;
}

fieldset.form-group {
    width: 100%;         /* Or set a fixed width like 300px */
    max-width: 400px;    /* Optional, to control maximum width */
/*    margin-bottom: 15px; /* Space between fields */*/
}

fieldset.form-group input.form-control {
    width: 100%;         /* Makes input fill the fieldset */
}
/* Remove up/down arrows from number input (for Chrome, Safari, Edge) */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Remove arrows for Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

@media (min-width: 768px) {
    .ps-banner {
        height: 320px;
        min-height: 320px !important;
    }
}

/* Mobile view (below 768px) */
@media (max-width: 767.98px) {
    .ps-banner {
        height: auto;       /* Height adjusts based on content */
        min-height: 200px;  /* You can set a suitable min-height for mobile */
    }
}
@media (max-width: 767.98px) {
    .ps-banner {
        padding-top: 20px; /* Adjust the value as needed */
    }
}
/* Default margin for mobile view (up to 991px) */
h2.excellence-heading {
    margin-top: -102px;  /* Adjust this value as needed for mobile */
    text-align: center;
}


/* Margin for desktop view (992px and above) */
@media (min-width: 992px) {
    h2.excellence-heading {
        margin-top: 120px;
    }
}
h2.heading {
    text-align: center;
}

/* Margin for desktop view (992px and above) */
@media (min-width: 992px) {
    h2.heading {
        margin-top: 18px;
    }
}
h2.text-center {
    text-align: center!important;
}
@media (max-width: 767px) {
    h2.text-center {
        margin-left: 24px!important;
    }
}
.tex {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    margin: 20px 0;
   padding-top: 50px;
}

@media (max-width: 767px) {
    .tex {
        font-size: 20px;
        margin: 15px 0;
    }
}

.bottom-banner-container {
    padding-top: 50px; /* Adjust the value as needed */
    text-align: center;
}

/* Desktop view ke liye */
@media (min-width: 768px) {
    .bottom-banner-container {
/*        padding-top: 300px; /* Jo bhi value aapko chahiye */*/
    }
}

/* Mobile view ke liye */
@media (max-width: 767.98px) {
    .bottom-banner-container {
        padding-top: 0px; 
    }
}

@media (max-width: 991.98px) {
    .hair-loss-intro {
        margin-top: 20px;   /* Adjust as per need */
        padding: 15px 0;    /* Top and bottom padding */
    }
}
/* Spacing for mobile and tablet (up to 991.98px) */
@media (max-width: 991.98px) {
    .hair-loss-intro {
        margin-top: 20px;    /* Adjust spacing for mobile/tablet */
        padding: 15px 0;
        text-align: center;  /* Optional: Ensures proper alignment */
    }
}

/* Desktop-specific styling */
@media (min-width: 992px) {
    .ps-banner.medical {
        margin-top: 20px;   /* Adds space from the top */
    }
}
@media (max-width: 767.98px) {
    .ps-banner.Hair {
        margin-top: -150px;
    }
}

@media (max-width: 767.98px) {
    .ps-banner.hair {
        margin-top: -60px;
    }
}

@media (max-width: 767.98px) {
    .ed-banner {
        margin-top: -20px; /* Adjust value as needed */
    }
}
@media (min-width: 992px) {
    .Herbalism {
        margin-top: 80px; /* Adjust the value as per your design */
    }
}
@media (min-width: 992px) {
    .Prowess {
/*        margin-top: 310px; /* Adjust the value as per your design */*/
    }
}
@media (max-width: 991.98px) {
    .row.d-approach {
        padding: 20px; /* Reduced padding for mobile/tablet */
    }
}
@media (max-width: 767.98px) {
    .d-approach {
        padding: 0 !important;
    }
}
.offer-sticker {
    position: absolute;
    top: 10px;
    right: 10px;
    background: linear-gradient(45deg, #ff4e50, #f9d423); /* Gradient Background */
    color: #fff;
    font-size: 12px;
    padding: 4px 8px;
    border-radius: 50px;
    font-weight: bold;
    z-index: 10;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    animation: pulse 1.5s infinite;
}
@keyframes pulse {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.9; }
    100% { transform: scale(1); opacity: 1; }
}
/* Mobile View Adjustment */
@media (max-width: 576px) {
    .offer-sticker {
        top: 8px;
        right: 8px;
        font-size: 10px;
        padding: 3px 6px;
    }
}

.ratings-full {
    display: flex;
    align-items: center;
    gap: 4px;
}

.ratings-full .fa-star {
    font-size: 16px;
    color: #ddd;
    transition: transform 0.3s, color 0.3s;
}

.ratings-full .fa-star.checked {
    color: gold;
    text-shadow: 0 0 3px rgba(255, 215, 0, 0.7);
}

.ratings-full .fa-star:hover {
    transform: scale(1.2);
    cursor: pointer;
}

.rating-reviews {
    font-size: 12px;
    color: #555;
    margin-left: 8px;
}


/* Mobile View Improvements */
@media (max-width: 576px) {
    .ratings-full {
        justify-content: center; /* Center alignment for mobile */
        gap: 6px;
    }

    .ratings-full .fa-star {
        font-size: 18px;
    }

    .ratings-full .fa-star:hover {
        transform: none;
    }

    .rating-reviews {
        font-size: 11px;
    }
}
.ps-section__product {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    margin: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;
}

.ps-section__product:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.ps-product__thumbnail {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #f0f0f0;
}

.ps-product__thumbnail img {
    width: 100%;
    height: auto;
    transition: transform 0.4s ease;
}

.ps-section__product:hover .ps-product__thumbnail img {
    transform: scale(1.07);
}

.offer-sticker {
    position: absolute;
    top: 12px;
    right: 12px;
    background: linear-gradient(135deg, #ff4e50, #f9d423);
    color: #fff;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 20px;
    font-weight: 700;
    z-index: 10;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    animation: pulseSticker 1.5s infinite;
    text-transform: uppercase;
}

@keyframes pulseSticker {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.ps-product__title a {
    color: #222;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    display: block;
    margin: 12px 20px!important 8px 0;
    min-height: 42px;
    transition: color 0.3s;
}
@media (max-width: 575.98px) {
  .ps-product__title a {
    font-size: 13px;
    margin: 10px 20px 6px 0 !important;
    min-height: auto;
  }
}

.ratings-full {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 10px;
}

.ratings-full .fa-star {
    font-size: 16px;
    color: #ddd;
}

.ratings-full .fa-star.checked {
    color: #FFD700;
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.7);
}

.rating-reviews {
    font-size: 12px;
    color: #777;
    margin-left: 6px;
}

.ps-btn {
    width: 100%;
    padding: 8px 10px;
    text-align: center;
    border-radius: 4px;
    font-size: 14px;
    text-decoration: none;
    color: #fff;
    display: inline-block;
    transition: background 0.3s;
}

.ps-btn--success {
    background: #28a745;
}

.ps-btn--success:hover {
    background: #218838;
}

.ps-btn--warning {
    background: #ffc107;
    color: #fff;
    padding: 8px 10px;
    font-size: 16px;
}


.ps-btn--warning:hover {
    background: #e0a800;
}

/* Mobile & Tablet Responsiveness */
@media (max-width: 768px) {
    .ps-product__title a {
        font-size: 14px;
        min-height: 38px;
    }

    .ratings-full .fa-star {
        font-size: 18px;
    }

    .ps-btn {
        font-size: 13px;
        padding: 6px 8px;
    }

    .offer-sticker {
        font-size: 11px;
        padding: 4px 8px;
        top: 8px;
        right: 8px;
    }

    .ps-section__product:hover {
        transform: none;
        box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    }

    .ps-section__product:hover .ps-product__thumbnail img {
        transform: none;
    }
}


/*----------new work-------------*/
nav a {
    margin: 0 15px;
    text-decoration: none;
    color: #333;
}

.category-section {
    display: flex;
    justify-content: center;
    gap: 50px;
    margin: 60px;
    /*flex-wrap: wrap;*/
}

.category-card {
    overflow: hidden;
    width: 550px;
    max-width: 100%;
    text-align: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: 0.3s;
    cursor: pointer;
    background: white;
}

.category-card img {
    width: 550%;
    height: 100px;
    object-fit: cover;
    transition: 0.3s;
}


@keyframes shine {
    0% {
        text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
    }
    50% {
        text-shadow: 0 0 15px rgba(255, 215, 0, 1);
    }
    100% {
        text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
    }
}

.category-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2);
    filter: blur(0.5px);
}

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

.bestseller {
    background: goldenrod;
    color: white;
    display: block;
    padding: 8px 16px;
    margin: 20px auto;
    border-radius: 20px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    margin-left: 42%;
    margin-right: 42%;
    margin-top: -40px;
}

/* Mobile View Fix */
@media (max-width: 480px) {
    .bestseller {
        width: fit-content;
        margin: 20px auto; /* Auto se perfect center hoga */
        padding: 8px 16px;
        font-size: 16px;
        margin-top: -55px;
    }
}

.bestseller-tre {
    background: goldenrod;
    color: white;
    display: block;
    padding: 8px 16px;
    margin: 20px auto;
    border-radius: 20px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    margin-left: 42%;
    margin-right: 42%;
    margin-top: -40px;
}

/* Mobile View Fix */
@media (max-width: 480px) {
    .bestseller-tre {
        width: fit-content;
        margin: 20px auto; /* Auto se perfect center hoga */
        padding: 8px 16px;
        font-size: 16px;
        margin-top: -5px;
    }
}



/* --------- Responsive CSS ---------- */

@media (max-width: 1024px) {
    .category-card {
        width: 80%;
    }
}

@media (max-width: 768px) {
    .category-section {
        margin: 30px;
        gap: 20px;
    }
    .category-card {
        width: 100%;
    }
    nav {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .category-card img {
        height: 150px;
    }
    .category-card h3 {
        font-size: 18px;
    }
    nav a {
        margin: 10px;
        font-size: 14px;
    }
}
@media (max-width: 480px) {

    .category-section {
        margin: 20px;
        gap: 10px;
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start;
    }

    .category-card {
        min-width: 250px;
        flex-shrink: 0;
    }

    .category-card img {
        height: 150px;
    }

    .category-card h3 {
        font-size: 18px;
    }

    nav a {
        margin: 10px;
        font-size: 14px;
    }
}


/*  Responsive Media Queries */

@media (max-width: 768px) {
    .product-card {
        width: 80%;
    }
}

@media (max-width: 480px) {
    .product-card {
        width: 95%;
    }
}

/*---------bestseller-----------*/
.product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
}

.product-card {
    text-align: center;
    background: linear-gradient(135deg, #fff, #f9f9f9);
    transition: 0.4s;
    cursor: pointer;
    overflow: hidden;
}

.product-card:hover {
    transform: none;
}

.product-image {
    position: relative;
    width: 100%;
    height: 270px;
    overflow: hidden;
}
@media (max-width: 600px) {
    .product-image {
        position: relative;
        width: 125%;
        height: 146px;
        overflow: hidden;
    }
}


.product-image img {
    width: 80%;
    height: 95%;
    object-fit: cover;
    transition: 0.4s ease;
    display: block;
    position: absolute;
    top: 0;
}
@media (max-width: 600px) {
    .product-image img {
        width: 70%;
        height: 95%;
        object-fit: cover;
        transition: 0.4s ease;
        display: block;
        position: absolute;
        top: 0;
        left: 4px;
    }
}

.product-image {
    position: relative;
    overflow: hidden;
}

.product-image img {
    max-height: 180px;
    width: 100%;
    object-fit: contain;
    transition: all 0.3s ease;
}

.product-image .hover-img {
    opacity: 0;
    transform: scale(1);
    position: absolute;
    top: 0;
    left: 0;
}

.product-image:hover .hover-img {
    opacity: 1;
    transform: scale(1.05);
}

.product-image:hover .main-img {
    opacity: 0;
}


h4 {
    font-size: 16px;
    margin: 35px 10px 5px 10px;
    transition: 0.3s;
    color: #333;
}
@media (max-width: 600px) {
    h4 {
        font-size: 11px;
        text-align: 8px 18px 10px 18px;
        transition: 0.3s;
        color: #333;
    }
}


.rating {
    color: orange;
    margin-bottom: 5px;
    font-size: 14px;
}

.price {
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 16px;
}

button {
    padding: 7px 33px;
/*    background: white;*/
    color: black;
    border: 1px solid green;
    border-radius: 25px;
    cursor: pointer;
    transition: 0.4s;
    font-weight: bold;
    margin-bottom: 10px;
/*    box-shadow: 0 2px 5px rgba(0,0,0,0.1);*/
}

/*button:hover {
    background: green;
    color: goldenrod;
    transform: scale(1.08);
    border-color: goldenrod;
    box-shadow: 0 8px 15px rgba(0,0,0,0.3);
    margin-left: 47px;
}*/

/* Mobile View CSS */
@media (max-width: 575.98px) {
    button {
        padding: 10px 15px;
        font-size: 14px;
        width: 100%;
        border-radius: 20px;
        margin-bottom: 15px;
    }

    button:hover {
        transform: scale(1.03);
        box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    }
}
.dual-btn {
    display: flex;
    align-items: center;
    background-color: #2e7d32;
    color: white;
    overflow: hidden;
    font-size: 16px;
    font-weight: 600;
    height: 40px;
    width: 300px;
    max-width: 100%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    margin: 0 auto;
     font-family: 'Poppins', sans-serif;
}

.left-side, .right-side {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    height: 100%;
    transition: background 0.3s, color 0.3s;
    color: white;
}

.left-side {
    flex: 0 0 50px;
}

.right-side {
    flex: 1;
}

.left-side:hover, .right-side:hover {
    background-color: #256528;
    color: #ffd700; /* Golden Color */
}

.left-side:hover i {
    color: #ffd700;
}

.divider {
    width: 1px;
    background-color: #fff;
    height: 80%;
}

/* Responsive adjustments */
@media (max-width: 575.98px) {
    .dual-btn {
        width: 100%;
        height: 42px;
        font-size: 13px;
    }
    
    .left-side {
        flex: 0 0 40px;
    }

    .divider {
        height: 50%;
    }
}

@media (max-width: 575.98px) {
    .ps-product__content {
        text-align: center;
    }
    .ps-product__content .button-group {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .ps-product__content .buy-btn {
        margin-bottom: 8px;
    }
}


/* Tablet & Mobile Responsive */
@media (max-width: 1024px) {
    .product-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 768px) {
    .product-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 600px) {
    .product-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/*-------Watch & Shop--------*/
.product-slider {
  display: flex;
  gap: 15px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding: 10px;
  scrollbar-width: thin;
}

.product-slider::-webkit-scrollbar {
  height: 6px;
}

.product-slider::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}

.product-card {
/*  min-width: 200px;*/
  background: #fff;
  border: 1px solid #ddd;
/*  border-radius: 8px;*/
  padding: 25px;
  flex-shrink: 0;
  text-align: center;
/*  box-shadow: 0 0 8px rgba(0,0,0,0.1);*/
}

.product-card img {
  width: 100%;
  height: auto;
  margin-right: 10px;
}

.discount {
  background: #ff4d4d;
  color: #fff;
  font-size: 12px;
  padding: 2px 5px;
  border-radius: 4px;
  position: absolute;
  top: 8px;
  left: 8px;
}

.delivery {
  font-size: 12px;
  margin-top: 5px;
}
.product-img, iframe {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 5px;
  }
  .discount {
    background: red;
    color: #fff;
    padding: 2px 8px;
    position: absolute;
    margin-top: -10px;
    margin-left: -10px;
    font-size: 12px;
    border-radius: 3px;
  }
  .delivery {
    margin-top: 5px;
    font-size: 12px;
    color: green;
  }
/*----------containerr---------*/ 
 .containerr {
    display: grid;
    grid-template-columns: 1fr 1fr;
/*    gap: 20px;*/
    align-items: center;
}

.banner {
    position: relative;
    width: 100%;
}

.banner img {
    width: 70%;
    height: auto;
    max-width: 87%;
    border-radius: 10px;
    display: block;
    object-fit: cover;
}
.banner {
    width: 107%;
    max-width: 114%;
    overflow: hidden;
}



.banner-text {
    position: absolute;
    top: 20px;
    left: 20px;
    color: #fff;
    background-color: rgba(0,0,0,0.5);
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 1.5rem;
    font-weight: bold;
}

.products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 10px;
}

.product-card {
    background: #fff;
    padding: 28px;
/*    border-radius: 10px;*/
    text-align: center;
    position: relative;
    overflow: hidden;
    transition: box-shadow 0.3s;
    cursor: pointer;
    margin-left: 5px;
}

/*.product-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
*/
.product-image {
    position: relative;
    width: 100%;
}

.product-image img {
    width: 100%;
    height: auto;
    transition: opacity 0.3s;
    display: block;
}

.product-image {
    position: relative;
    overflow: hidden;
}

.product-image img {
    width: 100%;
    height: auto;
    transition: all 0.4s ease;
    display: block;
}

.hover-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transform: scale(1);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.product-card:hover .hover-img,
.product-card:hover .product-image:hover .hover-img {
    opacity: 1;
    transform: scale(1.05);
}

.default-img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.product-card:hover .default-img,
.product-card:hover .product-image:hover .default-img {
    opacity: 0;
    transform: scale(1.05);
}


.product-info h3 {
    font-size: 1.7rem;
    margin: 32px 9px 5px;
}

.product-info p {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 8px;
}

/* ---------------- Responsive CSS ---------------- */

@media (max-width: 768px) {
    .containerr {
        grid-template-columns: 1fr;
    }

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

    .banner-text {
        font-size: 1.2rem;
        padding: 8px 15px;
    }
}
@media (max-width: 767px) {
  .banner {
    order: -1;
  }
}

/*---------doctor-img--------*/

.doctor-text-block {
    background: #f8f9fa;
    border: 1px solid #ddd;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    text-align: center;
}

.doctor-text-block h4 {
    font-size: 1.5rem;
    color: #103178;
    margin-bottom: 10px;
    overflow: hidden;
}

.doctor-text-block p {
    font-size: 1rem;
    color: #555;
}

.doctor-slider {
    display: flex;
    gap: 15px;
    overflow-x: auto;
    padding: 10px 0;
    scroll-snap-type: x mandatory;
    animation: scrollAuto 10s linear infinite;
}

@keyframes scrollAuto {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}


.doctor-card {
    min-width: 120px;
    flex-shrink: 0;
    text-align: center;
    scroll-snap-align: center;
    transition: transform 0.3s;
    cursor: pointer;
}

.doctor-card img {
    width: 100%;
    max-width: 210px;
    border-radius: 50%;
    padding: 5px;
}

.doctor-card:hover {
    transform: scale(1.1);
}

@media (max-width: 768px) {
    .doctor-text-block {
        margin-bottom: 20px;
    }

    .doctor-text-block h4 {
        font-size: 1.3rem;
    }

    .doctor-text-block p {
        font-size: 0.95rem;
    }

    .doctor-slider {
        gap: 10px;
    }

    .doctor-card {
        min-width: 100px;
    }

    .doctor-card img {
        max-width: 100px;
    }
}
.doctor-slider::-webkit-scrollbar {
    display: none;
}

.doctor-slider {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
@media (max-width: 768px) {
    .doctor-slider {
        justify-content: center;
        display: flex;
        gap: 15px;
        overflow-x: auto;
        padding: 10px 0;
        scroll-snap-type: x mandatory;
    }

    .doctor-card {
        min-width: 100px;
        flex-shrink: 0;
        text-align: center;
    }

    .doctor-card img {
        max-width: 210px;
        display: block;
        margin: 0 auto;
    }
}
@media (max-width: 768px) {
    .doctor-text-block {
        text-align: center;
        margin: 0 auto;
        max-width: 300px;
    }
}


.doctor-card {
  padding: 10px;
  text-align: center;
}

.doctor-card img {
  width: 80%;
  border-radius: 10px;
}

.doctor-text-block {
  text-align: left;
  background: #f9f9f9;
}

.doctor-slider .doctor-card {
    text-align: center;
    padding: 10px;
}
.doctor-slider img {
    width: 100%;
    border-radius: 10px;
}
.doctor-text-block {
    min-height: 180px;
}
.doctor-slider .doctor-card {
    text-align: center;
    padding: 10px;
    transition: transform 0.6s, box-shadow 0.6s;
}
.doctor-slider .doctor-card img {
    width: 100%;
    border-radius: 10px;
}
.doctor-slider .doctor-card.hover-effect {
    transform: scale(1.05);
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
}
.doctor-text-block {
    min-height: 180px;
}

.brand-slider {
    overflow: hidden;
    white-space: nowrap;
/*    background: #fff;*/
    padding: 20px 0;
}

.brand-slider h2 {
    text-align: center;
    margin-bottom: 20px;
}

.brand-slide-track {
    display: inline-block;
    animation: slide 20s linear infinite;
}

.brand-slide-track img {
    height: 110px;
    margin: 0 40px;
}

@keyframes slide {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}
.mobile-only {
    display: none;
}

/* Mobile View ke liye */
@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }
}

/* Common Container Grid */
.containerr {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: center;
}
.containerr.reverse {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0px;
    align-items: center;
}
/* Product Section */
.products {
    margin: 0;
}

/* Banner Image Styling */
.banner img {
    width: 100%;
    border-radius: 10px;
    display: block;
    object-fit: cover;
    margin-left: 27px;
}
@media (max-width: 576px) {
  .banner img {
    margin: 25px auto;
    border-radius: 8px;
    margin-left: 45px;
  }
}

/* Banner Left, Product Right - Margin Control */
@media (min-width: 768px) {
   /* .banner.ban {
        margin-left: 100px;
    }*/
    .products.pr {
        margin-right: 50px;
    }
}

/* Banner Right, Product Left - Margin Control */
@media (min-width: 768px) {
    /*.products.rev-pr {
        margin-left: 50px;
    }*/
    .banner.rev-ban {
        margin-right: 100px;
    }
}

/* Mobile View - Stack Layout */
@media (max-width: 768px) {
    .containerr, .containerr.reverse {
        grid-template-columns: 1fr;
    }
}

/* ================= Desktop View Search Bar ================= */

.search-bar {
    padding: 2px;
    width: 630px;
    background: white;
    border-radius: 5px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    margin: 5px auto;
    position: relative;
    margin-right: 298px;
}

.search-bar input {
    width: 100%;
    padding: 10px 15px;
    border: none;
    outline: none;
    border-radius: 30px;
    font-size: 16px;
    background: transparent;
    color: #333;
}

.search-bar input::placeholder {
    color: #999;
    font-style: italic;
}

.search-bar .search-icon {
    display: none;
}

input:focus{
    box-shadow: none!important;
}

/* ================= Mobile View ================= */
.search-container {
    display: inline-block;
}

.search-toggle-icon {
    font-size: 20px;
    cursor: pointer;
    color: #fff;
    transition: transform 0.3s ease;
    margin-left: 20px;
}

/*.search-toggle-icon:hover {
    transform: scale(1.1);
}*/

.floating-search {
    position: fixed;
    top: 8px;
    left: 50%;
    transform: translateX(-50%) scale(0.8);
   /* padding: 5px 0px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);*/
    display: none;
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 999;
    width: 370px;
    height: 46px;
}

.floating-search.show {
    display: block;
    opacity: 1;
    transform: translateX(-50%) scale(1);
}

.inputbar {
    width: 100%;
    padding: 1opx 15px;
    border: 1px solid #ccc;
    outline: none;
    border-radius: 30px;
    font-size: 16px;
    background: #fff;
    color: #333;
}

.inputbar::placeholder {
    color: #999;
    font-style: italic;
}
.search-wrapper {
  position: relative;
  width: 100%;
}

.searchInput.inputbar {
  width: 100%;
  padding: 4px 14px 4px 15px; /* Right padding for icon */
  /*border: 1px solid #ccc;
  border-radius: 8px;*/
  font-size: 16px;
}

.clear-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  color: #888;
  cursor: pointer;
  display: none;
}

.clear-icon:hover {
  color: #000;
}


/* ================= button ================= */

.right-icons {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-left: 900px;
    margin-top: -36px;
}

.right-icons .icon {
    cursor: pointer;
    font-weight: bold;
    color: #333;
}

.right-icons .cart-icon {
    font-size: 58px;
}
.herbarium-intro {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}

.herbarium-intro h2 {
    font-size: 2.8rem;
    color: #000000;
    margin-bottom: 15px;
}

.herbarium-intro p {
    font-size: 1.05rem;
    color: #555;
    line-height: 1.7;
}

@media (max-width: 768px) {
    .herbarium-intro {
        padding: 15px;
    }

    .herbarium-intro h2 {
        font-size: 2.0rem;
    }

    .herbarium-intro p {
        font-size: 1rem;
    }
}
.product-notes {
    max-width: 1250px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 8px;
    font-size: 1.2rem;
    color: #555;
    line-height: 1.6;
   
}

.product-notes .note strong,
.product-notes .disclaimer strong {
    color: #c18c00;
}

.product-notes .disclaimer {
    font-style: italic;
    color: #8a6d00;
}

@media (max-width: 768px) {
    .product-notes {
        padding: 15px;
        font-size: 0.95rem;
    }
}

.banner-icon img {
    max-height: 100px;
}

.banner-icon p {
    margin-top: 10px;
    font-weight: 600;
    color: #000;
}
.desktop-only {
    display: block;
}

@media (max-width: 767px) {
    .desktop-only {
        display: none;
    }
}
.ps-promo {
    padding: 30px 0;
}

.ps-promo__title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 2.2rem;
    font-weight: 700;
    color: #103178;
    position: relative;
}

.ps-promo__title::after {
    content: "";
    display: block;
    width: 80px;
    height: 3px;
    background: #efb13e;
    margin: 10px auto 0;
    border-radius: 2px;
}

.ps-promo__item {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    background: #fff;
}
.ps-section--blog {
    padding-bottom: 50px; /* Aap is value ko apne design ke hisaab se bada chhota kar sakte ho */
}


.ps-promo__item:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

.ps-promo__banner {
    width: 100%;
    display: block;
    transition: transform 0.4s ease;
    border-radius: 15px;
}

.ps-promo__item:hover .ps-promo__banner {
    transform: scale(1.05);
}

.ps-promo__badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: linear-gradient(135deg, #FFD700, #FFC300);
    color: #000;
    padding: 6px 15px;
    font-size: 13px;
    border-radius: 20px;
    font-weight: bold;
    animation: pulse 1.5s infinite;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

@keyframes pulse {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.8; }
    100% { transform: scale(1); opacity: 1; }
}

.ps-promo__overlay {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: rgba(16, 49, 120, 0.8);
    color: white;
    text-align: center;
    padding: 15px 0;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.ps-promo__item:hover .ps-promo__overlay {
    opacity: 1;
}

.ps-promo__overlay button {
    background: #efb13e;
    border: none;
    color: #103178;
    padding: 10px 25px;
    border-radius: 25px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}

.ps-promo__overlay button:hover {
    background: #fff;
    color: #103178;
}

/* Responsive Adjustments */
@media (max-width: 767px) {
    .ps-promo__title {
        font-size: 1.8rem;
    }

    .ps-promo__badge {
        font-size: 11px;
        padding: 4px 10px;
    }

    .ps-promo__overlay button {
        padding: 8px 20px;
        font-size: 14px;
    }
}
.section-title {
    font-size: 2.2rem;
    font-weight: bold;
    color: #103178;
    position: relative;
}

.section-title::after {
    content: "";
    display: block;
    width: 80px;
    height: 3px;
    background: #efb13e;
    margin: 10px auto 0;
    border-radius: 2px;
}

/*.video-card {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background: #fff;
}

.video-card:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

.video-card iframe {
    width: 100%;
    height: 200px;
    border: none;
    border-radius: 15px;
}

@media (max-width: 767px) {
    .video-card iframe {
        height: 180px;
    }
}

/* Custom carousel icons */
/*.custom-prev-icon, .custom-next-icon {
    background: rgba(16,49,120,0.8);
    color: #fff;
    padding: 10px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    cursor: pointer;
}

.carousel-control-prev, .carousel-control-next {
    width: 5%;
}

.carousel-indicators li {
    background-color: #103178;
}
.ps-promo__badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: linear-gradient(135deg, #FFD700, #FFC300);
    color: #000000;
    padding: 5px 12px;
    font-size: 12px;
    border-radius: 5px;
    font-weight: bold;
    /* animation: pulse 1.5s infinite;  -- REMOVE or comment this line */
    /*box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}*/

.ps-blog--latset:hover {
    transform: translateY(-7px);
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    overflow: hidden;
}

.gradient-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.5) 100%);
    z-index: 1;
}
.ps-blog__thumbnail {
    width: 100%;
    aspect-ratio: 16/9; /* Maintains proper responsive rectangle shape */
    position: relative;
}

.ps-blog__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-right: 100px;

}
.process-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 15px 25px rgba(0,0,0,0.2);
}

.animate-up {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s ease forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/*products*/

/* Product Card Styling */
.product-card {
    background: #fff;
/*    border: 1px solid #ddd;*/
/*    border-radius: 8px;*/
    padding: 15px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s;
    height: 100%;
}

/*.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}*/

.product-image img {
    max-height: 180px;
    width: 100%;
    object-fit: contain;
}

.product-title a {
    color: #333;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

.product-title a:hover {
    color: #103178;
}

.rating .fa-star {
    color: #ddd;
}

.rating .checked {
    color: #FFD700;
}

.price {
    font-size: 16px;
    font-weight: bold;
    color: #103178;
}

.old-price {
    text-decoration: line-through;
    color: #999;
    font-size: 14px;
    margin-left: 8px;
}

.button-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 10px;
    margin-top: 12px;
}

/* Common Button Styling */
.action-btn {
    width: 90%;
    max-width: 250px;
    padding: 10px 15px;
    font-size: 15px;
    text-align: center;
    border-radius: 25px;
    display: block;
    border: none;
    cursor: pointer;
    transition: 0.3s;
    text-decoration: none;
}

/* Buy Now & Add to Cart Styling */
.buy-btn{
    padding: -7px 33px;
    background: white;
    color: black;
    border: 2px solid green;
    border-radius: 25px;
    cursor: pointer;
    transition: 0.4s;
    font-weight: bold;
    margin-bottom: 15px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 90%;
    max-width: 150px;
    font-size: 15px;
}
.add-cart-btn {
     padding: 10px 33px;
    background: white;
    color: black;
    border: 2px solid green;
    border-radius: 25px;
    cursor: pointer;
    transition: 0.4s;
    font-weight: bold;
    margin-bottom: 15px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 90%;
    max-width: 50px;
    font-size: 15px;
    margin-left: 20px;
}

/* Hover Effects */
.buy-btn:hover,
.add-cart-btn:hover {
    background: green;
    color: goldenrod;
    transform: scale(1.08);
    border-color: goldenrod;
    box-shadow: 0 8px 15px rgba(0,0,0,0.3);
}

/* Icon Size */
.buy-btn i,
.add-cart-btn i {
    font-size: 1rem;
}

/* Desktop View: Buttons Left-Right */
@media (min-width: 768px) {
    .button-group {
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
    }

    .buy-btn,
    .add-cart-btn {
        margin-bottom: 0;
    }
}

/* Mobile View - Full Width Buttons */
@media (max-width: 575.98px) {
    .buy-btn{
        padding: 10px 15px;
        font-size: 14px;
        width: 100%;
        border-radius: 20px;
        margin-bottom: 15px;
        margin-right: 22px;
    }
    .add-cart-btn {
        padding: 10px 33px;
        font-size: 20px;
        width: 100%;
        border-radius: 20px;
        margin-bottom: 15px;
         margin-right: 22px;
    }

    .buy-btn:hover,
    .add-cart-btn:hover {
        transform: scale(1.03);
        box-shadow: 0 6px 10px rgba(0,0,0,0.2);
    }
}
.buy-btn:active,
    .add-cart-btn:active {
        transform: scale(1.03);
        box-shadow: 0 6px 10px rgba(0,0,0,0.2);
        background: green;
        color: goldenrod;
        border-color: goldenrod;
    }
}


/* Responsive - Full Width on Mobile */
@media (max-width: 575.98px) {
    .action-btn {
        width: 100%;
        max-width: none;
        padding: 8px 12px;
        font-size: 14px;
    }
}
.product-image {
    width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.product-image img {
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
}
@media (max-width: 575.98px) {
    .product-image {
        height: 140px;
    }

    .product-title a {
        font-size: 14px;
    }

    .price {
        font-size: 14px;
    }

    .action-btn {
        width: 100%;
        max-width: none;
        padding: 8px 12px;
        font-size: 14px;
    }
}




.product-slider {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
    scrollbar-width: none;
}

.product-slider::-webkit-scrollbar {
    display: none;
}

.product-card {
    flex: 0 0 260px;
/*    background: #fff;*/
/*    border-radius: 15px;*/
    padding: 15px;
    text-align: center;
    scroll-snap-align: start;
    position: relative;
    /*box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s, box-shadow 0.3s;*/
}

/*.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}
*/
.discount {
    position: absolute;
    top: 10px;
    left: 10px;
    background: crimson;
    color: #fff;
    padding: 4px 10px;
    font-size: 12px;
    border-radius: 5px;
    font-weight: bold;
}

.video-container {
    width: 100%;
    height: 150px;
    overflow: hidden;
    border-radius: 10px;
    margin-bottom: 10px;
}

.video-container iframe {
    width: 100%;
    height: 100%;
    border: none;
}

h6 {
/*    margin: 10px 0 5px;*/
    font-size: 16px;
    color: #333;
}

.price {
    margin: 5px 0;
    font-size: 16px;
}

.delivery {
    font-size: 14px;
    margin: 8px 0;
}

.actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
}

.add-btn {
    background: linear-gradient(45deg, #28a745, #218838);
    color: white;
    border: none;
    padding: 8px 14px;
    border-radius: 20px;
    cursor: pointer;
    transition: background 0.3s, transform 0.2s;
    font-size: 14px;
}

.add-btn:hover {
    background: linear-gradient(45deg, #218838, #1e7e34);
    transform: scale(1.05);
}

.icon {
    cursor: pointer;
    font-size: 18px;
    color: #666;
    transition: color 0.3s, transform 0.2s;
}

.icon:hover {
    color: crimson;
    transform: scale(1.2);
}

@media (max-width: 768px) {
    .product-card {
        flex: 0 0 70%;
    }
}

@media (max-width: 480px) {
    .product-card {
        flex: 0 0 90%;
    }
}
.offer-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: red;
    color: white;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 4px;
    z-index: 2;
}

.wishlist {
    position: absolute;
    top: 8px;
    right: 8px;
    background: transparent;
    color: #212121;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    cursor: pointer;
    z-index: 2;
}


.bottom-banner {
    background: linear-gradient(90deg, #e0f7fa 0%, #f1f8e9 100%);
    border-radius: 15px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.banner-image {
    max-width: 300px;
    width: 100%;
    height: auto;
}

.banner-content {
    max-width: 600px;
}

.banner-subtitle {
    font-size: 1.1rem;
    font-weight: 600;
}

.banner-title {
    font-size: 1.8rem;
    font-weight: bold;
    color: #103178;
}

.banner-text {
    font-size: 1rem;
    color: #555;
}

@media (min-width: 768px) {
    .bottom-banner {
        flex-direction: row;
        justify-content: center;
        text-align: left;
    }
    .banner-image {
        max-width: 350px;
        margin-right: 20px;
    }
}

@media (min-width: 768px) {
    .bottom-banner-container .ban {
        margin-bottom: -100px; /* Apne hisaab se value adjust karo */
    }
}
.product-section {
    text-align: center;
    padding: 40px 20px;
/*    background: #fff;*/
}

.product-section h2 {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #222;
}

.product-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.product-item {
    max-width: 350px;
    width: 100%;
    text-align: center;
}

.product-item img {
    width: 100%;
    height: 300px;
    object-fit: contain;
    margin-bottom: 15px;
}

.product-item p {
    margin-top: 10px;
    font-size: 16px;
    font-weight: 500;
    color: #333;
}

/* Responsive Controls */
@media (max-width: 768px) {
    .product-items {
        gap: 20px;
    }
    .product-item {
        max-width: 200px;
    }
    .product-item img {
        height: 170px;
    }
}

@media (max-width: 575px) {
    .product-items {
        flex-direction: column;
        align-items: center;
    }
    .product-item {
        max-width: 90%;
    }
    .product-item img {
        height: 200px;
    }
}

.card {
    border: 1px solid #ddd;
    border-radius: 4px;
}

.card-header {
    background: #f9f9f9;
}

.btn {
    text-decoration: none;
    color: #333;
    font-weight: 500;
    font-size: 16px;
}

.card-body {
    font-size: 12px;
    color: #555;
}
.accordion2{
      padding-top: 20px;
    }
.accordion {
    margin-top: 20px;
    margin-bottom: 10px;
}

.accordion-header {
    background: transparent;
    padding: 15px;
    cursor: pointer;
    font-weight: bold;
    border-bottom: 1px solid #ddd; /* Bas neeche ek line */
}

.accordion-body {
    display: none;
    padding: 12px;
    background: #fff;
    border-top: 1px solid #ddd;
    margin-left: 20px;
}

.accordion.open .accordion-body {
    display: block;
}

.herb-section {
    padding: 40px 20px;
    background: #eef8f3;
    border-radius: 20px;
    max-width: 1200px;
    margin: auto;
}

.section-title {
    text-align: center;
    font-size: 28px;
    margin-bottom: 30px;
    color: #333;
}

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

.herb-text {
    flex: 1 1 350px;
    order: 1;
}

.herb-text h3 {
    font-size: 22px;
    margin-bottom: 15px;
    color: #222;
}

.herb-text p {
    margin-bottom: 20px;
    color: #444;
    line-height: 1.6;
}

.herb-text ul {
    padding-left: 20px;
    margin-top: 15px;
}

.herb-text ul li {
    margin-bottom: 12px;
    color: #333;
}

.herb-images {
    flex: 1 1 350px;
    order: 2;
    display: flex;
    justify-content: center;
    align-items: center;
}

.herb-item {
    position: relative;
    width: 100%;
    max-width: 350px;
    aspect-ratio: 1/1;
    border-radius: 15px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
}

.herb-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    background: #fff;
}
@media (max-width: 768px) {
    .herb-container {
        flex-direction: column;
    }
    .herb-text, .herb-images {
        order: unset;
        flex: 1 1 100%;
    }
    .herb-item {
        max-width: 100%;
        width: 100%;
    }
}

.login-footer-tab .nav-link {
    color: #333;
    transition: color 0.3s;
}

/*.login-footer-tab .nav-link:hover {
    color: #d4af37;
}*/

.login-footer-tab .nav-link.active {
    color: #d4af37 !important;
}
/* Desktop Button - Visible only on desktop */
.desktop-close-btn {
    position: absolute;
    font-size: 50px;
/*    background: transparent;*/
    border: none;
    color: #000;
    cursor: pointer;
    right: 15px;
    margin-right: 10px;
    display: block;
}

.mobile-close-btn {
    display: none;
}
.desktop-close-btn:hover {
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
    border: none !important;
    cursor: pointer;
}
button.desktop-close-btn:hover {
    cursor: pointer;
}


/* Tablet & Mobile View */
@media (max-width: 991.98px) {
    .desktop-close-btn {
        font-size: 40px;
    }
}

/* Mobile View - Show mobile button, hide desktop button */
@media (max-width: 575.98px) {
    .desktop-close-btn {
        display: none;
    }

    .mobile-close-btn {
        display:  flex;
        position: absolute;
        justify-content: center;
        font-size: 50px;
        background: transparent;
        border: none;
        color: #000;
        cursor: pointer;
        left: 150px;
    }
}

.mobile-close-btn:hover,
.desktop-close-btn:hover {
    background: none;
}
@media (max-width: 575.98px) {
    .btn-close {
        position: absolute;
        top: 10px;
        right: 10px;
    }
}

.nav-tabs .nav-link:hover {
    background-color: transparent;
    border-color: transparent;
    color: inherit;
}
.nav-tabs .nav-link {
    border-radius: 6px !important;
/*    padding: 10px 20px;*/
    border: 1px solid #ddd;
    background: #fff;
    color: #333;
    margin: 0;
    font-weight: 500;
    transition: all 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    white-space: nowrap;
}

/* Hover effect - better shadow & slight background change */
.nav-tabs .nav-link:hover {
    background: #f1f3f5;
    color: #000;
    border-color: #ccc;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.12);
}

/* Active tab styling - vibrant green with smooth shadow */
.nav-tabs .nav-link.active {
    background: #198754;
    color: #fff;
    border-color: #198754;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.nav-tabs .nav-item {
    margin: 0;
    padding: 0;
}

.nav-tabs {
    border-bottom: none;
    padding-top: 20px;
    margin-left: 20px;
    flex-wrap: wrap;
}

.tab-content {
    margin-left: 45px;
    padding-top: 20px;
}

/* ================= Responsive ================= */

/* Tablet View */
@media (max-width: 991.98px) {
    .nav-tabs {
        margin-left: 10px;
        padding-top: 15px;
    }

    .tab-content {
        margin-left: 15px;
        padding-top: 15px;
    }
}

/* Mobile View */
@media (max-width: 575.98px) {
    .nav-tabs {
        margin-left: 5px;
        padding-top: 10px;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

    .nav-tabs .nav-link {
        width: auto;
        margin-bottom: 5px;
        flex: 1 1 auto;
        padding: 6px 10px;
        font-size: 14px;
    }

    .tab-content {
        margin-left: 32px;
        padding-top: 10px;
    }
}
.container-Categories {
    max-width: 1200px;
    margin: 10px auto;
    padding: 20px;
}

.content {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.page-subtitle {
    color: #009879;
    font-weight: bold;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.page-title {
    font-size: 32px;
    color: #004f77;
    margin-bottom: 25px;
}
.ps-banner.hair {
    max-width: 100%;
    margin-left: 150px;
}

@media (max-width: 767px) {
    .ps-banner.hair {
        margin-left: 0;
    }
}

.ps-banner.medical {
    padding-top: 25px;
    max-width: 100%;
    margin-left: 180px;
}

@media (max-width: 767px) {
    .ps-banner.medical {
        margin-left: 0;
    }
}


h2.text-center {
/*    margin-top: -73px;*/
    font-size: 26px;
}

@media (max-width: 767px) {
    h2.text-center {
        margin-top: 10px !important;
    }
}

/*img {
    border-radius: 8px;
}*/
/* Step Title (STEP 1, STEP 2, etc.) */
h6.fw-bold {
    font-size: 16px;
    letter-spacing: 1px;
    color: #333;
    margin-bottom: 8px;
    text-transform: uppercase;
    border-bottom: 2px solid #ffb703;
    display: inline-block;
    padding-bottom: 4px;
}

/* By default margin-top 10px or -10px lagega */
.product-card {
    margin-top: 5px;
}

/* Jisme -10px diya hai, uske liye specific class bana lo */
.product-card.minus-margin {
    margin-top: -5px;
}

/* Desktop view par margin hata do */
@media (min-width: 768px) {
    .product-card,
    .product-card.minus-margin {
        margin-top: 0;
    }
}
.promo-banner-grid { 
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin: 20px 0;

}

.promo-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f9f9f9;
    padding: 20px;
    flex-wrap: wrap;
    border-radius: 8px;
    overflow: hidden;
/*    min-height: 220px;*/
    transition: box-shadow 0.3s ease;
}


.promo-image {
    flex: 1 1 50%;
    text-align: center;
}

.promo-image img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Tablet View */
@media (max-width: 992px) {
    .promo-text h3 {
        font-size: 20px;
    }

    .promo-text p {
        font-size: 14px;
    }
}

/* Mobile View */
@media (max-width: 768px) {
    .promo-banner {
        flex-direction: column;
        text-align: center;
        padding: 15px;
        margin-bottom: -48px;
    }

    .promo-image {
        flex: 1 1 100%;
        padding: 10px 0;
    }

}
.category-heading {
  font-size: clamp(20px, 4vw, 32px); /* Responsive font size */
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5rem;
  margin-top: -83px; /* Base value for mobile */
}

/* Medium screens (≥576px) */
@media (min-width: 576px) {
  .category-heading {
    margin-top: -40px;
  }
}

/* Large screens (≥992px) */
@media (min-width: 992px) {
  .category-heading {
    margin-top: -20px;
  }
}

/* Extra-large screens (≥1400px) */
@media (min-width: 1400px) {
  .category-heading {
    margin-top: 0;
  }
}


.section-title {
    font-size: 28px;
    margin-bottom: 10px;
    color: #222;
    font-weight: bold;
}

.section-subtitle {
    color: #555;
    margin-bottom: 30px;
    font-size: 16px;
}

.promise-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    justify-items: center;
    align-items: center;
}

.promise-item img {
    max-width: 60px;
    margin-bottom: 15px;
    justify-items: center;
     align-items: center;
     margin-left: 80px;
}

.promise-item h4,h2 {
    font-size: 16px;
    text-align: center;
    color: #222;
    font-weight: 600;
    margin-left: 40px;
}

/* Responsive Design */
@media(max-width: 992px) {
    .promise-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width: 576px) {
    .promise-grid {
        grid-template-columns: 1fr;
    }
}
.category {
    background: #fff;
    border: 1px solid #eee;
    transition: all 0.3s ease;
    cursor: pointer;
    overflow: hidden;
    height: 150px;
}

.category img {
    width: 100%;
    display: block;
    object-fit: cover;
    height: 200px;
    transition: transform 0.3s ease;
}
/* Mobile view ke liye height 120px */
@media (max-width: 576px) {
    .category img {
        height: 80px;
    }
}

/*.category:hover img {
    transform: scale(1.05);
}*/

.category h6 {
    font-size: 16px;
    color: #fff;
    margin: 0;
    padding: 10px;
    background: #2e7d32;
}
.ps-banner img {
    transition: opacity 0.5s ease;
    opacity: 1;
}

.ps-banner img.fade-out {
    opacity: 0;
}
.banner-dots {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
  bottom: 5%; /* Use % instead of px for flexibility */
}

.banner-dots .dot {
  width: 12px;
  height: 12px;
  background: transparent;
  border: 2px solid rgba(212, 175, 55, 0.8);
  border-radius: 50%;
  opacity: 0.8;
  cursor: pointer;
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.banner-dots .dot.active {
  transform: scale(1.3);
  box-shadow: 0 0 5px rgba(212, 175, 55, 0.7);
}

/* Media Query: Slight tweak for smaller screens */
@media (max-width: 767.98px) {
  .banner-dots {
    bottom: 28%;  /* Adjust this % if needed */
    gap: 6px;
    z-index: 20;
  }
}

  .ps-banner {
    position: relative !important;
    /*min-height: 300px !important;*/
  }
}

  .ps-banner {
    position: relative !important;
  }
}

.ps-banner img {
    user-drag: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.ps-banner img {
    cursor: none;
}

.ps-banner img:hover {
    cursor: pointer; 
}
@media (max-width: 991px) {
    .product-slider .owl-nav {
        display: none;
    }
}



.custom-bestseller-heading {
    font-size: 24px;
    margin-bottom: 15px;
    font-weight: bold;
}

.custom-product-slider {
    position: relative;
}

.custom-product-slider .owl-stage {
    display: flex;
}

.custom-product-box {
    text-align: center;
    background: linear-gradient(135deg, #fff, #f9f9f9);
/*    margin: 10px;*/
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.custom-product-image-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1/1;
    overflow: hidden;
}

.custom-product-main-img,
.custom-product-hover-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: all 0.3s ease;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.custom-product-hover-img {
    opacity: 0;
    transform: scale(1);
    z-index: 2;
}

.custom-product-box:hover .custom-product-hover-img {
    opacity: 1;
    transform: scale(1.05);
}

.custom-product-box:hover .custom-product-main-img {
    opacity: 0;
}

.custom-product-offer,
.custom-product-wishlist {
    position: absolute;
    z-index: 3;
}

.custom-product-offer {
    top: 10px;
    left: 10px;
    background: red;
    color: #fff;
    padding: 2px 6px;
    font-size: 12px;
    border-radius: 3px;
}

.custom-product-wishlist {
    top: 10px;
    right: 20px;
    cursor: pointer;
    font-size: 18px;
    color: #555;
}

.custom-product-title {
    font-size: 16px;
    margin: 15px 10px 5px 10px;
    color: #333;
}

.custom-product-rating {
    color: orange;
    margin-bottom: 5px;
    font-size: 14px;
}

.custom-product-price {
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 16px;
}

.custom-product-action-btn {
    display: flex;
    align-items: center;
    background-color: #2e7d32;
    color: white;
    font-size: 16px;
    font-weight: 600;
    height: 40px;
    width: 300px;
    max-width: 100%;
    margin: 0 auto 15px auto;
}

.custom-cart-btn, .custom-buy-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    height: 100%;
    color: white;
}

/*.custom-cart-btn {
    flex: 0 0 50px;
}*/

.custom-buy-btn {
    flex: 1;
}

.custom-action-divider {
    width: 1px;
    background-color: #fff;
    height: 80%;
}

/* Left-Right Arrows Styling */
.custom-product-slider .owl-nav {
    position: absolute;
    top: 40%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

.custom-product-slider .owl-nav button {
   
    border: none;
    color: #000000 !important;
    font-size: 18px;
    pointer-events: all;
}

/* Hide Arrows on Mobile */
@media (max-width: 575.98px) {
    .custom-product-slider .owl-nav {
        display: none;
    }
    .custom-product-action-btn {
        width: 100%;
        height: 42px;
        font-size: 13px;
    }
    .custom-product-title {
        font-size: 12px;
    }
}
.custom-product-slider .owl-nav button {
    background: transparent !important;
    border: none !important;
    color: #2e7d32 !important;
    width: auto !important;
    height: auto !important;
    font-size: 22px !important;
    pointer-events: all !important;
    transition: none !important;
}

.custom-product-slider .owl-nav button:hover {
    background: transparent !important;
    color: #2e7d32 !important;
}
.custom-product-info {
    background-color: #edf3f2;
    padding: 10px;
    /*border-radius: 5px;*/
}
.custom-buy-btn,
.custom-cart-btn {
    display: inline-block;
    padding: 6px 10px;
    color: white;
    transition: all 0.3s ease;
}
.margin-btn{
    margin-left: 33px;
}
.custom-buy-btn:hover,
.custom-cart-btn:hover {
    color: #ffcc00; /* Yellow color on hover */
}

.owl-carousel button.owl-dot {
    display: none;
}


.product-card {
    width: 64% !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 120px;
}

.product-card > div {
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
}

.product-card img {
    width: 100% !important;
    object-fit: cover !important;
    display: block !important;
}
.hair-loss-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding-top: 25px;
}

.hair-loss-banner img {
    max-width: 100%;
    height: auto;
}
@media (max-width: 576px) {
    .hair-loss-banner {
        padding-top: 69px;
    }

    .hair-loss-banner img {
        max-width: 90%;
    }
}

.herbal-heading-margin {
    margin-top: 0;
}

@media (min-width: 992px) {
    .herbal-heading-margin {
        margin-top: 60px;
    }
}
.ps-banner img,
.Hair img,
.herb-images img,
.text-center img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto;
    margin-bottom: 15px;
}

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

.herb-text {
    flex: 1 1 300px;
    padding: 10px;
}

.herb-images {
    flex: 1 1 300px;
    text-align: center;
}

.bottom-banner-container {
    padding-top: 30px;
}

.card {
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .herb-text, .herb-images {
        flex: 1 1 100%;
    }

    .bottom-banner-container {
        padding-top: 30px;
    }

    .ps-banner {
        margin-top: -22px;
    }

    .herb-section {
        padding: 15px;
    }
}

.category img {
    width: 250px;
    height: 170px;
    object-fit: cover;
}

@media (max-width: 576px) {
    .category img {
        height: 100px;
    }
}

.custom-categories-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0px 15px;
  padding-top: 0px;
}

.custom-section-title {
  font-size: 30px;
  font-weight: bold;
  margin-top: -50px;
  text-align: center;
  margin-bottom: 20px;
}

.custom-swiper-container {
  padding-bottom: 20px;
}

.custom-category-card {
  width: 100%;
  max-width: 200px;
  height: 180px;
/*  background: #edf3f2;*/
/*  border-radius: 10px;*/
/*  box-shadow: 0 4px 15px rgba(0,0,0,0.1);*/
  text-align: center;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
  margin: auto;
  position: relative;
}



.custom-category-card img {
  width: 100%;
  height: 146px;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.custom-category-card h6 {
  margin: 10px 0 0 0;
  font-weight: 700;
  color: #333;
  font-size: 16px;
  transition: color 0.3s ease;
}

/*.custom-category-card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}*/

/*.custom-category-card:hover img {
  transform: scale(1.1);
}*/

.custom-category-card:hover h6 {
  color: goldenrod; /* Change text color on hover */
}


/*.modern-blog-section {
    padding: 20px;
}*/

.modern-blog-heading {
    font-size: 2.2rem;
    font-weight: bold;
    color: #333;
}

.modern-blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    padding-bottom: 10px;
}

.modern-blog-card {
    overflow: hidden;
/*    box-shadow: 0 8px 20px rgba(0,0,0,0.1);*/
/*    transition: transform 0.4s, box-shadow 0.4s;*/
    background: #edf3f2;
}

/*.modern-blog-card:hover {
    transform: translateY(-8px) scale(1.03);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}*/

.modern-blog-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.modern-blog-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.modern-blog-card:hover .modern-blog-image img {
    transform: scale(1.05);
}

.modern-badge {
    position: absolute;
    top: 25px;
    left: 25px;
    padding: 5px 12px;
    font-size: 0.75rem;
    color: #fff;
    border-radius: 50px;
    z-index: 2;
}

.badge-red {
    background: #e53935;
}

.badge-yellow {
    background: #fbc02d;
}

.badge-green {
    background: #43a047;
}

.modern-blog-content {
    text-align: center;
}

.modern-blog-content h4 {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
    transition: color 0.3s;
}

.modern-blog-card:hover .modern-blog-content h4 {
    color: #4CAF50;
}

.modern-blog-content p {
    color: #555;
    font-size: 0.95rem;
    margin-bottom: 15px;
}

.modern-blog-content button {
    background: linear-gradient(45deg, #4CAF50, #8BC34A);
    color: #fff;
    border: none;
    padding: 8px 40px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s;
    display: inline-block;
    text-align: center;
}

/* Hover Effect */
.modern-blog-content button:hover {
    background: linear-gradient(45deg, #8BC34A, #4CAF50);
    transform: scale(1.05);
}

/* Responsive for Tablets */
@media (max-width: 768px) {
    .modern-blog-content button {
        padding: 12px 80px;
        font-size: 14px;
    }
}

/* Responsive for Small Mobiles */
@media (max-width: 480px) {
    .modern-blog-content button {
        padding: 10px 40px;
        font-size: 13px;
    }
}

.modern-blog-image {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.modern-blog-image img {
    width: 100%;
    height: 123%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.modern-blog-image .hover-img {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.modern-blog-card:hover .modern-blog-image .hover-img {
    opacity: 1;
}

.modern-blog-card:hover .modern-blog-image .main-img {
    opacity: 0;
}
@media (max-width: 768px) {
    p.text-center.mb-4 {
        font-size: 20px !important;
    }
}

@media (max-width: 480px) {
    p.text-center.mb-4 {
        font-size: 18px !important;
    }
}
/*.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot {
    display: none !important;
}
.owl-carousel .owl-stage-outer {
    padding-bottom: 20px; /* Jitna gap chahiye, us hisaab se value change kar sakte ho */
}*/
.excellence-heading {
    font-size: 30px;
    font-weight: bold;
    padding-top: 110px;
}

/* Mobile View ke liye Padding Remove */
@media (max-width: 767px) {
    .excellence-heading {
        padding-top: 0;
        margin-top: -90px;
    }
}
.custom-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-top: -120px;
/*    margin-left: 142px;*/
}
.customm-banner {
    position: relative;
    width: 82%;
    overflow: hidden;
/*    margin-left: 142px;*/
}


.custom-banner img {
    width: 100%;
    height: auto;
    display: block;
    max-height: 50%;
    object-fit: cover;
}

.custom-banner-heading {
    position: absolute;
    left: 110px;
/*    bottom: 140px;*/
    color: #fff;
    font-size: 36px;
    font-weight: bold;
     margin-top: 90px;
}

.custom-banner-breadcrumb {
    position: absolute;
    left: 115px;
/*    bottom: 120px;*/
    color: #fff;
    font-size: 18px;
     margin-top: 140px;
}

/* Tablet View */
@media (max-width: 991px) {
    .custom-banner-heading {
        font-size: 28px;
/*        bottom: 60px;*/
        left: 20px;
    }

    .custom-banner-breadcrumb {
        font-size: 22px;
/*        bottom: 50px;*/
        left: 29px;
    }

    .custom-banner img {
        max-height: auto;
    }
}

/* Mobile View */
@media (max-width: 767px) {
    .custom-banner-heading {
        font-size: 22px;
/*        bottom: 50px;*/
        left: 34px;
    }

    .custom-banner-breadcrumb {
        font-size: 13px;
/*        bottom: 20px;*/
        left: 23px;
    }

    .custom-banner img {
        max-height: 250px;
    }
}

/* Extra Small Mobile */
@media (max-width: 480px) {
    .custom-banner-heading {
        font-size: 22px;
        bottom: 32px;
    }

    .custom-banner-breadcrumb {
        font-size: 13px;
        bottom: 20px;
    }

    .custom-banner img {
        max-height: 456px;
        padding-top: 75px;
    }
}

.herbalism-section {
    margin-top: 85px;
}
@media (max-width: 767px) {
    .herbalism-section {
        margin-top: -15px;
    }
}


.herbalism-inner {
    padding: 5px 5px;
    border-radius: 10px;
}

.herbalism-image img {
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 767px) {
    .herbalism-inner {
        padding: 30px 15px;
    }
    .herbalism-section h3 {
        font-size: 20px;
        text-align: center;
    }
    .herbalism-section p {
        font-size: 14px;
        text-align: center;
    }
}
.diabetes-section {
    margin: 0px 0%;
    padding: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.diabetes-text {
    flex: 1 1 60%;
    padding-right: 20px;
}

.diabetes-image {
    flex: 1 1 35%;
    text-align: center;
    margin-top: 20px;
}

.diabetes-image img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 991px) {
    .diabetes-text, .diabetes-image {
        flex: 1 1 100%;
        padding-right: 0;
    }
}
.diabetes-program-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 0px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.diabetes-program-text {
    flex: 1 1 55%;
    padding: 20px;
}

.diabetes-program-text h2 {
    color: #222;
    font-size: 28px;
    margin-bottom: 20px;
}

.diabetes-program-text p {
    margin-bottom: 15px;
    font-size: 16px;
}

.diabetes-program-text h3 {
    margin: 20px 0 15px;
    font-size: 22px;
    color: #d62828;
    position: relative;
}

.diabetes-program-text h3::before {
    content: '';
    width: 4px;
    height: 100%;
    background: #d62828;
    position: absolute;
    left: -10px;
    top: 0;
}

.diabetes-program-list {
    list-style: none;
    padding: 0;
}

.diabetes-program-list li {
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
}

.diabetes-program-list li::before {
    content: "✔";
    color: #0077cc;
    margin-right: 10px;
    font-size: 18px;
    margin-top: 2px;
}

.diabetes-program-image {
    flex: 1 1 40%;
    text-align: center;
    padding: 20px;
}

.diabetes-program-image img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 991px) {
    .diabetes-program-wrap {
        flex-direction: column;
        text-align: center;
    }

    .diabetes-program-text, .diabetes-program-image {
        flex: 1 1 100%;
        padding: 15px;
    }

    .diabetes-program-text h2 {
        font-size: 24px;
    }
}
#close-menu {
    color: goldenrod;
}

.ps-nav__item.active #open-menu {
    display: none;
}

.ps-nav__item.active #close-menu {
    display: inline-flex;
}
/*.owl-carousel .owl-nav {
    display: none!important;
}*/
/* Mobile view par nav hide karo */
/*@media (max-width: 767px) {
  .owl-carousel .owl-nav {
    display: none !important;
  }
}

/* Desktop view ke liye nav dikhayein */
/*@media (min-width: 768px) {
  .owl-carousel .owl-nav {
    display: block !important;
  }
}*/






/* Modal Background & Border */
.modal-content {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
    animation: fadeInModal 0.5s ease;
    background: #fff;
}

/* Left Image Styling */
.login-modal-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px 0 0 12px;
}

/* Right Side Form Padding */
.login-modal-right {
    padding: 35px;
    background: linear-gradient(45deg, #fff, #fffdf8);
}

/* Heading Styling */
.login-modal-right h5 {
    font-size: 2rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 25px;
/*    text-align: center;*/
/*    text-transform: uppercase;*/
    letter-spacing: 1px;
    margin-top: -48px;
}

/* Input Fields */
.form-control {
    height: 48px;
    border-radius: 6px;
    border: 1px solid #ddd;
    transition: 0.3s;
    font-size: 2rem;
}

.form-control:focus {
    border-color: #ff9800;
    box-shadow: 0 0 10px rgba(255, 152, 0, 0.5);
    outline: none;
}

/* Attractive Button */
.ps-btn.ps-btn--warning {
    background: linear-gradient(135deg, #ff9800, #ff5722);
    color: white;
    padding: 14px 22px;
    border-radius: 8px;
    font-size: 1.2rem;
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.4);
    transition: 0.3s;
    width: 100%;
}

.ps-btn.ps-btn--warning:hover {
    background: linear-gradient(135deg, #e65100, #ff3d00);
    box-shadow: 0 6px 15px rgba(255, 87, 34, 0.5);
    transform: translateY(-1px);
}

/* Social Buttons */
.btn-facebook, .btn-google, .btn-twitter {
    padding: 10px 16px;
    margin: 5px;
    color: white;
    border-radius: 6px;
    font-size: 1rem;
    transition: 0.3s;
    min-width: 110px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.btn-facebook { background-color: #3b5998; }
.btn-facebook:hover { background-color: #2d4373; }

.btn-google { background-color: #db4437; }
.btn-google:hover { background-color: #b03125; }

.btn-twitter { background-color: #1da1f2; }
.btn-twitter:hover { background-color: #0d8ae5; }

/* Tabs Styling */
.nav-tabs {
    border: none;
    justify-content: center;
}

.nav-tabs .nav-link {
    color: #555;
    font-weight: bold;
    transition: 0.3s;
    padding: 10px 20px;
}

.nav-tabs .nav-link:hover {
    color: #ff9800;
}

.nav-tabs .nav-link.active {
    color: #fff;
    background: #ff9800;
    border: none;
    border-radius: 4px;
}

/* Close Buttons */
.close {
    font-size: 4rem;
    color: #333;
    opacity: 1;
    transition: 0.3s;
    margin-top: -10px;
    margin-left: 3px;
}

/*.close:hover {
    color: #ff5722;
}*/

/* Animation */
@keyframes fadeInModal {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

/* ---------------------- Responsive Design ---------------------- */
@media (max-width: 991px) {
    .login-modal-left img {
        display: none;
    }
    .login-modal-right {
        padding: 25px;
    }
    .login-modal-right h5 {
        font-size: 1.7rem;
    }
}

@media (max-width: 575px) {
    .modal-dialog {
        margin: 10px;
        margin-top: -38px;
    }
    .login-modal-right {
        padding: 20px;
    }
    .login-modal-right h5 {
        font-size: 1.5rem;
        padding-top: 28px;
    }
    .ps-btn.ps-btn--warning {
        padding: 12px 18px;
        font-size: 1rem;
    }
    .btn-facebook, .btn-google, .btn-twitter {
        font-size: 0.9rem;
        padding: 8px 12px;
        min-width: 90px;
    }
    .close {
        font-size: 3.5rem;
        position: absolute;
        top: 10px;
        right: 15px;
    }
}
@media (max-width: 768px) {
    .ps-about__section {
        flex-direction: column-reverse; /* image below text */
        text-align: center;
    }
    .ps-about__text, .ps-about__image {
        flex: 1 1 100%;
    }
}
.health-section {
    padding: 40px 125px;
    border-radius: 20px;
    margin-bottom: 40px;
    /* background: linear-gradient(135deg, #f0f4f8, #ffffff); */
    /* box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05); */
}

/* Responsive padding for tablets and mobile */
@media (max-width: 992px) {
    .health-section {
        padding: 30px 60px;
    }
}

@media (max-width: 576px) {
    .health-section {
        padding: 20px 20px;
    }
}


        .health-section h5 {
            font-weight: 700;
            font-size: 1.5rem;
            color: #2c3e50;
        }

        .health-section p {
            font-size: 14pt;
            font-family: Verdana, Geneva, sans-serif;
            color: #555;
            line-height: 1.7;
        }

        .health-section img {
            border-radius: 12px;
            box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
        }

        @media (max-width: 768px) {
            .health-section {
                text-align: center;
            }
        }
         .treat-section h2 {
            font-weight: 700;
            margin-bottom: 20px;
            color: #2a2a2a;
        }

        .treat-section p {
            font-size: 14pt;
            font-family: Verdana, Geneva, sans-serif;
            color: #555;
        }

        .treat-card {
            border: 1px solid #e0e0e0;
            border-radius: 12px;
            padding: 20px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.08);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            text-align: center;
            height: 100%;
        }

        .treat-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.15);
        }

        .treat-icon {
            font-size: 2rem;
            color: #28a745;
            margin-bottom: 10px;
        }

        .pillars-list {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 20px;
            margin-top: 30px;
        }

        .pillar-card {
            background: #f9f9f9;
            border-radius: 10px;
            padding: 20px;
            text-align: center;
            transition: 0.3s;
            box-shadow: 0 4px 10px rgba(0,0,0,0.06);
        }

        .pillar-card:hover {
            background: #e8f5e9;
            box-shadow: 0 6px 20px rgba(0,0,0,0.1);
        }

        .pillar-card i {
            font-size: 1.8rem;
            color: #007bff;
            margin-bottom: 10px;
        }

        .pillar-card p {
            margin-bottom: 0;
            font-size: 13pt;
            color: #333;

        }
         .ps-about__section h2,
.treat-section h2 {
    font-size: 2rem;
    font-weight: bold;
    padding-top: 30px;
    margin-right: 20px;
    color: green;
    margin-top: 0; /* Default for desktop */
}

/* Optional: Apply -50px margin-top only on small screens if needed */
@media (max-width: 767.98px) {
    .ps-about__section h2,
    .treat-section h2 {
        margin-top: -50px;
    }
}

    .treat-card {
        background-color: #f9f9f9;
        padding: 20px;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        transition: transform 0.3s ease;
    }
    .treat-card:hover {
        transform: translateY(-5px);
        background-color: #fff;
    }
    .treat-icon {
        font-size: 32px;
        color: #28a745;
        margin-bottom: 10px;
    }
    .pillars-list {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
        margin-top: 20px;
    }
    .pillar-card {
        background: #e9f5ee;
        padding: 20px;
        border-radius: 10px;
        text-align: center;
        flex: 1 1 200px;
        max-width: 250px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    }
    .pillar-card i {
        font-size: 28px;
        color: #2e7d32;
        margin-bottom: 10px;
    }

    @media (max-width: 768px) {
        .ps-about__section {
            flex-direction: column;
        }
        .ps-about__text, .ps-about__image {
            flex: 1 1 100%;
            margin-bottom: 20px;
        }
        .treat-card h5 {
            font-size: 1rem;
        }
        .treat-icon {
            font-size: 24px;
        }
        .pillar-card p {
            font-size: 0.9rem;
        }
    }
    .trusted-partner-section h2 {
    font-size: 2rem;
    color: #157347;
}

.trusted-partner-section p {
    line-height: 1.7;
    color: #333;
}
.mission-text {
    font-size: 1.1rem;
    font-family: 'Verdana', Geneva, sans-serif;
    max-width: 1137px;
    margin: 0 auto 1.5rem;
    line-height: 1.7;
    color: #333;
}

.choose-box h5 {
    font-weight: bold;
    margin-bottom: 10px;
    color: #157347;
}

.choose-box p {
    font-size: 0.95rem;
    color: #444;
}
.slider-controls {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    pointer-events: none;
}

.slider-controls .prev,
.slider-controls .next {
    font-size: 40px;
    color: #efb13e;
    padding: 20px 65px;
    cursor: pointer;
    pointer-events: auto;
    z-index: 10;
    border-radius: 50%;
    transition: background 0.3s;
}
@media (max-width: 767.98px) {
  .slider-controls {
    display: none !important;
  }
}

/*.custom-product-box {
    width: 400.25px !important;   
    margin-right: 10px;
}*/




    .contact-card {
        backdrop-filter: blur(10px);
        border-radius: 20px;
        padding: 40px;
        transition: all 0.3s ease-in-out;
    }

    .contact-icon {
        font-size: 2.5rem;
        color: #28a745;
    }

    .form-control:focus {
        border-color: goldenrod;
        box-shadow: 0 0 0 0.1rem rgba(40, 167, 69, 0.25);
    }

    .gradient-btn {
        background: linear-gradient(to right, #28a745, #218838);
        color: #fff;
        border: none;
/*        padding: 12px 30px;*/
        font-weight: 500;
/*        border-radius: 50px;*/
        transition: all 0.3s ease;
        width: 100%;
        margin-left: 409px;
    }
    @media (max-width: 767px) {
    .gradient-btn {
       margin-top: 10px;
        margin-left: 144px;
        width: 177%;
        display: block;
    }
}

    .gradient-btn:hover {
        background: linear-gradient(to right, #218838, #1e7e34);
    }


.ps-contact__info {
    padding: 70px 30px 30px 30px; /* added more top padding */
    border-radius: 20px;
}

.ps-contact__info h2 {
    font-weight: 700;
    color: #28a745;
    margin-bottom: 30px;
    font-size: 2.2rem; /* increased heading size */
}

.contact-item {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
    font-size: 1.7rem; /* increased font size */
    color: #333;
}

.contact-item i {
    font-size: 1.5rem; /* increased icon size */
    color: goldenrod;
    width: 35px;
    text-align: center;
    margin-right: 12px;
}

.contact-item a {
    color: #000;
    text-decoration: none;
    font-size: 1.5rem; /* increased link font size */
}

.contact-item a:hover {
    color: goldenrod;
}

.ps-social {
    display: flex;
    gap: 20px;
    margin-top: 30px;
    padding-left: 0;
}

.ps-social__link {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 2rem;
    color: #555;
    text-decoration: none;
    transition: transform 0.3s ease, color 0.3s ease;
}

.ps-social__link:hover {
    transform: scale(1.2);
}

/* Tooltip below icons */
.ps-tooltip {
    font-size: 0.9rem;
    background-color: #f8f9fa;
    color: #333;
    padding: 5px 12px;
    border-radius: 10px;
    margin-top: 8px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, transform 0.3s ease;
    transform: translateY(5px);
    white-space: nowrap;
}

.ps-social__link:hover .ps-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* REAL BRAND COLORS ON HOVER */
.ps-social__link.facebook:hover {
    color: #1877F2;
}

.ps-social__link.instagram:hover {
    color: #E4405F;
}

.ps-social__link.youtube:hover {
    color: #FF0000;
}

.ps-social__link.linkedin:hover {
    color: #0077B5;
}


.health-page {
  font-family: 'Segoe UI', sans-serif;
  color: #333;
}

.banner-wrapper {
  text-align: center;
  padding: 40px 20px;
  background: #e9f8f5;
  position: relative;
}

.banner-title {
  font-size: 2.5rem;
  font-weight: bold;
  color: #176a4c;
}

.breadcrumb {
  margin-top: 10px;
  color: #555;
}

.banner-image {
  width: 100%;
  height: auto;
  margin-top: 20px;
}

.health-container {
  padding: 40px 20px;
}

.section-title {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 15px;
  color: #146356;
}

.sub-heading {
  font-size: 1.3rem;
  margin-top: 20px;
  color: #1b8c73;
}

.section-text {
  font-size: 1rem;
  line-height: 1.8;
}

.list-style {
  margin-left: 20px;
  list-style-type: disc;
  font-size: 1rem;
}

.remedy-box {
  background: #f3f8f6;
  padding: 20px;
  margin-top: 30px;
  border-left: 5px solid #00b894;
  border-radius: 6px;
}

.faq-section {
  background: #fff9e6;
  padding: 20px;
  margin-top: 30px;
  border-left: 5px solid #f39c12;
  border-radius: 6px;
}

.faq-item {
  margin-bottom: 15px;
}

.newsletter-cta {
  background: #e6f7ff;
  padding: 30px;
  text-align: center;
  margin-top: 40px;
  border-radius: 6px;
}

.cta-heading {
  font-size: 1.6rem;
  margin-bottom: 10px;
}

.cta-subtext {
  margin-bottom: 20px;
  color: #555;
}

.newsletter-form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.newsletter-input {
  padding: 10px;
  width: 280px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.newsletter-button {
  padding: 10px 20px;
  background: #00b894;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.custom-product-slider .owl-item {
  display: flex;
  justify-content: center;
}

.custom-product-box {
  width: 100%;
  max-width: 320px;
  box-sizing: border-box;
}

.custom-product-main-img,
.custom-product-hover-img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}

/* Main Section Styling */
.info-block,
.remedy-box {
  padding: 40px 25px;
  background-color: #f9f9f9;
  color: #333;
  border-radius: 12px;
  margin-bottom: 30px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* Section Titles */
.section-title {
  font-size: 2.25rem; /* ~35px */
  font-weight: 700;
  color: #1e5631;
  margin-bottom: 20px;
  position: relative;
}

.section-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background-color: #1e5631;
  margin-top: 8px;
  border-radius: 2px;
}

/* Sub Headings */
.sub-heading {
  font-size: 1.6rem; /* ~26px */
  color: #2c3e50;
  margin-top: 30px;
  margin-bottom: 15px;
  font-weight: 600;
}

/* Paragraph Text */
.section-text {
  font-size: 1.125rem; /* ~18px */
  line-height: 1.7;
  margin-bottom: 20px;
  color: #444;
}

/* List Styling */
.list-style {
  padding-left: 25px;
  font-size: 1.7rem; /* ~18px */
  line-height: 1.8;
  color: #333;
}

.list-style li {
  margin-bottom: 12px;
  position: relative;
}

.list-style li::before {
  content: "✔";
  color: #1e5631;
  margin-right: 10px;
}

/* Responsive for Mobiles */
@media (max-width: 576px) {
  .info-block,
  .remedy-box {
    padding: 25px 15px;
  }

  .section-title {
    font-size: 1.6rem;
  }

  .sub-heading {
    font-size: 1.3rem;
  }

  .section-text,
  .list-style {
    font-size: 1.2rem;
    text-align: center;
  }

  .list-style li::before {
    font-size: 0.9rem;
  }
}
.remedy-box {
  padding: 50px 20px;
  background-color: #fefdf8;
}

.remedy-box img {
  max-height: 420px;
  object-fit: cover;
}
/* Container Styling */
.remedy-box {
  padding: 60px 30px;
  background: linear-gradient(to right, #fefdf8, #f3f8f5);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  border-radius: 20px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}

/* Image Styling */
/* Image Styling */
.remedy-box img {
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: contain; 
}


/* Column Sizing */
.remedy-image {
  flex: 1 1 45%;
  padding: 10px;
}

.remedy-text {
  flex: 1 1 50%;
  padding: 20px;
  text-align: right;
}

/* Heading Styling */
.remedy-text .section-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #2c4b27;
}

/* List Styling */
.remedy-text .list-style {
  list-style: none;
  padding: 0;
}

.remedy-text .list-style li {
  margin-bottom: 12px;
  font-size: 18px;
  color: #444;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

.remedy-text .list-style li span {
  font-size: 20px;
  color: #50a371;
}

/* Responsive Design */
@media (max-width: 768px) {
  .remedy-box {
    flex-direction: column;
    text-align: center;
    padding: 40px 20px;
  }

  .remedy-text {
    text-align: center;
    flex: 1 1 100%;
  }

  .remedy-text .list-style li {
    justify-content: center;
  }

  .remedy-image {
    flex: 1 1 100%;
  }
}
.natural-remedies-box {
  background-color: #fefdf8;
  border-radius: 20px;
  padding: 40px 30px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  margin-bottom: 40px;
}

.remedies-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 30px;
}

.remedy-col {
  flex: 1 1 30%;
/*  background-color: #ffffff;*/
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
}

.section-title {
  font-size: 28px;
  font-weight: 700;
  color: #2c4b27;
}

.sub-heading {
  font-size: 20px;
  margin-bottom: 15px;
  color: #1e5631;
}

.list-style {
  list-style: none;
  padding: 0;
  margin: 0;
}

.list-style li {
  margin-bottom: 10px;
  font-size: 16px;
  color: #444;
}

.note-text {
  margin-top: 30px;
  font-size: 16px;
  color: #5a5a5a;
  background: #fff3cd;
  border-left: 4px solid #f0ad4e;
  padding: 15px;
  border-radius: 8px;
}

/* Responsive */
@media (max-width: 768px) {
  .remedies-row {
    flex-direction: column;
  }

  .remedy-col {
    flex: 1 1 100%;
  }

  .section-title {
    font-size: 24px;
  }
}
/* --- COMMON BOX STYLE FOR INFO SECTIONS --- */
.natural-remedies-box {
  background-color: #fefdf8;
  border-radius: 20px;
  padding: 50px 30px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  margin-bottom: 40px;
}

.remedies-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 30px;
}

.remedy-col {
  flex: 1 1 30%;
  background-color: #ffffff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
}

.section-title {
  font-size: 28px;
  font-weight: 700;
  color: #2c4b27;
  margin-bottom: 10px;
}

.sub-heading {
  font-size: 20px;
  margin-bottom: 15px;
  color: #1e5631;
}

.section-text {
  font-size: 18px;
  line-height: 1.6;
  color: #444;
  margin-top: 10px;
}

.intro-text {
  max-width: 800px;
  margin: 0 auto 20px;
}

.list-style {
  list-style: none;
  padding: 0;
  margin: 0;
}

.list-style li {
  margin-bottom: 10px;
  font-size: 16px;
  color: #444;
}

/* Responsive */
@media (max-width: 768px) {
  .remedies-row {
    flex-direction: column;
  }

  .remedy-col {
    flex: 1 1 100%;
  }

  .section-title {
    font-size: 24px;
  }

  .section-text {
    font-size: 16px;
  }
}
.remedy-box {
  padding: 60px 30px;
  background: linear-gradient(to right, #fefdf8, #f3f8f5);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  border-radius: 20px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  margin-bottom: 40px;
  transition: all 0.3s ease;
}

.remedy-box:hover {
  transform: scale(1.01);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.07);
}

.remedy-image {
  flex: 1 1 45%;
  padding: 10px;
}

.remedy-text {
  flex: 1 1 50%;
  padding: 20px;
}

.remedy-box img {
  max-height: 420px;
  width: 100%;
  object-fit: contain;
  border-radius: 16px;
  transition: transform 0.3s ease;
}

.remedy-box img:hover {
  transform: scale(1.03);
}

.section-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #2c4b27;
}

.highlight-text {
  color: #1e5631;
}

.section-text {
  font-size: 18px;
  margin-bottom: 15px;
  color: #444;
}

.list-style {
  list-style: none;
  padding: 0;
}

.list-style li {
  margin-bottom: 12px;
  font-size: 16px;
  color: #333;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.5;
}

.list-style li span {
  font-size: 20px;
  color: #50a371;
  flex-shrink: 0;
}

/* Responsive Styles */
@media (max-width: 768px) {
  .remedy-box {
    flex-direction: column;
    text-align: center;
    padding: 40px 20px;
  }

  .remedy-text,
  .remedy-image {
    flex: 1 1 100%;
  }

  .section-title {
    font-size: 24px;
  }

  .section-text,
  .list-style li {
    font-size: 15px;
  }

  .list-style li {
    justify-content: center;
    text-align: left;
  }
}
/* Prevention Box Styling */
.prevent-box {
  border-radius: 20px;
  padding: 50px 30px;
  margin-bottom: 40px;
  transition: transform 0.3s ease;
}

.prevent-box:hover {
  transform: scale(1.01);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08);
}

.prevent-box .section-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 25px;
  color: #1e5631;
}

.prevent-list {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 600px;
}

.prevent-list li {
  font-size: 18px;
  color: #444;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.prevent-list li span {
  font-size: 22px;
  color: #50a371;
  flex-shrink: 0;
}



/* Card hover lift with shadow glow */
.hover-lift {
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}
.hover-lift:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

/* Icon styling with background circle and pulse */
.process-card img {
  transition: transform 0.3s ease, filter 0.3s ease;
  background-color: #e6f5f3;
  padding: 15px;
  border-radius: 50%;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.06);
}
.process-card:hover img {
  transform: scale(1.1);
  filter: brightness(1.1);
  box-shadow: 0 0 15px rgba(0, 170, 140, 0.2);
}

/* Section background */
.section-gap {
  background: linear-gradient(180deg, #f9f9f9 0%, #f0f4f5 100%);
  padding-top: 60px;
  padding-bottom: 60px;
}

/* Section heading enhancement */
.section-gap h2 {
  position: relative;
  display: inline-block;
}
.section-gap h2::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -10px;
  width: 60%;
  height: 3px;
  background: linear-gradient(90deg, #198754, #63c7a8);
  border-radius: 2px;
}

/* Bottom banner heading */
.bottom-banner h2 {
  font-size: 1.75rem;
  color: #2d4739;
}
@media (min-width: 768px) {
  .bottom-banner h2 {
    font-size: 2rem;
  }
}

/* Bottom banner paragraph */
.bottom-banner p {
  font-size: 1rem;
  color: #333;
}



/* Center alignment for all section titles and sub-headings */
.section-title,
.sub-heading,
h2,
h3 {
  text-align: center !important;
  margin-right: 30px;
  color: #000000!important;
}


.btn-shop-now {
  display: inline-block;
  padding: 12px 24px;
  background-color: #1c7c54;
  color: white;
  font-weight: 600;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.btn-shop-now:hover {
  background-color: #145c3c;
  transform: translateY(-2px);
}

/* Section Headings */
h2, h4, h5 {
  color: #000000;
  font-weight: 600;
}

/* Paragraph Styling */
p {
  font-size: 1rem;
  color: #333;
}

/* About Section Styling */
.ps-about__section {
  gap: 2rem;
}
.ps-about__text {
  padding: 1rem;
}
.ps-about__image img {
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease;
}
.ps-about__image img:hover {
  transform: scale(1.02);
}

/* Timeline List */
.timeline li {
  padding: 0.5rem 0;
  position: relative;
  padding-left: 1.5rem;
}
.timeline li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: #198754;
  font-size: 1.2rem;
}

/* Testimonials */
.testimonial-box {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.testimonial-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

/* Treat Cards */
.treat-card {
  background: #f8f9fa;
  border-radius: 10px;
  padding: 1rem;
  transition: all 0.3s ease;
}
.treat-card:hover {
  background: #e9f7ef;
  transform: translateY(-5px);
}

/* Pillars */
.pillar-card {
  text-align: center;
  margin-bottom: 20px;
  padding: 1rem;
}
.pillar-card i {
  font-size: 24px;
  color: #198754;
  margin-bottom: 10px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .ps-about__section {
    flex-direction: column;
  }
  .timeline {
    padding-left: 0;
  }
  .treat-card {
    margin-bottom: 15px;
  }
  .pillars-list {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}

/* Button Styling */
.btn-success {
  font-size: 1rem;
  padding: 0.75rem 2rem;
  border-radius: 8px;
}

/* Fade-in Animation (Optional) */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 0.6s forwards;
}
@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.pillar-card {
  background: #f8f9fa;
  padding: 1rem;
  border-radius: 12px;
  transition: transform 0.3s ease;
  height: 100%;
}
.pillar-card:hover {
  transform: translateY(-5px);
  background-color: #e9f7ef;
}

.range-slider {
    position: relative;
    width: 100%;
    height: 40px;
  }

  .range-slider input[type="range"] {
    position: absolute;
    width: 100%;
    top: -8px;
    left: 0;
    background: none;
    pointer-events: none; /* Disable mouse for now */
    -webkit-appearance: none;
    z-index: 3;
  }

  .range-slider input[type="range"]::-webkit-slider-thumb {
    pointer-events: all; /* Enable pointer on thumb */
    width: 20px;
    height: 20px;
    background: #28a745;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    -webkit-appearance: none;
    cursor: pointer;
  }

  .range-slider .slider-track {
    position: absolute;
    height: 6px;
    background: #ddd;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 1;
    border-radius: 5px;
  }

  .range-slider .slider-fill {
    position: absolute;
    height: 6px;
    background: #28a745;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    border-radius: 5px;
  }

  .price-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    font-weight: bold;
    color: #28a745;
  }
.page-list {
    list-style: none;
    padding: 0;
    margin: 20px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.page-list li {
    display: inline-block;
}

.page-link {
    display: block;
    padding: 8px 14px;
    font-size: 15px;
    color: #333;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 5px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.page-link:hover {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.page-link.active-page,
.page-link.active-page:hover {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
    font-weight: bold;
}
.row
{
margin-left:0px!important;
margin-right:0px!important;
margin-top: 10px;
}
.filter-box {
  position: sticky;
  top: 120px;
  background: rgba(0, 255, 0, 0.05); /* Light green for debug */
  z-index: 900;
  overflow: hidden;
overflow: auto;
}
@media (max-width: 767.98px) {
    .filter-box {
      position: fixed;
      top: 0;
      left: 0;
      height: 100vh;
      width: 100%;
      overflow-y: auto;
      z-index: 1055;
      display: none;
    }

    .filter-box.mobile-visible {
      display: block;
    }
  }
  @media (max-width: 767.98px) {
    .filter-box.mobile-visible {
        display: block;
        height: 412px;
        margin-top: 79px;
    }
}
  #searchSuggestions {
    max-height: 300px;
    margin-left: 124px!important;
    overflow-y: auto;
/*    border: 1px solid #ddd;*/
    border-top: none;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 5px 5px 15px 15px;
    width: 49.60%;
    margin-top: -5px;
}

.searchSuggestion a.suggestion-item {
  padding: 10px 15px;
  color: #333;
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.searchSuggestion a.suggestion-item:hover {
  background-color: #f8f9fa;
  color: #000;
}

  .thumbnail-img {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 6px;
    margin-bottom: 10px;
    cursor: pointer;
    object-fit: cover;
  }

  .main-img {
    width: 100%;
/*    border-radius: 12px;*/
  }

  .price-text {
    font-size: 28px;
    font-weight: bold;
    color: #B12704;
  }

  .old-price {
    text-decoration: line-through;
    color: #565959;
    font-size: 14px;
  }

  .discount {
    color: #007600;
    font-weight: bold;
  }

  .btn-cart,
  .btn-buy {
    font-weight: 600;
    border-radius: 6px;
    padding: 10px 16px;
    width: 100%;
    transition: background-color 0.3s ease, color 0.3s ease;
  }

  .btn-cart {
    background-color: #FFD814;
    color: #111;
    margin-left: 20px;
  }

  .btn-buy {
    background-color: #FFA41C;
    color: #111;
  }

  .btn-cart:hover,
  .btn-buy:hover {
    background-color: #28a745;
    color: #FFD700;
    box-shadow: 0 4px 12px rgba(0, 128, 0, 0.2);
    transform: translateY(-2px);
  }

  .checked {
    color: #FFA41C;
  }

  .description-box {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
  }

  .description-box:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  }

  .description-box h2 {
    font-size: 24px;
    margin-bottom: 15px;
    color: #1a1a1a;
    border-bottom: 2px solid #ffa41c;
    display: inline-block;
    padding-bottom: 5px;
  }

  .description-box p {
    font-size: 15px;
    line-height: 1.7;
    color: #444;
  }

  .custom-product-action-btn {
    gap: 10px;
    flex-wrap: wrap;
  }

  @media (max-width: 991.98px) {
    .main-img {
/*      margin-top: 80px;*/
      text-align: center;
    }

    .card-title {
      font-size: 16px;
    }

    .custom-product-action-btn {
      flex-direction: column;
      align-items: stretch;
    }
  }

  @media (max-width: 767.98px) {
    .row.flex-md-row {
      flex-direction: column !important;
    }

    .col-3.thumbnails,
    .col-9.main-image {
      width: 100% !important;
      max-width: 100%;
    }

    .col-3.thumbnails {
      order: 2;
      display: flex;
      gap: 10px;
      justify-content: center;
      flex-wrap: wrap;
      margin-top: 15px;
    }

    .col-9.main-image {
      order: 1;
    }
  }
  .swiper {
  width: 100%;
  height: auto;
}

.swiper-slide img {
/*  border-radius: 12px;*/
  width: 100%;
  object-fit: cover;
}
@media (max-width: 767.98px) {
  .product-specs p {
    font-size: 14px;
  }

  ul li {
    font-size: 14px;
  }

  ul li img {
    height: 16px;
    vertical-align: middle;
    margin-right: 5px;
  }
}
/* Base Styles */
.custom-product-action-btn {
  gap: 10px;
  flex-wrap: wrap;
}

/* Make Cart + Buy Now stack on mobile */
@media (max-width: 576px) {
  .custom-product-action-btn {
    flex-direction: column;
    align-items: stretch !important;
  }

  .custom-cart-btn {
    width: 25%;
    text-align: center;
    padding: 10px 0;
    border-radius: 6px;
  }

  .custom-buy-btn {
    width: 59%;
  }

  .custom-buy-btn a {
    width: 75%;
    margin: -1px -36px;
    margin-right: 30;
  }

  .custom-action-divider {
    display: none;
  }
}
/* Style the divider */
.custom-action-divider {
    padding-top: 32px;
  display: inline-block;
  width: 1px;
  height: 24px;
  background-color: #fff;
  margin-top: 5px;
  margin-right: 10px;
}

/* Mobile Horizontal Slider Styles */
.related-products-slider {
  padding-bottom: 10px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
}
.related-products-slider::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}
.related-products-slider > .product-card {
  flex: 0 0 auto;
  width: 75%;
  max-width: 260px;
  margin-right: 15px;
}

/* Optional: adjust card spacing on desktop */
@media (min-width: 992px) {
  .product-card {
    margin-bottom: 30px;
  }
}
@media (min-width: 992px) {
  .buy-now-link {
    margin: 0 !important;
  }
}
.buy-now-link {
  transition: color 0.3s ease;
}

.buy-now-link:hover {
  color: gold !important;
}
.card .fa-star.checked {
  color: #FFA41C;
}
.btn-buy, .btn-cart {
  border-radius: 6px;
  font-weight: 500;
}
.checkout-info-card {
  font-family: 'Segoe UI', sans-serif;
  max-width: 600px;
  margin: auto;
}
.checkout-info-card img {
  object-fit: contain;
}
#stickyCardWrapper::-webkit-scrollbar {
  width: 6px;
}
#stickyCardWrapper::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 3px;
}
.zoom-wrapper {
    position: relative;
    display: inline-block;
    cursor: zoom-in;
  }

  .main-img {
    width: 100%;
/*    border-radius: 12px;*/
    transition: transform 0.3s ease;
  }

  .zoom-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0,0,0,0.6);
    color: white;
    padding: 6px;
    border-radius: 50%;
    font-size: 16px;
    display: none;
    z-index: 2;
  }

  .zoom-wrapper:hover .zoom-icon {
    display: block;
  }
  .thumbnail-img {
    width: 80%;                /* Full width of column */
    max-height: 90px;          /* Fixed height */
    object-fit: cover;          /* Crop to fit */
    margin-bottom: 10px;
    border-radius: 8px;
    border: 1px solid #ddd;
    cursor: pointer;
    transition: transform 0.3s ease;
  }

  .thumbnail-img:hover {
    transform: scale(1.03);     /* Slight zoom on hover */
    border-color: #28a745;      /* Optional highlight */
  }
@media (min-width: 768px) {
    .custom-buy-text {
      margin-left: 44px;
    }
  }
   .hover-white:hover {
    color: #fff !important;
  }
  .hover-white:hover i {
    color: #fff !important;
  }
  .benefit-card {
  background-color: #f9f9f1;
  border-radius: 16px;
  padding: 15px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  height: 100%;
}
.benefit-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.benefit-img {
  width: 230px;
  height: 230px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #d8eecb;
}

.benefit-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.benefit-card:hover .benefit-img img {
  transform: scale(1.05);
}

.benefit-card p {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  color: #222;
}
@media (max-width: 575.98px) {
  .benefit-card p {
    font-size: 13px;
  }
}
 @media (min-width: 768px) {
    #stickyCardWrapper {
      max-height: 85vh;
    }
  }
  #stickyCardWrapper {
    overflow-y: auto;
  }
  #stickyCard {
    font-size: 14px;
    padding: 1rem;
  }
  .checkout-info-card img {
    max-height: 40px;
  }
/*
.ingredient-card {
  background-color: #fdfdfd;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
*/
.ingredient-card:hover {
 /* transform: translateY(-6px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);*/
}
.how-to-card {
  background-color: #fafafa;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.how-to-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.step-number {
  font-size: 20px;
  color: #222;
}
.nav-tabs .nav-link {
  color: #888;
  font-weight: 600;
  text-transform: uppercase;
  border: none;
  font-size: 14px;
  width: 100%;
}
.nav-tabs .nav-link.active {
  color: #198754;
  border-bottom: 3px solid #198754;
  background: none;
  width: 100%;
}
.tab-content p, .tab-content ul {
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}
#stickyCardWrapper {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
#stickyCardWrapper::-webkit-scrollbar {
  display: none;
}
.howToUseSwiper {
  width: 250%;
  max-width: 1128px;
  margin: 0 auto;
  padding: 0 0px; /* Extra spacing for mobile */
}

.swiper-slide {
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.how-to-card {
  width: 100%;
  max-width: 280px;
  height: auto;
  background-color: #f8f9fa;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  padding: 15px;
}

.step-title {
  font-size: 16px;
  color: #222;
  margin-top: 10px;
}

/*  Mobile Responsive Tweaks */
@media (max-width: 767.98px) {
  .howToUseSwiper {
    padding: 0 8px;
  }

  .how-to-card {
    max-width: 90%;
    padding: 12px;
  }

  .step-title {
    font-size: 14px;
  }
}
 @media (max-width: 767.98px) {
    .benefit-card, .ingredient-card {
/*      min-height: 260px;*/
      width: 95%;
      margin: 0 auto;
    }

    .benefit-img img,
    .ingredient-card img {
      max-width: 100%;
      height: auto;
    }

    .row > div {
      /*padding-left: 10px;*/
      padding-right: 10px;
    }
  }

  .benefit-card:hover,
  .ingredient-card:hover {
   /* transform: translateY(-5px);
    transition: 0.3s ease;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);*/
  }
  .amazon-price {
    font-size: 28px;
    font-weight: 600;
    color: #B12704; /* Amazon red */
    letter-spacing: 0.5px;
    font-family: "Arial", sans-serif;
  }
  .upi-icon {
  max-height: 20px;
  background-color: #fff;
  border-radius: 3px;
}

/* Mobile-specific styles (screens less than 768px) */
@media (max-width: 767.98px) {
  .upi-icon {
    max-height: 23px; /* slightly smaller for mobile */
    margin-left: 4px;
    margin-right: -6px;
  }
}
.btn-buy-now {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  min-width: 100px;
  height: 37px;
  background: linear-gradient(135deg, #FFD700, #FFA500); /* Gold gradient */
  color: #000;
  font-weight: 600;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  box-shadow: 0 4px 10px rgba(255, 193, 7, 0.4);
  transition: all 0.3s ease-in-out;
  margin-top: 14px;
}

.btn-buy-now:hover {
  background: linear-gradient(135deg, #FFC107, #FF9800); /* Slightly darker gold */
  transform: scale(1.03);
  box-shadow: 0 6px 14px rgba(255, 193, 7, 0.5);
  color: #000;
}

.upi-icon {
  height: 25px;
  background-color: #fff;
  padding: 2px 4px;
  border-radius: 4px;
}

.search-wrapper {
    position: relative;
    width: 100%;
}

.searchInput {
    width: 100%;
    padding-right: 35px; /* leave space for the icon */
    padding-left: 15px;
    height: 40px;
    border-radius: 6px;
    border: 1px solid #ccc;
}

.clear-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #888;
    cursor: pointer;
    display: none; /* initially hidden */
}
 #otp-section { display: none; }
  .inputbar { padding: 10px; margin: 5px; width: 200px; }
  button { padding: 10px 20px; }
  #response { margin-top: 10px; font-weight: bold; }

    #form-wrapper {
    width: 100%;
    max-width: 400px;
    /* background: white; */
    padding: 25px;
    /* border-radius: 12px; */
    /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); */
    margin-top: 24px;
  }

  h3 {
    text-align: center;
    color: #333;
    margin-bottom: 20px;
  }

  .inputbar[type="text"] {
    width: 100%;
    padding: 20px 14px;
    margin-bottom: 15px;
/*    border: 1px solid #ccc;*/
    border-radius: 3px;
    font-size: 16px;
    box-sizing: border-box;
  }

  button {
    width: 53%;
    padding: 11px 12px;
    font-size: 16px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    margin-bottom: 15px;
    justify-content: end!important;
  }

  #sendOtpBtn {
    background-color: #28a745;
    color: white;
    margin-left: 50px;
  }

  #verifyOtpBtn {
    background-color: #28a745;
    color: white;
    margin-left: 50px;
  }

  #resendOtpBtn {
    background-color: #ffc107;
    color: #333;
    margin-left: 50px;
  }

  #sendOtpBtn:hover,
  #verifyOtpBtn:hover {
   background-color: #218838;
   transform: scale(1.05);
  }

  #resendOtpBtn:hover {
    background-color: #e0a800;
    transform: scale(1.05);
  }

  #response {
    margin-top: 15px;
    font-size: 14px;
    text-align: center;
  }

  @media(max-width: 500px) {
    #form-wrapper {
      padding: 15px;
    }

    .inputbar[type="text"], button {
      font-size: 15px;
      padding: 10px;
    }
  }

  /* 🔽 Mobile View Styling */
@media (max-width: 500px) {
  #form-wrapper {
    padding: 15px;
    margin-top: 20px;
  }

  .inputbar[type="text"] {
    font-size: 15px;
    padding: 12px;
  }

  button {
    font-size: 15px;
    padding: 12px;
  }

  h3 {
    font-size: 20px;
  }

  #response {
    font-size: 13px;
  }
}

   /* Header toggle */
  #menu-toggle {
    display: none;
  }

  .ps-header__left {
    position: fixed;
    top: 15px;
    left: 15px;
    z-index: 996;
  }

  .menu-toggle-label {
    font-size: 30px;
    color: #D4AF37;
    cursor: pointer;
  }

  .open-icon {
    display: inline-block;
  }

  .close-icon {
    display: none;
  }

  #menu-toggle:checked ~ .ps-header__left .open-icon {
    display: none;
  }

  #menu-toggle:checked ~ .ps-header__left .close-icon {
    display: inline-block;
  }

  /* Sidebar */
  .ps-menu--slidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100%;
    background: #fff;
    padding: 20px;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
    z-index: 1000;
    display: flex;
    flex-direction: column;
  }

  #menu-toggle:checked ~ .ps-menu--slidebar {
    transform: translateX(0);
    background: beige;
  }

  .menu-close {
    font-size: 24px;
    color: #D4AF37;
    text-align: right;
    margin-bottom: 15px;
    cursor: pointer;
  }

  /* Mobile Menu */
  .menu--mobile li {
    list-style: none;
    padding: 12px 0;
    position: relative;
  }

  .menu--mobile li a,
  .menu--mobile label.dropdown-label {
    color: #333;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 500;
    transition: color 0.2s ease;
  }

  .menu--mobile li a:hover,
  .menu--mobile label.dropdown-label:hover {
    color: #D4AF37;
  }

  .menu--mobile label.dropdown-label {
    cursor: pointer;
  }

  .menu--mobile label.dropdown-label i {
    transition: transform 0.3s ease;
  }

  /* Submenu Toggle */
  .dropdown-toggle {
    display: none;
  }

  .submenu-list {
    max-height: 0;
    overflow: hidden;
    padding-left: 18px;
    transition: max-height 0.3s ease;
  }

  .submenu-list li {
    padding: 8px 0;
    font-size: 15px;
    margin-left: 20px;
  }

  .dropdown-toggle:checked + label + .submenu-list {
    max-height: 500px;
  }

  .dropdown-toggle:checked + label i {
    transform: rotate(180deg);
    color: #D4AF37;
  }

  .ps-menu__footer {
/*    margin-top: auto;*/
    font-size: 14px;
    /*padding-top: 20px;
    border-top: 1px solid #eee;*/
  }

  .ps-menu__contact {
    margin-bottom: 8px;
    color: #555;
  }

  .ps-menu__contact a {
    color: #D4AF37;
    text-decoration: none;
  }

  @media (min-width: 769px) {
    .ps-header__left {
      display: none;
    }
  }

/* Default: show on mobile/tablet */
.banner-dots {
    top: 75%;
}

/* Hide on desktop (min-width 992px and up) */
@media (min-width: 992px) {
    .banner-dots {
        top: 90%;
    }
}
@media (min-width: 992px) {
  .custom-banner,
  .ps-blog,
  .ps-page {
    margin-top: 119px;
  }
}

.logoimg {
    margin-left: 130px; /* default for mobile */
  }

  @media (min-width: 768px) {
    .logoimg {
      margin-left: 55px; /* more margin for desktop/tablet */
    }
  }

@media (max-width: 767px) {
  #filterToggleBtn {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .filter-box {
    padding: 15px !important;
  }

  .ps-categogy--grid {
    overflow-x: hidden;
  }

  .custom-baner img {
    width: 100%;
    height: auto;
    margin-top: -45px;
  }

  .custom-baner,
  .ps-categogy__content,
  .row,
  .col-12,
  .col-md-3,
  .col-md-9 {
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
  }
}
@media (max-width: 767px) {
  #filterBox {
    display: none;
  }
}
@media (max-width: 767px) {
    #filterBox {
        display: none;
        position: absolute;
        top: 100px;
        left: 5%;
        width: 90%;
        z-index: 9999;
        background: #fff;
        border-radius: 10px;
        height: 367px;
        position: fixed;
    }

    .overlay-bg {
        display: none;
        position: fixed;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.5);
        z-index: 9998;
    }
}
 @media (max-width: 768px) {
    .mt-mobile-70 {
      margin-top: 70px !important;
    }
  }

  .custom-bannner {
    position: relative;
    max-width: 100%;
    border-radius: 10px;
    overflow: hidden;
/*    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);*/
  }

  .custom-bannner img {
/*    width: 100%;*/
    height: auto;
    object-fit: cover;
  }

  .custom-overlay {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
  }

  .custom-btn {
    padding: 10px 25px;
    font-weight: 600;
    border-radius: 30px;
  }

  .custom-product-box {
    max-width: 376px;
    /*border: 1px solid #eee;
    border-radius: 10px;
    padding: 15px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);*/
  }

  .custom-product-image-wrap {
    position: relative;
  }

  .custom-product-main-img,
  .custom-product-hover-img {
    width: 100%;
    height: auto;
   /* object-fit: cover;
    border-radius: 8px;*/
  }
 @media (max-width: 576px) {
  .mt-85-mobile {
    margin-top: 8.5rem !important;
  }
}

  .custom-product-offer {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #ff4d4d;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: bold;
  }

  .custom-product-wishlist {
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 18px;
    color: #999;
    cursor: pointer;
  }

  .custom-product-title {
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0 5px;
  }

  .custom-product-rating {
    color: #ffc107;
    font-size: 14px;
    margin-bottom: 5px;
  }

  .custom-product-price {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
  }

  .custom-product-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .custom-cart-btn,
  .custom-buy-btn {
    font-weight: 600;
    cursor: pointer;
  }

  .custom-cart-btn i {
    font-size: 18px;
  }

  .custom-action-divider {
    width: 1px;
    height: 20px;
    background-color: #ccc;
    margin: 5px 10px;
  }

  @media (min-width: 768px) {
    .row.align-items-center > .col-md-6:first-child {
      padding-right: 15px;
    }

    .row.align-items-center > .col-md-6:last-child {
      padding-left: 15px;
    }
  }

  @media (max-width: 767.98px) {
    .custom-product-box {
      margin-top: -10px;
    }

    .custom-bannner {
      margin-bottom: 10px;
    }
  }
   .custom-accordion {
      max-width: 800px;
      margin: auto;
    }

    .custom-accordion-item {
      background: #fff;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
      transition: all 0.3s ease;
    }

    .custom-accordion-item:not(:last-child) {
      margin-bottom: 16px;
    }

    .custom-accordion-header {
      margin: 0;
    }

    .custom-accordion-toggle {
      background: #ffffff;
      color: #212529;
      font-size: 1.05rem;
      padding: 1rem 1.25rem;
      width: 100%;
      text-align: left;
      border: none;
      border-radius: 0;
      font-weight: 600;
      transition: background 0.3s ease;
    }

    .custom-accordion-toggle:hover {
      background-color: #f1f1f1;
    }

    .custom-accordion-toggle:focus {
      outline: none;
      box-shadow: none;
    }

    .custom-accordion-toggle::after {
      content: "\25BC"; /* ▼ down arrow */
      font-size: 1rem;
      float: right;
      transition: transform 0.3s ease;
    }

    .custom-accordion-toggle:not(.collapsed)::after {
      transform: rotate(180deg);
    }

    .custom-accordion-body {
      padding: 1rem 1.25rem;
      background-color: #fafafa;
      border-top: 1px solid #e9ecef;
      color: #444;
    }

    @media (max-width: 576px) {
      .custom-accordion-toggle {
        font-size: 1rem;
        padding: 0.9rem 1rem;
      }

      .custom-accordion-body {
        padding: 0.9rem 1rem;
      }
    }
.slider-container {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 30px auto;
    overflow: hidden;
    height: auto;
    aspect-ratio: 4/3;
    user-select: none;
    touch-action: none;
}

.slider-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none; /* Image ke upar click effect disable */
}

.slider-container .after-image {
    clip-path: inset(0 50% 0 0);
    transition: clip-path 0.3s ease;
}

.slider-handle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    background: #000;
    border: 2px solid #fff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    cursor: ew-resize;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    z-index: 2;
    user-select: none;
    touch-action: none;
}

@media (min-width: 769px) {
    .slider-container {
        aspect-ratio: auto;
        height: 450px;
    }
}

@media (max-width: 768px) {
    .slider-handle {
        width: 30px;
        height: 30px;
    }
}

@media (max-width: 575px) {
    .slider-container {
        aspect-ratio: 1/1;
    }
}

    .custom-accordion {
      max-width: 1170px;
      margin: auto;
    }

    .custom-accordion-item {
      background: #fff;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
      transition: all 0.3s ease;
    }

    .custom-accordion-item:not(:last-child) {
      margin-bottom: 16px;
    }

    .custom-accordion-header {
      margin: 0;
    }

    .custom-accordion-toggle {
      background: #ffffff;
      color: #212529;
      font-size: 1.05rem;
/*      padding: 1rem 1.25rem;*/
      width: 100%;
      text-align: left;
      border: none;
      border-radius: 0;
      font-weight: 600;
      transition: background 0.3s ease;
    }

    .custom-accordion-toggle:hover {
      background-color: #f1f1f1;
    }

    .custom-accordion-toggle:focus {
      outline: none;
      box-shadow: none;
    }

    .custom-accordion-toggle::after {
      content: "\25BC"; /* ▼ down arrow */
      font-size: 1rem;
      float: right;
      transition: transform 0.3s ease;
    }

    .custom-accordion-toggle:not(.collapsed)::after {
      transform: rotate(180deg);
    }

    .custom-accordion-body {
      padding: 1rem 1.25rem;
      background-color: #fafafa;
      border-top: 1px solid #e9ecef;
      color: #444;
    }

    @media (max-width: 576px) {
      .custom-accordion-toggle {
        font-size: 1rem;
        padding: 0.9rem 1rem;
      }

      .custom-accordion-body {
        padding: 0.9rem 1rem;
      }
    }

.btn-buy-now {
  background: linear-gradient(135deg, #ff9800, #ffc107);
  color: #fff;
  font-weight: bold;
  border: none;
  padding: 10px 20px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  font-size: 1rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.btn-buy-now:hover {
  background: linear-gradient(135deg, #e68900, #e6ac00);
  transform: scale(1.03);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
}

.upi-icon {
  height: 22px;
  width: auto;
  margin-left: 10px;
  margin-right: 5px;
}

@media (max-width: 767px) {
  .btn-buy-now {
    font-size: 0.95rem;
    padding: 10px 16px;
    width: 100%;
    justify-content: center;
  }

  .upi-icon {
    height: 18px;
    margin-left: 6px;
    margin-right: 4px;
  }
}
/* Container spacing */
.shopping_cart_page {
/*  padding-top: 30px;*/
  padding-bottom: 30px;
  background-color: #f9f9f9;
}

/* ===========================
   Enhanced Form Card Style
=========================== */
.widget {
/*  background: #fff;*/
  border-radius: 16px;
  padding: 30px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
}
.widget:hover {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
}

/* ===========================
   Labels & Fields
=========================== */
.widget .form-label {
  font-weight: 600;
  color: #212529;
  margin-bottom: 6px;
  font-size: 15px;
}

.widget .form-control {
  border-radius: 10px;
  box-shadow: none;
  border: 1px solid #131414;
  font-size: 15px;
  padding: 10px 14px;
  transition: all 0.3s;
  color: #000!important;
}

.widget .form-control:focus {
  border-color: #28a745;
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.2);
  outline: none;
}

/* Required * asterisk color */
.widget .text-danger {
  color: #e74c3c !important;
}

/* ===========================
   Select2 Dropdown Style
=========================== */
.select2-container--default .select2-selection--single {
  height: 42px;
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 6px 12px;
  font-size: 15px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 28px;
}

/* ===========================
   Submit Button
=========================== */
.widget #submit {
  background: linear-gradient(135deg, #28a745, #1e7e34);
  color: white;
  border: none;
/*  border-radius: 50px;*/
  padding: 12px 32px;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.3s ease-in-out;
  width: 20%;
}

.widget #submit:hover {
  background: linear-gradient(135deg, #1e7e34, #146c2b);
  box-shadow: 0 6px 15px rgba(33, 124, 64, 0.3);
}

/* ===========================
   Textarea Style
=========================== */
textarea.form-control {
  min-height: 100px;
  resize: vertical;
  line-height: 1.5;
}

/* ===========================
   Breadcrumb Styling
=========================== */
.osahan-breadcrumb {
/*  padding: 20px 0;*/
/*  background: #ffffff;*/
/*  margin-top: 85px;*/
/*  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);*/
}

.breadcrumb {
  background: transparent;
  justify-content: center;
  font-size: 16px;
  font-weight: 500;
  color: #28a745;
}

/* ===========================
   Mobile Responsiveness
=========================== */
@media (max-width: 768px) {
  .widget {
    padding: 20px 15px;
    margin-top: 40px;
  }

  .widget #submit {
    width: 30%;
    margin-top: 12px;
  }

   @media (max-width: 768px) {
    .responsive-btn {
      margin-top: 12px !important; /* Adjust as needed */
      width: 30% !important;       /* Optional for better mobile width */
    }
  }

  .breadcrumb {
    font-size: 14px;
    margin-top: 70px;
    text-align: center;
  }
}
.map-wrapper {
  max-width: 100%;
/*  padding: 20px;*/
  margin: 0 auto;
  text-align: center;
}

.map-frame {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
  height: 0;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.map-frame iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 16px;
}
.map-frame {
  position: relative;
  padding-bottom: 25%; /* Reduced height */
  height: 0;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
/* === Order List Container === */
.shopping_cart_page {
/*  padding: 50px 0;*/
  background: #f6f6f6;
  font-family: 'Segoe UI', sans-serif;
}

/* Section Title */
.heading-design-h5 {
  font-size: 26px;
  font-weight: 600;
  color: #232f3e;
  margin-bottom: 30px;
  border-left: 6px solid #FF9900;
  padding-left: 12px;
}

/* Order Card */
.order-card {
  background: #ffffff;
  border: 1px solid #d5d9d9;
  border-radius: 10px;
  margin-bottom: 30px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03);
  transition: transform 0.3s ease;
  overflow: hidden;
}

.order-card:hover {
  transform: translateY(-3px);
}

/* Header */
.order-card-header {
  background: #fafafa;
  padding: 15px 20px;
  border-bottom: 1px solid #e3e6e8;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.order-id {
  font-weight: 600;
  font-size: 15px;
  color: #111;
}

.order-total {
  color: #B12704;
  font-weight: 700;
  font-size: 16px;
}

.order-status {
  display: inline-block;
  background-color: #d5f4e6;
  color: #007600;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 20px;
  margin-left: 10px;
}

/* Invoice Button */
.invoice-btn {
  background: #ffa41c;
  color: #111;
  font-weight: 600;
  padding: 6px 14px;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.3s ease;
  margin-left: 15px;
}

.invoice-btn:hover {
  background: #f08804;
  color: #000;
}

.invoice-btn i {
  font-size: 16px;
}

/* Product List */
.order-item {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding: 18px 20px;
  border-bottom: 1px solid #eee;
}

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

.order-item img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
}

/* Product Info */
.order-info {
  flex-grow: 1;
}

.order-info p {
  margin: 2px 0;
  font-size: 14px;
  color: #333;
  line-height: 1.4;
}

.order-info p strong {
  font-size: 15px;
  color: #111;
}

.order-info span {
  font-weight: 600;
  color: #000;
}

/* Responsive Design */
@media (max-width: 768px) {
  .order-card-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .invoice-btn {
    width: 100%;
    margin-left: 0;
  }

  .order-item {
    flex-direction: column;
    align-items: flex-start;
    padding: 15px;
  }
}
/* Thumbnail Image */
.product-thumbnail {
  width: 70px;
  height: 70px;
  object-fit: contain;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #f9f9f9;
}

/* Product info text */
.product-info {
  flex: 1;
}

.product-name {
  font-size: 16px;
  font-weight: 600;
  color: #232f3e;
}

.product-info p {
  font-size: 14px;
  color: #333;
}

.product-info span {
  font-weight: 500;
  color: #000;
}
@media (max-width: 768px) {
  .order-product-box {
/*    flex-direction: column;*/
    align-items: flex-start;
    gap: 10px;
  }

  .product-thumbnail {
    width: 100%;
    max-width: 100px;
  }
}
.wishlist-page {
    background-color: #f1f3f6;
    margin-top: 78px;
  }

  .wishlist-item {
    background-color: #fff;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
    padding: 5px 20px;
/*    display: flex;*/
    flex-wrap: wrap;
    justify-content: space-between;
/*    gap: 15px;*/
    border-radius: 5px;
  }
/* Wishlist Table Styling */
.wishlist-table {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}
.wishlist-table thead {
    background-color: #f8f9fa;
}
.wishlist-table th {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
/*    padding: 12px;*/
}
.wishlist-table td {
    vertical-align: middle;
    padding: 12px;
}

/* Product Image */
.wishlist-img {
    width: 55px;
    height: 80px;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}

/* Quantity Controls */
.wishlist-qty .qty-btn {
    width: 32px;
    height: 32px;
    padding: 0;
    font-weight: bold;
}
.wishlist-qty .qty-input {
    width: 50px;
    height: 32px;
}

/* Action Buttons */
.action-btn {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Mobile Card View */
@media (max-width: 767px) {
    .wishlist-table thead {
/*        display: none;*/
    }
    .wishlist-table tr {
      /*  display: block;
        margin-bottom: 15px;*/
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 8px;
/*        padding: 12px;*/
        box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    }
    .wishlist-table td {
/*        display: flex;*/
        justify-content: space-between;
        border: none !important;
        padding: 8px 3px;
    }
    .wishlist-table td:before {
        content: attr(data-label);
        font-weight: bold;
        color: #555;
    }
    .wishlist-img {
        width: 70px;
        height: 70px;
    }
}
/* Common button style */
.action-btn {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.2s ease;
    border: none;
}

/* Add to Cart button */
.btn-add {
    background: linear-gradient(135deg, #28a745, #218838);
    color: #fff;
}
.btn-add:hover {
    background: linear-gradient(135deg, #218838, #1e7e34);
    box-shadow: 0 3px 6px rgba(40, 167, 69, 0.4);
}

/* Remove button */
.btn-remove {
    background: linear-gradient(135deg, #dc3545, #b02a37);
    color: #fff;
}
.btn-remove:hover {
    background: linear-gradient(135deg, #b02a37, #842029);
    box-shadow: 0 3px 6px rgba(220, 53, 69, 0.4);
}

/* Icon alignment */
.action-btn i {
    font-size: 16px;
}


  .wishlist-main {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
  }

  .wishlist-thumb {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border: 1px solid #ddd;
    background: #fff;
    display: block;
  }

  .product-details {
    flex: 1;
    min-width: 160px;
  }

  .product-title {
    font-size: 16px;
    font-weight: 600;
    color: #1a202c;
    margin-bottom: 4px;
  }

  .subtitle-price {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
  }

  .product-desc {
    font-size: 14px;
    color: #6c757d;
    margin-bottom: 0;
  }

  .price {
    font-size: 15px;
    font-weight: 600;
    color: #28a745;
  }

  .wishlist-controls {
    display: flex;
    align-items: center;
    gap: 35px;
    flex-wrap: wrap;
    margin-top: 14px;
  }

  .quantity-wrapper {
    display: flex;
    align-items: center;
    background: #f8f9fa;
    gap: 8px;
  }

  .qty-btn {
    border: none;
    background: #e0e0e0;
    font-size: 18px;
    border-radius: 6px;
    width: 40px;
    height: 36px;
    cursor: pointer;
  }

  .qty-btn:hover {
    background-color: #d6d6d6;
  }

  .qty-input {
    width: 40px;
    text-align: center;
    border: none;
    background: transparent;
    font-size: 16px;
    margin-top: -9px;
  }

  .wishlist-actions {
    display: flex;
    align-items: center;
    gap: 35px;
  }

  .wishlist-actions button {
    width: 36px;
    height: 34px;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
  }

  .btn-success:hover {
    background-color: #fff50a;
    color: #000;
    border-color: #28a745;
  }

  @media (max-width: 768px) {
    .wishlist-item {
      flex-direction: column;
      align-items: flex-start;
      padding: 14px 20px;
    }

    .wishlist-main {
      flex-direction: row;
      width: 100%;
    }

    .wishlist-thumb {
      margin: 0;
    }

    .product-details {
      margin-left: 10px;
      text-align: left;
    }

    .wishlist-controls {
      justify-content: space-between;
      width: 100%;
    }

    .wishlist-actions {
      justify-content: flex-start;
      gap: 10px;
    }
  }
   /* Common action buttons */
.action-btn {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

/* Colors */
.btn-add { background: #28a745; color: #fff; }
.btn-view { background: #28a745; color: #fff; }
.btn-remove { background: #dc3545; color: #fff; }

/* Mobile adjustments */
@media (max-width: 767px) {
    .wishlist-actions .action-btn {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }
    .wishlist-actions .d-flex {
        gap: 4px;
    }
}
 .alert-popup {
    position: fixed;
    top: 120px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
    padding: 12px 20px;
    border-radius: 8px;
    z-index: 9999;
    font-weight: bold;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    animation: fadeOut 0.5s ease-in-out 4.5s forwards;
  }

  @keyframes fadeOut {
    to {
      opacity: 0;
      transform: translateX(-50%) translateY(-20px);
      visibility: hidden;
    }
  }

  .action-buttons {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-top: 10px;
  }

  .action-buttons a, .action-buttons button {
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    min-width: 100px;
  }

  .action-buttons a:hover, .action-buttons button:hover {
    transform: scale(1.05);
  }

  @media (max-width: 576px) {
    .action-buttons {
/*      flex-direction: column;*/
      margin-left: 0;
    }
  }

  .order-product-box img {
    border-radius: 8px;
    border: 1px solid #ddd;
  }

  .product-info {
    flex: 1;
  }
  /* Tablet (<= 768px) */
  @media (max-width: 768px) {
    .action-buttons {
       flex-direction: column;
        margin-left: 192px;
        align-items: flex-start;
        flex-direction: column;
        margin-top: -77px;

    }
  }


  .order-product-box img {
    border-radius: 8px;
    border: 1px solid #ddd;
  }

  .product-info {
    flex: 1;
  }
  .dropdown-menu {
    min-width: 240px;
    border-radius: 16px;
    padding: 10px 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(0, 0, 0, 0.08);
    font-family: 'Segoe UI', sans-serif;
    animation: slideFadeIn 0.4s ease forwards;
    opacity: 0;
    transform: translateY(-20px);
    overflow: hidden;
  }

  @keyframes slideFadeIn {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .dropdown-menu-end {
    right: 0;
    left: auto;
  }

  .dropdown-menu li {
    list-style: none;
  }

  .dropdown-menu li a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 24px;
    color: #222;
    text-decoration: none;
    font-size: 15.5px;
    font-weight: 500;
    position: relative;
    overflow: hidden;
    border-left: 4px solid transparent;
    transition: background 0.3s ease, color 0.3s ease, border-left 0.3s ease;
  }

  /* Animated border light sweep */
  .dropdown-menu li a::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 200%;
    height: 100%;
    background: linear-gradient(to right, transparent 30%, rgba(0, 123, 255, 0.08), transparent 70%);
    transition: left 0.3s ease;
  }

  .dropdown-menu li a:hover::before {
    left: 0;
  }

  .dropdown-menu li a::after {
    content: '';
    position: absolute;
    right: 20px;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ccc;
    transform: translateY(-50%);
    opacity: 0;
    transition: 0.3s ease;
  }

  .dropdown-menu li a:hover {
    background: linear-gradient(to right, #edf3ff, #e2eaff);
    color: #007BFF;
    border-left: 4px solid #007BFF;
    border-radius: 10px;
  }

  .dropdown-menu li a:hover::after {
    background-color: #007BFF;
    opacity: 1;
  }

  /* Icon Styling with animation */
  .dropdown-menu li a i {
    font-size: 18px;
    color: #666;
    transform: scale(0.95);
    opacity: 0.8;
    transition: all 0.25s ease;
  }

  .dropdown-menu li a:hover i {
    color: #007BFF;
    transform: scale(1.15);
    opacity: 1;
  }
  .modal-backdrop {
  background: transparent !important;  /* no black overlay */
}
/* Tablet & smaller devices (<= 991px width) */
/*@media (max-width: 991px) {
    .ps-header {
        margin-top: 0 !important;
    }
}
*/
/* Tablet (max 991px width) */
@media (max-width: 991px) {
    .search-bar {
        width: 100%;              /* responsive width */
        max-width: 500px;         /* tablet friendly */
        margin: 10px auto;        /* center align */
        margin-left: 10px !important;
    }
}

/* Tablet (991px tak) */
@media (max-width: 991px) {
    .right-icons {
        margin-left: 560px;
        justify-content: center;
    }
}
@media (max-width: 991px) {
    .ps-header .ps-header__middle .container {
        flex-direction: column;   /* upar niche elements aa jayein */
        align-items: center;      /* center align sab kuch */
        justify-content: center;
    }
}
 @media (max-width: 991px) {
    .ps-section--banner {
        min-height: 280px; /* thoda chhota kar diya */
        margin-top: 119px;  /* tablet ke liye adjust */
    }
}
@media (max-width: 991px) {
    .category-heading {
        margin-top: -15px;
    }
}
/* Sirf Tablet ke liye (768px – 991px) */
@media (max-width: 991px) {
    .banner-dots {
        top: 90%;
    }
}
/* Sirf Tablet ke liye (768px – 991px) */
@media (max-width: 991px) {
    .ps-categogy,
    .ps-page {
        margin-top: 119px;
    }
}
@media (max-width: 991px) {
    .custom-banner {
        margin-top: 0;
    }
}
@media (max-width: 576px) {
    .custom-banner {
        margin-top: -120px;
    }
}

/*@media (max-width: 991px) {
    .ps-home--13 .ps-section--banner .ps-banner__imagebg{
        width: 100%;
        object-fit: unset;
        object-fit: unset;
        height: 80%;
    }
}*/
@media (max-width: 991px) {
  .custom-logo-img {
    width: 340px;
    height: 200px;
    object-fit: contain;
    transition: transform 0.3s ease;
    margin-left: -44px;
  }
}
@media (max-width: 991px) {
  .submenu {
    display: flex;
    position: absolute;
    left: 48px;
    top: 88%;
    background: #efb13e;
    z-index: 999;
    border-radius: 3px;
    padding: 10px 0;
    width: 785px;
    justify-content: flex-start;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(25, 135, 84, 0.5);
  }
}
@media (max-width: 991px) {
  .submenu li {
    margin: 0;
    padding: 10px 10px;
    list-style: none;
  }
}
@media (max-width: 576px) {
    .banner-dots {
        top: 38%;
    }
}
/* Tablet screens (768px to 991px) */
@media (max-width: 991px) {
    .ps-checkout .ps-btn {
        padding: 10px 20px;
        font-size: 15px;
        width: 68%;
        text-align-last: center;
        margin-top: 12px;
        margin-left: 33%;
    }
}