/*
Theme Name: GharGharFresh
Theme URI: https://shreebalajitraderss.in/
Author: Do Digitals
Description: Custom, high-performance responsive theme with full Elementor and WooCommerce support.
Version: 1.1
Text Domain: ghargharfresh
*/

/* --- Brand Color Palette --- */
:root {
    --brand-orange: #fe6b08;
    --brand-green: #079830;
    --text-dark: #4a4a4a;
    --bg-white: #ffffff;
}

/* --- Base Styling --- */
* {
    box-sizing: border-box;
}

body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: var(--text-dark);
    background-color: var(--bg-white);
    margin: 0;
    padding: 0;
    line-height: 1.6;
}

.container {
    width: 100%;
    max-width: 1366px;
    margin: 0 auto;
    padding: 0 0px;
}

/* --- Header Layout --- */
.site-header {
    background-color: var(--bg-white);
    border-bottom: 2px solid var(--brand-green);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 20px;
}

/* --- Site Logo (Dynamic Customizer) --- */
.site-logo img {
    max-height: 70px; /* Adjust height based on your logo */
    width: auto;
    display: block;
}
.site-logo a.custom-logo-link {
    display: block;
}

/* --- Desktop Navigation --- */
.site-navigation {
    flex-grow: 1;
    display: flex;
    justify-content: center;
}

.primary-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 30px;
}

.primary-menu-list li a {
    text-decoration: none;
    color: var(--text-dark);
    font-weight: 600;
    font-size: 16px;
    transition: color 0.3s ease;
}

.primary-menu-list li a:hover {
    color: var(--brand-orange);
}

/* --- Header Actions (Cart & Toggle) --- */
.header-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-cart .cart-link {
    position: relative;
    color: var(--brand-green);
    display: flex;
    align-items: center;
    text-decoration: none;
}

.header-cart .cart-count {
    position: absolute;
    top: -8px;
    right: -10px;
    background-color: var(--brand-orange);
    color: var(--bg-white);
    font-size: 12px;
    font-weight: bold;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    color: var(--brand-green);
    cursor: pointer;
    padding: 0;
}

/* --- Responsive Media Queries --- */
@media screen and (max-width: 768px) {
	.qc-slider-top-header {
		    justify-content: center !important;
	}
    .mobile-menu-toggle {
        display: block;
    }

    .site-navigation {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background-color: var(--bg-white);
        border-bottom: 2px solid var(--brand-green);
        box-shadow: 0 5px 10px rgba(0,0,0,0.1);
    }

    .site-navigation.active {
        display: block;
    }

    .primary-menu-list {
        flex-direction: column;
        gap: 0;
    }

    .primary-menu-list li {
        border-top: 1px solid #f0f0f0;
    }

    .primary-menu-list li a {
        display: block;
        padding: 15px 20px;
    }
}
/* --- Header Actions (Account, Wishlist, Cart & Toggle) --- */
.header-actions {
    display: flex;
    align-items: center;
    gap: 25px; /* Thoda space badhaya 3 icons ke liye */
}

.header-icon a {
    position: relative;
    color: var(--brand-green);
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.2s ease;
}

.header-icon a:hover {
    color: var(--brand-orange);
    transform: translateY(-2px); /* Hover par halka sa upar uthega */
}

.header-icon.header-cart .cart-count {
    position: absolute;
    top: -8px;
    right: -12px;
    background-color: var(--brand-orange);
    color: var(--bg-white);
    font-size: 11px;
    font-weight: bold;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* =======================================================
   PREMIUM COLORED FOOTER & MOBILE NAV STYLES
   ======================================================= */

/* --- The Branded Footer with Background Color --- */
.premium-brand-footer {
    background-color: #111827; /* Premium Deep Dark Blue/Grey */
    color: #e5e7eb;
    margin-top: 0px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.footer-wrapper {
    display: grid;
    grid-template-columns: 2fr 1fr 1.5fr;
    gap: 40px;
    padding: 60px 20px;
}

/* Logo & About */
.footer-logo img {
    max-height: 110px;
    width: auto;
    margin-bottom: 0px;
}

.footer-logo .text-logo {
    font-size: 26px;
    font-weight: 800;
    color: var(--brand-orange);
    text-decoration: none;
    display: inline-block;
    margin-bottom: 15px;
}

.brand-tagline {
    font-size: 14px;
    line-height: 1.6;
    color: #9ca3af;
    margin-bottom: 20px;
    max-width: 90%;
}

/* Social Media SVGs */
.footer-socials {
    display: flex;
    gap: 15px;
}

.footer-socials a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background-color: #1f2937; /* Slightly lighter box */
    color: #e5e7eb;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.footer-socials a:hover {
    background-color: var(--brand-green);
    color: #ffffff;
    transform: translateY(-3px);
}

/* Columns & Links */
.footer-col h4 {
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 20px 0;
    position: relative;
    padding-bottom: 8px;
}

.footer-col h4::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 2px;
    background-color: var(--brand-orange);
}

.footer-links ul, 
.footer-contact ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li, 
.footer-contact li {
    margin-bottom: 12px;
    font-size: 14px;
    color: #9ca3af;
}

.footer-links a {
    color: #9ca3af;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-links a:hover {
    color: var(--brand-orange);
}

/* Bottom Copy */
.footer-bottom-copy {
    background-color: #0b0f19; /* Even darker for the bottom strip */
    padding: 20px 0;
    text-align: center;
    border-top: 1px solid #1f2937;
}

.footer-bottom-copy p {
    margin: 0;
    font-size: 13px;
    color: #6b7280;
}

/* --- App-Style Mobile Bottom Navigation --- */
.mobile-bottom-nav {
    display: none; 
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0 -4px 15px rgba(0,0,0,0.06);
    z-index: 9999;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
    border-top: 1px solid #eaeaea;
}

.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #888; 
    flex: 1;
    transition: color 0.2s ease;
}

.nav-item svg {
    margin-bottom: 4px;
}

.nav-item span {
    font-size: 11px;
    font-weight: 600;
}

.nav-item:hover, 
.nav-item:active {
    color: var(--brand-orange);
}

.nav-cart-icon-wrapper {
    position: relative;
    display: inline-block;
}

.nav-cart-icon-wrapper .cart-count {
    position: absolute;
    top: -6px;
    right: -10px;
    background-color: var(--brand-green);
    color: #ffffff;
    font-size: 10px;
    font-weight: bold;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #ffffff;
}

/* --- Responsive Adjustments --- */
@media screen and (max-width: 768px) {
    .footer-wrapper {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 30px;
        padding-bottom: 25px; /* Space for the bottom nav */
    }

    .footer-col h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

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

    /* Show Bottom Nav on Mobile */
    .mobile-bottom-nav {
        display: flex;
    }

    /* Extra padding on body so content doesn't hide behind bottom nav */
    body {
        padding-bottom: 65px; 
    }
}

/* --- Fix WordPress Default Widget Styles --- */
.footer-wrapper .widget {
    margin-bottom: 25px; /* Har naye widget ke beech me thoda space */
}

/* Remove default bullets from menus added via widgets */
.footer-wrapper ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Social Icon Alignment Fix */
.footer-wrapper .wp-block-social-links {
    display: flex;
    gap: 15px;
    padding: 0;
    margin-top: 15px;
}

.footer-wrapper .wp-block-social-links li {
    list-style: none !important;
}

.footer-wrapper .wp-block-social-links a:hover {
    background-color: var(--brand-green);
    color: #ffffff;
    transform: translateY(-3px);
}
.footer-wrapper .wp-block-social-links {
    display: flex;
    gap: 15px;
    padding: 0;
    margin-top: 15px;
}
.footer-icon-social li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background-color: #1f2937;
    color: #e5e7eb;
    border-radius: 8px;
    transition: all 0.3s ease;
}
.footer-icon-social li a svg {
    color: #e5e7eb;
    fill: #e5e7eb;
}

/* =======================================================
   CUSTOM VANILLA HERO SLIDER WITH IMAGES
   ======================================================= */
.custom-hero-section {
    padding: 30px 0;
}

.slider-container {
    position: relative;
    width: 100%;
    height: 550px; /* Thodi height badhayi images ke liye */
    border-radius: 24px;
    overflow: hidden;
    background-color: #eaeaea; /* Fallback color */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.slider-track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform;
}

.custom-slide {
    min-width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 60px 80px;
    box-sizing: border-box;
    position: relative; /* Essential for overlay */
    background-size: cover; /* Image puri cover karegi */
    background-position: center; /* Image center me rahegi */
    background-repeat: no-repeat;
}

/* --- Dark Overlay Layer (Text readability ke liye) --- */
.custom-slide::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 60%); /* Left se dark gradient */
    z-index: 1;
}

/* --- Set Background Images --- */
/* NOTE: Jab aapke paas images ho, to relative path use karein: url('images/hero-vegetables.jpg') */
.slide-bg-1 { 
    background-image: url('https://images.pexels.com/photos/1435904/pexels-photo-1435904.jpeg?auto=compress&cs=tinysrgb&w=1600'); 
}

.slide-bg-2 { 
    background-image: url('https://images.pexels.com/photos/248412/pexels-photo-248412.jpeg?auto=compress&cs=tinysrgb&w=1600'); 
}

.slide-bg-3 { 
    background-image: url('https://images.pexels.com/photos/1040160/pexels-photo-1040160.jpeg?auto=compress&cs=tinysrgb&w=1600'); 
}

.slide-content {
    max-width: 700px;
    z-index: 2; /* Text overlay ke upar rahega */
    position: relative;
}

.slide-content h1 {
    font-size: 72px;
    font-weight: 800;
    color: #ffffff; /* White text background par accha dikhega */
    margin-bottom: 15px;
    line-height: 1.1;
    letter-spacing: -1px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3); /* Halka shadow depth ke liye */
}

.slide-content h1 .highlight {
    color: var(--brand-orange); /* Orange focus color barkarar */
}

.slide-content p {
    font-size: 18px;
    color: #f1f1f1; /* Light grey text */
    margin-bottom: 35px;
    line-height: 1.6;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.btn-primary {
    display: inline-block;
    background-color: var(--brand-green);
    color: #ffffff;
    padding: 15px 35px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(72, 166, 76, 0.4);
}

.btn-primary:hover {
    background-color: #3b8a3e;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(72, 166, 76, 0.5);
}

/* --- Arrows --- */
.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.8);
    border: none;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    color: var(--brand-green);
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}

.slider-arrow:hover {
    background: #ffffff;
    transform: translateY(-50%) scale(1.1);
}

.prev-arrow { left: 25px; }
.next-arrow { right: 25px; }

/* --- Pagination Dots --- */
.slider-dots {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.dot {
    width: 12px;
    height: 12px;
    background-color: rgba(255,255,255,0.5); /* Semi-transparent dots */
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;
}

.dot.active {
    background-color: var(--brand-orange);
    width: 30px;
    border-radius: 8px;
}

/* =======================================================
   RESPONSIVE DESIGN (MOBILE & TABLET)
   ======================================================= */
@media screen and (max-width: 1024px) {
    .custom-slide { padding: 40px 60px; }
    .slide-content h1 { font-size: 36px; }
}

@media screen and (max-width: 768px) {
    .custom-hero-section {
        padding: 15px 0;
    }
    
    .slider-container {
        height: 380px; /* Thodi zyada height mobile par */
        border-radius: 16px;
    }

    .custom-slide {
        padding: 20px;
        align-items: flex-end; /* Text neeche shift hoga */
        text-align: center;
    }

    /* Full width overlay on mobile */
    .custom-slide::after {
        background: rgba(0,0,0,0.5); /* Simple dark layer */
    }

    .slide-content {
        background: rgba(255, 255, 255, 0.98); /* White box for text */
        padding: 25px 20px;
        border-radius: 16px;
        width: 100%;
        max-width: 100%;
        box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    }

    .slide-content h1 {
        font-size: 26px;
        color: #222 !important; /* Black text inside white box */
        text-shadow: none;
        margin-bottom: 10px;
    }

    .slide-content h1 .highlight {
        color: var(--brand-orange);
    }

    .slide-content p {
        font-size: 14px;
        color: #555 !important; /* Black text inside white box */
        text-shadow: none;
        margin-bottom: 20px;
    }

    .btn-primary {
        width: 100%;
        box-sizing: border-box;
        font-size: 15px;
    }

    /* Hide arrows on mobile */
    .slider-arrow {
        display: none;
    }
    
    .slider-dots {
        bottom: 15px;
    }
}

/* =======================================================
   QUICK COMMERCE CATEGORY GRID STYLES
   ======================================================= */
.quick-category-wrapper {
    width: 100%;
}

.quick-category-grid {
    display: grid;
    /* Desktop par ek line me 6-8 categories, Mobile par minimum 3-4 */
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 20px;
}

.category-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    transition: transform 0.3s ease;
}

.category-card:hover {
    transform: translateY(-5px);
}

.category-image-box {
    width: 100%;
    aspect-ratio: 1 / 1; /* Hamesha perfect square banayega */
    background-color: #f1f5f9; /* Soft light blue/grey background */
    border-radius: 20px;
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    margin-bottom: 12px;
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

.category-card:hover .category-image-box {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
}

.category-image-box img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Image ko box ke andar perfectly fit karega cut kiye bina */
    transition: transform 0.3s ease;
}

.category-card:hover .category-image-box img {
    transform: scale(1.08); /* Hover par image thodi badi hogi */
}

.category-name {
    font-size: 14px;
    font-weight: 600;
    color: #334155;
    text-align: center;
    margin: 0;
    line-height: 1.3;
    transition: color 0.2s ease;
}

.category-card:hover .category-name {
    color: var(--brand-orange);
}

/* --- Mobile Responsiveness --- */
@media screen and (max-width: 768px) {
    .quick-category-grid {
        /* Mobile par categories thodi choti dikhengi taaki screen par fit aayein */
        grid-template-columns: repeat(auto-fill, minmax(85px, 1fr));
        gap: 12px;
    }

    .category-image-box {
        border-radius: 16px;
        padding: 10px;
        margin-bottom: 8px;
    }

    .category-name {
        font-size: 12px;
    }
}

/* =======================================================
   CUSTOM CATEGORY HORIZONTAL SLIDER (BLINKIT/ZEPTO STYLE)
   ======================================================= */
.custom-category-slider-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

/* The Scrolling Track */
.custom-category-track {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory; /* Makes it snap perfectly to cards */
    gap: 15px; /* Space between cards */
    padding: 10px 5px 20px 5px; /* Bottom padding for hover shadow */
    width: 100%;
    
    /* Hide default scrollbars for pure app look */
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.custom-category-track::-webkit-scrollbar {
    display: none; /* Chrome, Safari and Opera */
}

/* Individual Slide Card */
.cat-slide-card {
    /* calc(100% / 6 items - gap adjustment) */
    flex: 0 0 calc(16.666% - 13px); 
    scroll-snap-align: start; /* Snaps to the start of the box */
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 12px 10px;
    transition: all 0.2s ease;
}

.cat-slide-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.06);
    border-color: #e2e8f0;
}

/* Image Box */
.cat-img-box {
    width: 100%;
    aspect-ratio: 1 / 1;
    background-color: #f8fafc; /* Very light gray behind image */
    border-radius: 12px;
    margin-bottom: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.cat-img-box img {
    width: 100%;
    height: auto;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.cat-slide-card:hover .cat-img-box img {
    transform: scale(1.1);
}

/* Text */
.cat-title-text {
    font-size: 14px;
    font-weight: 700;
    color: #334155;
    text-align: center;
    line-height: 1.2;
}

/* Desktop Arrow Buttons */
.cat-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-60%); /* Adjusted for bottom padding */
    background: #ffffff;
    border: 1px solid #e2e8f0;
    color: var(--brand-green);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    transition: all 0.2s ease;
}

.cat-arrow:hover {
    background: var(--brand-green);
    color: #ffffff;
}

.cat-prev { left: 0px; }
.cat-next { right: 0px; }

/* =======================================================
   RESPONSIVE DESIGN (TABLET & MOBILE)
   ======================================================= */
@media screen and (max-width: 1024px) {
    .cat-slide-card {
        flex: 0 0 calc(20% - 12px); /* 5 items on Tablet */
    }
}

@media screen and (max-width: 768px) {
    .cat-slide-card {
        flex: 0 0 calc(25% - 11px); /* Exactly 4 items on Mobile */
        padding: 8px;
        border-radius: 12px;
    }

    .cat-title-text {
        font-size: 12px; /* Smaller text for mobile */
    }

    .cat-img-box {
        border-radius: 8px;
        margin-bottom: 8px;
    }

    /* Hide arrows on mobile because users use touch-swipe natively */
    .cat-arrow {
        display: none;
    }
}

/* For very small phones, show 3.5 items to hint it's scrollable */
@media screen and (max-width: 400px) {
    .cat-slide-card {
        flex: 0 0 calc(50% - 10px); 
    }
}

/* =======================================================
   QUICK COMMERCE PRODUCT SLIDER (12 ITEMS)
   ======================================================= */
.qc-product-slider-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.qc-product-track {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    gap: 15px;
    padding: 10px 5px 20px 5px;
    width: 100%;
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}

.qc-product-track::-webkit-scrollbar {
    display: none;
}

/* --- Product Card Styling --- */
.qc-product-card {
    flex: 0 0 calc(20% - 12px); /* Desktop: 5 items per row */
    scroll-snap-align: start;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.2s ease;
}

.qc-product-card:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
    border-color: #cbd5e1;
}

/* Time Tag */
.qc-delivery-tag {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #f3f4f6;
    color: #475569;
    font-size: 9px;
    font-weight: 700;
    padding: 4px 6px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
    z-index: 2;
}

.qc-prod-img-box {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
    border-radius: 12px;
    overflow: hidden;
}

.qc-prod-img-box img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.qc-product-card:hover .qc-prod-img-box img {
    transform: scale(1.08);
}

.qc-prod-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.qc-prod-title {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    line-height: 1.3;
    margin-bottom: 5px;
    /* Truncate to 2 lines */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.qc-prod-weight {
    font-size: 12px;
    color: #64748b;
    margin-bottom: 12px;
}

.qc-price-add-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: auto; /* Pushes to bottom */
}

/* Price Formatting */
.qc-prod-price {
    display: flex;
    flex-direction: column;
}

.qc-prod-price del {
    font-size: 11px;
    color: #94a3b8;
    text-decoration: line-through;
}

.qc-prod-price ins {
    text-decoration: none;
}

.qc-prod-price .woocommerce-Price-amount {
    font-size: 15px;
    font-weight: 800;
    color: #1e293b;
}

/* --- Override WooCommerce ADD Button (Premium Look) --- */
.qc-add-btn-wrapper .button {
    background-color: #fef0ec; /* Light Orange */
    color: var(--brand-orange);
    border: 1px solid var(--brand-orange);
    font-size: 12px !important;
    font-weight: 800 !important;
    padding: 6px 18px !important;
    border-radius: 8px !important;
    text-transform: uppercase;
    transition: all 0.2s ease;
}

.qc-add-btn-wrapper .button:hover {
    background-color: var(--brand-orange);
    color: #ffffff;
}

/* Loading state for AJAX */
.qc-add-btn-wrapper .button.loading {
    opacity: 0.7;
    pointer-events: none;
}

.qc-add-btn-wrapper .button.added {
    background-color: var(--brand-green);
    color: #fff;
    border-color: var(--brand-green);
}

/* --- Arrows --- */
.prod-arrow {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    background: #ffffff;
    border: 1px solid #e2e8f0;
    color: var(--brand-orange);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    transition: all 0.2s ease;
}

.prod-arrow:hover {
    background: var(--brand-orange);
    color: #ffffff;
}

.prod-prev { left: -15px; }
.prod-next { right: -15px; }

/* =======================================================
   RESPONSIVE DESIGN
   ======================================================= */
@media screen and (max-width: 1024px) {
    .qc-product-card {
        flex: 0 0 calc(25% - 11px); /* 4 items on tablet */
    }
}

@media screen and (max-width: 768px) {
    .qc-product-card {
        flex: 0 0 calc(100% - 0px); /* Approx 2.5 items on mobile to show it's scrollable */
        padding: 10px;
    }

    .qc-prod-title { font-size: 13px; }
    .qc-prod-price .woocommerce-Price-amount { font-size: 14px; }
    
    .qc-add-btn-wrapper .button {
        padding: 5px 12px !important;
        font-size: 11px !important;
    }

    /* Hide arrows on mobile for native swipe */
    .prod-arrow { display: none; }
}
/* --- Wishlist Button (Heart Icon) --- */
.qc-wish-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e2e8f0;
    color: #94a3b8;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 5;
    transition: all 0.2s ease;
    padding: 0;
}

.qc-wish-btn:hover {
    color: var(--brand-orange);
    border-color: var(--brand-orange);
}

.qc-wish-btn.active {
    color: var(--brand-orange);
}

/* --- Action Row Flex Adjustments --- */
.qc-price-action-row {
    display: flex;
    margin-top: auto;
    gap: 10px;
    justify-content: space-between;
}

/* Button Container */
.qc-action-btns {
    display: flex;
    gap: 8px;
    width: 100%;
}

/* Base style for BOTH buttons to keep them perfectly equal */
.qc-action-btns .ajax_add_to_cart, 
.qc-action-btns .button,
.qc-action-btns .qc-buy-btn {
    flex: 1; /* Dono buttons barabar space lenge */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center;
    padding: 8px 4px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    border-radius: 6px !important;
    text-transform: uppercase;
    transition: all 0.2s ease;
    line-height: 1 !important;
    min-height: 32px;
    text-decoration: none;
}

/* Custom "ADD" Button Styling (Orange Theme) */
.qc-action-btns .ajax_add_to_cart {
    background-color: #fef0ec !important;
    color: var(--brand-orange) !important;
    border: 1px solid var(--brand-orange) !important;
}

.qc-action-btns .ajax_add_to_cart:hover {
    background-color: var(--brand-orange) !important;
    color: #ffffff !important;
}

/* Custom "BUY" Button Styling (Green Theme) */
.qc-action-btns .qc-buy-btn {
    background-color: var(--brand-green) !important;
    color: #ffffff !important;
    border: 1px solid var(--brand-green) !important;
}

.qc-action-btns .qc-buy-btn:hover {
    background-color: #3b8a3e !important;
    border-color: #3b8a3e !important;
}

/* Loading state for AJAX (WooCommerce Default) */
.qc-action-btns .button.loading {
    opacity: 0.7;
    pointer-events: none;
}

.qc-action-btns .button.added {
    background-color: var(--brand-green) !important;
    color: #fff !important;
    border-color: var(--brand-green) !important;
}

/* --- Mobile Responsiveness for Buttons --- */
@media screen and (max-width: 768px) {
    .qc-action-btns {
        flex-direction: column; /* Mobile par buttons upar-neeche honge taaki text na kate */
        gap: 5px;
    }
    
    .qc-action-btns .ajax_add_to_cart, 
    .qc-action-btns .qc-buy-btn {
        padding: 6px 4px !important;
        font-size: 10px !important;
        min-height: 28px;
    }
}
/* --- Hide WooCommerce Default "View Cart" Link --- */
.qc-action-btns .added_to_cart {
    display: none !important;
}

/* --- Keep ADD button text in single line --- */
.qc-action-btns .ajax_add_to_cart {
    white-space: nowrap !important; /* Text ko 2 line me tootne se rokega */
    background-color: #fef0ec !important;
    color: var(--brand-orange) !important;
    border: 1px solid var(--brand-orange) !important;
}

.qc-action-btns .ajax_add_to_cart:hover {
    background-color: var(--brand-orange) !important;
    color: #ffffff !important;
}

/* --- Style when Item is Added (Solid Orange) --- */
/* Green nahi karenge taaki wo 'Buy' button jaisa confuse na kare */
.qc-action-btns .button.added {
    background-color: var(--brand-orange) !important;
    color: #fff !important;
    border-color: var(--brand-orange) !important;
}

.qc-action-btns .button.added::after {
    /* WooCommerce default added icon (✓) hide karne ke liye */
    display: none !important; 
}
/* =======================================================
   CUSTOM ADD TO CART TOAST NOTIFICATION (POPUP)
   ======================================================= */
.qc-cart-toast {
    position: fixed;
    top: -100px; /* Hidden above the screen */
    left: 50%;
    transform: translateX(-50%);
    background-color: #ffffff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 16px;
    z-index: 99999;
    width: 90%;
    max-width: 380px;
    transition: top 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); /* Bouncy spring animation */
    pointer-events: none; /* User can click through it when hidden */
}

.qc-cart-toast.show {
    top: 20px; /* Slides down into view */
    pointer-events: auto;
}

.qc-toast-content {
    display: flex;
    align-items: center;
    gap: 15px;
}

.qc-toast-img {
    width: 45px;
    height: 45px;
    background-color: #f8fafc;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    flex-shrink: 0;
}

.qc-toast-img img {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
}

.qc-toast-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.qc-toast-success-text {
    margin: 0 0 2px 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--brand-green);
    display: flex;
    align-items: center;
    gap: 4px;
    text-transform: uppercase;
}

.qc-toast-info h4 {
    margin: 0 0 2px 0;
    font-size: 13px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.2;
    /* Truncate text if too long */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

.qc-toast-info span {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
}

.qc-toast-view-btn {
    background-color: #fef0ec;
    color: var(--brand-orange);
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
    padding: 8px 14px;
    border-radius: 6px;
    transition: all 0.2s ease;
    text-transform: uppercase;
}

.qc-toast-view-btn:hover {
    background-color: var(--brand-orange);
    color: #ffffff;
}

/* Mobile Adjustments */
@media screen and (max-width: 768px) {
    .qc-cart-toast.show {
        top: 15px; /* Thoda aur upar rakhenge mobile par */
    }
    
    .qc-toast-info h4 {
        max-width: 140px; /* Screen ke hisaab se chota */
    }
}
/* --- Discount Badge (Top Left Corner) --- */
.qc-discount-badge {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #079830; /* Soft green from screenshot */
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 16px 0 16px 0; /* Only top-left and bottom-right rounded */
    z-index: 3;
}

/* --- Category Label --- */
.qc-cat-label {
    font-size: 11px;
    color: #adadad;
    margin-bottom: 4px;
    display: block;
}
.qc-cat-label a {
    color: #adadad;
    text-decoration: none;
}
.qc-cat-label a:hover {
    color: var(--brand-green);
}

/* --- Star Rating --- */
.qc-star-rating {
    font-size: 12px;
    color: #f6c000; /* Gold color */
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
}
.qc-star-rating .empty-stars {
    color: #d1d5db; /* Gray stars */
}
.qc-star-rating .review-count {
    color: #9ca3af;
    font-size: 11px;
}

/* --- Price Update (Large Green) --- */
.qc-prod-price .woocommerce-Price-amount {
    font-size: 18px;
    font-weight: 800;
    color: #3bb77e; /* Green color from screenshot */
}
.qc-prod-price del .woocommerce-Price-amount {
    font-size: 13px;
    font-weight: 600;
    color: #adadad; /* Gray strikethrough */
}

/* --- Refined Add Button --- */
.qc-add-btn-wrapper .ajax_add_to_cart {
    background-color: #e8f6ea !important; /* Very light green */
    color: #3bb77e !important;
    border: none !important;
    font-size: 13px !important;
    padding: 8px 20px !important;
    border-radius: 6px !important;
	text-decoration: none;
}
.qc-add-btn-wrapper .ajax_add_to_cart:hover {
    background-color: #3bb77e !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}
/* =======================================================
   MULTI-BANNER GRID / SLIDER (App Style)
   ======================================================= */
.qc-banner-grid {
    display: flex;
    gap: 20px;
    width: 100%;
}

/* Agar sirf 1 banner upload kiya hai, toh wo pura bada dikhega */
.qc-banner-grid.single-banner .qc-banner-card {
    flex: 1 1 100%;
}

/* Agar multiple banners hain, toh equally divide honge */
.qc-banner-card {
    flex: 1 1 calc(33.333% - 15px); /* Desktop pe 3 banner aaram se aa jayenge */
    border-radius: 16px;
    overflow: hidden;
    background-color: #f8fafc;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: block;
}

.qc-banner-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.qc-banner-card img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Mobile & Tablet Adjustments (Blinkit style horizontal swipe) */
@media screen and (max-width: 768px) {
    .qc-banner-grid {
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 12px;
        padding-bottom: 10px; /* Space for shadow */
        
        /* Hide scrollbar */
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    
    .qc-banner-grid::-webkit-scrollbar {
        display: none;
    }

    .qc-banner-card {
        /* Mobile par banners screen se thoda bahar jayenge taaki user ko swipe karne ka hint mile */
        flex: 0 0 85%; 
        scroll-snap-align: center;
        border-radius: 12px;
    }
    
    /* Agar ek banner hai, to wo screen ke hisaab se poora dikhega */
    .qc-banner-grid.single-banner .qc-banner-card {
        flex: 0 0 100%;
    }
}

/* =======================================================
   PRODUCT GRID LAYOUT (NON-SLIDER)
   ======================================================= */
.qc-product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Desktop par 4 cards ek line mein */
    gap: 20px;
    width: 100%;
}

/* Yahan hum card ko zyad flex-grow denge taaki wo grid area poora use kare */
.qc-product-grid .qc-product-card {
    flex: unset; 
    width: 100%;
    margin: 0;
}

/* --- View More Button --- */
.qc-view-more-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 35px;
}

.qc-view-more-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #ffffff;
    color: var(--brand-green);
    border: 2px solid var(--brand-green);
    padding: 12px 35px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.3s ease;
}

.qc-view-more-btn:hover {
    background-color: var(--brand-green);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(72, 166, 76, 0.2);
}

.qc-view-more-btn:hover svg {
    transform: translateX(4px); /* Arrow aage ki taraf move hoga */
    transition: transform 0.3s ease;
}

/* =======================================================
   RESPONSIVE GRID (Tablet & Mobile)
   ======================================================= */
@media screen and (max-width: 1024px) {
    .qc-product-grid {
        grid-template-columns: repeat(3, 1fr); /* Tablet par 3 cards ki line */
        gap: 15px;
    }
}

@media screen and (max-width: 768px) {
    .qc-product-grid {
        grid-template-columns: repeat(1, 1fr); /* Mobile par 2-2 cards ki line (Standard E-commerce) */
        gap: 12px;
    }

    .qc-view-more-wrapper {
        margin-top: 25px;
    }

    .qc-view-more-btn {
        width: 100%; /* Mobile par button full width aayega */
        justify-content: center;
        padding: 12px 0;
    }
}
/* --- Header Wishlist Counter Badge --- */
.header-icon.header-wishlist .wishlist-count {
    position: absolute;
    top: -8px;
    right: -12px;
    background-color: var(--brand-orange); /* Same logic as cart */
    color: var(--bg-white);
    font-size: 11px;
    font-weight: bold;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: transform 0.2s ease;
}

/* Badge ko chhupa do agar koi item nahi hai (Optional clean UI) */
.header-icon.header-wishlist .wishlist-count:empty,
.header-icon.header-wishlist .wishlist-count:contains('0') {
    display: none;
}

.wishlist-banner {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    padding: 30px 0;
}
.wishlist-banner img {
    width: 100%;
    height: auto;
    display: block;
	border-radius: 16px;
}

/* Pagination Styling */
.qc-pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.qc-pagination .page-numbers {
    padding: 10px 15px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    text-decoration: none;
    color: #475569;
    font-weight: 600;
	width: max-content;
}
.qc-pagination .page-numbers.current {
    background-color: var(--brand-green);
    color: #ffffff;
    border-color: var(--brand-green);
}
.qc-pagination .page-numbers:hover:not(.current) {
    background-color: #f1f5f9;
}

/* Container & Header */
.qc-cart-container {
    margin: 50px auto;
    padding: 0 20px;
    font-family: inherit;
}

.qc-cart-header {
    margin-bottom: 30px;
}

.qc-page-title {
    font-size: 28px;
    font-weight: 800;
    color: #111827;
    margin: 0 0 5px 0;
}

.qc-cart-count {
    color: #6b7280;
    font-size: 15px;
    margin: 0;
}

/* Layout Grid */
.qc-cart-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 40px;
    align-items: flex-start;
}

/* --- LEFT SIDE: CART ITEMS --- */
.qc-cart-items-list {
    display: flex;
    flex-direction: column;
    gap: 16px; /* Space between each product card */
}

/* Individual Product Card */
.qc-cart-item-box {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 16px;
    transition: box-shadow 0.2s ease;
}

.qc-cart-item-box:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
    border-color: #d1d5db;
}

/* Product Image */
.qc-cart-image {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    background: #f9fafb;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
}

.qc-cart-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Product Details */
.qc-cart-details {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.qc-cart-name {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    text-decoration: none;
    line-height: 1.3;
}

.qc-cart-name:hover {
    color: var(--brand-green, #079830);
}

.qc-cart-price-wrap {
    font-weight: 700;
    color: #111827;
    font-size: 15px;
}

/* Actions (Qty + Delete) */
.qc-cart-actions {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: 15px;
}

/* Beautiful Quantity Input */
.qc-qty-wrapper .quantity {
    display: flex;
    align-items: center;
}

.qc-qty-wrapper input.qty {
    width: 50px;
    height: 36px;
    text-align: center;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-weight: 600;
    color: #111827;
    background: #fff;
    padding: 0;
}

/* Hide arrows from number input */
.qc-qty-wrapper input.qty::-webkit-outer-spin-button,
.qc-qty-wrapper input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Remove Icon */
.qc-remove-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #9ca3af;
    background: #f3f4f6;
    border-radius: 50%;
    transition: 0.2s;
}

.qc-remove-btn:hover {
    color: #ef4444;
    background: #fee2e2;
}

/* Update Button */
.qc-cart-update-action {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.qc-update-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f3f4f6;
    color: #374151;
    border: none;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.2s;
}

.qc-update-btn:hover {
    background: #e5e7eb;
    color: #111827;
}

/* --- RIGHT SIDE: BILL DETAILS --- */
.qc-cart-sidebar {
    position: sticky;
    top: 40px;
}

.qc-bill-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02);
}

.qc-bill-title {
    font-size: 18px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 20px;
}

.qc-bill-row {
    display: flex;
    justify-content: space-between;
    font-size: 15px;
    color: #4b5563;
    margin-bottom: 12px;
}

.qc-amount {
    font-weight: 600;
    color: #111827;
}

.qc-bill-divider {
    height: 1px;
    background: #e5e7eb;
    margin: 16px 0;
    border-style: dashed;
    border-width: 1px;
}

.qc-grand-total {
    font-size: 18px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 0;
}

.qc-grand-total .qc-amount {
    color: var(--brand-green, #079830);
    font-size: 20px;
}

/* Checkout Button */
.qc-checkout-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--brand-green, #079830);
    color: #fff;
    padding: 18px 24px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    margin-top: 20px;
    transition: background 0.3s, transform 0.2s;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
	top: 15px;
    position: relative;
}

.qc-checkout-button:hover {
    background: #059669;
    transform: translateY(-2px);
    color: #fff;
}

/* Responsive (Mobile View) */
@media (max-width: 768px) {
    .qc-cart-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .qc-cart-item-box {
        position: relative;
        padding-bottom: 24px;
    }
    
    .qc-cart-actions {
        position: absolute;
        bottom: 16px;
        left: 116px; /* Aligns with text */
        margin: 0;
    }
    
    .qc-remove-btn {
        position: absolute;
        right: 16px;
        top: 16px;
        width: 32px;
        height: 32px;
    }
}
/* Container & Banner */
.qc-banner-section {
    margin: 30px auto 0;
    padding: 0 20px;
}
.qc-banner-section img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.qc-checkout-container {
    margin: 40px auto 80px;
    padding: 0 20px;
    font-family: inherit;
    background-color: #f8fafc; /* Premium light background */
}

.qc-checkout-header {
    text-align: center;
    margin-bottom: 40px;
}

.qc-page-title {
    font-size: 32px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 5px;
}

.qc-subtitle {
    color: #64748b;
    font-size: 16px;
}

/* Layout Grid */
.qc-checkout-layout {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 40px;
    align-items: flex-start;
}

/* Left Side - Form Card */
.qc-form-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 4px 25px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}

/* Step UI (1, 2 indicators) */
.qc-form-step {
    position: relative;
}
.qc-step-number {
    position: absolute;
    left: -20px;
    top: -5px;
    width: 32px;
    height: 32px;
    background: #079830;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3);
}
.qc-step-content h3 {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 25px;
    padding-left: 25px; /* space for number */
}

/* Modern Form Inputs Override */
.woocommerce form .form-row {
    margin-bottom: 20px;
}
.woocommerce form .form-row label {
    font-weight: 600;
    color: #334155;
    font-size: 14px;
    margin-bottom: 8px;
    display: inline-block;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .select2-container .select2-selection {
    width: 100%;
    padding: 14px 16px !important;
    height: auto !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 12px !important;
    background-color: #f8fafc !important;
    color: #0f172a !important;
    font-size: 15px !important;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: none !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
    border-color: #079830 !important;
    background-color: #ffffff !important;
    outline: none !important;
}

/* Right Side - Order Summary Box */
.qc-sticky-sidebar {
    position: sticky;
    top: 30px;
}
.qc-summary-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 35px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.06);
    border: 1px solid #f1f5f9;
}
.qc-summary-title {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 25px;
    border-bottom: 2px dashed #e2e8f0;
    padding-bottom: 15px;
}

/* Clean up WooCommerce Table */
.qc-order-review-wrap table.shop_table {
    border: none;
    width: 100%;
    border-collapse: collapse;
}
.qc-order-review-wrap table.shop_table th,
.qc-order-review-wrap table.shop_table td {
    border: none;
    padding: 12px 0;
    background: transparent;
}
.qc-order-review-wrap table.shop_table thead {
    display: none; /* Hide product/total heading for clean look */
}
.qc-order-review-wrap table.shop_table tbody td.product-name {
    font-weight: 600;
    color: #1e293b;
    font-size: 15px;
}
.qc-order-review-wrap table.shop_table tbody td.product-total {
    text-align: right;
    font-weight: 700;
    color: #475569;
}
.qc-order-review-wrap table.shop_table tfoot tr {
    border-top: 1px solid #f1f5f9;
}
.qc-order-review-wrap table.shop_table tfoot th {
    font-weight: 600;
    color: #64748b;
}
.qc-order-review-wrap table.shop_table tfoot td {
    text-align: right;
    font-weight: 700;
    color: #0f172a;
}
/* Grand Total Row */
.qc-order-review-wrap table.shop_table tfoot tr.order-total th,
.qc-order-review-wrap table.shop_table tfoot tr.order-total td {
    padding-top: 20px;
    font-size: 20px;
    color: #0f172a;
}
.qc-order-review-wrap table.shop_table tfoot tr.order-total td {
    color: #079830; /* Brand green */
}

/* App-style Payment Methods Box */
#payment {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-top: 30px;
}
#payment ul.payment_methods {
    border: none !important;
    padding: 0 !important;
}
#payment ul.payment_methods li {
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 16px;
    padding: 18px 20px;
    margin-bottom: 15px;
    transition: 0.3s ease;
}
/* Active/Selected Payment Method */
#payment ul.payment_methods li:focus-within {
    border-color: #079830;
    background: #ecfdf5;
}
#payment ul.payment_methods li input {
    accent-color: #079830;
    transform: scale(1.2);
    margin-right: 10px;
}
#payment ul.payment_methods li label {
    font-weight: 700;
    color: #0f172a;
    font-size: 16px;
    cursor: pointer;
}
#payment div.payment_box {
    background: transparent !important;
    color: #475569 !important;
    padding: 10px 0 0 30px !important;
    font-size: 14px;
    box-shadow: none !important;
}
#payment div.payment_box::before {
    display: none !important; /* Hide default arrow */
}

/* Massive Place Order Button */
#payment #place_order {
    width: 100%;
    background: #079830;
    color: #fff;
    padding: 20px;
    border-radius: 16px;
    font-size: 18px;
    font-weight: 800;
    border: none;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 10px 25px rgba(16, 185, 129, 0.3);
    margin-top: 20px;
}
#payment #place_order:hover {
    background: #059669;
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(16, 185, 129, 0.4);
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .qc-checkout-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .qc-form-card {
        padding: 25px 20px;
        border-radius: 20px;
    }
    .qc-summary-card {
        padding: 25px 20px;
    }
    .qc-step-number {
        left: -10px;
    }
    .qc-step-content h3 {
        padding-left: 35px;
    }
}

/* Page Background */
.qc-success-page-wrapper {
    padding: 60px 20px;
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: inherit;
}

/* Center Card (App Modal Style) */
.qc-success-card {
    background: #ffffff;
    max-width: 500px;
    width: 100%;
    border-radius: 24px;
    padding: 50px 40px;
    text-align: center;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
}

/* --- Animated Checkmark (The Wow Factor) --- */
.qc-animated-icon-box {
    width: 90px;
    height: 90px;
    margin: 0 auto 25px;
}

.qc-checkmark {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: block;
    stroke-width: 4;
    stroke: #079830;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #079830;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.qc-checkmark-circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 4;
    stroke-miterlimit: 10;
    stroke: #079830;
    fill: none;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.qc-checkmark-check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% { stroke-dashoffset: 0; }
}
@keyframes scale {
    0%, 100% { transform: none; }
    50% { transform: scale3d(1.1, 1.1, 1); }
}
@keyframes fill {
    100% { box-shadow: inset 0px 0px 0px 45px #ecfdf5; } /* light green inner glow */
}

/* Typography */
.qc-success-title {
    font-size: 28px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 10px;
}

.qc-success-subtitle {
    font-size: 15px;
    color: #64748b;
    margin-bottom: 35px;
    line-height: 1.5;
}

/* Receipt Style Box */
.qc-receipt-box {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 16px;
    padding: 25px;
    text-align: left;
    margin-bottom: 35px;
}

.qc-receipt-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.qc-receipt-row:last-child {
    margin-bottom: 0;
}

.qc-receipt-label {
    font-size: 14px;
    color: #64748b;
    font-weight: 500;
}

.qc-receipt-value {
    font-size: 15px;
    color: #1e293b;
    font-weight: 700;
}

.qc-receipt-divider {
    height: 1px;
    background: #e2e8f0;
    margin: 20px 0;
}

.qc-total-row .qc-receipt-label {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.qc-total-row .amount-highlight {
    font-size: 20px;
    color: #079830;
    font-weight: 800;
}

/* Action Buttons */
.qc-action-buttons {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.qc-btn-primary {
    display: block;
    width: 100%;
    background: #079830;
    color: #fff;
    padding: 16px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}

.qc-btn-primary:hover {
    background: #059669;
    transform: translateY(-2px);
    color: #fff;
}

.qc-btn-secondary {
    display: block;
    width: 100%;
    background: transparent;
    color: #079830;
    padding: 16px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    border: 2px solid #079830;
    transition: 0.3s;
}

.qc-btn-secondary:hover {
    background: #ecfdf5;
}

/* Hide Default WooCommerce Boring Tables */
.qc-woo-default-hooks h2,
.qc-woo-default-hooks table.shop_table,
.qc-woo-default-hooks .woocommerce-order-details,
.qc-woo-default-hooks .woocommerce-customer-details {
    display: none !important;
}

/* Show only gateway messages if any */
.qc-woo-default-hooks p {
    font-size: 14px;
    color: #64748b;
    margin-top: 20px;
}

/* Mobile View */
@media (max-width: 480px) {
    .qc-success-card {
        padding: 40px 20px;
    }
    .qc-success-title {
        font-size: 24px;
    }
}

/* Container & Banner */
.qc-banner-section {
    margin: 30px auto 0;
    padding: 0 20px;
}
.qc-banner-section img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.qc-myaccount-wrapper {
    margin: 40px auto 80px;
    padding: 0 20px;
    font-family: inherit;
}

/* --- Profile Header (App Style) --- */
.qc-profile-header {
    background: linear-gradient(135deg, #079830 0%, #059669 100%);
    border-radius: 24px;
    padding: 40px;
    display: flex;
    align-items: center;
    gap: 30px;
    margin-bottom: 40px;
    box-shadow: 0 15px 35px rgba(16, 185, 129, 0.2);
    color: #fff;
}

.qc-profile-avatar img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 4px solid rgba(255, 255, 255, 0.3);
    object-fit: cover;
}

.qc-welcome-text {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.8;
    font-weight: 600;
}

.qc-profile-name {
    font-size: 32px;
    font-weight: 800;
    margin: 5px 0;
    color: #fff;
}

.qc-profile-email {
    font-size: 16px;
    opacity: 0.9;
    margin: 0;
}

/* --- Layout Grid --- */
.qc-myaccount-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 40px;
    align-items: flex-start;
}

/* --- Left Sidebar (Navigation) --- */
.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background: #ffffff;
    border-radius: 20px;
    padding: 15px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}

.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li {
    margin-bottom: 5px;
}

.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li:last-child {
    margin-bottom: 0;
}

.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 14px 20px;
    color: #475569;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
}

/* Hover & Active State */
.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li a:hover {
    background: #f8fafc;
    color: #079830;
    transform: translateX(5px);
}

.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li.is-active a {
    background: #ecfdf5;
    color: #079830;
}

/* Logout Button special styling */
.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
    color: #ef4444;
}
.qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    background: #fef2f2;
}

/* --- Right Content Area (Card) --- */
.qc-myaccount-content-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}

/* Form Styling inside My Account */
.qc-myaccount-content-card form .form-row {
    margin-bottom: 20px;
}
.qc-myaccount-content-card form label {
    font-weight: 600;
    color: #334155;
    font-size: 14px;
    margin-bottom: 8px;
    display: block;
}
.qc-myaccount-content-card form input.input-text,
.qc-myaccount-content-card form textarea {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background-color: #f8fafc;
    color: #0f172a;
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
}
.qc-myaccount-content-card form input.input-text:focus,
.qc-myaccount-content-card form textarea:focus {
    border-color: #079830;
    background-color: #ffffff;
    outline: none;
}

/* Clean Tables (For Orders & Downloads) */
.qc-myaccount-content-card table.shop_table {
    width: 100%;
    border-collapse: collapse;
    border: none;
}
.qc-myaccount-content-card table.shop_table thead th {
    background: #f8fafc;
    padding: 15px;
    color: #475569;
    font-weight: 600;
    font-size: 14px;
    text-align: left;
    border: none;
    border-radius: 8px;
}
.qc-myaccount-content-card table.shop_table tbody td {
    padding: 18px 15px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    font-size: 15px;
    vertical-align: middle;
}
.qc-myaccount-content-card table.shop_table tbody tr:last-child td {
    border-bottom: none;
}

/* Buttons inside My Account */
.qc-myaccount-content-card .button {
    background: #079830;
    color: #fff;
    padding: 12px 24px;
    border-radius: 10px;
    font-weight: 700;
    border: none;
    text-decoration: none;
    transition: 0.3s;
    display: inline-block;
}
.qc-myaccount-content-card .button:hover {
    background: #059669;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2);
}

/* Addresses Grid */
.qc-myaccount-content-card .u-columns.col2-set {
/*     display: grid; */
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}
.qc-myaccount-content-card .u-column1,
.qc-myaccount-content-card .u-column2 {
    width: 100%;
    float: none;
    background: #f8fafc;
    padding: 25px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
}
.qc-myaccount-content-card address {
    font-style: normal;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 15px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .qc-profile-header {
        flex-direction: column;
        text-align: center;
        padding: 30px 20px;
    }
    .qc-myaccount-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul {
        display: flex;
        overflow-x: auto;
        padding: 10px;
        white-space: nowrap;
		flex-wrap: wrap;
    }
    .qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul li {
        margin-bottom: 0;
        margin-right: 10px;
    }
    .qc-myaccount-content-card {
        padding: 25px 20px;
    }
    .qc-myaccount-content-card .u-columns.col2-set {
        grid-template-columns: 1fr;
    }
    .qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
        height: 4px;
    }
    .qc-myaccount-sidebar .woocommerce-MyAccount-navigation ul::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 4px;
    }
}

/* ==================================================
   LOGIN & SIGNUP PAGE STYLING
================================================== */
.qc-auth-wrapper {
    max-width: 1000px;
    margin: 50px auto 100px;
    padding: 0 20px;
    font-family: inherit;
}

.qc-auth-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.qc-auth-single-card {
    max-width: 500px;
    margin: 0 auto;
}

/* Card Styling */
.qc-auth-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
    border: 1px solid #f1f5f9;
}

.qc-auth-header {
    text-align: center;
    margin-bottom: 30px;
}

.qc-auth-header h2 {
    font-size: 26px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 8px;
}

.qc-auth-header p {
    color: #64748b;
    font-size: 15px;
    margin: 0;
}

/* Auth Forms */
.qc-auth-card form .form-row {
    margin-bottom: 20px;
}

.qc-auth-card form label {
    font-weight: 600;
    color: #334155;
    font-size: 14px;
    margin-bottom: 8px;
    display: block;
}

.qc-auth-card form input.input-text {
    width: 100%;
    padding: 15px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background-color: #f8fafc;
    color: #0f172a;
    font-size: 15px;
    transition: 0.3s ease;
}

.qc-auth-card form input.input-text:focus {
    border-color: #079830;
    background-color: #ffffff;
    outline: none;
}

/* Remember Me & Lost Password */
.qc-auth-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
    font-size: 14px;
}

.qc-auth-actions input[type="checkbox"] {
    accent-color: #079830;
    transform: scale(1.2);
    margin-right: 5px;
}

.qc-auth-actions a {
    color: #079830;
    font-weight: 600;
    text-decoration: none;
}

.qc-auth-actions a:hover {
    text-decoration: underline;
}

/* Submit Buttons */
.qc-btn-full {
    width: 100%;
    background: #079830 !important;
    color: #fff !important;
    padding: 16px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border: none !important;
    cursor: pointer;
    transition: 0.3s !important;
    text-align: center;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}

.qc-btn-full:hover {
    background: #059669 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.3);
}

.qc-password-notice {
    font-size: 13px;
    color: #64748b;
    background: #f1f5f9;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 20px;
}


/* ==================================================
   DASHBOARD GRID STYLING
================================================== */
.qc-dashboard-wrapper {
    animation: fadeIn 0.5s ease;
}

.qc-dashboard-welcome {
    background: #f8fafc;
    padding: 20px 25px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    margin-bottom: 30px;
    color: #475569;
    line-height: 1.6;
}

.qc-dashboard-welcome strong {
    color: #0f172a;
}

.qc-dashboard-welcome a {
    color: #079830;
    font-weight: 600;
    text-decoration: none;
}

/* Grid Cards */
.qc-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.qc-dash-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 30px 20px;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    display: block;
}

.qc-dash-card:hover {
    border-color: #079830;
    box-shadow: 0 10px 25px rgba(16, 185, 129, 0.08);
    transform: translateY(-5px);
}

.qc-dash-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 15px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qc-dash-card h3 {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 5px 0;
}

.qc-dash-card p {
    font-size: 14px;
    color: #64748b;
    margin: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .qc-auth-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .qc-auth-card {
        padding: 30px 20px;
    }
    .qc-dashboard-grid {
        grid-template-columns: 1fr;
    }
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    float: unset;
    width: 100%;
}
.woocommerce-account .woocommerce-MyAccount-content {
    float: right;
    width: 100%;
}

/* Blog Container */
.qc-blog-container {
    margin: 40px auto 80px;
    padding: 0 20px;
    font-family: inherit;
}

.qc-blog-header {
    text-align: center;
    margin-bottom: 40px;
}

.qc-blog-header .qc-page-title {
    font-size: 32px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 5px;
}

.qc-blog-header .qc-subtitle {
    color: #64748b;
    font-size: 16px;
}

/* Blog Grid */
.qc-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* Single Blog Card */
.qc-blog-card {
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.04);
    border: 1px solid #f1f5f9;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.qc-blog-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    border-color: #e2e8f0;
}

/* Image Wrapper */
.qc-blog-img-link {
    display: block;
    position: relative;
    overflow: hidden;
    height: 220px;
}

.qc-blog-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.qc-blog-card:hover .qc-blog-img {
    transform: scale(1.05); /* Hover pe image halki si zoom hogi */
}

/* Fallback Image Box */
.qc-blog-img-fallback {
    width: 100%;
    height: 100%;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Category Badge */
.qc-blog-cat-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: #079830; /* Brand green */
    color: #fff;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 8px;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(16, 185, 129, 0.3);
    z-index: 2;
}

/* Card Content */
.qc-blog-content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.qc-blog-meta-top {
    margin-bottom: 10px;
}

.qc-blog-date {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}

.qc-blog-title {
    text-decoration: none;
    margin-bottom: 12px;
    display: block;
}

.qc-blog-title h2 {
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.4;
    margin: 0;
    transition: color 0.2s;
}

.qc-blog-title:hover h2 {
    color: #079830;
}

.qc-blog-excerpt {
    font-size: 15px;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 25px;
    flex-grow: 1; /* Pushes footer to bottom */
}

/* Read More Button */
.qc-blog-footer {
    margin-top: auto;
    border-top: 1px solid #f1f5f9;
    padding-top: 15px;
}

.qc-blog-read-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #079830;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.qc-blog-read-more svg {
    transition: transform 0.3s ease;
}

.qc-blog-card:hover .qc-blog-read-more svg {
    transform: translateX(5px); /* Arrow right shift hogi hover pe */
}

.qc-no-posts {
    text-align: center;
    grid-column: 1 / -1;
    color: #64748b;
    font-size: 16px;
    padding: 40px;
    background: #f8fafc;
    border-radius: 16px;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    .qc-blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .qc-blog-grid {
        grid-template-columns: 1fr;
    }
    .qc-blog-img-link {
        height: 200px;
    }
}

/* Page Background */
.qc-single-page-wrapper {
    background-color: #f8fafc;
    padding-bottom: 80px;
    font-family: inherit;
}

/* Featured Image Banner */
.qc-single-banner {
    max-width: 1200px;
    margin: 30px auto 0;
    padding: 0 20px;
}

.qc-banner-img-wrap {
    width: 100%;
    height: 450px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.qc-banner-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Main Content Card (Overlap Effect) */
.qc-single-content-container {
    max-width: 850px; /* Reading ke liye patla container best hota hai */
    margin: -100px auto 0; /* Image ke upar overlap karega */
    background: #ffffff;
    border-radius: 24px;
    padding: 50px 60px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.06);
    position: relative;
    z-index: 10;
    border: 1px solid #f1f5f9;
}

/* Agar banner image na ho toh overlap margin hata do */
.qc-single-content-container.no-banner {
    margin-top: 50px;
}

/* Post Header */
.qc-single-header {
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 30px;
}

.qc-single-cat {
    margin-bottom: 15px;
}

.qc-cat-badge {
    background: #ecfdf5;
    color: #079830;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 50px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.qc-single-title {
    font-size: 36px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.3;
    margin-bottom: 20px;
}

.qc-single-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
}

.qc-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Post Body (Reading Typography) */
.qc-single-body {
    font-size: 18px;
    line-height: 1.8;
    color: #334155;
}

.qc-single-body h2, 
.qc-single-body h3 {
    color: #0f172a;
    font-weight: 800;
    margin: 35px 0 15px;
}

.qc-single-body p {
    margin-bottom: 25px;
}

.qc-single-body img {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
    margin: 20px 0;
}

.qc-single-body blockquote {
    background: #f8fafc;
    border-left: 4px solid #079830;
    padding: 20px 25px;
    margin: 30px 0;
    font-style: italic;
    color: #475569;
    border-radius: 0 12px 12px 0;
}

/* Tags Box */
.qc-single-tags {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px dashed #e2e8f0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.qc-tags-label {
    font-weight: 700;
    color: #0f172a;
    margin-right: 5px;
}

.qc-tag-link {
    background: #f1f5f9;
    color: #475569;
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: 0.3s;
}

.qc-tag-link:hover {
    background: #079830;
    color: #ffffff;
}

/* Comments Section Wrapper */
.qc-single-comments-wrapper {
    max-width: 850px;
    margin: 40px auto 0;
    padding: 0 20px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .qc-banner-img-wrap {
        height: 250px;
        border-radius: 16px;
    }
    .qc-single-content-container {
        margin: -50px 20px 0;
        padding: 30px 20px;
        border-radius: 16px;
    }
    .qc-single-title {
        font-size: 26px;
    }
    .qc-single-meta {
        flex-direction: column;
        gap: 10px;
    }
    .qc-single-body {
        font-size: 16px;
    }
}

/* ==================================================
   SHARE BUTTONS SECTION
================================================== */
.qc-single-footer-box {
    margin-top: 50px;
    padding-top: 25px;
    border-top: 2px dashed #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.qc-single-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.qc-share-wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
}

.qc-share-label {
    font-weight: 700;
    color: #0f172a;
    font-size: 15px;
}

.qc-share-links {
    display: flex;
    gap: 12px;
}

.qc-share-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    color: #ffffff;
    transition: all 0.3s ease;
}

.qc-share-btn.whatsapp { background: #25D366; }
.qc-share-btn.whatsapp:hover { background: #1ebd5a; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(37, 211, 102, 0.3); }

.qc-share-btn.facebook { background: #1877F2; }
.qc-share-btn.facebook:hover { background: #1565cc; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(24, 119, 242, 0.3); }

.qc-share-btn.twitter { background: #1DA1F2; }
.qc-share-btn.twitter:hover { background: #1a91da; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(29, 161, 242, 0.3); }


/* ==================================================
   COMMENTS SECTION STYLING (Premium Look)
================================================== */
.qc-single-comments-wrapper {
    max-width: 850px;
    margin: 40px auto 0;
    position: relative;
    z-index: 10;
}

.qc-comments-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px 50px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}

/* Comments Header */
.qc-comments-card .comments-title,
.qc-comments-card .comment-reply-title {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f1f5f9;
}

/* Comment List */
.qc-comments-card ol.comment-list {
    list-style: none;
    padding: 0;
    margin: 0 0 40px 0;
}

.qc-comments-card ol.comment-list li.comment {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #f1f5f9;
}

.qc-comments-card ol.comment-list li.comment:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Single Comment Block */
.qc-comments-card .comment-body {
    display: flex;
    gap: 20px;
}

.qc-comments-card .comment-author img.avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e2e8f0;
}

.qc-comments-card .comment-meta {
    flex-grow: 1;
}

.qc-comments-card .comment-author .fn {
    font-weight: 700;
    font-size: 16px;
    color: #0f172a;
    font-style: normal;
}

.qc-comments-card .comment-metadata {
    font-size: 13px;
    color: #64748b;
    margin-bottom: 10px;
    display: block;
}

.qc-comments-card .comment-metadata a {
    color: #64748b;
    text-decoration: none;
}

.qc-comments-card .comment-content p {
    color: #334155;
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 10px 0;
}

/* Reply Button */
.qc-comments-card .reply a {
    font-size: 13px;
    font-weight: 600;
    color: #079830;
    text-decoration: none;
    background: #ecfdf5;
    padding: 4px 12px;
    border-radius: 20px;
    transition: 0.3s;
}

.qc-comments-card .reply a:hover {
    background: #079830;
    color: #fff;
}

/* Nested Comments (Replies) */
.qc-comments-card ol.children {
    list-style: none;
    padding-left: 60px;
    margin-top: 30px;
}

/* ==================================================
   COMMENT FORM STYLING
================================================== */
.qc-comments-card .comment-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.qc-comments-card .comment-form label {
    font-weight: 600;
    color: #334155;
    font-size: 14px;
    margin-bottom: 8px;
    display: inline-block;
}

.qc-comments-card .comment-form input[type="text"],
.qc-comments-card .comment-form input[type="email"],
.qc-comments-card .comment-form input[type="url"],
.qc-comments-card .comment-form textarea {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background-color: #f8fafc;
    color: #0f172a;
    font-size: 15px;
    font-family: inherit;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.qc-comments-card .comment-form input:focus,
.qc-comments-card .comment-form textarea:focus {
    border-color: #079830;
    background-color: #ffffff;
    outline: none;
}

/* Comment Form Submit Button */
.qc-comments-card .form-submit {
    margin: 10px 0 0 0;
}

.qc-comments-card .submit {
    background: #079830;
    color: #fff;
    padding: 14px 30px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}

.qc-comments-card .submit:hover {
    background: #059669;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.3);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .qc-single-footer-box {
        flex-direction: column;
        align-items: flex-start;
    }
    .qc-comments-card {
        padding: 30px 20px;
    }
    .qc-comments-card ol.children {
        padding-left: 20px;
    }
    .qc-comments-card .comment-body {
        flex-direction: column;
        gap: 10px;
    }
}
/* Layout Container (Grid) */
.qc-single-layout-container {
    max-width: 1200px;
    margin: -100px auto 0; /* Image ke upar overlap */
    padding: 0 20px;
    position: relative;
    z-index: 10;
    display: grid;
    grid-template-columns: 1fr 350px; /* 1fr Left Content, 350px Sidebar */
    gap: 40px;
    align-items: flex-start;
}

.qc-single-layout-container.no-banner {
    margin-top: 50px;
}

/* Left Content Wrapper */
.qc-single-main {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.qc-single-content-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 50px 60px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.06);
    border: 1px solid #f1f5f9;
}

/* Make Comments take full width of Left Main */
.qc-single-comments-wrapper {
    max-width: 100%;
    margin: 0;
}

/* ==================================================
   RIGHT SIDEBAR STYLING
================================================== */
.qc-single-sidebar {
    position: sticky;
    top: 40px; /* Scrolls gracefully */
}

.qc-sidebar-widget {
    background: #ffffff;
    border-radius: 24px;
    padding: 30px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.04);
    border: 1px solid #f1f5f9;
}

.qc-sidebar-title {
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 25px;
    border-bottom: 2px dashed #e2e8f0;
    padding-bottom: 15px;
}

/* Sidebar Recent Posts List */
.qc-recent-posts-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 25px;
}

.qc-recent-post-item {
    display: flex;
    align-items: center;
    gap: 15px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.qc-recent-post-item:hover .qc-recent-post-info h4 {
    color: #079830;
}

.qc-recent-post-img {
    width: 70px;
    height: 70px;
    flex-shrink: 0;
    border-radius: 12px;
    overflow: hidden;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.qc-recent-post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.qc-sidebar-img-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qc-recent-post-info {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.qc-recent-post-info h4 {
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
    line-height: 1.4;
    transition: color 0.3s;
}

.qc-recent-date {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
}

/* Sidebar Button */
.qc-sidebar-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    background: #f8fafc;
    color: #079830;
    padding: 15px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
}

.qc-sidebar-btn:hover {
    background: #079830;
    color: #fff;
    border-color: #079830;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    .qc-single-layout-container {
        grid-template-columns: 1fr; /* Sidebar neeche chali jayegi */
        margin-top: -50px;
    }
    .qc-single-content-card {
        padding: 40px 30px;
    }
    .qc-single-sidebar {
        position: relative;
        top: 0;
    }
}
@media (max-width: 600px) {
    .qc-single-content-card {
        padding: 30px 20px;
    }
}

/* Container */
.qc-single-product-container {
    margin: 40px auto 80px;
    padding: 0 20px;
    font-family: inherit;
}

/* Layout Grid */
.qc-product-main-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: flex-start;
}

/* --- Left Side: Gallery --- */
.qc-sticky-sidebar {
    position: sticky;
    top: 40px;
}

.qc-gallery-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.04);
    border: 1px solid #f1f5f9;
}

.qc-gallery-card .woocommerce-product-gallery__image {
    border-radius: 16px;
    overflow: hidden;
}

.qc-gallery-card .flex-control-nav {
    margin-top: 15px;
    display: flex;
    gap: 10px;
    padding: 0;
}

.qc-gallery-card .flex-control-nav li img {
    border-radius: 8px;
    border: 2px solid transparent;
    transition: 0.3s;
    cursor: pointer;
}

.qc-gallery-card .flex-control-nav li img.flex-active {
    border-color: var(--brand-green, #079830);
}

/* --- Right Side: Info Card --- */
.qc-product-info-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.04);
    border: 1px solid #f1f5f9;
    margin-bottom: 20px;
}

.qc-product-cat-badge a {
    display: inline-block;
    background: #ecfdf5;
    color: var(--brand-green, #079830);
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 50px;
    text-transform: uppercase;
    text-decoration: none;
    margin-bottom: 15px;
}

.qc-product-title {
    font-size: 32px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.3;
    margin: 0 0 15px 0;
}

/* Rating Override */
.qc-product-rating-box .woocommerce-product-rating {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0;
}

.qc-product-divider {
    height: 1px;
    background: #f1f5f9;
    margin: 25px 0;
}

/* Price Section */
.qc-product-price-box p.price {
    font-size: 28px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 5px 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.qc-product-price-box p.price del {
    color: #94a3b8;
    font-size: 18px;
    font-weight: 600;
}
.qc-product-price-box p.price ins {
    text-decoration: none;
    color: var(--brand-green, #079830);
}
.qc-tax-note {
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}

/* Short Description */
.qc-product-short-desc {
    margin: 25px 0;
    font-size: 16px;
    color: #475569;
    line-height: 1.6;
}

/* Add to Cart Area */
.qc-product-action-box {
    background: #f8fafc;
    padding: 20px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    margin-bottom: 25px;
}

/* Quantity Input & Button Layout */
.qc-product-action-box form.cart {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    align-items: center;
}

.qc-product-action-box .quantity input.qty {
    width: 60px;
    height: 50px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    background: #fff;
    color: #0f172a;
}

/* Main Add To Cart Button */
.qc-product-action-box .single_add_to_cart_button {
    flex-grow: 1;
    height: 50px;
    background: var(--brand-green, #079830) !important;
    color: #fff !important;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 800;
    border: none;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 5px 15px rgba(16, 185, 129, 0.25);
    display: flex;
    justify-content: center;
    align-items: center;
}

.qc-product-action-box .single_add_to_cart_button:hover {
    background: #059669 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.35);
}

/* Meta Data (SKU, Categories) */
.qc-product-meta-box .product_meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
    color: #64748b;
    border-top: 1px dashed #e2e8f0;
    padding-top: 20px;
}
.qc-product-meta-box .product_meta span {
    font-weight: 600;
    color: #334155;
}
.qc-product-meta-box .product_meta a {
    color: var(--brand-green, #079830);
    text-decoration: none;
}

/* Trust Badges */
.qc-trust-badges {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
}

.qc-badge-item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 15px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02);
}

.qc-badge-item span {
    font-size: 12px;
    font-weight: 700;
    color: #475569;
}

/* Bottom Section (Tabs & Upsells) */
.qc-product-bottom-section {
    margin-top: 60px;
}

.qc-product-tabs-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.04);
    border: 1px solid #f1f5f9;
}

/* Tabs UI Styling */
.qc-product-tabs-card .woocommerce-tabs ul.tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    display: flex;
    gap: 20px;
    border-bottom: 2px solid #f1f5f9;
}

.qc-product-tabs-card .woocommerce-tabs ul.tabs li {
    margin: 0;
    padding: 0;
}

.qc-product-tabs-card .woocommerce-tabs ul.tabs li a {
    display: inline-block;
    padding: 12px 0;
    color: #64748b;
    font-weight: 700;
    font-size: 16px;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: 0.3s;
}

.qc-product-tabs-card .woocommerce-tabs ul.tabs li.active a {
    color: var(--brand-green, #079830);
    border-bottom-color: var(--brand-green, #079830);
}

/* Related Products Heading Fix */
.qc-product-tabs-card .related.products > h2,
.qc-product-tabs-card .upsells.products > h2 {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin: 50px 0 25px;
    border-bottom: 2px dashed #e2e8f0;
    padding-bottom: 15px;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    .qc-product-main-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .qc-sticky-sidebar {
        position: relative;
        top: 0;
    }
    .qc-product-title {
        font-size: 26px;
    }
    .qc-gallery-card, .qc-product-info-card, .qc-product-tabs-card {
        padding: 25px 20px;
    }
}
/* Quantity Box Modern Wrapper */
.quantity {
    display: inline-flex !important;
    align-items: center;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    height: 50px;
}

/* Default browser arrows (spinners) hide karna */
.quantity input[type="number"]::-webkit-inner-spin-button,
.quantity input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.quantity input[type="number"] {
    -moz-appearance: textfield;
}

/* Plus/Minus Buttons Styling */
.quantity .minus,
.quantity .plus {
    background: transparent;
    border: none;
    width: 45px;
    height: 100%;
    font-size: 22px;
    font-weight: 600;
    color: var(--brand-green, #079830);
    cursor: pointer;
    transition: background 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quantity .minus:hover,
.quantity .plus:hover {
    background: #ecfdf5;
    color: #059669;
}

/* Text Input Styling */
.quantity input.qty {
    width: 40px !important;
    height: 100% !important;
    border: none !important;
    background: transparent !important;
    text-align: center;
    font-weight: 800;
    font-size: 16px;
    color: #0f172a;
    padding: 0 !important;
    box-shadow: none !important;
}
/* Gallery Card */
.qc-gallery-card {
    background: #ffffff;
    padding: 20px;
    border-radius: 20px;
    border: 1px solid #f1f5f9;
}

/* Main Image */
.qc-main-gallery-img {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
    border-radius: 12px;
    overflow: hidden;
}
.qc-main-gallery-img img {
    width: 100%;
    height: 300px; /* Fixed height for consistency */
    object-fit: cover;
}
.qc-zoom-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: white;
    padding: 8px;
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Thumbnails Grid */
.qc-thumb-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.qc-thumb-item img {
    width: 100%;
    height: 80px;
    object-fit: cover;
    border-radius: 8px;
    cursor: pointer;
    border: 2px solid transparent;
}
.qc-thumb-item img:hover {
    border-color: var(--brand-green, #079830);
}
.qc-main-img-box img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 12px;
    transition: opacity 0.3s ease;
}

.qc-thumb-grid {
    display: flex;
    gap: 10px;
    margin-top: 15px;
    overflow-x: auto;
    padding-bottom: 5px;
}

.qc-thumb-item {
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 8px;
    overflow: hidden;
}

.qc-thumb-item.active {
    border-color: var(--brand-green, #079830);
}

.qc-thumb-item img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    display: block;
}
.woocommerce div.product form.cart {
    margin-bottom: 0;
}
/* ==================================================
   PREMIUM REVIEW SECTION STYLING
================================================== */

/* Reviews Wrapper */
#reviews {
    margin-top: 30px;
}

#reviews h2 {
    font-size: 24px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 25px;
}

/* Star Rating Styling */
.woocommerce .star-rating {
    color: #fbbf24 !important; /* Premium Amber Gold */
    font-size: 16px;
}

/* Individual Review Card */
ol.commentlist {
    list-style: none;
    padding: 0;
    margin: 0;
}

li.review {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 25px;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02);
    display: flex;
    gap: 20px;
}

/* Avatar */
li.review .avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #f8fafc;
}

/* Review Content */
.comment-text {
    flex-grow: 1;
}

.review .meta {
    font-size: 14px;
    color: #64748b;
    margin-bottom: 8px;
    display: block;
}

.review .meta strong {
    color: #0f172a;
    font-size: 16px;
    margin-right: 5px;
}

.review .description p {
    color: #334155;
    font-size: 15px;
    line-height: 1.6;
    margin: 10px 0 0 0;
}

/* Review Form Styling (App Style) */
#review_form_wrapper {
    background: #f8fafc;
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    margin-top: 40px;
}

#review_form_wrapper h3 {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 20px;
}

.comment-form p {
    margin-bottom: 15px;
}

.comment-form label {
    font-weight: 600;
    color: #334155;
    font-size: 14px;
    margin-bottom: 8px;
    display: block;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form textarea {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    font-size: 15px;
    transition: 0.3s;
}

.comment-form input:focus,
.comment-form textarea:focus {
    border-color: #079830;
    outline: none;
}

/* Submit Button */
.comment-form #submit {
    background: #079830;
    color: #fff;
    padding: 14px 28px;
    border-radius: 10px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: 0.3s;
}

.comment-form #submit:hover {
    background: #059669;
    transform: translateY(-2px);
}
.woocommerce-product-rating a.woocommerce-review-link {
    color: #000;
    text-decoration: none;
}
.woocommerce p.stars a::before {
    color: #fbbf23;
}
/* Container & Header */
.qc-contact-page-wrapper { max-width: 1200px; margin: 80px auto; padding: 0 20px; font-family: inherit; }
.qc-contact-header { text-align: center; margin-bottom: 60px; }
.qc-contact-header h1 { font-size: 42px; font-weight: 800; color: #0f172a; margin-bottom: 15px; }
.qc-contact-header p { font-size: 18px; color: #64748b; max-width: 600px; margin: 0 auto; line-height: 1.6; }

/* Grid Layout for Desktop */
.qc-contact-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 50px; margin-bottom: 60px; }

/* Left Sidebar - Info Cards */
.qc-contact-info-sidebar { display: flex; flex-direction: column; gap: 25px; }
.qc-info-card { 
    background: #ffffff; padding: 30px; border-radius: 20px; 
    border: 1px solid #f1f5f9; box-shadow: 0 10px 40px rgba(0,0,0,0.03);
    display: flex; gap: 20px; align-items: flex-start; transition: 0.3s;
}
.qc-info-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(16,185,129,0.08); }
.qc-icon-box { 
    background: #ecfdf5; min-width: 60px; height: 60px; border-radius: 16px;
    display: flex; align-items: center; justify-content: center;
}
.qc-info-card h3 { font-size: 18px; font-weight: 700; color: #0f172a; margin: 0 0 8px 0; }
.qc-info-card p { font-size: 16px; font-weight: 600; color: #334155; margin: 0 0 5px 0; }
.qc-info-card span { font-size: 13px; color: #64748b; }

/* Right Side - The Form */
.qc-contact-form-wrap { 
    background: #ffffff; padding: 50px; border-radius: 24px; 
    border: 1px solid #f1f5f9; box-shadow: 0 10px 40px rgba(0,0,0,0.04);
}
.qc-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }
.qc-form-group { margin-bottom: 25px; }
.qc-form-group label { display: block; font-weight: 700; margin-bottom: 10px; color: #334155; font-size: 15px; }
.qc-form-group input, .qc-form-group textarea { 
    width: 100%; padding: 16px 20px; border: 2px solid #e2e8f0; border-radius: 14px; 
    font-size: 16px; background: #f8fafc; color: #0f172a; transition: 0.3s;
}
.qc-form-group input:focus, .qc-form-group textarea:focus { border-color: #079830; background: #ffffff; outline: none; box-shadow: 0 0 0 4px rgba(16,185,129,0.1); }
.qc-form-group textarea { resize: vertical; min-height: 120px; }

/* Submit Button */
.qc-submit-btn { 
    width: 100%; background: #079830; color: #fff; border: none; padding: 18px; 
    border-radius: 14px; font-size: 18px; font-weight: 800; cursor: pointer; 
    display: flex; justify-content: center; align-items: center; gap: 10px; transition: 0.3s;
}
.qc-submit-btn:hover { background: #059669; transform: translateY(-2px); box-shadow: 0 10px 20px rgba(16,185,129,0.25); }

/* Success Message Enhancement */
.qc-success-msg { 
    background: #ecfdf5; color: #059669; padding: 20px; border-radius: 16px; 
    margin-bottom: 40px; border: 1px solid #a7f3d0;
    display: flex; align-items: center; justify-content: center; gap: 12px; font-weight: 700; font-size: 16px;
}

/* Map Section */
.qc-map-wrapper { border-radius: 24px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.04); border: 1px solid #f1f5f9; }

/* Responsive adjustments */
@media (max-width: 992px) {
    .qc-contact-grid { grid-template-columns: 1fr; }
    .qc-form-row { grid-template-columns: 1fr; gap: 0; }
    .qc-contact-form-wrap { padding: 30px; }
    .qc-contact-header h1 { font-size: 32px; }
}


.qc-product-grid-wrapper {
    margin-top: 40px;
}
/* Premium Banner Styles */
.qc-category-banner {
    position: relative;
    width: 100%;
    height: 380px;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.qc-category-banner-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(135deg, rgba(15,23,42,0.85) 0%, rgba(15,23,42,0.5) 100%);
    z-index: 1;
}

.qc-category-banner-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #ffffff;
    padding: 0 20px;
    max-width: 800px;
}

.qc-category-banner-content h1 {
    font-size: 52px;
    font-weight: 800;
    margin: 0 0 15px 0;
    letter-spacing: -1px;
    text-transform: capitalize;
    text-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

.qc-cat-desc {
    font-size: 18px;
    color: #f1f5f9;
    line-height: 1.6;
    font-weight: 500;
}

/* Toolbar (Result Count & Dropdown) */
.qc-shop-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 2px dashed #e2e8f0;
    flex-wrap: wrap;
    gap: 15px;
}

.qc-shop-toolbar .woocommerce-result-count {
    margin: 0;
    font-size: 16px;
    color: #64748b;
    font-weight: 600;
}

.qc-shop-toolbar .woocommerce-ordering select {
    appearance: none;
    background: #f8fafc url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%2364748b" viewBox="0 0 16 16"><path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/></svg>') no-repeat right 15px center;
    padding: 12px 45px 12px 20px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    color: #0f172a;
    cursor: pointer;
    transition: 0.3s;
}

.qc-shop-toolbar .woocommerce-ordering select:focus {
    outline: none;
    border-color: #079830;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
}

/* Premium Pagination */
.qc-pagination {
    margin-top: 50px;
    border-top: 2px dashed #e2e8f0;
    padding-top: 40px;
}

.qc-pagination ul.page-numbers {
    display: flex;
    justify-content: center;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.qc-pagination ul.page-numbers li a,
.qc-pagination ul.page-numbers li span {
    display: flex;
    align-items: center;
    justify-content: center;
/*     width: 45px;
    height: 45px; */
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    color: #475569;
    background: #f8fafc;
    border: 2px solid transparent;
    transition: 0.3s;
    text-decoration: none;
}

.qc-pagination ul.page-numbers li a:hover {
    background: #ecfdf5;
    color: #079830;
}

.qc-pagination ul.page-numbers li span.current {
    background: #079830;
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.25);
}

/* No Products State */
.qc-no-products {
    text-align: center;
    padding: 80px 20px;
    background: #f8fafc;
    border-radius: 24px;
    border: 2px dashed #e2e8f0;
}

.qc-no-products h3 { font-size: 24px; color: #0f172a; margin: 20px 0 10px; font-weight: 800; }
.qc-no-products p { font-size: 16px; color: #64748b; margin-bottom: 25px; }

.qc-back-shop-btn {
    display: inline-block;
    background: #079830;
    color: #ffffff;
    padding: 14px 28px;
    border-radius: 12px;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.2);
}

.qc-back-shop-btn:hover {
    background: #059669;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(16, 185, 129, 0.3);
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .qc-category-banner { height: 280px; }
    .qc-category-banner-content h1 { font-size: 38px; }
    .qc-shop-toolbar { flex-direction: column; align-items: flex-start; }
    .qc-shop-toolbar .woocommerce-ordering { width: 100%; }
    .qc-shop-toolbar .woocommerce-ordering select { width: 100%; }
}

/* All Categories Page Grid Layout */
.qc-all-categories-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Desktop pe 4 cards ek line me */
    gap: 30px;
}

/* Hover Effect for Card (Agar pehle se nahi hai toh) */
.qc-all-categories-grid .cat-slide-card {
    background: #ffffff;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
    transition: 0.3s ease;
}

.qc-all-categories-grid .cat-slide-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(16, 185, 129, 0.1); /* Aapke theme ka green glow */
    border-color: #079830;
}

.qc-all-categories-grid .cat-img-box img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 12px;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    .qc-all-categories-grid {
        grid-template-columns: repeat(3, 1fr); /* Tablet pe 3 cards */
    }
}

@media (max-width: 768px) {
    .qc-all-categories-grid {
        grid-template-columns: repeat(2, 1fr); /* Mobile pe 2 cards */
        gap: 15px;
    }
    .qc-all-categories-grid .cat-img-box img {
        height: 140px;
    }
}

/* --- DESKTOP VIEW (Default) --- */
/* Hide the mobile account button on large screens */
.mobile-account-wrap {
    display: none;
}

/* --- MOBILE VIEW --- */
@media (max-width: 992px) {
    /* Hide the account button from top header on mobile */
    .desktop-account-wrap {
        display: none !important;
    }

    /* Show the mobile account button inside the menu */
    .mobile-account-wrap {
        display: block;
        margin-top: auto; /* Pushes the button to the absolute bottom of the menu */
        padding: 20px;
        border-top: 1px dashed #e2e8f0;
        background: #ffffff;
    }

    /* Mobile Account Button Styling */
    .qc-mobile-account-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        background: #ecfdf5; /* Light green background */
        color: var(--brand-green, #079830);
        padding: 15px;
        border-radius: 12px;
        text-decoration: none;
        font-weight: 700;
        font-size: 16px;
        transition: 0.3s;
    }

    .qc-mobile-account-btn:hover {
        background: var(--brand-green, #079830);
        color: #ffffff;
    }
}


/* Variation Buttons Styling */
.qc-card-variations {
    margin-bottom: 5px;
}
.qc-var-btn {
    font-size: 12px;
    font-weight: 700;
    color: #64748b;
    background: #f1f5f9;
    padding: 6px 12px;
    border-radius: 50px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.3s ease;
}
.qc-var-btn:hover {
    background: #e2e8f0;
    color: #334155;
}
.qc-var-btn.active {
    background: #ecfdf5;
    color: var(--brand-green, #079830);
    border-color: var(--brand-green, #079830);
    box-shadow: 0 2px 10px rgba(16, 185, 129, 0.15);
}
a.added_to_cart.wc-forward {
    display: none;
}

/* Custom CSS for B2B Switch Toggle */
.qc-switch input:checked + .qc-slider-round:before {
    transform: translateX(22px);
}
.qc-slider-round:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}