:root { 
    --bq-pink: #ff0066; 
    --bq-black: #000000; 
    --bq-text: #333333; 
    --bq-border: #e5e5e5; 
    --bq-bg-light: #f9f9f9; 
}

/* =========================================
   GLOBAL & LAYOUT
   ========================================= */
.boutique-checkout-wrapper { max-width: 1200px; margin: 40px auto; font-family: 'Poppins', sans-serif; color: var(--bq-text); }
.boutique-checkout-header { text-align: center; margin-bottom: 30px; }
.boutique-checkout-header h1 { font-size: 32px; font-weight: 800; color: var(--bq-black); }
.trust-badges { list-style: none; padding: 0; display: flex; justify-content: center; gap: 20px; font-size: 14px; font-weight: 600; }
.trust-badges span { color: var(--bq-pink); }
.boutique-grid { display: grid; grid-template-columns: 1fr 400px; gap: 30px; align-items: start; }

/* NOTICES */
.boutique-notices-wrapper { max-width: 800px; margin: 0 auto 20px auto; }
.boutique-notices-wrapper .woocommerce-info, 
.boutique-notices-wrapper .woocommerce-message { background: #f8f9fa !important; border-top: 2px solid var(--bq-pink) !important; color: var(--bq-text) !important; padding: 15px 20px !important; border-radius: 8px !important; font-size: 14px !important; margin: 0 !important; }
.boutique-notices-wrapper .woocommerce-info a, 
.boutique-notices-wrapper .woocommerce-message a { color: var(--bq-pink) !important; font-weight: 700 !important; }

/* FORM BOXES */
.boutique-step-box { background: #fff; border: 1px solid var(--bq-border); border-radius: 12px; padding: 24px; margin-bottom: 20px; }
.boutique-step-box h2 { font-size: 18px; font-weight: 700; color: var(--bq-black); display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.step-num { background: var(--bq-black); color: #fff; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.boutique-fields-row { display: flex; gap: 15px; }
.boutique-field { margin-bottom: 15px; flex: 1; }
.boutique-field label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 6px; }
.boutique-field input { width: 100%; padding: 12px; border: 1px solid var(--bq-border); border-radius: 8px; }
.boutique-step-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.invoice-text { font-size: 13px; color: #888; }

/* DAY BUTTONS */
.boutique-days-group { display: flex; gap: 8px; }
.day-btn { flex: 1; padding: 10px; border: 1px solid var(--bq-border); background: #fff; border-radius: 8px; font-weight: 600; cursor: pointer; transition: all 0.2s; text-align: center; line-height: 1.2; }
.day-btn.active { background: var(--bq-pink); color: #fff; border-color: var(--bq-pink); }
.day-btn small { display: block; font-size: 9px; font-weight: 500; margin-top: 2px; opacity: 0.8; }

/* VENUE */
.boutique-venue-prompt { background: var(--bq-bg-light); border: 1px solid var(--bq-border); padding: 12px 15px; border-radius: 8px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; font-size: 14px; }
.boutique-venue-prompt .link-btn { background: transparent !important; border: none !important; color: var(--bq-pink) !important; font-weight: 700 !important; text-decoration: underline !important; cursor: pointer !important; padding: 0 !important; font-size: 14px !important; font-family: inherit !important; box-shadow: none !important; }
.boutique-venue-input-box { background: var(--bq-bg-light); border: 1px solid var(--bq-border); padding: 15px; border-radius: 8px; margin-bottom: 15px; }
.price-delivery-btn { background: var(--bq-black); color: #fff; border: none; padding: 0 20px; border-radius: 8px; font-weight: 600; cursor: pointer; }

/* SIDEBAR HEADER */
.boutique-summary-box { background: #fff; border: 1px solid var(--bq-border); border-radius: 12px; padding: 24px; position: sticky; top: 20px; box-shadow: 0 4px 20px rgba(0,0,0,0.05); }
.summary-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; padding-bottom: 15px; margin-bottom: 15px; }
.summary-header h3 { font-size: 16px; font-weight: 800; margin: 0; color: #111; text-transform: uppercase; }
.summary-total { font-size: 18px; font-weight: 800; color: #111; }
.boutique-right-col .boutique-days-section { display: none !important; }

/* =========================================
   GIFT SELECTION LAYOUT
   ========================================= */
.boutique-gifts-container { margin-bottom: 20px; }
.boutique-gift-section { margin-bottom: 25px; }
.gift-title { font-size: 13px; font-weight: 800; color: #111; margin: 0 0 10px 0; text-transform: uppercase; letter-spacing: 0.03em; }

.gift-grid { 
    display: grid; 
    grid-template-columns: repeat(2, 1fr); 
    gap: 10px; 
    margin-bottom: 15px;
}

.gift-item { 
    position: relative;
    border: 2px solid #e5e5e5; 
    border-radius: 10px; 
    padding: 12px 8px; 
    text-align: center; 
    cursor: pointer; 
    transition: all 0.2s; 
    background: #fff; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: space-between; 
}

.gift-item:hover { 
    border-color: #b3b3b3; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.05); 
}

/* Active State (When clicked/selected) */
.gift-item.active { 
    border-color: #2E5CFF; 
    background: #f0f5ff; 
    box-shadow: 0 0 0 1px #2E5CFF; 
}

/* The checkmark circle for the active item */
.gift-item.active::after {
    content: "✓";
    position: absolute;
    top: 8px;
    right: 8px;
    width: 20px;
    height: 20px;
    background: #2E5CFF;
    color: white;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(46, 92, 255, 0.4);
}

.gift-item img { width: 70px; height: auto; object-fit: contain; margin-bottom: 8px; }
.gift-item-name { font-size: 12px; font-weight: 700; color: #111; line-height: 1.2; margin-bottom: 4px; }
.gift-item-worth { font-size: 10px; color: #888; font-weight: 500; margin-top: auto; }

/* =========================================
   CART TABLE
   ========================================= */
.boutique-cart-table { width: 100% !important; border-collapse: collapse !important; margin-bottom: 20px !important; border: none !important; background: transparent !important; }
.boutique-cart-table tbody, .boutique-cart-table tr, .boutique-cart-table td { border: none !important; background: transparent !important; }
.boutique-cart-table .cart-item td { padding: 15px 0 !important; vertical-align: middle !important; border-bottom: 1px solid var(--bq-border) !important; }
.boutique-cart-table .cart-item:last-child td { border-bottom: none !important; }
.boutique-cart-table td:first-child { border-right: none !important; padding-right: 15px !important; }
.boutique-cart-table td:last-child { border-left: none !important; }
.boutique-cart-table .product-img { width: 60px !important; }
.boutique-cart-table .product-img img { width: 60px !important; height: 60px !important; border-radius: 8px !important; border: 1px solid var(--bq-border) !important; object-fit: cover !important; display: block !important; margin: 0 !important; padding: 0 !important; }
.boutique-cart-table .product-details { display: flex !important; flex-direction: column !important; justify-content: center !important; padding-left: 0 !important; }
.product-name-wrap { display: flex !important; flex-direction: column !important; gap: 4px !important; margin-bottom: 8px !important; }
.boutique-cart-table .product-name { font-weight: 700 !important; color: var(--bq-black) !important; font-size: 14px !important; line-height: 1.3 !important; }
.boutique-cart-table .product-qty-price { display: flex !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; margin-top: 0 !important; }
.boutique-cart-table .product-price { font-weight: 800 !important; color: var(--bq-black) !important; font-size: 15px !important; white-space: nowrap !important; }

/* QTY CONTROLS */
table.boutique-cart-table .qty-controls { display: flex !important; align-items: center !important; gap: 5px !important; background: #f4f6fa !important; padding: 2px 4px !important; border-radius: 6px !important; border: none !important; }
table.boutique-cart-table .qty-controls .qty-btn { background: #fff !important; border: 1px solid #d1d5db !important; border-radius: 4px !important; font-size: 14px !important; font-weight: 800 !important; color: var(--bq-black) !important; cursor: pointer !important; width: 24px !important; height: 24px !important; display: flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; padding: 0 !important; margin: 0 !important; min-height: 0 !important; max-height: 24px !important; box-shadow: none !important; text-shadow: none !important; }
table.boutique-cart-table .qty-controls .qty-btn:hover { background: #e5e7eb !important; }
table.boutique-cart-table .qty-controls .qty-val { font-size: 13px !important; font-weight: 700 !important; min-width: 20px !important; text-align: center !important; }
table.boutique-cart-table .qty-controls .remove-item { color: #888 !important; text-decoration: none !important; font-size: 14px !important; margin-left: 5px !important; border: none !important; background: transparent !important; padding: 0 !important; }
table.boutique-cart-table .qty-controls .remove-item:hover { color: var(--bq-pink) !important; }

/* =========================================
   SAVINGS BREAKDOWN BAR (NEW)
   ========================================= */
.boutique-savings-breakdown {
    background: #f9f9f9;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 20px;
    font-size: 13px;
}

.saving-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

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

.saving-row.highlight-green {
    color: #15803d; /* Matches reference green */
}

.saving-value.strikethrough {
    text-decoration: line-through;
    color: #888;
}

.saving-note {
    font-size: 12px;
    color: #666;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed #d1d5db;
    font-style: italic;
    text-align: center;
}
/* Green Progress Bar */
.saving-progress-track {
    width: 100%;
    height: 8px;
    background: #e5e7eb; /* Light grey track */
    border-radius: 4px;
    margin-top: 10px;
    overflow: hidden;
}

.saving-progress-fill {
    height: 100%;
    background: #15803d; /* The matching green */
    border-radius: 4px;
    transition: width 0.4s ease-in-out; /* Smooth animation when changing days */
}
/* =========================================
   TOTALS & BUTTONS
   ========================================= */
.boutique-totals { border-top: 1px dashed #ddd; padding-top: 15px; }
.total-row { display: flex; justify-content: space-between; font-size: 14px; font-weight: 600; color: #555; margin-bottom: 8px; }
.total-row.grand-total { font-size: 18px; font-weight: 800; color: #111; margin-top: 10px; padding-top: 10px; border-top: 1px solid #ddd; }
#place_order { background: var(--bq-pink) !important; color: #fff !important; width: 100% !important; border-radius: 8px !important; font-weight: 800 !important; font-size: 16px !important; padding: 15px !important; text-transform: uppercase !important; }


/* =========================================
   HEADER CART BUTTON
   ========================================= */
.boutique-header-cart-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 8px;
    margin-left: 15px; /* Space between Quote List and Cart */
    color: #ffffff;    /* White icon to match the pink top bar */
    transition: all 0.2s ease;
}

/* Make the SVG icon a good size */
.boutique-header-cart-btn svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
}

/* Hover effect */
.boutique-header-cart-btn:hover {
    color: #333333; /* Turns dark on hover (or change to your brand black) */
    transform: scale(1.05);
}

/* The Red/Pink Notification Badge */
.boutique-cart-count {
    position: absolute;
    top: -2px;
    right: -6px;
    background: #000000; /* Black background for high contrast against pink bar */
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #ff0066; /* Pink border to separate it from the icon */
    
    /* Hidden animation state */
    opacity: 0; 
    transform: scale(0.5);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Show the badge only when there are items */
.boutique-header-cart-btn.has-items .boutique-cart-count {
    opacity: 1;
    transform: scale(1);
}

/* =========================================
   DUAL ACTION BUTTONS (Checkout / Quote)
   ========================================= */
.boutique-action-buttons {
    margin-top: 25px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
}

.boutique-btn-primary {
    display: block;
    width: 100%;
    background: #ff0066;
    color: #ffffff !important;
    padding: 16px;
    border-radius: 8px;
    font-weight: 800;
    font-size: 15px;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.boutique-btn-primary:hover {
    background: #000000;
    color: #ffffff !important;
}

.boutique-btn-secondary {
    display: block;
    width: 100%;
    background: #ffffff;
    color: #ff0066 !important;
    border: 2px solid #ff0066;
    padding: 14px;
    border-radius: 8px;
    font-weight: 800;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.boutique-btn-secondary:hover {
    background: #fff0f5;
}

.boutique-quote-link a {
    display: inline-block;
    margin-top: 10px;
    font-size: 12px;
    color: #666;
    text-decoration: underline;
}

.boutique-quote-link a:hover {
    color: #ff0066;
}

/* Hide the default WooCommerce Add to Cart form on single pages */
.single-product .elementor-add-to-cart {
    display: none !important;
}

/* UNHIDE and style the YITH Add to Quote Button */
.single-product .yith-ywraq-add-to-quote {
    display: block !important;
    width: 100%;
    margin-top: 20px;
}

.single-product .yith-ywraq-add-to-quote .add-request-quote-button {
    display: block !important;
    width: 100%;
    background: #ff0066 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    text-align: center;
    cursor: pointer !important;
    padding: 16px 20px !important;
    transition: all 0.2s ease;
    text-decoration: none !important;
}

.single-product .yith-ywraq-add-to-quote .add-request-quote-button:hover {
    background: #000000 !important;
}

/* Hide the "View Cart" link that YITH adds after clicking */
.single-product .yith_ywraq_add_item_browse-list-34798 {
    display: none !important;
}

/* =========================================
   FIX YITH POST-CLICK LAYOUT
   ========================================= */

/* 1. Hide the ugly "Product added to cart" text */
.single-product .yith_ywraq_add_item_product_message {
    display: none !important;
}

/* 2. Hide the "View Cart" link */
.single-product .yith_ywraq_add_item_browse_message {
    display: none !important;
}

/* 3. Force the main button to stay visible even after clicking */
.single-product .yith-ywraq-add-button.addedd {
    display: block !important;
}

/* 4. Ensure the button still looks like a button after clicking */
.single-product .yith-ywraq-add-button.addedd .add-request-quote-button {
    background: #ff0066 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
/* =========================================
   RESPONSIVE
   ========================================= */
@media (max-width: 900px) { 
    .boutique-grid { grid-template-columns: 1fr; } 
    .boutique-right-col { order: -1; } 
}