@media (min-width: 1474px) {
    .container{
        max-width: 1920px;
    }
}   
/* Small Devices (Tablets, 768px - 991px) */
@media (max-width: 991px) and (min-width: 768px) {
    .nav {
        flex-direction: column;
        gap: 1rem;
        padding: 16px 0 0 0;
    }
    .search-box input {
        width: 160px;
    }
    .hero-content h2 {
        font-size: 1.7rem;
    }
    .product-details-container {
        flex-direction: column;
        gap: 20px;
    }
    .action-buttons {
        flex-direction: column;
        gap: 10px;
    }
    .product-details-section .add-to-cart-btn,
    .product-details-section .buy-now-btn {
        width: 100%;
        justify-content: center;
    }
    .cart-sidebar {
        width: 500px;
        max-width: 90%;
        right: -500px;
    }
    .cart-sidebar.active {
        right: 0;
    }
}

/* Extra Small Devices (Mobiles, 480px - 767px) */
@media (max-width: 767px) and (min-width: 480px) {
    .nav {
        flex-direction: column;
        gap: 0.5rem;
        padding: 16px 0 0 0;
    }
    .search-box input {
        width: 120px;
    }
    .hero-content h2 {
        font-size: 1.2rem;
    }
    .hero-content p {
        font-size: 0.95rem;
    }
    .section-title {
        font-size: 1.3rem;
    }
    .category-header h3 {
        font-size: 1.1rem;
    }
    .category-image-wrapper {
        width: 108px !important;
        max-width: 108px !important;
        height: 108px !important;
        aspect-ratio: 1 / 1;
    }
    .popular-categories-container {
        padding: 0 32px !important;
    }
    .quantity-btn-new {
        width: 30px !important;
        height: 30px !important;
        font-size: 16px !important;
    }
    .quantity-input-new {
        width: 40px !important;
        height: 30px !important;
        font-size: 13px !important;
    }
    /* Add subtle divider under product name */
    .product-title-new {
        border-bottom: 1px solid #eee;
        padding-bottom: 6px;
        margin-bottom: 10px;
    }
    .tabs-header {
        flex-wrap: wrap;
    }
    .action-buttons {
        flex-direction: column;
        gap: 8px;
    }
    .product-details-section .add-to-cart-btn,
    .product-details-section .buy-now-btn {
        width: 100%;
        font-size: 1rem;
    }
}
@media (min-width: 768px) {
    .navbar-nav .has-submenu:hover > .submenu {
        display: block !important;
    }

    .navbar-nav .has-submenu:hover > .submenu-toggle .arrow i {
        transform: rotate(180deg); 
    }
}
@media (max-width: 767px) {
     .submenu-toggle {
        width: 100%;
    }
    .nav-menu li.sub.has-submenu {
        position: relative;
    }
    .has-submenu.open > .submenu {
        display: block !important;
    }
    .has-submenu.open > .submenu {
        display: block !important;
        position: relative !important;
        left: 0px !important;
        top: 0 !important;
    }
    sub.submenu {
        background: transparent;
    }
    .submenu-toggle .arrow {
        font-size: 14px;
        color: #ffffff !important;
        padding: 0 !important;
        width: 30px !important;
        height: 30px !important;
        background: #fc8303;
        text-align: center !important;
        display: inline-block !important;
        border-radius: 2px;
        line-height: 30px;
    }
    .sub.has-submenu .submenu-toggle {
        position: absolute;
        right: 6px;
        font-size: 17px;
        color: #ffffff !important;
        padding: 0 !important;
        width: 30px !important;
        height: 30px !important;
        background: #fc8303;
        text-align: center !important;
        display: inline-block !important;
        border-radius: 2px;
        top: 22px;
    }
        li.sub.has-submenu ul li a {
        border-bottom: 1px solid #dddddd;
        background: #fff;
    }
     .sub.has-submenu .arrow {
        color: #ffffff;
    }
    li.sub.has-submenu a {
        padding: 10px;
        font-size: 16px;
        border-bottom: 1px solid #dddddd91;
    }
    .navbar-nav a{
        border-bottom: 1px solid #eee;
    }
    .nav-menu a {
        padding: 7px 0px;
        width: 100%;
        display: block;
        font-size: 18px;
        font-weight: 500;
        color: #333333;
    }
    .nav-menu a:hover, .nav-menu a:focus{
         color: #e74c3c;
    }
    .submenu-toggle {
        font-size: 18px;
        color: #333333;
        padding: 7px 0px;
        border-bottom: 1px solid #eee;
    }
    .submenu li a {
        padding: 7px 15px;
        font-size: 18px;
        font-weight: 500;
    }
    ul.submenu {
        width: 100%;
        background: #eeeeeec4;
        border-radius: 0px;
        position: relative;
        top: 0;
    }
    ul.submenu li {
        border-bottom: 3px solid #fff;
    }
    .nav-menu ul li {
        padding: 0px;
        border-right: 0;
        border-bottom: 0;
    }
    .search-box input {
        width: 100%;
    }
    .toggleMenu {
        background: none;
        border: none;
        font-size: 21px;
        cursor: pointer;
        position: relative;
        z-index: 2;
    }
    .nav-icons {
        justify-content: flex-end;
        gap: 25px;
    }
    .cart-icon {
        font-size: 18px;
    }
    .cart-count {
        top: -8px;
        right: -8px;
        font-size: 12px;
        font-weight: 500;
    }
    .user-btn {
        font-size: 18px !important;
    }
    .nav-menu {
        position: fixed;
        top: 0;
        left: -100%;
        width: 100vw;
        height: 100vh;
        background: #fff;
        display: flex;
        flex-direction: column;
        padding-top: 50px;
        z-index: 1000;
        transition: left 0.3s ease;
        padding: 10px;
    }
    .nav-menu.show {
        left: 0;
    }
    .closeMenu {
        font-size: 30px;
        color: #000;
        background: none;
        border: none;
        cursor: pointer;
    }
    .nav-menu ul {
        display: flex;
        list-style: none;
        flex-direction: column;
        margin-top: 0;
    }
    .nav-menu ul {
        gap: 0;
    }
    .mobile-logo-flex {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid #eee;
    }
    .thumbnail-container {
        gap: 6px;
    }
    #siteNavBar {
        position: fixed;
        height: 100vh;
        width: 100vw;
        background: #fff;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        padding: 20px;
        z-index: 999;
    }
    .navbar-nav {
        flex-direction: column !important;
    }
    .navbarToggler {
        background: transparent;
        border: 0;
        outline: none;
        box-shadow: none;
        font-size: 22px;
        cursor: pointer;
    }
    .header {
        position: relative;
    }
    .search-box {
        width: 100%;
    }
    /* Hero */
    .site-content {
        margin-top: 0;
    }

    .btn-checkout, .btn-secondary, .btn-continue{
        padding: 10px;
        font-size: 13px;
    }
    .hero {
        height: auto;
        margin-top: 0;
    }
    .hero-content img {
        height: 230px !important;
        object-fit: cover;
    }
    .category-header h3 {
        font-size: 26px;
    }
    .category-header {
        margin-bottom: 20px;
    }
    /* Product Loop */
    .product-image {
        height: 130px;
        width: 110px;
    }
    .product-info {
        padding: 10px !important;
        min-height: auto;
    }
    .product-details-section .product-info {
        padding: 0px !important;
        justify-content: flex-start;
    }
    .products-section {
        padding: 40px 0px;
    }
    .product-title {
        font-size: 15px;
        font-weight: 500;
        margin-bottom: 10px;
        line-height: 1.6;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .top-sales-category-section {
    border-radius: 5px;
    border: 1px solid #eee;
    text-align: center;
    padding: 0px;
    margin: 11px;
    background: #fff;
    transition: all ease-in-out 0.2s;
    overflow: hidden;
    gap: 4px !important;
    height: 70px;
    width: 70px;
}
    .price_wrapper {
        flex-wrap: wrap;
        font-size: 16px;
        font-weight: 500;
        gap: 0;
    }
    .add-to-cart-btn {
        font-size: 15px;
        padding: 5px 3px;
    }
    .product-card {
        height: 100%;
    }
    /* Newsletter */
    .newsletter-section {
        padding: 2rem 0;
    }
    .newsletter-title {
        font-size: 30px;
    }
    /* Footer */
    .footer-bottom p {
        margin: 0;
    }
.footer-content {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
    gap: 0px;
}

/* Mobile Footer Logo - Centered */
.footer-logo-section {
    text-align: center;
    margin-bottom: 30px;
}

.footer-logo-wrapper {
    justify-content: center;
    margin-bottom: 20px;
}

.footer-contact {
    text-align: left;
    margin-top: 4px;
}

.footer-social {
    justify-content: center;
}

/* Mobile Footer Menu Sections - Expandable */
.footer-section:not(:last-of-type) {
    border-bottom: 1px solid #e0e0e0;
    padding: 10px 0;
  }

  .footer-app-social-section{
    padding: 10px 0;
  }
  
  

.footer-heading-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-heading-wrapper .footer-heading {
    margin: 0;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--secondary-color);
    font-size: 16px;
    flex: 1;
}

/* Hide toggle icons - accordion removed */
.footer-toggle-icon {
    display: none !important;
}

.footer-icon-plus,
.footer-icon-minus {
    display: none !important;
}

/* Footer content always visible on mobile - no accordion */
.footer-menu-content {
    max-height: none !important;
    overflow: visible !important;
    margin-top: 15px;
    padding-top: 0;
}

.footer-menu-content li {
    margin-bottom: 10px;
}

.footer-menu-content a {
    font-size: 14px;
    color: var(--secondary-color);
}

/* Desktop: Hide toggle icons, show links directly */
@media (min-width: 768px) {
    .footer-heading-wrapper {
        cursor: default;
    }
    
    .footer-toggle-icon {
        display: none;
    }
    
    .footer-menu-content {
        max-height: none !important;
        overflow: visible !important;
    }
    
    .footer-menu-section {
        border-bottom: none;
        padding: 0;
    }
    
    .footer-logo-section {
        text-align: left;
    }
    
    .footer-logo-wrapper {
        justify-content: flex-start;
    }
    
    .footer-social {
        justify-content: flex-start;
    }
}

    /* Single Product Page */
    .breadcrumb {
        margin-bottom: 20px;
        font-size: 16px;
    }
.product-details-container {
    gap: 10px;
    /* padding: 15px; */
}
    .main-image {
        height: 350px;
        object-fit: cover;
        object-position: center;
    }
    .thumbnail {
        width: 80px !important;
        height: 80px !important;
    }
    .slider-btn {
        width: 40px !important;
        height: 30px !important;
        display: inline-block !important;
        font-size: 17px !important;
    }
   .zoom-result {
        display: none !important; /* hide zoom */
    }

    .thumbnail {
        flex: 0 0 calc((100% - 80px)/3); /* 3 thumbnails per view */
        height: 70px;
    }

    .slider-btn {
        display: block;
    }

    .product-rating{
        display: none;
    }
    .quantity-controls-heading{
        display: none;
    }
    .product-price-value {
    display: flex;
    flex-direction: row;
    /* justify-content: space-between; */
    align-items: center;
    margin-top: 0.75rem;
    gap: 2rem;
    }
    .attribute-name-heading {
    /* display: none; */
}

.attribute-item {
    font-size: 12px;
}
    .product-details-section .product-title {
        font-size: 16px;
        margin: 0 0 12px 0;
        min-height: auto;
        line-height: 1.2;
        font-weight: 400;
    }
    .product-details-section .product-price {
        font-size: 20px;
        margin: 0 0 16px 0;
    }
    
    /* Product Price Layout - Price and Discount Badge */
    .product-price-value {
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-top: 0;
        margin-bottom: 16px;
        gap: 50px;
    }
    
    .product-price-amount {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }
    
    
    
    .discount-badge {
        background: #504D50;
        color: white;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 400;
    }
    
    /* Attribute Groups - Better spacing */
    .attribute-group {
        margin-bottom: 20px;
    }
    
    .attribute-group.mb-4 {
        margin-bottom: 24px;
    }
    
    .attribute-values {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 8px;
    }
    
    .attribute-item {
        font-size: 14px;
        border-radius: 4px;
        border: 1px solid #504D50;
        color: #504D50;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s ease;
        min-height: 36px;
        padding: 4px 12px;
        box-sizing: border-box;
    }
    
    .attribute-item:hover {
        border-color: #504D50;
        background: #f5f5f5;
    }
    
    .attribute-item.selected {
        background: #504D50;
        color: white;
        border-color: #504D50;
    }
    
    .attribute-item.disabled {
        background: #e0e0e0;
        color: #999;
        border-color: #e0e0e0;
        cursor: not-allowed;
        position: relative;
        opacity: 0.5;
    }
    
    .attribute-item.disabled::after {
        content: '';
        position: absolute;
        width: 100%;
        height: 1px;
        background: #999;
        transform: rotate(45deg);
    }
    
    /* Quantity Controls */
    .quantity-controls {
        margin: 16px 0;
    }
    
    .control-panel-container {
        display: flex;
        align-items: center;
        gap: 12px;
        flex-wrap: wrap;
    }
    
    .control-panel {
        width: 120px;
        border: 1px solid #504D50;
        border-radius: 0;
    }
    
    /* Hide total quantity value on mobile */
    .total-quantity-value {
        display: none !important;
    }
    
    /* Show Add to Cart button in control panel container on mobile */
    .control-panel-container .add-to-cart-btn-mobile {
        display: flex !important;
        flex: 1;
        min-width: 200px;
        padding: 9px 20px;
        font-size: 16px;
        text-transform: uppercase;
        font-weight: 400;
        border-radius: 0;
        background: #504D50;
        color: white;
        border: none;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        text-decoration: none;
    }

    .control-panel .quantity-input{
        width: 35px;
    }
    
    /* Show Shop Now button below quantity controls on mobile */
    .buy-now-btn-mobile {
        display: block !important;
        width: 100%;
        padding: 10px 20px;
        font-size: 14px;
        text-transform: uppercase;
        font-weight: 400;
        border-radius: 0;
        border: 1px solid #504D50;
        color: #504D50;
        /* background: white; */
        text-align: center;
        margin-top: 12px;
        cursor: pointer;
    }
    
    .buy-now-btn-mobile:hover {
        background: #f5f5f5;
    }
    
    /* Hide the regular action buttons on mobile (they'll be in control panel) */
    .action-buttons {
        display: none !important;
    }

.product-breadcrumb {
    margin-bottom: 12px;
    font-size: 12px;
    gap: 4px;
}

.control-panel {
    width: 120px;
}
    .product-tabs {
        margin-top: 40px;
        padding: 15px;
    }
    .tab-btn {
        font-size: 14px;
    }
    /* Related Products */
    .related-products {
        margin: 30px 0px;
    }
    .related-products .product-title {
        min-height: auto;
    }
    /* Checkout */
    #checkout {
        padding: 30px 0px;
    }
    .checkout-flex {
        margin: 25px 0px 0px;
    }
    .checkout-summary, .checkout-form {
        padding: 0px;

        min-height: auto;
    }
    .checkout-summary {
        gap: 15px;
    }

}

/* Tiny Devices (Small Mobiles, <=480px) */

@media (max-width: 480px) {
   
     .thumbnail {
        flex: 0 0 calc((100% - 80px)/3); /* maintain 3 thumbnails */
    }
    .main-image {
        max-width: 100%;
    }
    .thumbnail-container {
        gap: 4px;
    }
    .nav {
        flex-direction: row;
        gap: 0.3rem;
        padding: 16px 0 0 0;
    }
    .search-box input {
        font-size: 0.85rem;
    }
    .hero-content h2 {
        font-size: 1rem;
    }
    .hero-content p {
        font-size: 0.8rem;
    }
    .section-title {
        font-size: 1rem;
        font-weight: 500;
    }
    .tabs-header {
        flex-wrap: wrap;
    }
    .tab-btn {
        padding: 0.3rem 0.5rem;
    }
    .action-buttons {
        flex-direction: column;
        gap: 12px;
    }
    
    /* Product Details - Small Mobile */
    .product-details-section .product-title {
        margin-top: 18px;
    }
    
    .product-details-section .product-price {
        font-size: 18px;
        margin: 0 0 12px 0;
    }
    
    .attribute-item {
        font-size: 13px;
    }
    
    .product-details-section .add-to-cart-btn, 
    .product-details-section .buy-now-btn {
        padding: 12px 16px;
        font-size: 15px;
    }
    
    .control-panel {
        width: 120px;
    }
}

/* Mobile Footer Accordion (Template9) */
@media (max-width: 767px) {
    .footer-section {
        width: 100%;
    }
    .footer-section.footer-logo-section{
        align-items: center;
        justify-content: center;
    }

    .footer-heading {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    /* Hide toggle icons - accordion removed */
    .footer-heading .footer-toggle-icon {
        display: none !important;
    }

    /* Footer links always visible on mobile - no accordion */
    .footer-links {
        max-height: none !important;
        overflow: visible !important;
        display: block !important;
        padding-left: 0;
        margin-bottom: 16px;
    }

    .footer-links li {
        padding: 2px 0;
        border-bottom: 0;
    }
}

/* Toggle icons removed - accordion functionality disabled */
.footer-toggle-icon{
    display: none !important;
}

/* Mobile CTA Geometry — Unified Row Layout */
@media (max-width: 768px) {

    /* Row containers: force horizontal layout */
    .action-buttons-new {
        display: flex;
        flex-direction: row;
        gap: 8px;
        width: 100%;
        margin-bottom: 12px;
    }

    .t6-secondary-cta-row {
        display: flex;
        flex-direction: row;
        gap: 8px;
        width: 100%;
        margin-bottom: 12px;
        flex-wrap: nowrap;
    }

    /* Universal button geometry — same height, same flex distribution */
    .add-to-cart-btn-new,
    .buy-now-btn-new,
    .out-of-stock-btn-new,
    .continue-shipping-btn-new {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 1 1 0;
        box-sizing: border-box;
        min-width: 0;
        height: 48px;
        min-height: 48px;
        padding: 0 8px;
        font-size: 13px;
        font-weight: 600;
        line-height: 1;
        white-space: nowrap;
        text-align: center;
        margin: 0;
        border-radius: 4px;
    }

    /* Secondary CTAs (Call / WhatsApp) — same height, icon+text on one centerline */
    .t6-secondary-cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 1 1 0;
        box-sizing: border-box;
        min-width: 0;
        height: 48px;
        min-height: 48px;
        padding: 0 8px;
        font-size: 12px;
        font-weight: 600;
        line-height: 1;
        white-space: nowrap;
        text-align: center;
        gap: 6px;
        margin: 0;
        border-radius: 4px;
    }

    /* Icon alignment inside secondary buttons */
    .t6-secondary-cta-btn i {
        display: inline-flex;
        align-items: center;
        line-height: 1;
        font-size: 14px;
        flex-shrink: 0;
    }
    .category-image-wrapper {
        width: 96px !important;
        max-width: 96px !important;
        height: 96px !important;
        aspect-ratio: 1 / 1;
    }
    .popular-categories-container {
        padding: 0 0px !important;
    }
    .quantity-btn-new {
        width: 28px !important;
        height: 28px !important;
        font-size: 14px !important;
    }
    .quantity-input-new {
        width: 36px !important;
        height: 28px !important;
        font-size: 12px !important;
    }
    .product-title-new {
        padding-bottom: 0px;
        margin-bottom: 0px;
    }
    /* Product Image Layout: Thumbnails Left, Main Image Right on Mobile */
    .product-image-section {
        display: flex;
        flex-direction: row-reverse;
        align-items: stretch;
        gap: 5px;
        margin-bottom: 0px;
    }
    
    .main-image-container {
        flex: 1;
        width: 0;
        margin-bottom: 0 !important;
    }
    
    .thumbnail-swiper-container {
        width: 60px;
        flex-shrink: 0;
        padding: 0 !important;
        margin-bottom: 0 !important;
        position: relative;
    }

    .thumbnail-swiper {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    .thumbnail-swiper .swiper-wrapper {
        flex-direction: column;
    }

    .thumbnail-swiper .swiper-slide {
        width: 100% !important;
        height: auto !important;
        margin-bottom: 8px !important;
        margin-right: 0 !important;
    }
    
    .thumbnail-new {
        width: 100%;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }
}