.elementor-570 .elementor-element.elementor-element-03bb1d0{--update-cart-automatically-display:none;--sections-background-color:var( --e-global-color-primary );--sections-border-type:none;--sections-border-radius:0px 0px 0px 0px;--sections-title-color:var( --e-global-color-32aca3d );--sections-radio-buttons-color:var( --e-global-color-32aca3d );}.elementor-570 .elementor-element.elementor-element-03bb1d0 {--sections-descriptions-color:var( --e-global-color-32aca3d );}/* Start custom CSS for woocommerce-cart, class: .elementor-element-03bb1d0 *//* ============================================================
   FUNBADGES — WINKELWAGEN
   Elementor Pro cart-widget + WooCommerce
   Kleuren: cream #fffff4 · ink #0f3833 · border #d8e3d9
            play green #27a74a · fun orange #eb7023 · red #e42725
   ============================================================ */

/* --- 1. Tabel wordt een lijst met kaarten ------------------- */
.woocommerce-cart .shop_table.cart {
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 14px !important;
  background: transparent !important;
}

.woocommerce-cart .shop_table.cart thead th {
  border: 0 !important;
  background: transparent !important;
  padding: 0 0 4px !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #4f7750 !important;
}

.woocommerce-cart tr.cart_item td {
  border: 0 !important;
  border-top: 1px solid #d8e3d9 !important;
  border-bottom: 1px solid #d8e3d9 !important;
  background: #ffffff !important;
  padding: 16px 12px !important;
  vertical-align: middle !important;
}
.woocommerce-cart tr.cart_item td:first-child {
  border-left: 1px solid #d8e3d9 !important;
  border-radius: 22px 0 0 22px !important;
  padding-left: 20px !important;
}
.woocommerce-cart tr.cart_item td:last-child {
  border-right: 1px solid #d8e3d9 !important;
  border-radius: 0 22px 22px 0 !important;
  padding-right: 20px !important;
  font-weight: 700 !important;
}

/* --- 2. Verwijder-knop -------------------------------------- */
.woocommerce-cart td.product-remove { width: 56px !important; text-align: center !important; }

body.woocommerce-cart td.product-remove a.remove.remove,
body .woocommerce-mini-cart a.remove.remove,
body .xoo-wsc-smr-del {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 32px !important;  max-width: 32px !important;
  height: 32px !important;
  padding: 0 !important;  margin: 0 !important;
  border-radius: 999px !important;
  background-color: #fffff4 !important;
  background-image: none !important;
  border: 1.5px solid #d8e3d9 !important;
  color: #3c5a54 !important;
  font: 700 18px/1 "Montserrat", sans-serif !important;
  text-decoration: none !important;
  transition: all 120ms ease;
}
body.woocommerce-cart td.product-remove a.remove.remove:hover,
body .woocommerce a.remove.remove:hover,
body .xoo-wsc-smr-del:hover {
  background-color: #e42725 !important;
  border-color: #e42725 !important;
  color: #ffffff !important;
  transform: rotate(90deg);
}

/* --- 3. Productfoto en naam --------------------------------- */
.woocommerce-cart td.product-thumbnail img {
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  display: block !important;
}
.woocommerce-cart td.product-name a {
  font-weight: 700 !important;
  font-size: 16px !important;
  color: #0f3833 !important;
  text-decoration: none !important;
}
.woocommerce-cart td.product-name a:hover { color: #eb7023 !important; }

/* --- 4. Aantal-veld ----------------------------------------- */
.woocommerce-cart .quantity input.qty {
  width: 74px !important;
  height: 44px !important;
  padding: 0 10px !important;
  border: 1.5px solid #d8e3d9 !important;
  border-radius: 999px !important;
  background: #fffff4 !important;
  font: 700 15px "Montserrat", sans-serif !important;
  color: #0f3833 !important;
  text-align: center !important;
}
.woocommerce-cart .quantity input.qty:focus {
  border-color: #27a74a !important;
  outline: 3px solid rgba(39,167,74,.25) !important;
  outline-offset: 1px !important;
}

/* --- 5. Knoppen (update, coupon, checkout) ------------------ */
.woocommerce-cart .button,
.woocommerce-cart button.button,
.woocommerce-cart .checkout-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font: 700 15px "Montserrat", sans-serif !important;
  cursor: pointer !important;
  transition: background 150ms ease, transform 120ms ease;
}
.woocommerce-cart .button:hover { transform: translateY(-1px); }

/* secundair: bijwerken + coupon */
.woocommerce-cart button[name="update_cart"],
.woocommerce-cart .e-apply-coupon {
  background: transparent !important;
  color: #0f3833 !important;
  box-shadow: inset 0 0 0 2px #b7c9bb !important;
}
.woocommerce-cart button[name="update_cart"]:hover,
.woocommerce-cart .e-apply-coupon:hover {
  background: #d6eac8 !important;
  color: #0f3833 !important;
}
.woocommerce-cart button[name="update_cart"]:disabled { opacity: .45 !important; }

/* primair: afrekenen */
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  width: 100% !important;
  min-height: 52px !important;
  background: #eb7023 !important;
  color: #ffffff !important;
  font-size: 16px !important;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
  background: #d15f18 !important;
  color: #ffffff !important;
}

/* --- 6. Couponblok ------------------------------------------ */
.woocommerce-cart .coupon {
  background: #d6eac8 !important;
  border-radius: 22px !important;
  padding: 16px 20px !important;
  border: 0 !important;
}
.woocommerce-cart #coupon_code {
  height: 44px !important;
  padding: 0 18px !important;
  border: 1.5px solid #b7c9bb !important;
  border-radius: 999px !important;
  background: #fffff4 !important;
  font: 400 14px "Montserrat", sans-serif !important;
  color: #0f3833 !important;
}
.woocommerce-cart #coupon_code::placeholder { color: #4f7750 !important; }

/* --- 7. Totalen-paneel -------------------------------------- */
.woocommerce-cart .cart_totals {
  background: #ffffff !important;
  border: 1px solid #d8e3d9 !important;
  border-radius: 22px !important;
  padding: 24px !important;
  box-shadow: 0 4px 16px rgba(15,56,51,.07) !important;
}
.woocommerce-cart .cart_totals h2 {
  margin: 0 0 12px !important;
  font: 800 18px "Montserrat", sans-serif !important;
  color: #0f3833 !important;
}
.woocommerce-cart .cart_totals table { border: 0 !important; margin: 0 !important; }
.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
  border: 0 !important;
  border-bottom: 1px solid #d8e3d9 !important;
  padding: 12px 0 !important;
  background: transparent !important;
  font-size: 15px !important;
  color: #3c5a54 !important;
}
.woocommerce-cart .cart_totals th {
  font-weight: 700 !important;
  color: #0f3833 !important;
  width: 42% !important;
}
.woocommerce-cart .cart_totals tr.order-total th,
.woocommerce-cart .cart_totals tr.order-total td {
  border-bottom: 0 !important;
  padding-top: 16px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #0f3833 !important;
}
.woocommerce-cart .cart_totals tr.order-total .amount { color: #eb7023 !important; }

/* verzendopties als aanklikbare pillen */
.woocommerce-cart ul#shipping_method li {
  background: #fffff4 !important;
  border: 1.5px solid #d8e3d9 !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  margin: 0 0 8px !important;
}
.woocommerce-cart ul#shipping_method label {
  font-size: 14px !important;
  color: #0f3833 !important;
  cursor: pointer !important;
}
.woocommerce-cart .shipping-calculator-button {
  color: #eb7023 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}
.woocommerce-cart .woocommerce-shipping-destination { font-size: 12px !important; color: #4f7750 !important; }

/* --- 8. Prijzen --------------------------------------------- */
.woocommerce-cart .amount { color: #0f3833 !important; font-weight: 600 !important; }

/* --- 9. Meldingen ------------------------------------------- */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error {
  position: relative !important;
  border: 0 !important;
  border-radius: 14px !important;
  /* links ruimte houden voor het WooCommerce-icoon */
  padding: 16px 20px 16px 52px !important;
  font: 500 14px "Montserrat", sans-serif !important;
  line-height: 1.5 !important;
}
.woocommerce-cart .woocommerce-message::before,
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .woocommerce-error::before {
  top: 50% !important;
  left: 20px !important;
  transform: translateY(-50%) !important;
  font-size: 16px !important;
  line-height: 1 !important;
}
.woocommerce-cart .woocommerce-message::before { color: #27a74a !important; }
.woocommerce-cart .woocommerce-info::before    { color: #0572b7 !important; }
.woocommerce-cart .woocommerce-error::before   { color: #e42725 !important; }
.woocommerce-cart .woocommerce-message .button,
.woocommerce-cart .woocommerce-error .button {
  min-height: 34px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}
.woocommerce-cart .woocommerce-message { background: #d6eac8 !important; color: #0f3833 !important; }
.woocommerce-cart .woocommerce-info    { background: #e4f0fa !important; color: #0f3833 !important; }
.woocommerce-cart .woocommerce-error   { background: #fde3e3 !important; color: #0f3833 !important; }

/* --- 10. Mobiel (WooCommerce kantelt de tabel) -------------- */
@media (max-width: 768px) {
  .woocommerce-cart .shop_table.cart { border-spacing: 0 !important; }
  .woocommerce-cart tr.cart_item {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid #d8e3d9 !important;
    border-radius: 22px !important;
    margin-bottom: 14px !important;
    padding: 8px 4px !important;
  }
  .woocommerce-cart tr.cart_item td {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 10px 16px !important;
  }
  .woocommerce-cart td.product-remove a.remove {
    width: 44px !important; max-width: 44px !important;
    height: 44px !important; font-size: 22px !important;
  }
  .woocommerce-cart .wc-proceed-to-checkout .checkout-button { min-height: 52px !important; }
}

/* --- 11. Laatste redmiddel: theme wint nog van de X --------
   Maximale specificiteit; zet dit als laatste in je CSS.     */
html body .woocommerce td.product-remove a.remove[href*="remove_item"] {
  width: 32px !important;  height: 32px !important;  max-width: 32px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #fffff4 !important;
  background-color: #fffff4 !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 1.5px solid #d8e3d9 !important;
  color: #3c5a54 !important;
  font-size: 20px !important;
  line-height: 28px !important;
  text-indent: 0 !important;
}
html body .woocommerce td.product-remove a.remove[href*="remove_item"]:hover {
  background: #e42725 !important;
  background-color: #e42725 !important;
  border-color: #e42725 !important;
  color: #ffffff !important;
}

/* --- 12. Elementor cart-widget wint van gewone .elementor-570 .elementor-element.elementor-element-03bb1d0s ----
   LET OP: zet dit NIET in de Custom CSS van de widget zelf —
   dan scopet Elementor het naar .elementor-570
   .elementor-element-XXXXXXX en werkt het alleen op díe pagina
   (je Engelse cart heeft een ander ID). Plaats het in
   Customizer → Extra CSS of in je child-theme style.css.
   De klasse .elementor-widget-woocommerce-cart zit op elke
   cart-widget, ongeacht taal of pagina-ID.                    */
.elementor-widget-woocommerce-cart td.product-remove a.remove {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;  height: 32px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #fffff4 !important;
  border: 1.5px solid #d8e3d9 !important;
  color: #3c5a54 !important;
  font-size: 20px !important;
  line-height: 1 !important;
  transition: all 120ms ease;
}
.elementor-widget-woocommerce-cart td.product-remove a.remove:hover {
  background: #e42725 !important;
  border-color: #e42725 !important;
  color: #ffffff !important;
  transform: rotate(90deg);
}

/* Verzendingsrij: label weg, opties op volle breedte eronder.
   Zonder dit staat <th>Verzending</th> als aparte kolom naast
   de verzendopties.                                           */
.elementor-widget-woocommerce-cart .cart_totals tr.shipping th {
  display: none !important;
}
.elementor-widget-woocommerce-cart .cart_totals tr.shipping td {
  display: block !important;
  width: 100% !important;
  padding: 12px 0 16px !important;
  border: 0 !important;
  border-bottom: 1px solid #d8e3d9 !important;
}
.elementor-widget-woocommerce-cart .cart_totals tr.shipping td::before {
  content: none !important;
}
.elementor-widget-woocommerce-cart .cart_totals tr.shipping li label {
  margin-left: 8px !important;
}/* End custom CSS */