/* ========== Product Variation 1 ========== */

.product-section {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}
.variation-1 .product-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.variation-1 .product-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: .3s;
}

.variation-1 .product-card:hover {
    transform: translateY(-8px);
}

.variation-1 img {
    width: 100%;
    height: 240px;
    object-fit: cover;
}

/* ========== Product Variation 2 ========== */
    .variation-2 .horizontal-card {
        display: flex;
        gap: 20px;
        background: #fff;
        margin-bottom: 25px;
        padding: 15px;
        border-radius: 12px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.06);
    }

    .variation-2 img {
        width: 180px;
        height: 150px;
        object-fit: cover;
        border-radius: 10px;
    }

/* ========== Product Variation 3 ========== */
    .variation-3 .minimal-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 40px;
    }

    .variation-3 .minimal-card {
        text-align: center;
    }

    .variation-3 img {
        width: 100%;
        height: 220px;
        object-fit: cover;
        border-radius: 8px;
    }

/* ========== Product Variation 4 ========== */
    .variation-4 {
    background: #111;
    padding: 60px 0;
    }

    .variation-4 .dark-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .variation-4 .dark-card {
        background: #1c1c1c;
        color: #fff;
        border-radius: 15px;
        overflow: hidden;
        transition: .3s;
    }

    .variation-4 img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }

    /* ========== Product Variation 5 ========== */
    .variation-5 .zoom-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .variation-5 .image-wrap {
        position: relative;
        overflow: hidden;
        border-radius: 12px;
    }

    .variation-5 img {
        width: 100%;
        height: 250px;
        object-fit: cover;
        transition: .5s;
    }

    .variation-5 .zoom-card:hover img {
        transform: scale(1.1);
    }

    .variation-5 .overlay-btn {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        background: #ff6b00;
        color: #fff;
        padding: 8px 20px;
        border-radius: 30px;
        text-decoration: none;
        opacity: 0;
        transition: .3s;
    }

    .variation-5 .zoom-card:hover .overlay-btn {
        opacity: 1;
    }



    .locked-section {
        position: relative;
        cursor: pointer;
    }

    .locked-section * {
        pointer-events: none;  /* disables editing/selecting inner elements */
    }

    .locked-section::after {
        content: "Manage Products";
        position: absolute;
        top: 15px;
        right: 15px;
        background: #6c2bd9;
        color: #fff;
        padding: 6px 14px;
        font-size: 12px;
        border-radius: 20px;
    }

/* ========== PREMIUM CART SIDEBAR ========== */

    .cart-overlay{
        position:fixed;
        inset:0;
        background:rgba(10,8,6,0.55);
        backdrop-filter:blur(3px);
        -webkit-backdrop-filter:blur(3px);
        display:none;
        z-index:10000;
    }

    .cart-sidebar{
        position:fixed;
        top:0;
        right:-440px;
        width:420px;
        max-width:100vw;
        height:100%;
        background:#fff;
        z-index:10001;
        display:flex;
        flex-direction:column;
        transition:right 0.38s cubic-bezier(0.4,0,0.2,1);
        box-shadow:-8px 0 40px rgba(0,0,0,0.12);
    }

    .cart-sidebar.show{
        right:0;
    }

    /* ---- Header ---- */
    .cart-header{
        padding:22px 24px 18px;
        display:flex;
        justify-content:space-between;
        align-items:center;
        border-bottom:1px solid rgba(var(--primary-rgb,142,27,207),0.10);
        flex-shrink:0;
    }

    .cart-header h3{
        font-size:1.1rem;
        font-weight:700;
        color:var(--primary-color);
        letter-spacing:-0.02em;
        margin:0;
    }

    .close-cart{
        width:32px;
        height:32px;
        border-radius:50%;
        border:none;
        background:rgba(var(--primary-rgb,142,27,207),0.08);
        color:var(--primary-color);
        font-size:16px;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:background 0.2s;
        line-height:1;
    }
    .close-cart:hover{
        background:rgba(var(--primary-rgb,142,27,207),0.16);
    }

    /* ---- Items ---- */
    .cart-items{
        flex:1;
        overflow-y:auto;
        padding:18px 20px;
        scroll-behavior:smooth;
    }
    .cart-items::-webkit-scrollbar{width:4px;}
    .cart-items::-webkit-scrollbar-track{background:transparent;}
    .cart-items::-webkit-scrollbar-thumb{background:rgba(var(--primary-rgb,142,27,207),0.2);border-radius:4px;}

    .cart-item{
        display:flex;
        gap:14px;
        padding:14px 0;
        border-bottom:1px solid rgba(0,0,0,0.06);
        align-items:flex-start;
    }
    .cart-item:last-child{border-bottom:none;}

    .cart-item-img{
        width:64px;
        height:64px;
        border-radius:10px;
        overflow:hidden;
        flex-shrink:0;
        background:rgba(var(--primary-rgb,142,27,207),0.05);
    }
    .cart-item-img img{
        width:100%;
        height:100%;
        object-fit:cover;
        display:block;
    }

    .cart-item-info{
        flex:1;
        min-width:0;
        display:flex;
        flex-direction:column;
        gap:4px;
    }
    .cart-item-name{
        font-size:0.88rem;
        font-weight:600;
        color:#1a1a1a;
        line-height:1.3;
        display:block;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }
    .cart-item-price{
        font-size:0.9rem;
        font-weight:700;
        color:var(--primary-color);
        display:block;
    }

    /* ---- Qty Row ---- */
    .qty-row{
        display:flex;
        align-items:center;
        justify-content:space-between;
        margin-top:6px;
    }
    .qty-controls{
        display:flex;
        align-items:center;
        gap:0;
        border:1.5px solid rgba(var(--primary-rgb,142,27,207),0.22);
        border-radius:8px;
        overflow:hidden;
    }
    .qty-btn{
        width:30px;
        height:30px;
        border:none;
        background:transparent;
        color:var(--primary-color);
        font-size:16px;
        font-weight:700;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:background 0.15s;
        flex-shrink:0;
    }
    .qty-btn:hover{background:rgba(var(--primary-rgb,142,27,207),0.08);}
    .qty-value{
        min-width:28px;
        text-align:center;
        font-size:0.85rem;
        font-weight:700;
        color:#1a1a1a;
        border-left:1px solid rgba(var(--primary-rgb,142,27,207),0.15);
        border-right:1px solid rgba(var(--primary-rgb,142,27,207),0.15);
        line-height:30px;
    }
    .qty-del{
        width:28px;
        height:28px;
        border:none;
        background:transparent;
        color:#bbb;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        border-radius:6px;
        transition:color 0.15s,background 0.15s;
        padding:0;
        flex-shrink:0;
    }
    .qty-del:hover{color:#e53e3e;background:rgba(229,62,62,0.08);}

    /* ---- Footer / Summary ---- */
    .cart-footer{
        padding:16px 20px 20px;
        border-top:1px solid rgba(0,0,0,0.07);
        flex-shrink:0;
        background:#fff;
    }

    /* Coupon row */
    .coupon-row{
        display:flex;
        gap:8px;
        margin-bottom:14px;
    }
    .coupon-row input{
        flex:1;
        padding:9px 13px;
        border:1.5px solid rgba(var(--primary-rgb,142,27,207),0.2);
        border-radius:8px;
        font-size:0.83rem;
        color:#333;
        outline:none;
        transition:border-color 0.2s;
        font-family:inherit;
        background:#fafafa;
    }
    .coupon-row input::placeholder{color:#bbb;}
    .coupon-row input:focus{
        border-color:var(--primary-color);
        background:#fff;
    }
    .coupon-row .applyCoupon{
        padding:9px 15px;
        background:var(--primary-color) !important;
        color:#fff;
        border:none;
        border-radius:8px;
        font-size:0.8rem;
        font-weight:700;
        cursor:pointer;
        letter-spacing:0.03em;
        transition:opacity 0.2s;
        white-space:nowrap;
    }
    .coupon-row .applyCoupon:hover{opacity:0.88;}
    #couponError{
        display:block;
        font-size:0.75rem;
        color:#e53e3e;
        margin-top:-10px;
        margin-bottom:8px;
        min-height:0;
    }

    /* Summary lines */
    .cart-summary{
        font-size:0.82rem;
        color:#555;
        margin-bottom:14px;
    }
    .cart-summary > div{
        display:flex;
        justify-content:space-between;
        padding:4px 0;
    }
    .cart-summary hr{
        border:none;
        border-top:1px solid rgba(0,0,0,0.08);
        margin:8px 0;
    }
    .cart-total{
        font-size:1rem;
        font-weight:700;
        color:#1a1a1a;
    }
    .cart-total span{
        color:var(--primary-color);
        font-size:1.05rem;
    }

    /* Checkout / Order button */
    .checkout-btn{
        display:block;
        width:100%;
        padding:13px;
        background:var(--primary-color) !important;
        color:#fff;
        border:none;
        border-radius:10px;
        font-size:0.88rem;
        font-weight:700;
        letter-spacing:0.05em;
        text-transform:uppercase;
        cursor:pointer;
        transition:opacity 0.2s,transform 0.15s;
        margin-top:12px;
    }
    .checkout-btn:hover{opacity:0.9;transform:translateY(-1px);}

    /* ---- Checkout Steps ---- */
    .checkout-steps{
        display:flex;
        gap:8px;
        padding:14px 20px;
        border-bottom:1px solid rgba(0,0,0,0.06);
        flex-shrink:0;
    }
    .c-step{
        flex:1;
        padding:6px 10px;
        background:rgba(var(--primary-rgb,142,27,207),0.06);
        border-radius:20px;
        font-size:0.72rem;
        font-weight:700;
        color:#aaa;
        text-align:center;
        letter-spacing:0.04em;
        transition:background 0.2s,color 0.2s;
    }
    .c-step.active{
        background:var(--primary-color) !important;
        color:#fff;
    }

    /* ---- Step content ---- */
    .c-content{
        padding:20px 20px 0;
        flex:1;
        overflow-y:auto;
    }
    .c-content h3{
        font-size:0.95rem;
        font-weight:700;
        color:#1a1a1a;
        margin-bottom:16px;
        letter-spacing:-0.01em;
    }

    /* Checkout inputs */
    .form-group{margin-bottom:16px;}
    .c-input{
        width:100%;
        padding:12px 14px;
        border:1.5px solid rgba(var(--primary-rgb,142,27,207),0.18);
        border-radius:9px;
        font-size:0.875rem;
        font-family:inherit;
        color:#1a1a1a;
        outline:none;
        transition:border-color 0.2s,background 0.2s;
        background:#f8f8f8;
        box-sizing:border-box;
        min-height:46px;
        display:block;
    }
    .c-input::placeholder{color:#bbb;}
    .c-input:focus{
        border-color:var(--primary-color);
        background:#fff;
    }
    .c-input.input-error{border-color:#e53e3e;}
    .error-msg,.error{
        color:#e53e3e;
        font-size:0.72rem;
        display:block;
        margin-top:-8px;
        margin-bottom:6px;
    }

    /* Step action buttons */
    .step-actions{
        display:flex;
        gap:10px;
        padding:16px 20px 20px;
        flex-shrink:0;
        border-top:1px solid rgba(0,0,0,0.06);
    }
    .c-next,.place-order-btn{
        flex:1;
        padding:11px 16px;
        background:var(--primary-color) !important;
        color:#fff;
        border:none;
        border-radius:9px;
        font-size:0.84rem;
        font-weight:700;
        letter-spacing:0.04em;
        cursor:pointer;
        transition:opacity 0.2s;
    }
    .c-next:hover,.place-order-btn:hover{opacity:0.88;}
    .c-next:disabled,.place-order-btn:disabled{opacity:0.55;cursor:not-allowed;}
    .c-back{
        padding:11px 16px;
        background:rgba(var(--primary-rgb,142,27,207),0.08);
        color:var(--primary-color);
        border:none;
        border-radius:9px;
        font-size:0.84rem;
        font-weight:700;
        cursor:pointer;
        transition:background 0.2s;
    }
    .c-back:hover{background:rgba(var(--primary-rgb,142,27,207),0.14);}

    /* Payment method options */
    .pay-method-option{
        border:1.5px solid rgba(var(--primary-rgb,142,27,207),0.15);
        border-radius:10px;
        padding:12px 14px;
        margin-bottom:10px;
        display:flex;
        align-items:center;
        gap:12px;
        cursor:pointer;
        transition:border-color 0.2s,background 0.2s;
    }
    .pay-method-option:has(input:checked){
        border-color:var(--primary-color);
        background:rgba(var(--primary-rgb,142,27,207),0.04);
    }
    #paymentMethods label{
        display:flex;
        align-items:center;
        gap:10px;
        padding:12px 14px;
        border:1.5px solid rgba(var(--primary-rgb,142,27,207),0.15);
        border-radius:10px;
        margin-bottom:10px;
        cursor:pointer;
        font-size:0.87rem;
        font-weight:500;
        color:#1a1a1a;
        transition:border-color 0.2s,background 0.2s;
        width:100%;
        box-sizing:border-box;
    }
    #paymentMethods label:has(input:checked),
    #paymentMethods label.selected{
        border-color:var(--primary-color);
        background:rgba(var(--primary-rgb,142,27,207),0.04);
        font-weight:700;
    }
    #paymentMethods input[type="radio"]{
        accent-color:var(--primary-color);
        width:16px;
        height:16px;
        flex-shrink:0;
    }

    /* Place-order spinner */
    #place-order-loader{
        display:none;
        text-align:center;
        padding:6px 0 10px;
    }
    .btn-spinner{
        display:inline-block;
        width:18px;
        height:18px;
        border:2px solid rgba(255,255,255,0.4);
        border-top-color:#fff;
        border-radius:50%;
        animation:spin 0.7s linear infinite;
        vertical-align:middle;
        margin-right:7px;
    }

    /* OVERLAY (legacy checkout) */
    #checkoutOverlay{
        display:none;
        position:fixed;
        inset:0;
        background:rgba(0,0,0,0.6);
        z-index:11000;
    }
    #checkoutModal{
        display:none;
        position:fixed;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
        width:90%;
        max-width:1100px;
        background:#fff;
        border-radius:14px;
        z-index:11001;
    }
    .checkout-modal-content{display:flex;padding:30px;gap:30px;}
    .checkout-left{flex:2;}
    .checkout-right{flex:1;background:#f8f5ff;padding:20px;border-radius:10px;}
    .checkout-close{position:absolute;top:14px;right:20px;font-size:26px;cursor:pointer;}

    /* ======== QUICK VIEW MODAL ======== */

    body.modal-open{overflow:hidden;}

    #quickViewModal{
        position:fixed;
        inset:0;
        display:none;
        overflow-y:auto;
        z-index:9999;
    }

    .quick-modal{
        display:none;
        position:fixed;
        inset:0;
        background:rgba(10,8,6,0.6);
        backdrop-filter:blur(4px);
        -webkit-backdrop-filter:blur(4px);
        z-index:9990;
    }

    .quick-modal-content{
        background:#fff;
        width:90%;
        max-width:860px;
        margin:52px auto;
        padding:36px 32px;
        border-radius:16px;
        position:relative;
        animation:fadeIn 0.28s ease-out;
        z-index:9991;
        max-height:90vh;
        overflow-y:auto;
    }

    .quick-close{
        position:absolute;
        top:16px;
        right:18px;
        width:34px;
        height:34px;
        border-radius:50%;
        border:none;
        background:rgba(var(--primary-rgb,142,27,207),0.08);
        color:var(--primary-color);
        font-size:18px;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:background 0.2s;
        line-height:1;
    }
    .quick-close:hover{background:rgba(var(--primary-rgb,142,27,207),0.16);}

    .product-title{
        font-size:1.15rem;
        font-weight:700;
        letter-spacing:-0.02em;
        text-transform:uppercase;
        color:#1a1a1a;
        margin:0 0 8px;
    }
    .product-description{
        font-size:0.88rem;
        color:#666;
        line-height:1.65;
        margin-top:16px;
    }

    @keyframes fadeIn{
        from{opacity:0;transform:translateY(-18px);}
        to{opacity:1;transform:translateY(0);}
    }

    /* Quick view loader */
    .quick-loader{text-align:center;padding:60px 0;}
    .spinner{
        width:36px;
        height:36px;
        margin:0 auto 14px;
        border:3px solid rgba(var(--primary-rgb,142,27,207),0.15);
        border-top:3px solid var(--primary-color);
        border-radius:50%;
        animation:spin 0.75s linear infinite;
    }
    @keyframes spin{
        from{transform:rotate(0deg);}
        to{transform:rotate(360deg);}
    }

        /* ----------------------------------------------------- */

        .store-container{
    display:flex;
    gap:30px;
    padding:20px;
    }

    .store-sidebar{
    width:220px;
    }

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

    .category-list li{
    margin-bottom:10px;
    }

    .category-list a{
    text-decoration:none;
    color:#333;
    cursor:pointer;
    }

    .category-list a.active{
    color:#7c3aed;
    font-weight:bold;
    }

    .store-content{
    flex:1;
    }

    .store-topbar{
    display:flex;
    justify-content:space-between;
    margin-bottom:20px;
    }

    .product-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
    }

    .product-image{
    position:relative;
    }

    .product-image img{
    width:100%;
    }
	
	/*
    .sale-badge{
    position:absolute;
    top:10px;
    right:10px;
    background:#333;
    color:#fff;
    padding:5px 10px;
    }
	*/

    .old-price{
    text-decoration:line-through;
    color:var(--text-color);
    }

    .sale-price{
		color: var(--primary-color);
		font-size: 24px;
		font-weight: 700;
    }

    /* MOBILE */

    @media(max-width:768px){

    .store-container{
    flex-direction:column;
    }

    .store-sidebar{
    width:100%;
    }

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

    }

    @media(max-width:480px){

    .product-grid{
    grid-template-columns:1fr;
    }

    }


    /* MOBILE ONLY DESIGN */

    .mobile-category-btn{
    display:none;
    }

    @media(max-width:768px){

    /* Hide sidebar initially */

    .store-sidebar{
    display:none;
    position:absolute;
    background:#fff;
    width:100%;
    left:0;
    top:120px;
    z-index:999;
    padding:15px;
    border-top:1px solid #eee;
    border-bottom:1px solid #eee;
    }

    /* Show when active */

    .store-sidebar.show{
    display:block;
    }

    /* Topbar layout */

    .store-topbar{
    display:flex;
    gap:10px;
    }

    .desktop-title{
    display:none;
    }

    .mobile-category-btn{
    display:block;
    flex:1;
    padding:12px;
    border:1px solid #ddd;
    background:#fff;
    font-size:16px;
    }

    .sort-select{
    flex:1;
    padding:12px;
    font-size:16px;
    }

    /* One product per row */

    .product-grid{
    grid-template-columns:1fr !important;
    gap:25px;
    }

    /* Bigger mobile image */

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

    /* Improve spacing */

    .product-name{
    font-size:18px;
    margin-top:10px;
    }

    .product-price{
    font-size:17px;
    }

    }

    /* MOBILE CATEGORY POPUP */

    .category-overlay{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.4);
    z-index:9998;
    }

    .store-sidebar{
    transition:0.3s;
    }

    @media(max-width:768px){

    .mobile-category-btn{
    display:block;
    flex:1;
    padding:12px;
    border:1px solid #ddd;
    background:#fff;
    font-size:16px;
    cursor:pointer;
    }

    .desktop-title{
    display:none;
    }

    /* Sidebar popup style */

    .store-sidebar{

    position:fixed;
    top:0;
    left:-100%;
    width:80%;
    height:100%;
    background:#fff;
    z-index:9999;
    padding:20px;
    overflow:auto;
    box-shadow:2px 0 10px rgba(0,0,0,0.1);

    }

    /* When open */

    .store-sidebar.show{
    left:0;
    }

    .category-overlay.show{
    display:block;
    }

    .sidebar-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
    }

    .close-btn{
    font-size:28px;
    background:none;
    border:none;
    cursor:pointer;
    }

    .category-list li{
    padding:12px 0;
    border-bottom:1px solid #eee;
    }

    }

    /* Hide close button on desktop */
    .close-btn{
    display:none;
    }

    /* Show only on mobile */
    @media(max-width:768px){

    .close-btn{
    display:block;
    font-size:28px;
    background:none;
    border:none;
    cursor:pointer;
    }

    }

    @media(min-width:769px){

    .category-overlay{
    display:none !important;
    }

    .store-sidebar{
    position:relative;
    left:0;
    height:auto;
    box-shadow:none;
    }

    }

    .sort-select{
        padding:6px 12px;
        height:36px;
        font-size:14px;
        border:1px solid #ccc;
        background:#fff;
        cursor:pointer;
    }

    @media(max-width:768px){

        .store-topbar{
            display:flex;
            gap:10px;
            align-items:center;
        }

        .mobile-category-btn{
            flex:1;
            padding:10px;
            font-size:14px;
            height:38px;
        }

        .sort-select{
            flex:1;
            padding:8px 10px;
            font-size:14px;
            height:38px;
            max-width:100%;
        }

    }

    .store-content{
        width:100%;
        overflow:hidden;
    }

    .store-topbar{
        width:100%;
    }

    .sort-select{
        box-sizing:border-box;
    }

    .store-topbar{
        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:15px;
    }

    @media(max-width:768px){

        .store-topbar{
            flex-direction:row;
        }

    }

    /* Product Card */
    /*.product-card {
        background: #fff;
        border-radius: 8px;
        padding: 12px;
        margin-bottom: 20px;
        transition: 0.3s;
    }*/

    .product-card:hover {
        transform: translateY(-3px);
    }

    /* Product Image Wrapper */
    .product-image {
        position: relative;
        margin-bottom: 12px; /* space between image and title */
    }

    .product-image img {
        width: 100%;
        height: auto;
        border-radius: 6px;
        display: block;
    }

    /* Sale Badge 
    .sale-badge {
        position: absolute;
        top: 8px;
        right: 8px;
        background: #333;
        color: #fff;
        font-size: 13px;
        padding: 4px 10px;
        border-radius: 3px;
        font-weight: 500;
    }
	*/
    /* Product Info */
    .product-info {
        padding: 2px 4px;
    }

    /* Product Name */
    .product-name {
        font-size: 17px;
        font-weight: 600;
        margin-bottom: 6px;
        color: #222;
    }

    /* Price */
    .product-price {
        font-size: 16px;
    }

    /* Old Price */
    .old-price {
        text-decoration: line-through;
        color: var(--text-color);
        margin-right: 6px;
        font-size: 24px;
    }

    /* Sale Price */
    .sale-price {
        color: var(--primary-color);
		font-size: 24px;
		font-weight: 700;
    }
	
	.add-to-cart-btn{
		background: var(--primary-color);
		color: var(--text-color);
		border: none;
		padding: 10px 18px;
		font-weight: 600;
		text-decoration: none;
	}

    /* Mobile Responsive */
    @media (max-width: 768px) {

        .product-card {
            padding: 10px;
            margin-bottom: 18px;
        }

        .product-name {
            font-size: 16px;
        }

        .sale-price {
            font-size: 16px;
        }

    }

    /* Extra Small Mobile */
    @media (max-width: 480px) {

        .product-card {
            padding: 8px;
        }

        .product-name {
            font-size: 15px;
        }

    }

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

    /* Quick View Button Hidden Default */
    /*.quick-view-btn {
        position: absolute;
        bottom: -50px;
        left: 50%;
        transform: translateX(-50%);
        background: #fff;
        padding: 10px 18px;
        font-size: 14px;
        border-radius: 4px;
        cursor: pointer;
        transition: 0.3s;
        box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    }*/

    /* Show on Hover */
    .product-card:hover .quick-view-btn,
	.horizontal-card:hover .quick-view-btn,
	.minimal-card:hover .quick-view-btn,
	.dark-card:hover .quick-view-btn,
	.zoom-card:hover .quick-view-btn {
		bottom: 15px;
	}
	
	.product-image:hover .quick-view-btn,
	.image-wrap:hover .quick-view-btn {
		bottom: 15px;
	}

    /* Prevent link underline */
    .product-link {
        text-decoration: none;
        color: inherit;
        display: block;
    }

    /* ------------ */

	
	.product-view-image {
		width: 100%;
		max-width: 400px;   /* control max width */
		height: 300px;      /* fixed height */
		overflow: hidden;
		border-radius: 8px;
	}

	.product-view-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;  /* ✅ important */
		display: block;
	}

#c-step-1{display:none;}#iv4rkg{display:none;}#c-step-2{display:none;}

/* ===== PRODUCT SCROLL (FINAL) ===== */

section.product{
	padding: 0px !important;
}

.product-scroll-wrapper {
    position: relative;
    overflow: hidden;
}

.product-scroll {
    display: flex;
    overflow: hidden; /* important */
    scroll-behavior: smooth;
}

/* Each item */
.product-card-scroll {
    flex: 0 0 25%; /* show 4 items */
    padding: 10px;
    box-sizing: border-box;
}

/* Responsive */
@media (max-width: 992px) {
    .product-card-scroll { flex: 0 0 33.33%; }
}
@media (max-width: 768px) {
    .product-card-scroll { flex: 0 0 50%; }
}
@media (max-width: 576px) {
    .product-card-scroll { flex: 0 0 100%; }
}

/* Buttons */
.scroll-btn {
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    background: #fff;
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    padding: 10px 14px;
    cursor: pointer;
    z-index: 10;
}

.scroll-btn.prev { left: 0; }
.scroll-btn.next { right: 0; }

.scroll-btn:hover {
    background: var(--primary-color);
    color: var(--secondary-color);
}

.thumbs {
    display: flex;
    gap: 10px;
    margin-top: 10px;

    overflow-x: auto;
    overflow-y: hidden;

    scroll-behavior: smooth;

    max-width: 100%;
    width: 100%;
}

/* Hide scrollbar */
.thumbs::-webkit-scrollbar {
    display: none;
}
.thumbs {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Each thumbnail */
.thumbs img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    flex: 0 0 auto; /* IMPORTANT */
    cursor: pointer;
    border-radius: 6px;
    border: 2px solid transparent;
}

/* Active */
.thumbs img.active {
    border: 2px solid var(--primary-color);
}

.image-box,
.thumbs {
    width: 100%;
    overflow: hidden; /* prevents overflow outside column */
}
.thumb-wrapper {
    position: relative;
}

.thumb-prev,
.thumb-next {
    position: absolute;
    top: 40%;
    transform: translateY(-50%);
    background: black;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    z-index: 2;
}

.thumb-prev { left: 0; }
.thumb-next { right: 0; }

.order-success-overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.order-success-box{
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    width: 350px;
    max-width: 90%;
}

.order-success-box button{
    margin-top: 20px;
    padding: 10px 20px;
    cursor: pointer;
}