.elementor-20735 .elementor-element.elementor-element-11fe506c{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-20735 .elementor-element.elementor-element-a95bec7 .elementor-heading-title{font-family:"Le Monde Livre", Sans-serif;font-weight:600;}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-product__title, .elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .woocommerce-loop-category__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price ins .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products{--products-title-color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.products-heading-show .related-products > h2, .elementor-widget-woocommerce-products.products-heading-show .upsells > h2, .elementor-widget-woocommerce-products.products-heading-show .cross-sells > h2{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del .amount{color:var( --e-global-color-primary );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .price del {font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products ul.products li.product .button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-woocommerce-products.elementor-wc-products .added_to_cart{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-20735 .elementor-element.elementor-element-26be589.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-20735 .elementor-element.elementor-element-26be589.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-20735 .elementor-element.elementor-element-26be589.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:767px){.elementor-20735 .elementor-element.elementor-element-a95bec7{text-align:center;}.elementor-20735 .elementor-element.elementor-element-26be589.elementor-wc-products ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for container, class: .elementor-element-11fe506c *//***************************************************
WILDFIRE – CART PAGE BRAND LIFT
Scoped to WooCommerce Cart page only
****************************************************/
body.woocommerce-cart {
background: #ffffff;
font-family: 'Outfit', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
/* ---------- 1. PAGE HEADER BAND / TITLE ---------- */
body.woocommerce-cart .entry-header {
position: relative;
margin-bottom: 0;
z-index: 1;
}
/* Gradient band behind the page title */
body.woocommerce-cart .entry-header::before {
content: "";
position: absolute;
inset: 0;
top: -10px;
bottom: -40px;
background: linear-gradient(90deg, #e40046 0%, #b20034 100%);
z-index: -1;
}
/* "Cart" title styling */
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title {
color: #ffffff;
text-align: center;
font-family: 'LeMonde Livre', 'Georgia', serif;
font-style: italic;
font-weight: 500;
font-size: 3rem;
padding: 60px 0 40px;
margin: 0;
}
/* ---------- 2. MAIN CONTENT WRAPPER ---------- */
body.woocommerce-cart .entry-content {
background: linear-gradient(180deg, #fff5f8 0%, #ffe8ef 40%, #ffffff 100%);
padding: 40px 0 80px;
}
body.woocommerce-cart .entry-content .woocommerce {
max-width: 1180px;
margin: 0 auto;
}
/* ---------- 3. CART TABLE CARD ---------- */
body.woocommerce-cart .woocommerce-cart-form {
background: #ffffff;
border-radius: 18px;
padding: 30px 28px 24px;
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.06);
border: 1px solid #f7dfe6;
}
body.woocommerce-cart .woocommerce-cart-form .shop_table {
border: none;
box-shadow: none;
}
body.woocommerce-cart .woocommerce-cart-form .shop_table th {
font-weight: 600;
text-transform: uppercase;
font-size: 0.78rem;
letter-spacing: 0.06em;
color: #b23254;
border-bottom: 1px solid #f4dce4;
}
body.woocommerce-cart .woocommerce-cart-form .shop_table td {
border-top: 1px solid #f7e4ea;
padding-top: 18px;
padding-bottom: 18px;
}
/* product name links */
body.woocommerce-cart .product-name a {
color: #333333;
font-weight: 600;
}
body.woocommerce-cart .product-name a:hover {
color: #e40046;
}
/* base quantity input styling */
body.woocommerce-cart .qty {
border-radius: 999px;
border: 1px solid #f0c9d6;
padding: 6px 10px;
}
/* remove icon subtle tweak */
body.woocommerce-cart a.remove {
color: #e40046 !important;
}
body.woocommerce-cart a.remove:hover {
background: #e40046 !important;
color: #ffffff !important;
}
/* ---------- 4. COUPON ROW ---------- */
body.woocommerce-cart .woocommerce-cart-form .coupon {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
}
body.woocommerce-cart .woocommerce-cart-form .coupon label {
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.08em;
color: #b23254;
font-weight: 600;
}
body.woocommerce-cart .woocommerce-cart-form .coupon #coupon_code {
border-radius: 999px;
border: 1px solid #f0c9d6;
padding: 8px 14px;
min-width: 180px;
}
body.woocommerce-cart .woocommerce-cart-form .coupon .button {
border-radius: 999px;
background: #ffffff;
border: 1px solid #e40046;
color: #e40046;
padding: 8px 20px;
font-weight: 600;
text-transform: uppercase;
font-size: 0.8rem;
}
body.woocommerce-cart .woocommerce-cart-form .coupon .button:hover {
background: #e40046;
color: #ffffff;
}
/* update cart button (base) */
body.woocommerce-cart .woocommerce-cart-form .button[name="update_cart"] {
border-radius: 999px;
border: 1px solid #e1c2ce;
background: #ffffff;
color: #555555;
font-size: 0.8rem;
}
/* ---------- 5. CART TOTALS CARD ---------- */
body.woocommerce-cart .cart-collaterals {
margin-top: 30px;
}
body.woocommerce-cart .cart-collaterals .cart_totals {
background: #ffffff;
border-radius: 18px;
padding: 24px 24px 28px;
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.06);
border: 1px solid #f7dfe6;
}
/* header strip for Cart totals */
body.woocommerce-cart .cart_totals > h2 {
font-family: 'LeMonde Livre', 'Georgia', serif;
font-style: italic;
font-weight: 500;
font-size: 1.5rem;
margin: -24px -24px 20px;
padding: 12px 20px;
color: #ffffff;
background: #e40046;
border-radius: 18px 18px 0 0;
width: calc(100% + 48px) !important;
margin-left: -24px !important;
margin-right: -24px !important;
}
/* Totals table clean-up */
body.woocommerce-cart .cart_totals table {
border: none;
}
body.woocommerce-cart .cart_totals table th,
body.woocommerce-cart .cart_totals table td {
border-top: none;
border-bottom: 1px solid #f7e4ea;
padding-block: 10px;
}
body.woocommerce-cart .cart_totals table tr:last-child th,
body.woocommerce-cart .cart_totals table tr:last-child td {
border-bottom: none;
}
/* small reassurance text under totals */
body.woocommerce-cart .cart_totals .wf-cart-reassure,
body.woocommerce-cart .cart_totals p.wf-cart-reassure {
font-size: 0.84rem;
color: #555555;
margin-top: 10px;
line-height: 1.5;
}
/* ---------- 6. PRIMARY BUTTONS ---------- */
body.woocommerce-cart .button,
body.woocommerce-cart .button.alt,
body.woocommerce-cart a.button,
body.woocommerce-cart a.button.alt,
body.woocommerce-cart .checkout-button {
border-radius: 999px;
background: #e40046;
color: #ffffff;
border: none;
padding: 12px 26px;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
font-size: 0.87rem;
}
body.woocommerce-cart .button:hover,
body.woocommerce-cart .button.alt:hover,
body.woocommerce-cart a.button:hover,
body.woocommerce-cart a.button.alt:hover,
body.woocommerce-cart .checkout-button:hover {
background: #c3003b;
color: #ffffff;
box-shadow: 0 8px 20px rgba(228, 0, 70, 0.35);
}
/* ---------- 7. CROSS-SELLS ("YOU MAY BE INTERESTED IN") ---------- */
body.woocommerce-cart .cross-sells {
margin-top: 60px;
margin-bottom: 20px;
padding: 55px 40px 60px;
border-radius: 24px;
background: linear-gradient(180deg, #fff5f8 0%, #ffe2ea 100%);
box-shadow: 0 16px 36px rgba(0, 0, 0, 0.05);
}
/* Heading style */
body.woocommerce-cart .cross-sells > h2 {
font-family: 'LeMonde Livre', 'Georgia', serif;
font-style: italic;
font-size: 2rem;
color: #e40046;
text-align: left;
margin-bottom: 26px;
}
/* product cards */
body.woocommerce-cart .cross-sells ul.products {
gap: 20px;
}
body.woocommerce-cart .cross-sells ul.products li.product {
background: #ffffff;
border-radius: 16px;
padding: 16px 16px 18px;
border: 1px solid #f6dbe3;
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.04);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body.woocommerce-cart .cross-sells ul.products li.product:hover {
transform: translateY(-6px);
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}
/* product titles */
body.woocommerce-cart .cross-sells ul.products li.product .woocommerce-loop-product__title {
font-weight: 600;
font-size: 0.95rem;
color: #333333;
}
/* product price */
body.woocommerce-cart .cross-sells ul.products li.product .price {
color: #e40046;
}
/* product add to cart buttons */
body.woocommerce-cart .cross-sells ul.products li.product a.button {
margin-top: 10px;
width: 100%;
text-align: center;
border-radius: 999px !important;
padding: 10px 16px !important;
}
/* ---------- 8. SEPARATOR ABOVE GENERIC FOOTER BLOCK ---------- */
/* add breathing space between cart content and the "Explore our entire collection" block */
body.woocommerce-cart .entry-content > *:last-child {
margin-bottom: 0;
}
body.woocommerce-cart .entry-content > .woocommerce + * {
margin-top: 70px;
}
/* soft fade strip just before the lower marketing section (optional) */
body.woocommerce-cart .entry-content::after {
content: "";
display: block;
max-width: 1180px;
margin: 40px auto 0;
height: 1px;
border-radius: 999px;
background: linear-gradient(90deg, transparent, #f3c7d5, transparent);
}
/* ---------- 9. MOBILE ADJUSTMENTS ---------- */
@media (max-width: 768px) {
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title {
font-size: 2.1rem;
padding: 40px 0 28px;
}
body.woocommerce-cart .entry-content {
padding: 24px 0 50px;
}
body.woocommerce-cart .woocommerce-cart-form {
padding: 18px 16px 18px;
border-radius: 14px;
}
body.woocommerce-cart .cart-collaterals .cart_totals {
margin-top: 22px;
padding: 20px 18px 22px;
}
body.woocommerce-cart .cart_totals > h2 {
font-size: 1.3rem;
margin: -20px -18px 18px;
padding: 10px 16px;
}
body.woocommerce-cart .cross-sells {
padding: 32px 18px 36px;
border-radius: 18px;
margin-top: 40px;
}
body.woocommerce-cart .cross-sells > h2 {
text-align: center;
font-size: 1.6rem;
}
}
/***************************************************
50-50 SPLIT LAYOUT (Desktop/Tablet)
****************************************************/
@media (min-width: 768px) {
/* Main container for table + buttons */
body.woocommerce-cart .cart-collaterals .cart_totals {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}
/* Cart Totals header spans full width */
body.woocommerce-cart .cart_totals > h2 {
width: 100%;
margin-left: -24px;
margin-right: -24px;
}
/* Totals table (left side) */
body.woocommerce-cart .cart_totals table {
width: 48%;
margin-bottom: 0;
flex-shrink: 0;
}
/* Buttons / payment area (right side) */
body.woocommerce-cart .cart_totals .wc-proceed-to-checkout,
body.woocommerce-cart .cart_totals > div:not(h2):not(table):not(.shop_table_wrapper) {
width: 48%;
margin-top: 0 !important;
padding-top: 0 !important;
flex-shrink: 0;
}
/* Checkout button full width */
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
width: 100%;
}
}
/* Mobile: revert to single column */
@media (max-width: 767px) {
body.woocommerce-cart .cart-collaterals .cart_totals {
display: block;
}
body.woocommerce-cart .cart_totals table,
body.woocommerce-cart .cart_totals .wc-proceed-to-checkout,
body.woocommerce-cart .cart_totals > div {
width: 100% !important;
margin-top: 12px !important;
}
}
/***************************************************
MINIMAL QUANTITY INPUT – BALANCED SPACING
****************************************************/
/* Wrapper */
body.woocommerce-cart .quantity,
body.woocommerce-cart div.quantity {
display: inline-flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 6px !important; /* reduce spacing for better balance */
background: transparent !important;
padding: 0 !important;
border: none !important;
box-shadow: none !important;
}
/* Shared dimensions for consistency */
body.woocommerce-cart .quantity .minus,
body.woocommerce-cart .quantity .plus,
body.woocommerce-cart .quantity input.qty {
height: 36px !important;
min-width: 38px !important;
max-width: 42px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 6px !important;
padding: 0 !important;
line-height: 1 !important;
}
/* Minimal BUTTON styles */
body.woocommerce-cart .quantity .minus,
body.woocommerce-cart .quantity .plus {
background: #fff !important;
border: 1px solid #d9d9d9 !important;
font-size: 18px !important;
font-weight: 500 !important;
color: #333 !important;
cursor: pointer !important;
}
body.woocommerce-cart .quantity .minus:hover,
body.woocommerce-cart .quantity .plus:hover {
background: #f5f5f5 !important;
}
/* INPUT matches button appearance */
body.woocommerce-cart .quantity input.qty {
background: #fff !important;
border: 1px solid #d9d9d9 !important;
color: #333 !important;
text-align: center !important;
font-size: 16px !important;
font-weight: 500 !important;
}
/* Remove unwanted
in quantity cell */
body.woocommerce-cart td.product-quantity br {
display: none !important;
}
/***************************************************
PAYMENT BUTTONS - CONSISTENT STYLING & SPACING
****************************************************/
/* Main container with consistent spacing */
body.woocommerce-cart .wc-proceed-to-checkout {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
margin-top: 0 !important;
padding-top: 0 !important;
}
/* Reduce gap on mobile */
@media (max-width: 768px) {
body.woocommerce-cart .wc-proceed-to-checkout {
gap: 6px !important;
}
}
/* Reset all margins and padding on direct children */
body.woocommerce-cart .wc-proceed-to-checkout > *,
body.woocommerce-cart .wc-proceed-to-checkout > * > *,
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button,
body.woocommerce-cart .wc-proceed-to-checkout #afterpay_express_button,
body.woocommerce-cart .wc-proceed-to-checkout #wc-stripe-express-checkout-element {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Remove padding from payment containers */
body.woocommerce-cart .cart_totals > div:not(.shop_table_wrapper) {
padding: 0 !important;
}
/* EXPLICIT BUTTON ORDER WITH PROPER SPACING */
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
order: 1 !important;
margin-bottom: 0 !important;
}
body.woocommerce-cart .wc-proceed-to-checkout #afterpay_express_button,
body.woocommerce-cart .wc-proceed-to-checkout button#afterpay_express_button {
order: 2 !important;
margin-bottom: 0 !important;
}
body.woocommerce-cart .wc-proceed-to-checkout #wc-stripe-express-checkout-element,
body.woocommerce-cart .wc-proceed-to-checkout .wf-gpay-wrap {
order: 3 !important;
margin-bottom: 0 !important;
}
body.woocommerce-cart .wc-proceed-to-checkout .ppcp-messages {
order: 4 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
/* Force remove any Afterpay plugin margins */
.btn-afterpay_express {
margin: 0 !important;
padding-top: 15px !important;
padding-bottom: 15px !important;
}
/* Stripe element wrapper reset */
#wc-stripe-express-checkout-element {
margin: 0 !important;
padding: 0 !important;
}
/* 1. PROCEED TO CHECKOUT BUTTON */
a.checkout-button.button.alt.wc-forward {
line-height: 1.3 !important;
padding: 15px 28px !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
border-radius: 999px !important;
text-transform: none !important;
font-size: 1.25rem !important;
font-weight: 700 !important;
letter-spacing: 0.02em !important;
height: 54px !important;
width: 100% !important;
}
a.checkout-button.button.alt.wc-forward::first-letter {
text-transform: uppercase !important;
}
/* Remove stray line breaks */
a.checkout-button.button.alt.wc-forward br {
display: none !important;
}
/* 2. AFTERPAY EXPRESS BUTTON */
#afterpay_express_button.btn-afterpay_express {
border-radius: 999px !important;
padding: 15px 28px !important;
height: 54px !important;
min-height: 54px !important;
line-height: 1.3 !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
gap: 8px !important;
font-size: 1.15rem !important;
font-weight: 600 !important;
background-color: #b2fce4 !important;
color: #000 !important;
}
/* Alternative Afterpay .elementor-20735 .elementor-element.elementor-element-11fe506cs */
body.woocommerce-cart .cart_totals a.button.afterpay-checkout-button,
body.woocommerce-cart .cart_totals a.afterpay-checkout-button,
body.woocommerce-cart .cart_totals .afterpay-checkout-button,
body.woocommerce-cart .cart_totals .afterpay-payment-button button,
body.woocommerce-cart .cart_totals .afterpay-payment-button .button {
border-radius: 999px !important;
background-color: #b2fce4 !important;
color: #000000 !important;
height: 54px !important;
font-size: 1.15rem !important;
}
/* 4. PAYPAL PAY-IN-4 MESSAGE */
div.ppcp-messages,
.ppcp-messages {
display: block !important;
padding: 0 !important;
line-height: 1.3 !important;
clear: both !important;
}
div.ppcp-messages br {
display: none !important;
}
/***************************************************
WILDFIRE – PERFECT PILL FOR GOOGLE PAY (FINAL)
****************************************************/
/* Outer wrapper: allow space for Stripe's internal rendering */
.wf-gpay-wrap {
width: 100% !important;
height: 58px !important; /* extra room = stops clipping */
border-radius: 999px !important;
overflow: visible !important; /* allow iframe to breathe */
padding: 0 !important;
margin: 0 !important;
position: relative !important;
}
/* Masking layer for the 54px pill */
.wf-gpay-wrap::before {
content: "";
position: absolute;
inset: 0;
height: 54px !important; /* exact pill height */
border-radius: 999px !important;
background: #000 !important;
z-index: 0 !important;
}
/* Stripe element must sit above the mask */
.wf-gpay-wrap #wc-stripe-express-checkout-element {
position: relative !important;
z-index: 1 !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
top: 4px !important;
}
/* Iframe takes full wrapper height */
.wf-gpay-wrap iframe {
width: 100% !important;
height: 100% !important;
border-radius: 999px !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
z-index: 1 !important;
position: relative !important;
filter: none !important;
-webkit-filter: none !important;
}
/***************************************************
WILDFIRE – REMOVE GOOGLE PAY INTERNAL BORDER
****************************************************/
/* Mask only the border edges – never the content */
.wf-gpay-wrap::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 999px;
/* Create a black inset mask that covers ONLY the edges */
box-shadow: inset 0 0 0 3px #000 !important; /* 3px is safe for any DPI */
pointer-events: none !important; /* Ensure button still clickable */
z-index: 3; /* Above the yellow border, below iframe content */
}
/* Force spacing between checkout, Afterpay, and Google Pay */
body.woocommerce-cart .wc-proceed-to-checkout {
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
margin-top: 0 !important;
padding-top: 0 !important;
}
body.woocommerce-cart .wc-proceed-to-checkout > * {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Fine-tune title band on mobile */
@media (max-width: 768px) {
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title {
padding: 24px 0 18px !important;
font-size: 1.8rem !important;
}
body.woocommerce-cart .entry-header::before {
top: -5px !important;
bottom: -20px !important;
}
}
/* MOBILE – move remove cell into top-right corner of each row */
@media (max-width: 768px) {
body.woocommerce-cart .shop_table.cart .cart_item td.product-remove {
position: absolute !important;
right: 8px !important;
top: 8px !important;
width: auto !important;
padding: 0 !important;
}
body.woocommerce-cart .shop_table.cart .cart_item td.product-remove a.remove {
position: static !important;
font-size: 22px !important;
width: 24px !important;
height: 24px !important;
line-height: 24px !important;
display: block !important;
text-align: center !important;
margin: 0 !important;
}
body.woocommerce-cart .shop_table.cart .cart_item,
body.woocommerce-cart .shop_table.cart tbody tr {
position: relative !important;
padding-right: 40px !important;
}
}
/* MOBILE – cross-sells two-column grid */
@media (max-width: 768px) {
body.woocommerce-cart .cross-sells ul.products {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 20px !important;
}
body.woocommerce-cart .cross-sells ul.products li.product {
display: flex !important;
flex-direction: column !important;
}
body.woocommerce-cart .cross-sells ul.products li.product a.button {
white-space: normal !important;
width: 100% !important;
font-size: 0.75rem !important;
padding: 10px 14px !important;
letter-spacing: 0 !important;
line-height: 1.3 !important;
text-align: center !important;
display: block !important;
border-radius: 999px !important;
min-height: 40px !important;
}
}
/***** FIX: Coupon label overlapping Apply/Update buttons on mobile *****/
@media (max-width: 768px) {
body.woocommerce-cart .woocommerce-cart-form .coupon {
flex-direction: column !important;
align-items: stretch !important;
}
body.woocommerce-cart .woocommerce-cart-form .coupon label {
width: 100% !important;
margin-bottom: 6px !important;
text-align: left !important;
order: 0 !important;
}
body.woocommerce-cart .woocommerce-cart-form .coupon #coupon_code,
body.woocommerce-cart .woocommerce-cart-form .coupon .button {
width: 100% !important;
order: 1 !important;
}
/* Ensure Update Cart button stays below and doesn’t get overlapped */
body.woocommerce-cart .woocommerce-cart-form .button[name="update_cart"] {
margin-top: 10px !important;
position: relative !important;
z-index: 5 !important;
}
}
/***** FIX: Update Cart turning white after quantity change *****/
body.woocommerce-cart .button[name="update_cart"],
body.woocommerce-cart .button[name="update_cart"].disabled,
body.woocommerce-cart .button[name="update_cart"]:disabled {
border-radius: 999px !important;
background: #e40046 !important;
color: #ffffff !important;
border: 1px solid #e40046 !important;
opacity: 1 !important; /* Woo tries to fade disabled buttons */
cursor: pointer !important;
}
body.woocommerce-cart .button[name="update_cart"]:hover {
background: #c3003b !important;
color: #ffffff !important;
}
/***** FIX: Cross-sells disappearing after payment buttons *****/
body.woocommerce-cart .cart-collaterals {
overflow: visible !important; /* stop Stripe/Afterpay wrappers from clipping content */
}
body.woocommerce-cart .cart-collaterals .cross-sells {
display: block !important;
visibility: visible !important;
position: relative !important;
margin-top: 40px !important;
z-index: 1 !important;
}
/* Some themes hide cross-sells if cart_totals is flex */
body.woocommerce-cart .cart_totals {
overflow: visible !important;
}
/***** FIX: Cross-sell buttons appearing vertical instead of horizontal *****/
body.woocommerce-cart .cross-sells ul.products li.product a.button {
white-space: nowrap !important; /* keep ADD TO CART on one line */
display: inline-flex !important;
justify-content: center !important;
align-items: center !important;
padding: 10px 20px !important;
width: 100% !important;
border-radius: 999px !important;
}
/* On small screens, shrink text slightly to prevent wrapping */
@media (max-width: 480px) {
body.woocommerce-cart .cross-sells ul.products li.product a.button {
font-size: 0.8rem !important;
}
}
/***** FIX: Restore visibility of remove 'X' *****/
body.woocommerce-cart .shop_table.cart td.product-remove a.remove {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
color: #e40046 !important;
z-index: 20 !important;
}
@media (max-width: 768px) {
body.woocommerce-cart .shop_table.cart .cart_item {
position: relative !important;
overflow: visible !important; /* ensure X is not clipped */
}
body.woocommerce-cart .shop_table.cart td.product-remove {
position: absolute !important;
top: 10px !important;
right: 10px !important;
width: auto !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
}
/***** FIX: Prevent the remove column from occupying space *****/
@media (max-width: 768px) {
body.woocommerce-cart table.shop_table.cart thead th.product-remove,
body.woocommerce-cart table.shop_table.cart td.product-remove {
width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
border: none !important;
}
}
/***** FORCE CART TABLE FULL WIDTH — FIX LEFT ALIGNMENT *****/
@media (max-width: 768px) {
body.woocommerce-cart table.shop_table {
table-layout: fixed !important;
width: 100% !important;
}
body.woocommerce-cart table.shop_table tr td,
body.woocommerce-cart table.shop_table tr th {
width: auto !important;
}
}
/***** COMPLETELY REMOVE THE REMOVE-COLUMN WIDTH *****/
@media (max-width: 768px) {
/* Collapse column via nth-child target */
body.woocommerce-cart table.shop_table.cart tr td.product-remove,
body.woocommerce-cart table.shop_table.cart tr th.product-remove {
display: table-cell !important;
width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
border: none !important;
}
/* Make sure WooCommerce's colgroup does not reserve space */
body.woocommerce-cart table.shop_table.cart colgroup col:first-child {
width: 0 !important;
max-width: 0 !important;
}
/* Let row content flow full-width */
body.woocommerce-cart table.shop_table.cart tr td:not(.product-remove),
body.woocommerce-cart table.shop_table.cart tr th:not(.product-remove) {
width: 100% !important;
display: block !important;
}
/* Position the X without affecting layout */
body.woocommerce-cart .shop_table.cart td.product-remove {
position: absolute !important;
top: 10px !important;
right: 10px !important;
z-index: 20 !important;
}
body.woocommerce-cart .shop_table.cart tr.cart_item {
position: relative !important;
overflow: visible !important;
}
}
/***** FIX CROSS-SELL PILL BUTTON WIDTH *****/
body.woocommerce-cart .cross-sells ul.products li.product {
padding-bottom: 16px !important;
}
body.woocommerce-cart .cross-sells ul.products li.product a.button {
display: block !important;
width: 100% !important;
white-space: nowrap !important;
padding: 12px 10px !important; /* less side padding = more room for text */
font-size: 0.82rem !important;
text-align: center !important;
border-radius: 999px !important;
overflow: hidden !important;
}
/* Two column layout, ensure enough room */
@media (max-width: 480px) {
body.woocommerce-cart .cross-sells ul.products {
grid-template-columns: 1fr 1fr !important;
}
}
/***** CROSS-SELL ADD TO CART – FULL-WIDTH PILLS *****/
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap {
width: 100% !important;
text-align: center !important;
}
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap a.button {
display: inline-flex !important;
justify-content: center !important;
align-items: center !important;
width: 100% !important;
padding: 10px 14px !important;
border-radius: 999px !important;
white-space: nowrap !important;
font-size: 0.82rem !important;
line-height: 1.2 !important;
}
/***** CART ROWS – REMOVE FAKE RIGHT COLUMN PADDING *****/
@media (max-width: 768px) {
body.woocommerce-cart .shop_table.cart .cart_item,
body.woocommerce-cart .shop_table.cart tbody tr {
padding-right: 0 !important; /* was 40px */
}
/* Keep the X nicely placed without needing extra padding */
body.woocommerce-cart .shop_table.cart td.product-remove {
position: absolute !important;
right: 10px !important;
top: 10px !important;
width: auto !important;
padding: 0 !important;
margin: 0 !important;
border: none !important;
}
body.woocommerce-cart .shop_table.cart td.product-remove a.remove {
display: block !important;
font-size: 22px !important;
width: 24px !important;
height: 24px !important;
line-height: 24px !important;
text-align: center !important;
color: #e40046 !important;
}
}
/***** FIX PRODUCT CARD WIDTH FOR CROSS-SELLS *****/
body.woocommerce-cart .cross-sells ul.products li.product .product-details,
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-bg,
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-wrap,
body.woocommerce-cart .cross-sells ul.products li.product .content-bg {
width: 100% !important;
max-width: 100% !important;
display: block !important;
}
/***** MAKE ADD-TO-CART PILL BUTTONS TRULY FULL WIDTH *****/
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap {
width: 100% !important;
display: block !important;
}
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap a.button {
width: 100% !important;
display: flex !important;
justify-content: center !important;
padding: 12px 18px !important; /* customise this */
border-radius: 999px !important;
white-space: nowrap !important;
font-size: 0.85rem !important;
line-height: 1.2 !important;
}
/***** ALIGN REMOVE "X" WITH CONTENT WIDTH *****/
@media (max-width: 768px) {
body.woocommerce-cart .shop_table.cart td.product-remove {
right: 16px !important; /* was 10 or 0 before */
top: 12px !important;
}
}
/***** FIX PRODUCT CARD WIDTH IN CROSS-SELLS *****/
body.woocommerce-cart .cross-sells ul.products li.product {
width: 100% !important;
max-width: 100% !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-bg,
body.woocommerce-cart .cross-sells ul.products li.product .loop-entry,
body.woocommerce-cart .cross-sells ul.products li.product .content-bg,
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-wrap {
width: 100% !important;
max-width: 100% !important;
}
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap a.button {
width: 100% !important;
display: flex !important;
justify-content: center !important;
padding: 14px 20px !important;
border-radius: 999px !important;
font-size: 0.9rem !important;
white-space: nowrap !important;
}
/***** FIX PRODUCT THUMBNAIL CELL WIDTH *****/
@media (max-width: 768px) {
body.woocommerce-cart td.product-thumbnail {
width: auto !important;
max-width: 80px !important;
}
body.woocommerce-cart td.product-thumbnail img {
width: 80px !important;
height: auto !important;
}
}
/***** FIX CROSS-SELL PRODUCT CARD ALIGNMENT *****/
body.woocommerce-cart .cross-sells ul.products li.product {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-bg,
body.woocommerce-cart .cross-sells ul.products li.product .entry-content-wrap,
body.woocommerce-cart .cross-sells ul.products li.product .product-details {
padding-left: 12px !important;
padding-right: 12px !important;
width: 100% !important;
box-sizing: border-box !important;
}
/***** FIX ADD-TO-CART BUTTON PADDING *****/
body.woocommerce-cart .cross-sells ul.products li.product .product-action-wrap a.button {
padding: 14px 18px !important;
border-radius: 999px !important;
width: 100% !important;
display: flex !important;
justify-content: center !important;
}
/* Remove Elementor decorative background from text-editor buttons */
.elementor-widget-text-editor a.button.wc-backward::before,
.elementor-widget-text-editor a.button.wc-backward::after {
content: none !important;
display: none !important;
background: none !important;
box-shadow: none !important;
border: none !important;
}
/* Also remove the coloured hover overlay Elementor adds */
.elementor-widget-text-editor a::before,
.elementor-widget-text-editor a::after {
content: none !important;
}
/* Cart – tidy 'Return to shop' button on empty cart */
/* Centre the paragraph itself */
body.woocommerce-cart p.return-to-shop {
text-align: center;
}
/* Kill the extra line-break inside the link */
body.woocommerce-cart p.return-to-shop br {
display: none;
}
/* Make the link a proper centred pill with vertically centred text */
body.woocommerce-cart p.return-to-shop a.button.wc-backward {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 10px 32px !important; /* adjust if you want a fatter / slimmer pill */
min-height: 44px !important;
border-radius: 999px !important;
line-height: 1.2 !important;
margin: 0 auto !important; /* keep it centred on desktop & mobile */
background-color: #e40046 !important;
color: #fff !important;
font-size: 16px !important;
font-weight: 600 !important;
}
/* MOBILE — Force cart to display as a single-column block layout */
@media (max-width: 768px) {
/* Make each cart row a block */
body.woocommerce-cart .shop_table.cart .cart_item {
display: block !important;
width: 100% !important;
}
/* Make each full width and stack vertically */
body.woocommerce-cart .shop_table.cart .cart_item td {
display: block !important;
width: 100% !important;
text-align: left !important;
}
/* Remove weird gaps Woo adds */
body.woocommerce-cart .shop_table.cart td.product-thumbnail,
body.woocommerce-cart .shop_table.cart td.product-name,
body.woocommerce-cart .shop_table.cart td.product-price,
body.woocommerce-cart .shop_table.cart td.product-quantity,
body.woocommerce-cart .shop_table.cart td.product-subtotal {
padding: 8px 0 !important;
}
}
/* Add space after the labels (Product:, Price:, Quantity:, Subtotal:) */
body.woocommerce-cart td[data-title]::before {
padding-right: 6px !important;
}
/* Move remove column to the left for mobile */
@media (max-width: 768px) {
/* Make the remove cell the first visible item on the row */
body.woocommerce-cart td.product-remove {
position: absolute !important;
left: 0 !important;
top: 10px !important;
right: auto !important;
width: auto !important;
z-index: 20 !important;
padding: 0 !important;
margin: 0 !important;
text-align: left !important;
}
/* Make the X itself sit cleanly on the left */
body.woocommerce-cart td.product-remove a.remove {
display: flex !important;
justify-content: center !important;
align-items: center !important;
font-size: 22px !important;
width: 24px !important;
height: 24px !important;
line-height: 24px !important;
color: #e40046 !important;
text-align: center !important;
background: #fff !important;
}
/* Ensure the cart item row allows absolute positioning */
body.woocommerce-cart .cart_item {
position: relative !important;
}
/* Add left padding so text doesn't overlap the X */
body.woocommerce-cart .cart_item td {
padding-left: 34px !important;
}
}
/* Shift product thumbnail right to give space for the X */
@media (max-width: 768px) {
/* Move thumbnail to the right */
body.woocommerce-cart td.product-thumbnail {
padding-left: 40px !important; /* space for the X */
}
body.woocommerce-cart td.product-thumbnail img {
margin-left: 20px !important;
display: block !important;
}
}
/* Hide the broken short border that appears only under the thumbnail */
body.woocommerce-cart table.shop_table.cart tr.cart_item:first-child td.product-thumbnail {
border-top: none !important;
}
/* Add a new full-width line above the first product row */
body.woocommerce-cart table.shop_table.cart tr.cart_item:first-child::before {
content: "";
position: absolute;
left: 0;
right: 0;
top: -1px;
height: 1px;
background: #f4dce4;
}
/* Center the product action button wrapper */
.product-action-wrap,
.woocommerce ul.products li.product .product-action-wrap {
display: flex !important;
justify-content: center !important; /* center horizontally */
align-items: center !important;
width: 100% !important;
}
/* Make product loop Add to Cart buttons wider & auto-fit text */
.archive .product .product-action-wrap a.button,
.woocommerce ul.products li.product a.button {
padding: 12px 28px !important; /* more left/right padding */
width: auto !important; /* remove fixed width */
white-space: nowrap !important; /* prevent text from wrapping */
text-transform: none !important; /* sentence case */
font-size: 16px !important;
font-weight: 600 !important;
border-radius: 999px !important; /* keep the pill shape */
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Make each product card a flex column */
.woocommerce ul.products li.product {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
}
/* Make the content wrapper grow, pushing the button down */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce ul.products li.product .entry-content,
.woocommerce ul.products li.product .product-details,
.woocommerce ul.products li.product .product {
flex-grow: 1 !important;
}
/* The button wrapper */
.woocommerce ul.products li.product .product-action-wrap,
.woocommerce ul.products li.product .button {
margin-top: auto !important;
}
/* Style the "You may be interested in..." heading on the Cart page */
.elementor-20735 .elementor-element.elementor-element-a95bec7 h2.elementor-heading-title {
font-family: 'LeMonde Livre', Georgia, serif !important;
font-weight: 500 !important;
font-style: italic !important;
font-size: 26px !important;
color: #333 !important;
text-align: center !important;
margin: 40px 0 25px !important;
position: relative;
}
/* Softer gradient underline */
.elementor-20735 .elementor-element.elementor-element-a95bec7 h2.elementor-heading-title::after {
content: "";
display: block;
width: 80px;
height: 3px;
margin: 14px auto 0;
border-radius: 3px;
background: linear-gradient(90deg, rgba(228,0,70,0) 0%, rgba(228,0,70,1) 50%, rgba(228,0,70,0) 100%);
}
iframe[src*="google"] {
width: 100% !important;
max-width: 400px !important;
height: 55px !important;
border-radius: 45px !important;
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* Wider add-to-cart buttons on desktop only */
@media (min-width: 768px) {
.woocommerce ul.products li.product .product-action-wrap a.button {
padding: 14px 32px !important;
min-width: 160px !important;
}
}
/* Fix disappearing cart row divider line on desktop */
@media (min-width: 768px) {
table.shop_table.cart tr.cart_item td {
border-bottom: 1px solid #f2d3dd !important; /* match your existing line colour */
}
/* Remove conflicting borders WooCommerce sometimes adds */
table.shop_table.cart tr.cart_item td.product-subtotal {
border-bottom: 1px solid #f2d3dd !important;
}
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
font-family: 'Le Monde Livre';
font-style: normal;
font-weight: 400;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-Normal.woff2') format('woff2');
}
@font-face {
font-family: 'Le Monde Livre';
font-style: italic;
font-weight: 400;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-Italic.woff2') format('woff2');
}
@font-face {
font-family: 'Le Monde Livre';
font-style: normal;
font-weight: 600;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-SemiBold.woff2') format('woff2');
}
@font-face {
font-family: 'Le Monde Livre';
font-style: italic;
font-weight: 600;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-SemiBoldItalic.woff2') format('woff2');
}
@font-face {
font-family: 'Le Monde Livre';
font-style: normal;
font-weight: 700;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-Bold.woff2') format('woff2');
}
@font-face {
font-family: 'Le Monde Livre';
font-style: italic;
font-weight: 700;
font-display: auto;
src: url('https://wildfireoil.com/wp-content/uploads/2025/10/LeMondeLivre-BoldItalic.woff2') format('woff2');
}
/* End Custom Fonts CSS */ |