/* QuickLand Frontend Styles - Premium Layout, Hover Effects & Smart Share */

body.ql-landing-page-mode {
    background-color: #f4f6f8;
    overflow-x: hidden;
}

/* Hide Theme Elements */
body.ql-landing-page-mode .woocommerce-breadcrumb,
body.ql-landing-page-mode .storefront-breadcrumb,
body.ql-landing-page-mode nav.woocommerce-breadcrumb,
body.ql-landing-page-mode .entry-header,
body.ql-landing-page-mode .page-title {
    display: none !important;
}

body.ql-landing-page-mode .site-content,
body.ql-landing-page-mode .content-area,
body.ql-landing-page-mode #content,
body.ql-landing-page-mode #main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body.ql-landing-page-mode .product {
    background: #ffffff;
    max-width: 1280px; /* INCREASED: Wider card on PC */
    box-sizing: border-box;
    position: relative;
    border-top: none !important;
}
body.ql-landing-page-mode .product::after { content: ""; display: table; clear: both; }

/* PC: Increased Top Gap (50px) for clear separation */
@media (min-width: 768px) {
    body.ql-landing-page-mode .site-content {
        padding-top: 50px !important;
    }
    body.ql-landing-page-mode .product {
        margin: 0 auto 30px auto !important;
        padding: 30px;
        border-radius: 12px;
        box-shadow: 0 10px 40px rgba(0,0,0,0.08);
    }
    body.ql-landing-page-mode .woocommerce-product-gallery {
        width: 48% !important; float: left !important; margin-right: 4% !important;
    }
    body.ql-landing-page-mode .summary.entry-summary {
        width: 48% !important; float: right !important;
    }

    /* === NEW: HIDE STICKY BAR ON PC === */
    .quickland-sticky-bar {
        display: none !important;
    }
}

/* Mobile: 10px Top Gap, 0px Side Gap (UPDATED: Zero Gap & Full Width) */
@media (max-width: 767px) {
    body.ql-landing-page-mode .site-header { margin-bottom: 0 !important; }
    
    /* Force Theme Containers to Full Width (Zero Padding) */
    body.ql-landing-page-mode .container,
    body.ql-landing-page-mode .ast-container, 
    body.ql-landing-page-mode .col-full,      
    body.ql-landing-page-mode .site-content,
    body.ql-landing-page-mode #content,
    body.ql-landing-page-mode .content-area {
        width: 100% !important; 
        max-width: 100% !important; 
        padding-left: 0 !important; 
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    body.ql-landing-page-mode .product {
        margin: 10px 0 !important; /* UPDATED: Zero side margin */
        width: 100% !important;    
        border-radius: 0 !important; /* Squared edges for smooth full-width look */
        box-shadow: 0 3px 10px rgba(0,0,0,0.05) !important;
        padding: 20px 15px !important;
    }
    
    body.ql-landing-page-mode .woocommerce-product-gallery,
    body.ql-landing-page-mode .summary.entry-summary {
        width: 100% !important; float: none !important; margin-right: 0 !important;
    }
    body.ql-landing-page-mode .summary.entry-summary { margin-top: 15px; }

    /* === NEW: STICKY BAR FULL WIDTH MOBILE STYLING (Aggressive Fix) === */
    .quickland-sticky-bar { 
        padding: 0 !important; /* Zero out ALL padding on the main wrapper */
        margin: 0 !important; /* Zero out ALL margin on the main wrapper */
        display: flex !important; /* Ensure it stays visible on mobile */
    }
    .ql-sticky-inner-full { 
        width: 100% !important; 
        max-width: 100% !important;
        border-radius: 0 !important; /* Square off corners for full screen edge alignment */
        box-shadow: 0 0 15px rgba(0,0,0,0.2); 
    }
    .ql-sticky-btn.ql-full-width-btn {
        border-radius: 0 !important; /* Match inner container */
        padding: 18px 20px !important; 
    }
}

/* Gallery & Thumbs */
body.ql-landing-page-mode .woocommerce-product-gallery__image img {
    border-radius: 10px; border: 1px solid #f0f0f0; width: 100%; height: auto;
}
body.ql-landing-page-mode .flex-control-thumbs {
    margin-top: 15px; display: flex; gap: 10px; overflow-x: auto;
}
body.ql-landing-page-mode .flex-control-thumbs li { width: 22%; flex-shrink: 0; list-style: none; }
body.ql-landing-page-mode .flex-control-thumbs img { border-radius: 6px; opacity: 0.7; }
body.ql-landing-page-mode .flex-control-thumbs img.flex-active { opacity: 1; border: 1px solid #333; }

/* Summary */
body.ql-landing-page-mode .summary.entry-summary > *:not(.quickland-primary-card),
.quickland-primary-card .quantity label { display: none !important; }

.quickland-primary-card { display: flex; flex-direction: column; gap: 15px; width: 100%; }

.ql-card-title h1, .ql-card-title .product_title {
    margin: 0 0 10px; font-size: 24px; font-weight: 700; line-height: 1.2; color: #111;
}

.ql-card-price .price {
    font-size: 22px; font-weight: 700; color: var(--ql-btn-buy-bg, #e65100);
    display: flex; align-items: center; gap: 10px;
}
.ql-card-price del { color: #999; font-size: 15px; opacity: 0.6; text-decoration: line-through; }

/* === NEW: SMART VARIATION CARD (Smart Swatch UI) === */

/* Main Card Structure */
.ql-smart-variation-card {
    border: 1px solid var(--ql-border, #e0e6ed);
    border-radius: 8px;
    padding: 15px;
    background: #f8f9fb;
    margin-bottom: 20px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.03);
}

.ql-svc-header {
    font-size: 15px;
    font-weight: 700;
    color: #2c3338;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

/* Sections for each attribute (e.g., Color, Size) */
.ql-svc-section {
    margin-bottom: 20px;
}
.ql-svc-section:last-child {
    margin-bottom: 5px;
}

.ql-svc-label-row {
    font-size: 14px;
    font-weight: 500;
    color: #444;
    margin-bottom: 10px;
}
.ql-selected-val {
    font-weight: 700;
    color: var(--ql-btn-buy-bg, #e65100);
    margin-left: 5px;
}

/* Common Swatch Styles (Label/Option Item) */
.ql-svc-chips-grid, .ql-svc-swatches-scroll {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.ql-svc-swatches-scroll {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 10px; /* Space for scroll bar on PC/Mobile */
    -webkit-overflow-scrolling: touch;
}
.ql-svc-swatches-scroll::-webkit-scrollbar { height: 6px; }
.ql-svc-swatches-scroll::-webkit-scrollbar-thumb { background: #ddd; border-radius: 3px; }

/* FIX: Prevent browser focus outline/shadow on the hidden radio input when selecting via JS */
.ql-option-item input[type="radio"] {
    outline: none !important;
    box-shadow: none !important;
}

.ql-option-item {
    cursor: pointer;
    border: 2px solid #ddd;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    user-select: none;
    position: relative;
    overflow: hidden;
}
.ql-option-item:hover { border-color: #aaa; }
.ql-option-item.selected {
    /* FIX: Add !important to ensure this style overrides all other focus/hover styles */
    border-color: var(--ql-btn-buy-bg, #43a047) !important;
    box-shadow: 0 0 0 2px rgba(67, 160, 71, 0.3) !important;
}
.ql-option-item.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    text-decoration: line-through;
    border-color: #f0f0f0 !important;
}

/* 1. SIZE/CHIP SWATCHES */
.ql-size-chip {
    padding: 8px 15px;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    min-width: 50px;
    height: 40px;
}
.ql-size-chip.selected {
    background: #e8f5e9;
    color: #2e7d32;
}

/* 2. COLOR SWATCHES */
.ql-color-card {
    flex-shrink: 0;
    width: 80px; /* Fixed width for color card */
    padding: 5px;
    flex-direction: column;
    height: auto;
}

.ql-color-preview {
    position: relative;
    width: 100%;
    padding-top: 100%; /* Square preview area */
    margin-bottom: 5px;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    overflow: hidden;
}

.ql-hex-dot {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.1);
}
.ql-mini-thumb {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 1;
}

.ql-opt-name {
    font-size: 11px;
    font-weight: 500;
    color: #333;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Mobile Optimizations for Smart Card */
@media (max-width: 767px) {
    .ql-smart-variation-card {
        padding: 12px;
        border-radius: 0;
        margin: 10px -15px 20px -15px; /* Full width hack */
        box-shadow: none;
        border-left: none;
        border-right: none;
        background: #fff;
    }
    .ql-svc-header { font-size: 16px; }
    .ql-svc-label-row { font-size: 13px; }
    .ql-size-chip { padding: 6px 12px; font-size: 13px; height: 36px; }
    .ql-color-card { width: 70px; padding: 4px; }
    .ql-opt-name { font-size: 10px; }
}


/* Form Layout */
.quickland-primary-card form.cart,
.quickland-primary-card .woocommerce-variation-add-to-cart {
    display: flex !important; flex-wrap: wrap !important; gap: 10px !important;
    width: 100% !important; margin-bottom: 0 !important; align-items: flex-end !important;
}
.quickland-primary-card a.reset_variations { display: none !important; }

.quickland-primary-card .variations {
    flex: 0 0 100% !important; width: 100% !important; margin-bottom: 15px !important; border: none !important; display: block !important;
}
.quickland-primary-card .variations tbody, .quickland-primary-card .variations tr, .quickland-primary-card .variations td {
    display: block !important; width: 100% !important; padding: 0 !important;
}

/* Row 1: Quantity */
.quickland-primary-card .quantity {
    flex: 0 0 100% !important; width: 100% !important; margin: 0 0 15px 0 !important; padding: 0 !important; display: block !important;
}
.quickland-primary-card .quantity label { 
    display: block !important; font-weight: 600; margin-bottom: 5px; color: #333; font-size: 14px;
}
.ql-quantity-wrapper {
    background: #fff; 
    height: 36px; /* SIZED DOWN */ 
    width: 130px; /* SIZED DOWN */ 
    max-width: 100%;
    display: inline-flex !important; align-items: center; border: 1px solid #ddd; border-radius: 4px;
}
.ql-qty-btn {
    width: 36px; /* SIZED DOWN */ 
    height: 100%; background: transparent; border: none; 
    font-size: 16px; /* SIZED DOWN */ 
    color: #333; cursor: pointer;
    display: flex; align-items: center; justify-content: center; padding: 0; transition: background 0.2s;
}
.ql-qty-btn:hover { background: #f9f9f9; }
.ql-qty-minus { border-right: 1px solid #eee !important; }
.ql-qty-plus { border-left: 1px solid #eee !important; }
.quickland-primary-card .quantity input.qty {
    flex: 1; 
    height: 100% !important; text-align: center; border: none !important; margin: 0 !important;
    font-weight: 700; 
    font-size: 15px; /* SIZED DOWN */ 
    padding: 0; background: transparent; color: #333; -moz-appearance: textfield;
}
.quickland-primary-card .quantity input.qty::-webkit-inner-spin-button, .quickland-primary-card .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* Row 2: Buttons - GENERAL RESET */
.quickland-primary-card button.single_add_to_cart_button,
.ql-btn-direct-buy.ql-inline-order-btn,
.ql-btn-select-options { /* ADDED SELECT OPTIONS */
    flex: 1 1 calc(50% - 5px) !important; width: calc(50% - 5px) !important; max-width: 50% !important;
    height: 40px !important; /* SIZED DOWN from 48px to 40px */ 
    margin: 0 !important; padding: 0 5px !important;
    font-size: 13px !important; /* SIZED DOWN from 14px to 13px */ 
    font-weight: 700 !important; text-transform: uppercase !important;
    border-radius: 4px !important; display: flex !important; align-items: center !important; justify-content: center !important; float: none !important;
    border: 1px solid transparent !important; transition: all 0.3s ease !important;
}

/* 1. ADD TO CART BUTTON (Using Variables) */
.quickland-primary-card button.single_add_to_cart_button {
    background: var(--ql-btn-cart-bg, #ffffff) !important; 
    color: var(--ql-btn-cart-text, #333333) !important; 
    border: 1px solid #333333 !important; /* Keep border for Cart button */
}
.quickland-primary-card button.single_add_to_cart_button:hover { 
    background: var(--ql-btn-cart-hover-bg, #f7f7f7) !important; 
    color: var(--ql-btn-cart-hover-text, #000000) !important;
}

/* 1b. SELECT OPTIONS BUTTON (NEW for Variable Products - Full Width) */
.quickland-primary-card .ql-btn-select-options {
    flex: 1 1 100% !important; /* Force full width on main card */
    max-width: 100% !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 5px !important;
    font-size: 13px !important; 
    font-weight: 700 !important; 
    text-transform: uppercase !important;
    border-radius: 4px !important; 
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    background: var(--ql-btn-buy-bg, #1b5e20) !important; 
    color: var(--ql-btn-buy-text, #ffffff) !important; 
    border: none !important;
    margin-bottom: 0 !important; 
}
.quickland-primary-card .ql-btn-select-options:hover {
    background: var(--ql-btn-buy-hover-bg, #144a18) !important;
    color: var(--ql-btn-buy-hover-text, #ffffff) !important;
}
.ql-btn-select-options .dashicons {
     font-size: 18px; margin-right: 8px;
}

/* 2. ORDER NOW BUTTON (Using Variables) */
.ql-btn-direct-buy.ql-inline-order-btn {
    background: var(--ql-btn-buy-bg, #1b5e20) !important; 
    color: var(--ql-btn-buy-text, #ffffff) !important; 
    border: none !important;
}
.ql-btn-direct-buy.ql-inline-order-btn:hover { 
    background: var(--ql-btn-buy-hover-bg, #144a18) !important;
    color: var(--ql-btn-buy-hover-text, #ffffff) !important;
}
.ql-btn-direct-buy .ql-icon { margin-right: 8px; font-size: 18px; }


/* Contact Buttons Wrapper */
.ql-card-phone-row { width: 100%; margin-top: 10px; }

/* 3. CALL BUTTON (Using Variables) */
.ql-btn-phone.ql-full-width-call {
    width: 100%; 
    height: 40px; /* SIZED DOWN from 48px to 40px */ 
    background: var(--ql-btn-call-bg, #ffffff); 
    color: var(--ql-btn-call-text, #333333); 
    border: 1px solid #ccc !important;
    border-radius: 4px; display: flex; align-items: center; justify-content: center;
    font-weight: 700; text-transform: uppercase; text-decoration: none; transition: all 0.3s ease;
    font-size: 13px; /* SIZED DOWN */
}

.ql-btn-phone.ql-full-width-call:hover {
    background-color: var(--ql-btn-call-hover-bg, #000000) !important;
    color: var(--ql-btn-call-hover-text, #ffffff) !important;
    border-color: var(--ql-btn-call-hover-bg, #000000) !important;
}

.ql-card-social-row { display: flex; gap: 10px; width: 100%; margin-top: 10px; }

.ql-btn-card.ql-half-width {
    flex: 1; 
    height: 40px; /* SIZED DOWN from 48px to 40px */ 
    border-radius: 4px; display: flex; align-items: center; justify-content: center;
    font-weight: 700; text-decoration: none; 
    transition: all 0.3s ease;
    font-size: 13px; /* SIZED DOWN */
}

/* 4. WHATSAPP BUTTON (Using Variables) */
.ql-btn-whatsapp { 
    background: var(--ql-btn-wa-bg, #25D366) !important; 
    color: var(--ql-btn-wa-text, #ffffff) !important;
    border:none; 
}
.ql-btn-whatsapp:hover {
    background: var(--ql-btn-wa-hover-bg, #1da851) !important;
    color: var(--ql-btn-wa-hover-text, #ffffff) !important;
}

/* 5. MESSENGER BUTTON (Using Variables) */
.ql-btn-messenger { 
    background: var(--ql-btn-msg-bg, #0084FF) !important; 
    color: var(--ql-btn-msg-text, #ffffff) !important;
    border:none; 
}
.ql-btn-messenger:hover {
    background: var(--ql-btn-msg-hover-bg, #006bcf) !important;
    color: var(--ql-btn-msg-hover-text, #ffffff) !important;
}

/* Meta */
.quickland-primary-card .ql-card-meta {
    margin-top: 20px; font-size: 13px; color: #888;
    border-top: 1px solid #eee; padding-top: 15px; width: 100%;
}
.ql-meta-label { font-weight: 600; color: #333; }

/* SMART SHARE SECTION (Square Style) */
.ql-smart-share-row {
    margin-top: 10px; border-top: 1px dashed #eee; padding-top: 12px;
    display: flex; align-items: center; gap: 12px;
}
.ql-share-label { font-size: 14px; font-weight: 600; color: #333; }
.ql-share-actions { display: flex; align-items: center; gap: 8px; }

/* Square Buttons (40x40px) */
.ql-share-btn {
    width: 40px; height: 40px;
    border: 1px solid #e0e0e0; border-radius: 6px; /* Rounded Square */
    background: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    color: #555; text-decoration: none; cursor: pointer;
    transition: all 0.2s ease;
}
.ql-share-btn:hover {
    background: #f4f4f4; color: #000; border-color: #ccc;
}
.ql-share-btn .dashicons { font-size: 18px; width: 18px; height: 18px; margin: 0; }

/* Hide Native share on Desktop */
@media (min-width: 768px) { .ql-share-native { display: none !important; } }
/* Show Native share on Mobile */
@media (max-width: 767px) { .ql-share-native { display: inline-flex !important; } }

body.ql-landing-page-mode .product .woocommerce-tabs,
body.ql-landing-page-mode .product .woocommerce-Tabs-panel { margin-top: 35px; clear: both; }


/* =======================================
   6. PREMIUM POPUP / MODAL STYLES (NEW/UPDATED)
   ======================================= */

/* Prevent body scroll when modal is open (REMOVED: as modal is no longer used) */
/* body.ql-popup-open { overflow: hidden !important; } */ 

.quickland-sticky-bar { 
    position: fixed; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    z-index: 99990; 
    pointer-events: none; 
    display: flex; 
    justify-content: center; 
    padding-bottom: 15px; 
    transform: translateY(150%); 
    transition: transform 0.3s; 
}
.quickland-sticky-bar.ql-show { transform: translateY(0); }
.ql-sticky-inner-full { width: 90%; max-width: 500px; pointer-events: auto; border-radius: 50px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); }
.ql-sticky-btn.ql-full-width-btn { width: 100%; border: none; border-radius: 50px; padding: 16px 20px; font-size: 18px; font-weight: 700; text-transform: uppercase; cursor: pointer; color: #fff; }

.ql-popup-overlay { 
    position: fixed; top: 0; left: 0; right: 0; bottom: 0; 
    background: rgba(0,0,0,0.7); /* Darker overlay for premium look */
    z-index: 100000; 
    display: none; 
    align-items: center; 
    justify-content: center; 
    transition: opacity 0.3s;
    opacity: 0;
}
.ql-popup-overlay.open { 
    display: flex; 
    opacity: 1; 
}
.ql-popup-content { 
    background: #fff; 
    width: 95%; 
    max-width: 450px; /* Slimmer look for variations */
    border-radius: 12px; 
    padding: 25px; 
    box-shadow: 0 10px 40px rgba(0,0,0,0.3); 
    max-height: 85vh; 
    overflow-y: auto;
    transform: translateY(20px);
    transition: transform 0.3s ease-out;
}
.ql-popup-overlay.open .ql-popup-content {
    transform: translateY(0);
}

.ql-popup-header {
    display: flex; justify-content: space-between; align-items: center; 
    margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 10px;
}
.ql-popup-header h3 {
    margin: 0; font-size: 20px; font-weight: 700; color: #333;
}
.ql-popup-close {
    background: none; border: none; font-size: 30px; line-height: 1; cursor: pointer; color: #999;
    padding: 0;
}

.ql-popup-body {
    padding-top: 10px;
}

/* Style the form elements inside the popup */
#ql-variation-popup .variations {
    border: none !important; margin-bottom: 20px !important;
}
#ql-variation-popup table.variations {
    width: 100% !important;
    border-collapse: collapse;
}
#ql-variation-popup table.variations td, 
#ql-variation-popup table.variations th {
    padding: 5px 0 !important;
}
#ql-variation-popup .label {
    font-weight: 600; font-size: 14px; color: #333;
    display: block; margin-bottom: 5px;
}
#ql-variation-popup table.variations select {
    width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px;
}

#ql-variation-popup .single_variation_wrap {
     margin-top: 20px;
}
#ql-variation-popup .single_add_to_cart_button {
    /* Style the final button inside the popup */
    width: 100% !important;
    max-width: 100% !important;
    height: 48px !important; 
    font-size: 16px !important; 
    margin-top: 15px !important;
    border-radius: 8px !important;
    background: var(--ql-btn-buy-bg) !important; 
    color: var(--ql-btn-buy-text) !important; 
}
#ql-variation-popup .single_add_to_cart_button:hover {
    background: var(--ql-btn-buy-hover-bg) !important;
    color: var(--ql-btn-buy-hover-text) !important;
}
#ql-variation-popup .price {
    font-size: 20px; font-weight: 700; color: var(--ql-btn-buy-bg); margin-bottom: 15px; display: block;
}


/* === NEW: SMART 3D BENEFITS SECTION (FIXED & COMPACT FOR MOBILE) === */

.ql-section.ql-benefits-section {
    width: 100%;
    max-width: 1280px; /* Matched to product card */
    margin: 30px auto;
    padding: 0 15px;
    box-sizing: border-box;
    clear: both;
    position: relative;
    z-index: 5;
    display: block !important;
}

.ql-section-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #222;
    text-align: left;
}

/* Desktop Grid */
.ql-benefits-grid.ql-scroll-snap {
    display: flex;
    gap: 15px;
    flex-wrap: wrap; 
}

/* THE 3D CARD (Desktop) */
.ql-benefit-card {
    background: #fff;
    border-radius: 12px;
    position: relative;
    box-shadow: 0 4px 0 #e0e0e0, 0 10px 20px rgba(0,0,0,0.05); 
    border: 1px solid #f0f0f0;
    transition: transform 0.2s, box-shadow 0.2s;
    flex: 1;
    min-width: 200px;
    overflow: hidden;
}

.ql-benefit-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 7px 0 #e0e0e0, 0 15px 30px rgba(0,0,0,0.1);
}

.ql-benefit-inner {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
    box-sizing: border-box;
}

.ql-benefit-icon-wrapper {
    width: 50px;
    height: 50px;
    background: #fdf6e7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}
.ql-benefit-icon-wrapper .dashicons {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #e65100;
}

.ql-benefit-content h4 {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 5px;
    color: #333;
}
.ql-benefit-content p {
    font-size: 13px;
    color: #666;
    margin: 0;
    line-height: 1.4;
}

/* === MOBILE: COMPACT 1-LINE SCROLL (FIXED) === */
@media (max-width: 767px) {
    .ql-section.ql-benefits-section {
        margin: 15px 0 20px 0 !important;
        padding: 0 4px !important; /* Aligned with product card margin */
        width: 100% !important;
    }
    
    .ql-section-title {
        padding: 0 4px;
        font-size: 18px;
        margin-bottom: 12px;
    }

    .ql-benefits-grid.ql-scroll-snap {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        
        /* Critical: Right Padding ensures last card (Satisfaction) isn't cut off */
        padding: 5px 20px 25px 5px !important; 
        
        -webkit-overflow-scrolling: touch;
        gap: 10px;
        width: 100% !important;
    }

    .ql-benefits-grid.ql-scroll-snap::-webkit-scrollbar { display: none; }
    .ql-benefits-grid.ql-scroll-snap { -ms-overflow-style: none; scrollbar-width: none; }

    .ql-benefit-card {
        flex: 0 0 105px !important; /* COMPACT: Small fixed width */
        min-width: 105px !important;
        max-width: 105px !important;
        scroll-snap-align: start;
        box-shadow: 0 3px 0 #e0e0e0, 0 5px 10px rgba(0,0,0,0.05);
        border-radius: 10px;
    }
    
    .ql-benefit-card:hover { transform: none; }
    
    .ql-benefit-inner {
        padding: 12px 6px;
    }
    
    .ql-benefit-icon-wrapper {
        width: 36px; height: 36px; margin-bottom: 8px;
    }
    .ql-benefit-icon-wrapper .dashicons {
        font-size: 18px; width: 18px; height: 18px;
    }
    
    .ql-benefit-content h4 { 
        font-size: 11px !important; 
        margin-bottom: 3px;
        line-height: 1.2;
    }
    .ql-benefit-content p { 
        font-size: 9px !important; 
        line-height: 1.2; 
        display: -webkit-box; 
        -webkit-line-clamp: 2; 
        -webkit-box-orient: vertical; 
        overflow: hidden; 
    }
}

/* === ANIMATION: Gentle Hover-Grow (Subtle Scale) === */
@keyframes qlGentleGrow {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); } /* Very subtle growth to 105% */
    100% { transform: scale(1); }
}

/* Apply ONLY to the inline "Order Now" button (not sticky) */
.ql-btn-direct-buy.ql-inline-order-btn.ql-btn-pulse-anim,
.ql-btn-select-options.ql-btn-pulse-anim { /* ADDED SELECT OPTIONS */
    animation: qlGentleGrow 2.5s ease-in-out infinite; /* Smooth, slow loop */
    transform-origin: center;
    backface-visibility: hidden; /* Fix for smoother rendering */
    -webkit-font-smoothing: subpixel-antialiased;
}

/* Ensure hover pauses it for usability */
.ql-btn-direct-buy.ql-inline-order-btn.ql-btn-pulse-anim:hover,
.ql-btn-select-options.ql-btn-pulse-anim:hover { /* ADDED SELECT OPTIONS */
    animation-play-state: paused; 
    transform: scale(1.05); /* Keep it slightly grown on hover */
}

/* === NEW: PRODUCT DETAILS CARD (Premium & Responsive) === */
.ql-section.ql-details-section {
    width: 100%;
    max-width: 1280px; /* Aligned with top card */
    margin: 30px auto;
    padding: 0 15px;
    box-sizing: border-box;
    clear: both;
}

.ql-details-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.05);
    overflow: hidden;
    width: 100%;
}

.ql-details-banner {
    width: 100%;
    max-height: 350px;
    overflow: hidden;
    position: relative;
    background: #f0f0f0;
}

.ql-details-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ql-details-content {
    padding: 40px;
}

.ql-details-content .ql-section-title {
    font-size: 22px;
    margin-bottom: 25px;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
    color: #222;
}

.ql-content-body {
    font-size: 16px;
    line-height: 1.8;
    color: #444;
}

.ql-content-body p { margin-bottom: 20px; }
.ql-content-body h2, .ql-content-body h3, .ql-content-body h4 {
    margin-top: 30px; margin-bottom: 15px; color: #111;
}
.ql-content-body img {
    max-width: 100%; height: auto; border-radius: 8px; margin: 20px 0;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

/* Mobile Tweaks for Details Card */
@media (max-width: 767px) {
    .ql-section.ql-details-section {
        margin: 15px 0 !important;
        padding: 0 4px !important;
    }
    
    .ql-details-card {
        border-radius: 10px;
        box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    }
    
    .ql-details-banner {
        max-height: 200px; /* Smaller banner on mobile */
    }
    
    .ql-details-content {
        padding: 20px 15px;
    }
    
    .ql-details-content .ql-section-title {
        font-size: 18px;
        margin-bottom: 15px;
        padding-bottom: 10px;
    }
    
    .ql-content-body {
        font-size: 15px;
        line-height: 1.6;
    }
}

/* MOBILE/TABLET ONLY – hide on desktop (consistent with main sticky bar) */
@media (min-width: 1025px) {
    /* Ensure the mobile sticky bar is always hidden on desktop */
    .ql-mobile-sticky-buy {
        display: none !important;
    }
}

/* Success feedback for variation selection (NEW) */
.quickland-primary-card.ql-selection-success {
    box-shadow: 0 0 10px 3px rgba(67, 160, 71, 0.5); /* Subtle green glow */
    transition: box-shadow 0.3s ease-in-out;
}