@font-face {
    font-family: 'Acumin Pro';
    src: url('/fonts/Acumin-RPro.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Acumin Pro';
    src: url('/fonts/Acumin-ItPro.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Acumin Pro';
    src: url('/fonts/Acumin-BdPro.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Acumin Pro';
    src: url('/fonts/Acumin-BdItPro.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}


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

html,
body {
    overflow-x: clip;
}


:root {
    --site-font: 'Acumin Pro', sans-serif;
    --bs-body-font-family: var(--site-font);
}

html,
body {
    font-family: var(--site-font);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
span,
small,
strong,
label,
li,
th,
td,
button,
input,
select,
textarea,
optgroup,
.btn,
.form-control,
.modal-title,
.nav-link {
    font-family: var(--site-font);
}

h1 {
    font-family: var(--site-font);
}

.btn-close:focus {
    box-shadow: unset !important;
}

.home_hero_section {
    /* background-image: url("../images/home-banner-16-9-scaled.webp");
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover; */
    height: 100vh;
}

.light_text {
    color: #222;
}

.more_text {
    color: #5b5b5b;
}

.font_400 {
    font-weight: 400;
}

.font_300 {
    font-weight: 300;
}

.logo_css {
    width: 75px;
}

.link {
    color: #bd9b65;
}

.pointer {
    cursor: pointer;
}

.icon_hover {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.icon_hover svg path {
    color: black;
}

.icon_hover:hover {
    background-color: #000000;
}

.icon_hover:hover svg path,
.product-header svg path {
    fill: #fff !important;
}

.icon_hover:hover .search_btn_svg path {
    fill: currentColor !important;
}

.banner_heading {
    font-size: 28px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #000000;
}

.para {
    font-size: 18px;
    /* font-weight: 500; */
    line-height: 24px;
    color: #000000;
    width: 315px;
}

.header_content_center {
    display: flex;
    justify-content: center;
    height: 80vh;
    flex-direction: column;
    padding-left: 100px;
}

.main_heading {
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}

.hamburger {
    display: flex;
    flex-direction: column;
    gap: 6px;
    cursor: pointer;
    z-index: 1001;
}

.hamburger span {
    width: 22px;
    height: 1.5px;
    background: #000000;
    transition: all 0.35s ease;
    transform-origin: center;
}

/* OPEN STATE → CLOSE ICON */
.hamburger.open span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.hamburger.open span:nth-child(2) {
    opacity: 0;
}

.hamburger.open span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

.offcanvas-body .header_links {
    display: flex;
    justify-content: center;
}

.header_links ul {
    padding-left: 0;
    list-style-type: none;
    text-align: center;
}

.header_links ul li {
    margin: 20px 0;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
}

.header_links ul li a {
    text-decoration: none;
    cursor: pointer;
}

.offcanvas-body .social_wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 30px;
}

.offcanvas-body .social_icons {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #f4ede3;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Slide container */
.categorySwiper .swiper-slide {
    position: relative;
    overflow: hidden;
    height: 600px;
}

/* KEY FIX */
.categorySwiper .swiper-slide img {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    left: 50%;
    transform: translateX(-50%);
    transition: transform 0.5s ease;
}

.categorySwiper .swiper-slide:hover img {
    transform: translateX(-45%);
}

.categorySwiper .swiper-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.1);
    opacity: 0;
    transition: 0.3s;
}

.categorySwiper .swiper-slide:hover::after {
    opacity: 1;
}

.slider-title {
    font-size: 25px;
    font-weight: 500;
    color: #000000;
    text-transform: uppercase;
    position: absolute;
    bottom: 10px;
    left: 15px;
    z-index: 1;
    transition: transform 0.5s ease;
}

.categorySwiper .swiper-slide:hover .slider-title {
    transform: translateY(-25px)
}

.swiper-button-prev,
.swiper-button-next {
    display: flex !important;
    background-color: white;
    width: 30px;
    height: 30px;
}

.swiper-button-prev svg,
.swiper-button-next svg {
    width: 16px;
    color: black;
}

/* LEFT ARROW */
.swiper-button-prev::before {
    transform: rotate(-135deg);
}

/* RIGHT ARROW */
.swiper-button-next::before {
    transform: rotate(45deg);
}

/* HOVER */
.swiper-button-prev:hover,
.swiper-button-next:hover {
    background: #000000;
}

.swiper-button-prev:hover svg,
.swiper-button-next:hover svg {
    color: white;
}

/* .category_listed {
    height: 100vh;
} */
.category_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top right;
    display: block;
}

.category_content {
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
}

.category_content p {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #000;
    width: 280px;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}

.redirect_btn {
    font-weight: 600;
    color: #000000;
    font-size: 15px;
    text-decoration: none;
    text-transform: uppercase;
}

.category_video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
}

.category_video video {
    width: 100%;
}

.benifits_wrapper {
    border-style: solid;
    border-width: 2px 1px 2px 1px;
    border-color: #eaeaea;
    padding: 30px 0 30px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.benifits_wrapper p {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.17em;
}

footer {
    background-color: #000000;
}

footer a,
footer,
footer h6 {
    color: white !important;
}

.footer_links a {
    text-decoration: none;
    font-size: 14px;
    color: #5d5d5d;
}

.footer_links p {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}

.footer_links ul {
    list-style-type: none;
}

.footer_links ul li {
    margin: 15px 0;
}

.contact_details .address {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}

.contact_details h6 {
    text-decoration: none;
    font-size: 14px;
    color: #5d5d5d;
    font-weight: 400;
}

.contact_details .details a {
    text-decoration: none;
    font-size: 14px;
    color: #5d5d5d;
    font-weight: 400;
}

.cart-dropdown {
    position: absolute;
    left: -85px;
    top: 100%;
    width: 200px;
    /* border-radius: 0 0 16px 16px; */
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.35s ease;
    /* background: linear-gradient(135deg, #e4d5c3, #c2af8b); */
    background: #000000;
}

.heade_nav_wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    margin-bottom: 0;
}

.login_form .form-control {
    padding: 15px 10px;
    font-size: 14px;
    line-height: 1;
    background-clip: padding-box;
    border: 1px solid #000;
    border-radius: 0px;
}

.login_form ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.login_form ul li {
    padding: 1px 10px;
}

.login_form ul li a {
    text-decoration: none;
    font-size: 14px;
    color: #ffffff;
}

.navLink_wrapper ul {
    list-style: none;
    padding-left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    margin-bottom: 0;
}

.navLink_wrapper ul li a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    color: #000000;
    font-weight: 500;
}

.navLink_wrapper ul li a:hover,
.login_form ul li a:hover,
.header_links ul li a:hover {
    text-decoration: none;
    font-weight: 600;
}

.navLink_wrapper ul li a.nav-active {
    color: #000;
    font-weight: 600;
    border-bottom: 2px solid #000;
    padding-bottom: 3px;
}

/* The "Shop" item has no href, so it still needs to look clickable. */
.navLink_wrapper ul li.cart-dropdown-wrapper>a {
    cursor: pointer;
}

.form-control:focus {
    box-shadow: unset;
}

.form_wrapper {
    margin: 15px 0;
}

.form_wrapper label {
    margin-bottom: 10px;
}

.submit_btn {
    background-color: #fff !important;
    color: #000 !important;
    width: max-content;
    padding: 10px 25px;
}

.cart-dropdown-wrapper:hover .search-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.search-dropdown {
    position: absolute;
    left: calc(100% - 450px);
    top: 100%;
    width: 450px;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.35s ease;
    background: #000000;
}

.search_wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.search_wrapper .form-control {
    padding: 15px 15px;
    font-size: 14px;
    line-height: 1;
    border-radius: 0;
}

.product_heading {
    position: absolute;
    bottom: 25px;
    left: 25px;
    color: #000000;
    font-size: clamp(20px, 20vw, 55px);
    font-weight: 600;
    /* font-family: aldhabi !important; */
}

.filter_section {
    border: 1px solid #000;
    border-radius: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    padding: 7px 15px;
    cursor: pointer;
}

.product_item_title {
    font-size: 16px;
    font-weight: 500;
    color: #222;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}

.product_item_price {
    font-size: 18px;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
}

/* ---- WISHLIST HEART ----
   The solid red heart means one thing only: this product IS in the wishlist.
   Hover used to force the exact same red, filled glyph, so straight after
   clicking "remove" the pointer was still sitting on the button and the
   heart looked completely unchanged - and on touch devices that hover state
   sticks until the page is reloaded, which is why it seemed to need a
   refresh. Hover now only nudges the icon; the colour is state, not hover. */
.wishlist:hover,
.wishlist.active {
    background-color: #ffffff !important;
}

.wishlist:hover i {
    transform: scale(1.12);
}

.wishlist.active i {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    color: #e11d48 !important;
    transform: scale(1.12);
}

.search_btn_svg path,
#rangeMin,
#rangeMax {
    color: #fff !important;
}

.filter_wrapper {
    position: absolute;
    top: 102%;
    width: 500px;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.35s ease;
    background: #000000;
    left: 0;
}

.sortby_wrapper {
    position: absolute;
    top: 100%;
    left: 0% !important;
    width: 100% !important;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.35s ease;
    left: 0;
    padding: 0 !important;
}

.filter_label {
    font-size: 16px;
    color: #fff;
}

.filter_check {
    max-height: 250px;
    overflow-y: scroll;
}

.form-check-input {
    border-radius: 0px;
}

.form-check-input:focus {
    border-color: unset;
    box-shadow: unset;
}

.form-check-input:checked {
    background-color: #000000;
    border-color: #ffffff;
}

.range-slider {
    position: relative;
    height: 35px;
}

/* The two range inputs are stacked on top of each other. The track is drawn by
   ::before, the highlighted portion by .range-fill. Inputs get a transparent
   track and pointer-events:none so only the thumbs are grabbable. */
.range-slider input[type="range"] {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    height: 6px;
    margin: 0;
    padding: 0;
    background: transparent;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
    z-index: 3;
}

/* Hide the native track so our custom track/fill shows through */
.range-slider input[type="range"]::-webkit-slider-runnable-track {
    background: transparent;
    border: none;
    height: 6px;
}

.range-slider input[type="range"]::-moz-range-track {
    background: transparent;
    border: none;
    height: 6px;
}

/* WebKit thumb — white with a dark ring so it stays visible on the white fill */
.range-slider input[type="range"]::-webkit-slider-thumb {
    pointer-events: auto;
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    margin-top: -6px;
    /* centre the 18px thumb on the 6px track */
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #1c1c1c;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    cursor: pointer;
}

/* Firefox thumb */
.range-slider input[type="range"]::-moz-range-thumb {
    pointer-events: auto;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #1c1c1c;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    cursor: pointer;
}

.range-slider::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 4px;
    background: #e5d3c6;
    transform: translateY(-50%);
    border-radius: 5px;
    z-index: 1;
}

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

.sortby_wrapper .sort_list {
    font-size: 13px;
    background-color: #000000;
    text-transform: capitalize;
    padding: 10px 15px;
    color: #ffffff;
}

.sortby_wrapper .sort_list:hover {
    background-color: #ffffff;
    color: #000;
}

.sortby_wrapper .sort_list svg path {
    stroke: #9b9b9b !important;
}

.product-gallery {
    display: flex;
}

.product-gallery .thumbSwiper .swiper-slide {
    width: 75px !important;
    margin-bottom: 10px;
    height: 100px !important;
}

.thumbSwiper {
    width: 90px;
    height: 520px;
}

.thumbSwiper img {
    width: 100%;
    cursor: pointer;
    border: 1px solid #ddd;
}

.mainSwiper {
    width: 70%;
    height: 100%;
    overflow: hidden;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.mainSwiper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* MAGNIFIER */
.zoom-container {
    position: relative;
    overflow: hidden;
    height: 100%;
}

.zoom-img {
    transition: transform 0.2s ease;
    transform-origin: center center;
}

.product_details_custom {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.product_details_title {
    font-size: 18px;
    color: #352424;
    text-transform: uppercase;
    margin-bottom: 25px;
    line-height: 1.5;
}

.product_detail_price {
    margin-bottom: 25px;
    font-size: 27px;
    color: #000000;
    font-weight: 600;
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
}

/* Original price shown with a strike-through when a product is on sale */
.product_detail_price .price-original {
    color: #9b9b9b;
    font-weight: 400;
    font-size: 20px;
    text-decoration: line-through;
}

/* Discounted / sale price highlighted */
.product_detail_price .price-sale {
    color: #000000;
    font-weight: 600;
}

/* Small "save X%" badge next to the price */
.product_detail_price .price-badge {
    font-size: 13px;
    font-weight: 500;
    color: #b12704;
    background: #fbecea;
    padding: 2px 8px;
    border-radius: 4px;
    text-decoration: none;
}

.product_details_custom label {
    font-size: 14px;
    letter-spacing: 1px;
    width: 55px;
}

.product_details_custom .button {
    box-shadow: 0 0 1px;
    padding: 5px 12px;
    font-size: 14px;
    cursor: pointer;
    margin-left: 0 !important;
}

.product_details_custom .button.active {
    box-shadow: 0 0 0 1px #000000;
    color: #000000;
}

.size_btn {
    border: 1px solid #dfcfcf !important;
    color: #6e6d6c !important;
    padding: 6px 14px !important;
    font-size: 16px !important;
    border-radius: 0 !important;
    cursor: pointer;
    white-space: nowrap;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.6),
        0 1px 2px rgba(0, 0, 0, 0.15);
}

.product-info-accordian .accordion-button {
    padding: 12px 0;
}

/* Add + icon */
.product-info-accordian .accordion-button::after {
    /* content: "+"; */
    font-size: 20px;
    margin-right: 10px;
    background-image: none;
    transform: none;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f067";
}

/* When open → change to - */
.product-info-accordian .accordion-button:not(.collapsed)::after {
    content: "\f068";
}

.customise_btn {
    text-transform: uppercase;
    font-size: 13px;
    color: #fff;
    background-color: #713e28;
}

.product_details_para {
    font-size: 13px;
    color: #222;
}

.addtocart_wrapper {
    border: 1px solid #000000;
    width: max-content;
}

.count_controll_btn {
    outline: 0;
    border: unset;
    background-color: unset;
    padding: 0px 15px;
    font-size: 20px;
    color: #222;
}

.addtocart_btn button {
    font-size: 18px;
    background-color: #713e28;
    text-transform: uppercase;
    color: #fff;
    text-wrap-mode: nowrap;
}

.buttons_wrapper {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
}

.accordian_wrapper .accordion-button {
    font-size: 16px !important;
    text-transform: uppercase !important;
    color: #595959 !important;
    background-color: unset !important;
}

.accordian_wrapper .accordion-button:hover {
    color: #222 !important;
}

.accordian_wrapper .accordion-header {
    border: unset;
    background-color: unset !important;
}

.accordian_wrapper .accordion-item {
    background-color: unset !important;
    border: unset;
}

.accordion-button:focus {
    box-shadow: unset !important;
}

.accordian_wrapper .accordion-body {
    font-size: 14px !important;
    color: #5b5b5b !important;
}

.accordion-button:not(.collapsed) {
    box-shadow: unset !important;
}

.review_wrapper .accordion-button {
    font-size: 18px !important;
    text-transform: uppercase !important;
    color: #595959 !important;
    background-color: unset !important;
}

.review_wrapper .accordion-button:hover {
    color: #222 !important;
}

.review_wrapper .accordion-header {
    border: unset;
    background-color: unset !important;
}

.review_wrapper .accordion-item {
    background-color: unset !important;
    border: unset;
}

.review_wrapper .accordion-body {
    font-size: 14px !important;
    color: #5b5b5b !important;
}

.review_container {
    padding: 30px 0;
}

.review_heading {
    font-size: 18px;
}

.select_input {
    border: unset !important;
    padding: 10px;
}

.review_inputs {
    gap: 5px;
    margin-bottom: 25px;
}

.select_input:focus,
.select_input:focus-visible {
    border: unset !important;
    box-shadow: unset !important;
}

.review_inputs textarea {
    border: unset;
    outline: none;
    height: 120px;
}

.review_inputs input[type="text"],
.review_inputs input[type="email"] {
    border: unset;
    outline: none;
    padding: 13px;
}

.form_submit_btn[type="submit"] {
    width: max-content;
    padding: 10px 50px;
    outline: none;
    border: unset;
}

.form_submit_btn:hover {
    background-color: #222 !important;
    color: #fff !important;
}

.sigle_product_category {
    width: 94%;
    margin: 0 auto;
}

.nav-tabs {
    justify-content: space-between;
    border: unset;
}

.nav-tabs .nav-link {
    font-size: 30px !important;
    font-weight: 400 !important;
    color: #000000 !important;
    background-color: unset;
    border: unset;
    padding: 5px 8px;
}

.nav-tabs .nav-link.active {
    background-color: unset;
    font-weight: 600 !important;
    color: #222 !important;
}

.modal-header {
    border: unset !important;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 32px;
}

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

.modal-content {
    border-radius: unset !important;
}

.custom_inputs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 15px;
}

.custom_form h3 {
    font-size: 18px;
    font-weight: 600;
    color: #222;
}

.custom_inputs label {
    font-size: 14px;
    font-weight: 600;
    color: #222;
}

.custom_inputs input[type="text"] {
    width: 90%;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 10px 12px;
}

.custom_inputs textarea {
    width: 90%;
    border: 1px solid #ddd;
    border-radius: 10px;
    height: 80px;
    padding: 10px 12px;
}

.custom_inputs input[type="text"]:focus-visible {
    border: 1px solid #ddd;
    transition:
        box-shadow 0.15s ease,
        border-color 0.15s ease;
    outline: none;
}

.custom_inputs_btn .done_btn {
    padding: 2px 10px;
    border-radius: unset;
    background-color: #6f3e24;
    border: unset;
    color: #fff;
    width: max-content;
    font-size: 14px;
    border-radius: unset;
}

.custom_inputs_btn .reset_btn {
    padding: 2px 10px;
    border-radius: unset;
    background-color: rgba(111, 62, 36, 50%);
    border: unset;
    color: #fff;
    width: max-content;
    font-size: 14px;
    border-radius: unset;
}

.add_toCart_canvas_close {
    width: 35px;
    height: 35px;
    border: 1px solid #ddd;
    border-radius: 50%;
    background-color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
}

.offcanvas {
    width: 450px !important;
}

.cart_list_main {
    max-height: 295px;
    overflow-y: auto;
}

.cart_wrapper h3 {
    font-size: 24px;
    color: #222;
    margin-bottom: 35px;
}

.cart_list_wrapper {
    display: flex;
    justify-content: flex-start;
    gap: 15px;
    margin-bottom: 18px;
}

.cart_list_wrapper {
    width: 100%;
}

.cart_list_wrapper img {
    max-width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart_img {
    width: 100%;
    max-width: 90px;
}

.cart_details {
    width: calc(100% - 100px);
}

.cart_details p {
    margin-bottom: 0;
    color: #5b5b5b;
    line-height: 18px;
}

.cart_title {
    color: #000 !important;
}

.cart_title,
.cart_price {
    font-size: 16px;
    margin-bottom: 5px !important;
    font-weight: 600;
}

.cart_color,
.cart_size,
.cart_length {
    font-size: 13px;
}

.cart_list_main::-webkit-scrollbar {
    display: none !important;
}

/* Track */
.cart_list_main::-webkit-scrollbar-track {
    display: none !important;
}

/* Handle */
.cart_list_main::-webkit-scrollbar-thumb {
    display: none !important;
}

.cart_benifits_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.cart_benifits_btn button {
    background-color: transparent;
    border: unset;
    outline: none;
    color: #000000;
    padding: 0 20px;
    border: unset;
    font-size: 14px;
    border-right: 1px solid #bd9b65;
}

.cart_benifits_btn button:last-child {
    border-right: unset;
}

.cart_benifits_btn button:hover {
    color: #bd9b65;
}

.cart_totals_details {
    padding: 25px 0;
}

.cart_totals_row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.cart_totals_row span {
    font-size: 16px;
    font-weight: 600;
    color: #000000;
}

.cart_totals_btns {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.cart_totals_btns button.cart_buy_now {
    background-color: #000000;
    color: #ffffff;
    border: 1px solid #000000;
}

.cart_totals_btns button {
    background-color: transparent;
    color: #000000;
    border: 1px solid #000000;
    padding: 10px 20px;
}

.cart_totals_btns a.cart_view_btn:hover {
    background-color: #bd9b65;
    color: #fff;
    border: 1px solid #bd9b65;
}

/* ======================================================= */

.login_heading_wrapper h1 {
    font-size: 46px;
    text-align: center;
    color: #000;
    border-bottom: 1px solid black;
    font-weight: 300;
    font-family: var(--site-font) !important;
    padding-bottom: 50px;
    margin: 0 30px;
}

.eye-open {
    display: none;
}

.lost_password_link {
    display: block;
    margin-top: 15px;
    font-size: 14px;
    color: #000000;
    transition: all 0.2s ease;
}

.lost_password_link:hover {
    font-weight: 600;
}

/* ===================================================================
   SHOP MEGA MENU (desktop, >=1200px)
   Dark panel to match the other header dropdowns, and every main
   category shows its sub-categories straight underneath its own title,
   so nothing is hidden behind a second hover step.
   =================================================================== */
.mega_menu_wrapper {
    position: fixed;
    /* 👈 key for end-to-end */
    left: 0;
    right: 0;
    top: 120px;
    /* height of your header */
    width: 100%;
    background: #000000;
    color: #ffffff;
    z-index: 9999;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
}

.sticky-active .mega_menu_wrapper
{
    top: 95px;
}

/* show first level */
.cart-dropdown-wrapper:hover .mega_menu_wrapper {
    display: block;
}

/* ===== LEFT LIST =====
   One column per main category. auto-fill keeps the columns evenly
   spaced whether there are two categories or eight. */
.mega_menu_columns {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 10px 24px;
    align-items: start;
}

.cat-item {
    width: 100%;
    padding: 5px 0;
    color: #ffffff;
    font-size: 12px;
    display: block;
}

/* Main category title */
.cat_title {
    display: inline-block;
    padding-bottom: 6px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom: 1px solid transparent;
    transition: color 0.2s ease, border-color 0.2s ease;
}

/* The sub-category list is part of the normal flow now, always open. */
.sub_panel {
    position: static;
    width: 100%;
    height: auto;
    background: transparent;
    padding: 6px 0 0;
    display: block;
}

/* The main category the visitor is currently browsing */
.cat-item.active .cat_title {
    color: #bd9b65;
    border-bottom-color: #bd9b65;
}

/* links side */
.sub_links {
    width: 100%;
}

.sub_links a {
    display: block;
    padding: 5px 0;
    color: #d8d8d8 !important;
    text-decoration: none;
    text-transform: unset !important;
    font-size: 14px !important;
    transition: all 0.2s ease;
}

.mega_menu_wrapper .cat-item {
    font-size: 14px;
}

.sub_links a:hover {
    color: #bd9b65 !important;
    transform: translateX(3px);
}

/* The exact category page that is open right now */
.sub_links a.active {
    color: #bd9b65 !important;
    font-weight: 600;
}

/* Product tiles on the right sit on the same dark panel */
.mega_menu_wrapper .product_item_title,
.mega_menu_wrapper .sub_images a {
    color: #ffffff !important;
}

/* image side */
.sub_images {
    width: 75%;
    display: flex;
    gap: 15px;
    margin-left: auto;
}

.img_box {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.my_account_links_wrapper {
    background-color: #f7f7f7;
}

.my_account_links_wrapper ul {
    list-style: none;
    padding-left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.my_account_links_wrapper ul li {
    color: #222;
    font-size: 14px;
    padding: 15px 30px;
}

.my_account_links_wrapper ul li:hover {
    background-color: #000000;
    color: white;
}

.my_account_links_wrapper ul li.active {
    background-color: #000000;
    color: #fff;
}

.my_account_links_wrapper ul li.active a {
    color: #fff;
}

.my_account_links_wrapper ul li a {
    text-decoration: none;
    color: #222;
}

.my_account_links_wrapper ul li:hover a {
    color: #fff;
    text-decoration: none;
}

.dashboard_paras {
    padding: 50px 0;
}

.dashboard_paras p {
    font-size: 16px;
    margin-bottom: 30px;
    color: #5b5b5b;
}

.dashboard_my_orders_wrapper {
    padding: 50px 0;
}

.dashboard_my_orders_wrapper tr th {
    font-size: 14px;
    color: #222;
    font-weight: normal !important;
    padding: 20px;
}

.dashboard_my_orders_wrapper tr td {
    padding: 20px;
    font-size: 14px;
    color: #222;
    font-weight: normal !important;
    vertical-align: middle;
}

button.common {
    width: max-content;
    padding: 10px 25px;
    border-radius: unset;
}

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

.wishlist_product_wrapper img {
    width: 100px;
    max-width: 100px;
    width: 100px;
    height: 150px;
    max-width: 100px;
    object-fit: contain;
}

.wishlist_product_wrapper p {
    color: #222;
}

.wishlist_modal {
    display: flex;
}

.wishlist_action_btn {
    width: 25%;
}

.wishlist_modal label {
    font-size: 14px;
    letter-spacing: 1px;
}

.wishlist_modal .button {
    box-shadow: 0 0 1px;
    padding: 5px 12px;
    font-size: 14px;
    cursor: pointer;
}

.wishlist_modal .button.active {
    box-shadow: 0 0 0 1px #bd9b65;
    color: #bd9b65;
}

.anchor_btn {
    text-decoration: none;
    color: #222;
    border: 1px solid #222;
    padding: 10px 20px;
    display: inline-block;
    border-radius: unset;
}

.anchor_btn:hover {
    border: 1px solid #222;
}

.address_wrapper p {
    color: #5b5b5b;
    font-size: 14px;
    margin: 5px;
    letter-spacing: 0;
    /* font-family: proxima_nova_regular !important; */
}

.address_wrapper .edit_address {
    color: #5b5b5b;
    font-size: 14px;
    margin: 5px;
    text-decoration: none;
    letter-spacing: 0;
    /* font-family: proxima_nova_regular !important; */
}

.address_wrapper .edit_address:hover {
    color: #bd9b65;
}

.select2 {
    width: 100% !important;
}

.select2-container--default .select2-selection--single {
    border: 1px solid #e1d4c1 !important;
    border-radius: 0 !important;
    padding: 10px !important;
}

.select2-container .select2-selection--single,
.select2-selection__arrow {
    height: 50px !important;
}

#edit-account-form .form_wrapper {
    margin: 10px 0 !important;
}

.order-status {
    background-color: yellow;
    padding: 5px;
    /* thoda spacing */
    display: inline-block;
    /* sirf text ke around highlight */
}

.highlight {
    background-color: black;
    padding: 2px 4px;
    color: white
}

.anchor__link_btn {
    text-decoration: none;
    color: #fff;
    border: 1px solid #222;
    padding: 10px 20px;
    display: inline-block;
    border-radius: unset;
}

.anchor__link_btn:hover {
    text-decoration: none;
    background-color: #bd9b65;
    color: #fff;
}

.cancel_request_wrapper {
    padding: 30px;
}

.cancel_request_wrapper h1 {
    font-size: 25px;
    color: #5b5b5b;
    font-weight: 400;
}

.cancel_request_wrapper h6 {
    font-size: 16px;
    color: #5b5b5b;
    font-weight: 600;
}

.cancel_request_wrapper p {
    font-size: 16px;
    color: #5b5b5b;
}

#cancellation_details {
    height: 160px;
    width: 100%;
    border: 1px solid #ddd;
    resize: none;
}

.checkout_sub_level p {
    font-size: 12px;
    color: #5b5b5b;
    margin-top: 5px;
}

.form-check-label {
    font-size: 14px;
    color: #ffffff;
}

.checkout_small_para {
    font-size: 12px;
    color: #5b5b5b;
}

.checkout_small_para a {
    font-size: 14px;
    color: #bd9b65;
    text-decoration: none;
}

.checkout_small_para a:hover {
    color: #bd9b65;
    text-decoration: none;
}

.form-check-input[type="checkbox"] {
    border-radius: unset !important;
}

#language_change_option {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10;
}

#language_change_option select {
    width: 100px;
    padding: 4px 5px;
    outline: none;
    border: none;
    background-color: #000000;
    color: white;
}

.cart_total_warpper {
    border: 1px solid #EAEAEA;
    padding: 30px;
}

#cart_product_img {
    width: 70px;
}

.cart_total_warpper p {
    font-size: 14px !important;
    color: #222 !important;
}

.cart_total_warpper h3 {
    font-size: 20px !important;
    color: #222 !important;
    margin-bottom: 30px;
}

.btn-dark {
    background-color: #000 !important;
    color: #fff !important;
}

.btn-dark:hover {
    background-color: #424649 !important;
}

input[type="checkbox"] {
    accent-color: #000000;
}

.product-main {
    width: 100%;
}

.table-responsive {
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: #555 transparent;
}

@media (max-width: 1300px) {
    .product_heading {
        font-size: 50px;
    }
}

@media (max-width:1200px) {
    .product-thumbs {
        max-height: 585px;
    }

    .accordian_wrapper .accordion-button {
        font-size: 14px !important;
    }

    .addtocart_btn button,
    .product-info-accordian .accordion-button::after {
        font-size: 16px;
    }
}

@media (max-width: 1024px) {
    .categorySwiper .swiper-slide {
        height: 450px;
    }
}

@media (max-width:992px) {

    .category_listed,
    .category_img img {
        height: 100%;
    }

    .footer_links ul li {
        margin: 3px 0;
    }

    .filter_check {
        display: flex;
        gap: 0px 20px;
        flex-wrap: wrap;
    }
}

@media (max-width: 768px) {
    .categorySwiper .swiper-slide {
        height: 400px;
    }

    .search-dropdown {
        width: 350px;
        left: calc(100% - 350px);
    }

    .filter_wrapper {
        width: 350px;
        left: 0;
    }

    .accordion-button {
        font-size: 16px;
    }
}

@media (max-width:575px) {
    .filter_wrapper {
        width: 300px;
    }

    .product_heading {
        font-size: 30px;
    }

    .header_content_center {
        justify-content: end;
        padding-left: 50px;
    }

    .product-thumbs {
        min-width: 65px;
    }

    p,
    .accordion-button {
        font-size: 14px;
    }

    .theme-btn {
        font-size: 16px;
    }

    .categorySwiper .swiper-slide {
        height: 350px;
    }

    .home_hero_section , .hero-video-bg
    {
        height: 64vh;
    }

    .discount-badge , .product-badge
    {
        font-size: 12px;
    }

    .discount-badge
    {
        width: 40px;
        height: 40px;
    }

    .product-badge
    {
        padding: 0 10px;
    }

    .header_content_center {
        height: 52vh;
    }

    .product_detail_price
    {
        font-size: 22px;
    }

    .product_detail_price .price-original
    {
        font-size: 18px;
    }

    .products.product_detail_price , .products.product_detail_price .price-original
    {
        font-size: 14px !important;
    }

    .products.product_detail_price .price-badge
    {
        font-size: 11px !important;
    }

    .products.product_detail_price
    {
        gap: 8px !important;
    }

}

@media (max-width:480px) {
    .header_content_center {
        padding-left: 50px;
    }

    .wishlist i {
        font-size: 16px;
    }

    .offcanvas {
        width: 80% !important;
    }

    .product-info,
    .product_item_title,
    .product_item_price,
    .para {
        font-size: 12px !important;
    }

    .wishlist {
        width: 30px;
        height: 30px;
    }

    .filter_section {
        padding: 2px 7px;
    }

    #sortProducts {
        padding: 3px;
    }

    .product-thumbs {
        max-height: 350px;
    }

    /* .banner_heading
    {
        font-size: 22px;
    } */

    .search-dropdown {
        width: 280px;
        left: calc(100% - 280px);
    }

    .filter_wrapper {
        width: 280px;
        left: 0;
    }

    .search_wrapper .form-control {
        padding: 8px 15px;
    }
}

@media (max-width:375px) {
    .header_content_center {
        padding-left: 30px;
    }

    .para {
        font-size: 14px;
        width: 250px;
    }

    .icon_hover {
        width: 30px;
        height: 30px;
    }

    .icon_hover svg {
        width: 18px
    }

    .filter_wrapper {
        width: 250px;
    }

    .product-thumbs {
        max-height: 300px;
    }

    .logo_css {
        width: 55px;
    }

    .search-dropdown {
        width: 220px;
        left: calc(100% - 220px);
    }

    .filter_wrapper {
        width: 250px;
        left: 0;
    }
}

.offcanvas-backdrop {
    position: fixed !important;
}

/* ===================================================================
   MOBILE MEGA MENU (inside offcanvas) — accordion style shop menu
   Desktop (>=1200px) mega menu remains hover-based and untouched above.
   =================================================================== */

.mobile-shop-item {
    text-align: left;
}

.mobile-shop-item * {
    text-align: left;
}

.mobile-shop-toggle,
.mobile-cat-toggle {
    text-decoration: none;
    cursor: pointer;
    padding: 8px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    width: 100%;
}

.mobile-toggle-icon {
    font-size: 18px;
    font-weight: 400;
    transition: transform 0.3s ease;
    line-height: 1;
    flex-shrink: 0;
    margin-left: 10px;
}

.mobile-shop-item.open>.mobile-shop-toggle .mobile-toggle-icon,
.mobile-cat-item.open>.mobile-cat-toggle .mobile-toggle-icon {
    transform: rotate(45deg);
}

.mobile-shop-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    padding-left: 10px;
}

.mobile-shop-item.open>.mobile-shop-submenu {
    max-height: max-content;
}

.mobile-cat-item {
    border-bottom: 1px solid #eee;
}

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

.mobile-cat-toggle {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 10px 0;
}

.mobile-cat-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    padding-left: 12px;
}

/* FIX: same reasoning as above — always show the category's full
   link-list (no clipped/hidden items) whenever that category is open. */
.mobile-cat-item.open>.mobile-cat-submenu {
    max-height: max-content;
}

.mobile-cat-submenu a {
    display: block;
    padding: 6px 0;
    font-size: 13px;
    color: #5b5b5b;
    text-decoration: none;
    text-transform: none;
    text-align: center;
}

.mobile-cat-submenu a:hover {
    color: #bd9b65;
}

/* offcanvas body needs to scroll once mega menu content expands */
.offcanvas-body {
    overflow-y: auto;
}

/* Hide desktop mega menu entirely below xl to avoid any leftover
   hover-triggered rendering / stacking issues on touch devices */
@media (max-width: 1199.98px) {
    .navLink_wrapper.d-xl-block {
        display: none !important;
    }

    .mega_menu_wrapper {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .offcanvas {
        width: 90% !important;
    }
}

.top-announcement-bar {
    width: 100%;
    background: #000000;
    color: #ffffff;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    z-index: 100;
}

.top-announcement-bar .announcement-track {
    display: inline-flex;
    width: max-content;
    animation: announcement-scroll 28s linear infinite;
}

.top-announcement-bar .announcement-group {
    display: inline-flex;
    align-items: center;
}

.top-announcement-bar .announcement-item {
    display: inline-flex;
    align-items: center;
    padding: 9px 34px;
    font-size: 13px;
    letter-spacing: 0.4px;
    font-weight: 400;
}

.top-announcement-bar .announcement-item b {
    font-weight: 700;
    margin-left: 4px;
    color: #e5c98f;
}

/* Pause the slide when the user hovers so they can read it */
.top-announcement-bar:hover .announcement-track {
    animation-play-state: paused;
}

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

    100% {
        transform: translateX(-50%);
    }
}

@media (max-width: 768px) {
    .top-announcement-bar .announcement-item {
        padding: 8px 22px;
        font-size: 12px;
    }

    .top-announcement-bar .announcement-track {
        animation-duration: 20s;
    }
}

/* ------------------------------------------------------------------
   2) WELCOME POPUP — enhanced look with hero image
   (base styles live in main.css; these refine + add image support)
   ------------------------------------------------------------------ */
.welcome-popup {
    padding: 0 !important;
    max-width: 440px !important;
    overflow: hidden;
    border-radius: 16px !important;
    background: #fffaf2 !important;
}

.welcome-popup .welcome-image {
    width: 100%;
    height: 230px;
    object-fit: cover;
    display: block;
}

.welcome-popup .welcome-body {
    padding: 26px 30px 34px;
}

.welcome-popup .welcome-title {
    font-size: 26px;
    margin-bottom: 10px;
    font-weight: 700;
    color: var(--primary-color);
    font-family: var(--site-font);
}

.welcome-popup .welcome-text {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 22px;
    color: #5b4a30;
}

.welcome-popup .welcome-btn {
    background: var(--primary-color);
    color: #fff;
    border: none;
    padding: 13px 34px;
    border-radius: 30px;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.2s ease;
}

.welcome-popup .welcome-btn:hover {
    background: #3f2900;
    transform: translateY(-2px);
}

/* Close button — circular, always visible over the image */
.welcome-popup .welcome-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-radius: 50%;
    font-size: 24px;
    line-height: 1;
    color: #000;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: background 0.25s ease, transform 0.25s ease;
    z-index: 2;
}

.welcome-popup .welcome-close:hover {
    background: #000;
    color: #fff;
    transform: rotate(90deg);
}

@media (max-width: 480px) {
    .welcome-popup .welcome-image {
        height: 180px;
    }

    .welcome-popup .welcome-body {
        padding: 22px 22px 28px;
    }

    .welcome-popup .welcome-title {
        font-size: 22px;
    }

    .product_details_title
    {
        font-size: 16px;
    }
}

/* ------------------------------------------------------------------
   3) REDESIGNED FOOTER — modern, structured, fully responsive
   ------------------------------------------------------------------ */
footer {
    background-color: #000000;
    color: #fff;
    margin-top: 40px;
}

.footer-top {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-brand .logo_css {
    max-width: 130px;
    margin-bottom: 18px;
}

.footer-brand .footer-tagline {
    font-size: 13px;
    line-height: 1.7;
    color: #b9b9b9;
    max-width: 280px;
    margin-bottom: 20px;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.footer-social a {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    color: #fff;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.footer-social a:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.footer-col .footer-heading,
.footer-brand .footer-heading {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    color: #fff;
}

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

.footer-col ul li {
    margin-bottom: 12px;
}

.footer-col ul li a {
    font-size: 14px;
    color: #b0b0b0 !important;
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
}

.footer-col ul li a:hover {
    color: #fff !important;
    padding-left: 5px;
}

.footer-contact p,
.footer-contact a {
    font-size: 14px;
    color: #b0b0b0 !important;
    text-decoration: none;
    margin-bottom: 12px;
    line-height: 1.6;
    display: block;
}

.footer-contact a:hover {
    color: #fff !important;
}

.footer-contact .footer-store-link {
    color: #e5c98f !important;
    font-weight: 500;
    margin-bottom: 16px;
}

/* Newsletter */
.footer-newsletter {
    display: flex;
    max-width: 320px;
    margin-top: 8px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 30px;
    overflow: hidden;
}

.footer-newsletter input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    padding: 11px 18px;
    color: #fff;
    font-size: 13px;
}

.footer-newsletter input::placeholder {
    color: #8a8a8a;
}

.footer-newsletter button {
    background: #fff;
    color: #000;
    border: none;
    padding: 0 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}

.footer-newsletter button:hover {
    background: #e5c98f;
}

/* Footer bottom bar */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: 24px;
}

.footer-bottom .copyright {
    font-size: 13px;
    color: #9a9a9a;
    margin: 0;
}

.footer-payments {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-payments img {
    height: 24px;
    width: 50px;
    background: #fff;
    border-radius: 4px;
    padding: 2px 4px;
}

/* Footer responsive */
@media (max-width: 992px) {
    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    .footer-brand,
    .footer-contact {
        grid-column: 1 / -1;
    }

    .footer-contact {
        text-align: center;
    }
}

@media (max-width: 576px) {
    .footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 26px 20px;
        padding-bottom: 30px;
    }

    .footer-brand,
    .footer-contact {
        grid-column: 1 / -1;
    }

    .footer-newsletter {
        max-width: 100%;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-col .footer-heading,
    .footer-brand .footer-heading {
        margin-bottom: 14px;
    }
}

/* ------------------------------------------------------------------
   4) STICKY PRODUCT GALLERY — single product page
   Gallery stays pinned while the details column scrolls (desktop only)
   ------------------------------------------------------------------ */
@media (min-width: 992px) {
    .product-gallery {
        position: sticky;
        top: 90px;
        align-self: flex-start;
        /* override Bootstrap .h-100 so the gallery keeps its natural
           height and the details column can scroll past it */
        height: auto !important;
    }

    /* Keep the main image tidy while pinned */
    /* .product-gallery .product-main {
        max-height: calc(100vh - 120px);
    } */

    .product-gallery .product-main .zoom-container,
    .product-gallery .product-main #mainProductImage {
        /* max-height: calc(100vh - 120px); */
        object-fit: cover;
    }
}

/* ------------------------------------------------------------------
   Cart: make the product name look and behave like a link
   ------------------------------------------------------------------ */
.cart-product-link {
    color: #000000;
    text-decoration: none;
    transition: color 0.2s ease;
    text-wrap-mode: nowrap;
}

.cart-product-link:hover {
    color: #7a5c46;
    text-decoration: underline;
}

/* ------------------------------------------------------------------
   Form validation messages / invalid states
   ------------------------------------------------------------------ */
.error-message,
.field-error {
    font-size: 13px;
    line-height: 1.3;
    margin-top: 4px;
    min-height: 0;
}

/* Inline message shown right under the field it belongs to. Hidden until
   the validator fills it, so an empty slot never takes up any space. */
.field-error {
    display: none;
    width: 100%;
    color: #dc3545;
}

.field-error.is-visible {
    display: block;
}

/* The field that failed gets a red outline so it is easy to spot in a
   long form, and matching focus styling so the two never fight. */
.is-invalid-field,
.form-control.is-invalid-field {
    border: 1px solid #dc3545 !important;
}

.is-invalid-field:focus,
.form-control.is-invalid-field:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.12) !important;
}

/* Checkboxes / radios only need the accent, not a full border. */
input[type="checkbox"].is-invalid-field,
input[type="radio"].is-invalid-field {
    outline: 1px solid #dc3545;
    outline-offset: 2px;
}

/* select2 and intl-tel-input render their own box over the real control. */
select.is-invalid-field+.select2-container .select2-selection {
    border: 1px solid #dc3545 !important;
}

.iti:has(.is-invalid-field) .iti__country-container {
    border-color: #dc3545;
}

.input-invalid {
    border: 1px solid #dc3545 !important;
    outline: none;
}

/* select2 (country dropdown) invalid state */
select.input-invalid+.select2-container .select2-selection {
    border: 1px solid #dc3545 !important;
}

/* Keep the min-range thumb stacked above the max-range thumb so it stays
   grabbable even when both handles sit close together. */
.range-slider #minRange {
    z-index: 5;
}

.range-slider #maxRange {
    z-index: 4;
}

/* =========================================================
   APPLY DISCOUNT COUPON  (cart page)
   ========================================================= */
.coupon_wrapper {
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
    padding: 20px 0;
    margin: 15px 0;
}

.coupon_label {
    display: block;
    font-size: 14px;
    color: #222;
    margin-bottom: 10px;
}

.coupon_form {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.coupon_input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 10px 12px;
    font-size: 14px;
    color: #222;
    border: 1px solid #e1d4c1;
    border-radius: 0;
    outline: none;
    text-transform: uppercase;
    background-color: #fff;
}

.coupon_input::placeholder {
    text-transform: none;
    color: #9a9a9a;
}

.coupon_input:focus {
    border-color: #bd9b65;
}

.coupon_input.is-invalid-coupon {
    border-color: #d13c3c;
    background-color: #fff7f7;
}

.coupon_apply_btn {
    flex: 0 0 auto;
    padding: 10px 22px;
    font-size: 14px;
    color: #fff;
    background-color: #000;
    border: 1px solid #000;
    border-radius: 0;
    cursor: pointer;
    transition: all 0.25s ease;
}

.coupon_apply_btn:hover {
    background-color: #bd9b65;
    border-color: #bd9b65;
}

/* Success / error message */
.coupon_msg {
    font-size: 13px;
    margin: 10px 0 0;
    line-height: 1.4;
}

.coupon_msg.error {
    color: #d13c3c;
}

.coupon_msg.success {
    color: #1c7c4a;
}

/* Applied coupon chip */
.applied_coupon_chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border: 1px dashed #bd9b65;
    background-color: #fdf8f1;
}

.applied_coupon_chip strong {
    font-size: 14px;
    color: #222;
    letter-spacing: 1px;
}

.applied_coupon_chip small {
    display: block;
    font-size: 12px;
    color: #5b5b5b;
    padding-left: 22px;
}

.coupon_remove {
    background: transparent;
    border: none;
    color: #5b5b5b;
    font-size: 16px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
}

.coupon_remove:hover {
    color: #d13c3c;
}

/* Discount row in totals */
.cart_discount_row p {
    color: #1c7c4a !important;
}

.discount_code_tag {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 1px;
    color: #bd9b65;
    border: 1px solid #bd9b65;
    padding: 1px 6px;
    margin-left: 5px;
    vertical-align: middle;
}

/* =========================================================
   ORDER DETAILS PAGE
   ========================================================= */
.order_details_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 25px;
}

.order_details_head p {
    font-size: 15px;
    color: #222;
}

.order_back_link {
    font-size: 14px;
    color: #222;
    text-decoration: none;
    white-space: nowrap;
}

.order_back_link:hover {
    color: #bd9b65;
}

.order_meta_strip {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 40px;
    border: 1px solid #eaeaea;
    padding: 20px 25px;
    margin-bottom: 35px;
}

.order_meta_item {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.order_meta_item span {
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #9a9a9a;
}

.order_meta_item strong {
    font-size: 15px;
    font-weight: 500;
    color: #222;
}

.order_status_badge {
    width: max-content;
    background-color: #fdf8f1;
    border: 1px solid #bd9b65;
    color: #bd9b65 !important;
    padding: 2px 10px;
    font-size: 13px !important;
}

.order_details_title {
    font-size: 20px;
    color: #222;
    margin-bottom: 15px;
}

.order_details_table thead th {
    border-bottom: 1px solid #222;
}

.order_details_table tbody td,
.order_details_table tbody th {
    padding: 20px;
    font-size: 14px;
    color: #222;
    font-weight: normal;
    vertical-align: middle;
}

.order_details_table tfoot td {
    padding: 14px 20px;
    font-size: 14px;
    color: #222;
}

.order_details_table tfoot .order_discount_row td {
    color: #1c7c4a;
}

.order_details_table tfoot .order_grand_total_row td {
    font-size: 16px;
    font-weight: 600;
    border-top: 1px solid #222;
}

.order_coupon_tag {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 1px;
    color: #bd9b65;
    border: 1px solid #bd9b65;
    padding: 1px 6px;
    margin-left: 5px;
}

.order_details_actions {
    margin-top: 30px;
}

@media (max-width: 767px) {
    .order_meta_strip {
        gap: 18px 25px;
        padding: 18px;
    }

    .coupon_form {
        flex-direction: column;
    }

    .coupon_apply_btn {
        width: 100%;
    }

    .order_details_table tbody td,
    .order_details_table tbody th,
    .order_details_table tfoot td {
        padding: 12px;
    }
}

.product-overlay 
{
    position: absolute;
    height: 100%;
    width: 100%;
    inset: 0;
    background-image: linear-gradient(to top, #000000d9 , #00000061 , transparent );
}

@media (max-width: 575px)
{
    .slider-title , .banner_heading  
    {
        font-size: 18px;
    }
    .category_content p
    {
        font-size: 13px;
        margin-bottom: 5px;
    }
    .redirect_btn 
    {
        font-size: 13px;
    }
    .filter_button.submit_btn
    {
        padding: 3px 14px;
    }
}

.products.product_detail_price 
{
    font-size: 20px;
}

.products.product_detail_price .price-original
{
    font-size: 16px;
}

/* ===================================================================
   FESTIVAL MODULE
   Header dropdown (desktop + mobile), festivals listing page,
   festival detail page and the static product colour swatch.
   All rules are namespaced with .festival- / .color-swatch- so nothing
   above is affected.
   =================================================================== */

/* ---------- Header dropdown (desktop, >=1200px) ---------- */

.festival-dropdown-wrapper {
    position: relative;
}

.festival-dropdown-wrapper>.festival-menu-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.festival-caret {
    display: inline-flex;
    align-items: center;
    transition: transform 0.3s ease;
}

.festival-dropdown-wrapper:hover .festival-caret {
    transform: rotate(180deg);
}

.festival-dropdown {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, 10px);
    min-width: 210px;
    padding: 8px 0;
    background: #000000;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.35s ease;
}

/* Invisible bridge so the menu does not close while the cursor travels
   from the link down to the dropdown. */
.festival-dropdown::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 14px;
}

.festival-dropdown-wrapper:hover .festival-dropdown,
.festival-dropdown-wrapper:focus-within .festival-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

.festival-dropdown ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    display: block;
    gap: 0;
}

.festival-dropdown ul li {
    padding: 0;
}

.navLink_wrapper .festival-dropdown ul li a {
    display: block;
    padding: 8px 18px;
    font-size: 13px;
    letter-spacing: 0.4px;
    color: #ffffff;
    text-transform: uppercase;
    white-space: nowrap;
    transition: background 0.25s ease, color 0.25s ease;
}

.navLink_wrapper .festival-dropdown ul li a:hover {
    background: #ffffff;
    color: #000000;
    font-weight: 500;
}

.festival-dropdown-all {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin-top: 6px;
    padding-top: 6px;
}

.navLink_wrapper .festival-dropdown .festival-dropdown-all a {
    font-weight: 600;
}

/* ---------- Header dropdown (mobile offcanvas) ---------- */

.mobile-festival-links {
    padding-top: 4px;
}

.mobile-festival-links a {
    display: block;
    padding: 8px 0;
    font-size: 13px;
    color: #5b5b5b;
    text-decoration: none;
    text-align: center;
    /* border-bottom: 1px solid #eee; */
}

.mobile-festival-links a:last-child {
    border-bottom: none;
    color: #000;
}

.mobile-festival-links a:hover {
    color: #bd9b65;
}

/* ---------- Festivals listing page ---------- */

.festival-listing-title {
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 600;
    color: #000;
}

.festival-listing-subtitle {
    font-size: 14px;
    color: #5b5b5b;
}

.festival-card {
    display: block;
    color: #000;
    overflow: hidden;
    background: #f7f5f2;
    height: 100%;
    transition: box-shadow 0.35s ease, transform 0.35s ease;
}

.festival-card:hover {
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10);
    transform: translateY(-4px);
}

.festival-card-img {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    background: #ece8e2;
}

.festival-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}

.festival-card:hover .festival-card-img img {
    transform: scale(1.06);
}

.festival-card-info {
    padding: 14px 12px;
    text-align: center;
}

.festival-card-name {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.festival-card-link {
    display: inline-block;
    margin-top: 4px;
    font-size: 12px;
    color: #5b5b5b;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ---------- Festival detail: banner ---------- */

.festival-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.festival-banner img {
    width: 100%;
    height: clamp(240px, 42vw, 520px);
    object-fit: cover;
    display: block;
}

.festival-banner-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0 16px 28px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0.45) 100%);
}

.festival-banner-title {
    color: #ffffff;
    font-size: clamp(28px, 6vw, 72px);
    font-weight: 600;
    letter-spacing: 1px;
    text-align: center;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

/* ---------- Festival detail: heading + read more ---------- */

.festival-about-heading {
    font-size: clamp(20px, 2.6vw, 30px);
    font-weight: 600;
    color: #000;
}

.festival-desc-wrapper {
    position: relative;
    max-height: 96px;
    /* roughly 4 lines when collapsed */
    overflow: hidden;
    transition: max-height 0.45s ease;
}

.festival-desc-wrapper.expanded {
    max-height: 2000px;
}

.festival-desc,
.festival-desc p {
    font-size: 15px;
    line-height: 1.7;
    color: #5b5b5b;
    margin-bottom: 12px;
}

.festival-desc p:last-child {
    margin-bottom: 0;
}

/* Soft fade at the bottom while the text is clipped */
.festival-desc-fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 46px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #ffffff 92%);
    transition: opacity 0.3s ease;
}

.festival-desc-wrapper.expanded .festival-desc-fade {
    opacity: 0;
}

.festival-desc-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    padding: 0;
    border: none;
    background: transparent;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.festival-desc-toggle-icon {
    display: inline-flex;
    transition: transform 0.3s ease;
}

.festival-desc-toggle.open .festival-desc-toggle-icon {
    transform: rotate(180deg);
}

/* ---------- Festival detail: product slider ---------- */

.festival-products-title {
    font-size: clamp(18px, 2.2vw, 26px);
    font-weight: 600;
    color: #000;
}

/* The container does not use the ".swiper" class (that one is auto-initialised
   in the layout), so the required overflow rules are declared here. */
.festival-products-swiper {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.festival-nav-btn {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #000;
    border-radius: 50%;
    background: #ffffff;
    color: #000;
    transition: background 0.25s ease, color 0.25s ease, opacity 0.25s ease;
}

.festival-nav-btn:hover {
    background: #000;
    color: #fff;
}

.festival-nav-btn.swiper-button-disabled {
    opacity: 0.35;
    cursor: default;
}

.festival-nav-btn.swiper-button-disabled:hover {
    background: #fff;
    color: #000;
}

.festival-product-card {
    background: #ffffff;
}

.festival-product-img {
    width: 100%;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    background: #f2efeb;
}

.festival-product-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s ease;
}

.festival-product-card:hover .festival-product-img img {
    transform: scale(1.06);
}

.festival-product-info {
    padding: 12px 2px 0;
}

.festival-product-name {
    font-size: 14px;
    color: #000;
}

.festival-product-price {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
}

.festival-product-price .price-sale {
    font-weight: 600;
    color: #000;
}

.festival-product-price .price-original {
    font-size: 13px;
    color: #9a9a9a;
    text-decoration: line-through;
}

/* ---------- Static colour swatch on the product page ---------- */

.color-swatch-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.color-swatch-list {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.color-swatch-box {
    width: 46px;
    height: 46px;
    border: 1px solid #d5d5d5;
    border-radius: 4px;
    cursor: pointer;
    background-color: #f2efeb;
    background-repeat: no-repeat;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.color-swatch-box:hover {
    border-color: #000;
}

.color-swatch-box.active {
    border-color: #000;
    box-shadow: 0 0 0 2px #ffffff inset, 0 0 0 1px #000;
}

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

@media (max-width: 1199.98px) {

    /* Desktop nav (and therefore the hover dropdown) is hidden below xl;
       the offcanvas accordion takes over. */
    .festival-dropdown {
        display: none !important;
    }
}

@media (max-width: 991.98px) {
    .festival-card-name {
        font-size: 15px;
    }

    .festival-banner-overlay {
        padding-bottom: 20px;
    }
}

@media (max-width: 767.98px) {
    .festival-card-info {
        padding: 10px 8px;
    }

    .festival-card-name {
        font-size: 13px;
        letter-spacing: 0.3px;
    }

    .festival-card-link {
        font-size: 11px;
    }

    .festival-desc-wrapper {
        max-height: 110px;
    }

    .festival-desc,
    .festival-desc p {
        font-size: 14px;
    }

    .festival-products-head {
        flex-wrap: wrap;
        gap: 10px;
    }

    .festival-nav-btn {
        width: 34px;
        height: 34px;
    }

    .festival-product-name {
        font-size: 13px;
    }

    .festival-product-price {
        font-size: 14px;
    }
}

@media (max-width: 575.98px) {
    .festival-banner img {
        height: 260px;
    }

    .festival-products-head {
        flex-direction: row;
        align-items: center;
    }

    .festival-products-title {
        font-size: 17px;
    }

    .login_heading_wrapper h1
    {
        font-size: 30px;
        padding-bottom: 30px;
    }
    .wishlist_product_wrapper img {
        width: 60px;
        max-width: 60px;
    }
    .addtocart_btn button, .product-info-accordian .accordion-button::after {
        font-size: 13px;
    }
    .cart-count, .wishlist-count
    {
        font-size: 10px;
        min-width: 14px;
        height: 14px;
    }
}

.color-img 
{
    width: 50px;
    height: 31px;
}
/* ===================================================================
   MINI CART DRAWER
   Slides in from the right when the header cart icon is clicked.
   Full width on phones, fixed width from tablet up.
   =================================================================== */
.cart-drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 1080;
}

.cart-drawer-overlay.open {
    opacity: 1;
    visibility: visible;
}

.cart-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 420px;
    background: #ffffff;
    box-shadow: -8px 0 30px rgba(0, 0, 0, 0.12);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
    z-index: 1090;
    display: flex;
    flex-direction: column;
    visibility: hidden;
}

.cart-drawer.open {
    transform: translateX(0);
    visibility: visible;
}

/* Lock the page behind the drawer while it is open */
body.cart-drawer-open {
    overflow: hidden;
}

.cart-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px;
    border-bottom: 1px solid #ececec;
    flex: 0 0 auto;
}

.cart-drawer-title {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #111;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cart-drawer-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.cart-drawer-close {
    background: transparent;
    border: none;
    padding: 6px;
    line-height: 0;
    color: #111;
    cursor: pointer;
    border-radius: 50%;
    transition: background 0.2s ease;
}

.cart-drawer-close:hover {
    background: #f2f2f2;
}

.cart-drawer-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* ---- Item list ---- */
.cart-drawer-items {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 20px;
}

.cart-drawer-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid #f0f0f0;
    transition: opacity 0.2s ease;
}

.cart-drawer-item.removing {
    opacity: 0.4;
}

.cart-drawer-item-img {
    flex: 0 0 auto;
    width: 74px;
    display: block;
}

.cart-drawer-item-img img {
    width: 74px;
    height: 96px;
    object-fit: cover;
    border-radius: 4px;
    background: #f6f6f6;
}

.cart-drawer-item-info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.cart-drawer-item-name {
    font-size: 13px;
    font-weight: 600;
    color: #111;
    text-decoration: none;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cart-drawer-item-name:hover {
    color: #000;
    text-decoration: underline;
}

.cart-drawer-item-variation,
.cart-drawer-item-qty {
    font-size: 12px;
    color: #777;
    text-transform: capitalize;
}

.cart-drawer-item-price {
    font-size: 14px;
    font-weight: 700;
    color: #111;
    margin-top: 2px;
}

.cart-drawer-item-remove {
    flex: 0 0 auto;
    background: transparent;
    border: none;
    color: #999;
    font-size: 16px;
    line-height: 1;
    padding: 2px;
    cursor: pointer;
    transition: color 0.2s ease;
}

.cart-drawer-item-remove:hover {
    color: #e11d48;
}

.cart-drawer-item-remove:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

/* ---- Footer ---- */
.cart-drawer-footer {
    flex: 0 0 auto;
    padding: 16px 20px calc(18px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #ececec;
    background: #fff;
}

.cart-drawer-subtotal {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 15px;
    color: #111;
    margin-bottom: 4px;
}

.cart-drawer-subtotal strong {
    font-size: 17px;
    font-weight: 700;
}

.cart-drawer-note {
    font-size: 11px;
    color: #888;
    margin-bottom: 12px;
}

.cart-drawer-go-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 13px 16px;
    background: #111;
    color: #fff;
    border: 1px solid #111;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.25s ease, color 0.25s ease;
}

.cart-drawer-go-btn:hover {
    background: #fff;
    color: #111;
}

/* ---- Empty state ---- */
.cart-drawer-empty {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 6px;
    padding: 40px 24px;
    color: #555;
}

.cart-drawer-empty svg {
    color: #d5d5d5;
    margin-bottom: 8px;
}

.cart-drawer-empty p {
    font-size: 16px;
    font-weight: 600;
    color: #111;
}

.cart-drawer-empty span {
    font-size: 13px;
    color: #888;
}

.cart-drawer-shop-btn {
    margin-top: 16px;
    padding: 11px 26px;
    background: #111;
    color: #fff;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.cart-drawer-shop-btn:hover {
    color: #fff;
    opacity: 0.85;
}

/* ---- Responsive tweaks ---- */
@media (min-width: 576px) {
    .cart-drawer {
        max-width: 400px;
    }
}

@media (min-width: 992px) {
    .cart-drawer {
        max-width: 430px;
    }
}

@media (max-width: 575.98px) {
    .cart-drawer {
        max-width: 100%;
    }

    .cart-drawer-head {
        padding: 14px 16px;
    }

    .cart-drawer-title {
        font-size: 14px;
    }

    .cart-drawer-items {
        padding: 4px 16px;
    }

    .cart-drawer-item {
        padding: 13px 0;
        gap: 10px;
    }

    .cart-drawer-item-img,
    .cart-drawer-item-img img {
        width: 62px;
    }

    .cart-drawer-item-img img {
        height: 82px;
    }

    .cart-drawer-item-name {
        font-size: 12px;
    }

    .cart-drawer-item-price {
        font-size: 13px;
    }

    .cart-drawer-footer {
        padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    }

    .cart-drawer-go-btn {
        padding: 12px 14px;
        font-size: 12px;
    }
}

/* Short / landscape phones: keep the footer reachable */
@media (max-height: 520px) {
    .cart-drawer-item-img,
    .cart-drawer-item-img img {
        width: 54px;
    }

    .cart-drawer-item-img img {
        height: 70px;
    }

    .cart-drawer-note {
        display: none;
    }
}

/* ===================================================================
   WISHLIST PAGE - "ADD TO BAG" CHECKBOXES + CHECK ALL
   =================================================================== */
.wishlist_checkall_bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 16px;
    background: #fafafa;
    border: 1px solid #ececec;
    border-radius: 6px;
}

.wishlist_checkall_hint {
    font-size: 14px;
    color: #888;
    margin-top: 3px
}

/* Custom checkbox: the native input is hidden and a square is drawn instead,
   so it looks the same in every browser. */
.wishlist_check {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    margin-bottom: 0;
    vertical-align: middle;
}

.wishlist_check_input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.wishlist_check_box {
    flex: 0 0 auto;
    position: relative;
    width: 20px;
    height: 20px;
    border: 1.5px solid #b9b9b9;
    border-radius: 4px;
    background: #fff;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.wishlist_check_box::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg) scale(0);
    transition: transform 0.18s ease;
}

.wishlist_check_input:checked + .wishlist_check_box {
    background: #111;
    border-color: #111;
}

.wishlist_check_input:checked + .wishlist_check_box::after {
    transform: rotate(45deg) scale(1);
}

/* Partially selected "Check all" */
.wishlist_check_input:indeterminate + .wishlist_check_box {
    background: #111;
    border-color: #111;
}

.wishlist_check_input:indeterminate + .wishlist_check_box::after {
    left: 4px;
    top: 8px;
    width: 10px;
    height: 0;
    border-width: 0 0 2px 0;
    transform: rotate(0deg) scale(1);
}

.wishlist_check_input:focus-visible + .wishlist_check_box {
    outline: 2px solid #111;
    outline-offset: 2px;
}

.wishlist_check_input:disabled + .wishlist_check_box {
    opacity: 0.5;
    cursor: not-allowed;
}

.wishlist_check_label {
    font-size: 13px;
    font-weight: 500;
    color: #111;
    white-space: nowrap;
}

.wishlist_table td,
.wishlist_table th {
    vertical-align: middle;
}

/* ---- Wishlist table on small screens ----
   The table turns into stacked cards so nothing overflows on a phone. */
@media (max-width: 575.98px) {
    .wishlist_checkall_bar {
        padding: 10px 12px;
    }

    .wishlist_checkall_hint {
        font-size: 12px;
    }

    .wishlist_table tr {
        border: 1px solid #ececec;
        border-radius: 6px;
        padding: 12px;
        margin-bottom: 12px;
    }

    .wishlist_table th,
    .wishlist_table td {
        border: none;
        padding: 6px 0;
    }

    /* Show the column name in front of each value */
    /* .wishlist_table td[data-label]::before {
        content: attr(data-label) ": ";
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        color: #999;
        margin-right: 8px;
    } */

    .wishlist_table td[data-label="Add to bag"]::before {
        display: none;
    }

    .wishlist_table td[data-label="Add to bag"] {
        padding-top: 10px;
        border-top: 1px dashed #eee;
        margin-top: 6px;
    }

    .wishlist_addbag_check {
        width: 100%;
        margin-top: 5px;
    }
}

/* ===================================================================
   LOGIN METHOD TABS (Password / Email OTP / SMS OTP / WhatsApp OTP)
   Four across on desktop, a 2x2 grid on tablets and phones.
   =================================================================== */
.login-method-toggle {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 18px;
    width: 100%;
}

.login-method-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 10px 8px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.25;
    letter-spacing: .2px;
    text-align: center;
    color: #333;
    cursor: pointer;
    transition: all .2s ease;
}

.login-method-btn i {
    font-size: 13px;
    flex: 0 0 auto;
}

.login-method-btn:hover {
    border-color: #999;
}

.login-method-btn.active {
    background: #111;
    color: #fff;
    border-color: #111;
}

/* ---- Phone number field (SMS / WhatsApp OTP) ---- */
.otp-phone-field {
    /* display: flex;
    align-items: stretch;
    flex: 1; */
    min-width: 0;
    border: 1px solid #000;
    background: #fff;
    width: 100%;
}

.otp-country-code {
    display: flex;
    align-items: center;
    padding: 0 10px;
    background: #f5f5f5;
    border-right: 1px solid #e5e5e5;
    font-size: 14px;
    color: #444;
    white-space: nowrap;
}

.otp-phone-field .form-control {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    flex: 1;
    min-width: 0;
}

.otp-send-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
}

/* ---- Responsive ---- */
@media (max-width: 991.98px) {
    .login-method-toggle {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .login-method-toggle {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    .login-method-btn {
        flex-direction: column;
        gap: 4px;
        padding: 9px 6px;
        font-size: 11px;
    }

    /* The OTP row stacks so the input never gets squeezed on a phone */
    .otp-email-row {
        flex-direction: column;
        gap: 10px;
    }

    .otp-email-row .send-otp-btn {
        width: 100%;
        padding: 11px 16px;
    }

    .otp-phone-field {
        width: 100%;
    }

    .login_form .nav-tabs .nav-link
    {
        font-size: 22px !important;
    }
    
    .auth-tab .submit_btn
    {
        width: 100%;
    }

    .cart_totals_btns button.cart_buy_now
    {
        font-size: 14px;
    }

    .blog-info .blog-desc
    {
        height: 60px;
    }

}

@media (max-width: 359.98px) {
    .login-method-toggle {
        grid-template-columns: 1fr;
    }

    .login-method-btn {
        flex-direction: row;
    }
}

.iti
{
    width: 100%;
}

.blog-card img 
{
    height: 300px;
    object-fit: cover;
}

@media (max-width: 992px)
{
    .blog-card img 
    {
        height: 200px;
        object-fit: cover;
    }
}