.elementor-12421 .elementor-element.elementor-element-32a3d44{margin-top:-41px;margin-bottom:0px;}/* Start custom CSS for html, class: .elementor-element-1213a34 *//* =========================================================
   NoomiEats Basket — CLEAN UI (FULL CSS) v7
   Fixes:
   - Item card layout breaking after add-ons refresh
   - Stepper changing UI / number disappearing
   - Prevents the tall “image column” + squished title
   - Keeps add-ons: stacked on desktop sidebar, carousel on mobile
   Fully scoped to #nmCartNew
========================================================= */

#nmCartNew,
#nmCartNew * { box-sizing: border-box; }

#nmCartNew{
  /* Brand */
  --nm-red: #E8342A;
  --nm-teal: #2F9CA5;
  --nm-ink: #111827;

  /* Surfaces */
  --nm-card: #ffffff;
  --nm-soft: #f7f8fb;
  --nm-border: rgba(17,24,39,.10);
  --nm-shadow: 0 14px 40px rgba(17,24,39,.08);
  --nm-shadow2: 0 10px 26px rgba(17,24,39,.07);
  --nm-muted: rgba(17,24,39,.64);

  /* Radius / spacing */
  --nm-r: 22px;
  --nm-r2: 16px;
  --nm-pad: clamp(16px, 2.6vw, 28px);

  /* Item sizing */
  --nm-thumb: 72px;
  --nm-gap: 14px;

  width: min(1160px, 100%);
  margin: 0 auto;
  padding: var(--nm-pad);
  color: var(--nm-ink);
  background: transparent;
  overflow: visible;
}

body.woocommerce-cart{ overflow-x: hidden !important; }
body.woocommerce-cart,
body.woocommerce-checkout{ background: #fff !important; }

#nmCartNew a{ color: inherit; text-decoration: none; }
#nmCartNew img{ max-width: 100%; height: auto; display: block; }

/* Hard safety: never let children force page width */
#nmCartNew,
#nmCartNew .nm-basket__grid,
#nmCartNew .nm-basket__left,
#nmCartNew .nm-basket__right,
#nmCartNew .nm-card{
  max-width: 100%;
  min-width: 0;
}

/* ---------------- Header ---------------- */
#nmCartNew .nm-basket__brand{
  letter-spacing: .36em;
  font-size: 12px;
  font-weight: 800;
  color: rgba(17,24,39,.55);
  margin-bottom: 10px;
}

#nmCartNew .nm-basket__top{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
}

#nmCartNew .nm-h1{
  margin: 0;
  font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.02;
  letter-spacing: -0.02em;
}

#nmCartNew .nm-sub{
  margin: 10px 0 0;
  color: var(--nm-muted);
  font-weight: 520;
  max-width: 46ch;
}

#nmCartNew .nm-basket__actions{
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}

/* Buttons */
#nmCartNew .nm-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 800;
  border: 1px solid var(--nm-border);
  background: #fff;
  box-shadow: 0 10px 22px rgba(17,24,39,.06);
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
  white-space: nowrap;
  max-width: 100%;
}
#nmCartNew .nm-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(17,24,39,.10);
}
#nmCartNew .nm-btn--ghost{ background: rgba(255,255,255,.92); }
#nmCartNew .nm-btn--solid{
  background: var(--nm-red);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 16px 34px rgba(232,52,42,.24);
}
#nmCartNew .nm-btn--solid:hover{
  box-shadow: 0 20px 44px rgba(232,52,42,.30);
}

/* ---------------- Cards ---------------- */
#nmCartNew .nm-card{
  background: var(--nm-card);
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-r);
  box-shadow: var(--nm-shadow);
  width: 100%;
}
#nmCartNew .nm-card + .nm-card{ margin-top: 14px; }

#nmCartNew .nm-card__head{
  padding: 18px 18px 14px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  min-width: 0;
}

#nmCartNew .nm-h2{
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.01em;
}

#nmCartNew .nm-muted{
  color: var(--nm-muted);
  font-weight: 600;
}

/* ---------------- Minimum bar ---------------- */
#nmCartNew .nm-min{
  padding: 18px;
  margin-top: 18px;
}
#nmCartNew .nm-min__row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
#nmCartNew .nm-min__title{
  font-weight: 950;
  font-size: clamp(15px, 2.1vw, 18px);
  line-height: 1.18;
  min-width: 0;
}
#nmCartNew .nm-min__meta{
  font-weight: 900;
  color: rgba(17,24,39,.70);
  white-space: nowrap;
}
#nmCartNew .nm-min__bar{
  margin-top: 12px;
  height: 10px;
  border-radius: 999px;
  background: rgba(17,24,39,.08);
  overflow: hidden;
}
#nmCartNew .nm-min__fill{
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(47,156,165,1), rgba(47,156,165,.55));
  transition: width .24s ease;
}
#nmCartNew .nm-min__hint{
  margin-top: 10px;
  color: var(--nm-muted);
  font-weight: 650;
  font-size: 14px;
  line-height: 1.35;
}

/* ---------------- Main grid ---------------- */
#nmCartNew .nm-basket__grid{
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 16px;
  align-items: start;
}
#nmCartNew .nm-basket__left,
#nmCartNew .nm-basket__right{ min-width: 0; }
#nmCartNew .nm-basket__right{ display: grid; gap: 16px; }

/* ---------------- Items list ---------------- */
#nmCartNew .nm-items{ overflow: hidden; }
#nmCartNew .nm-items__list{
  padding: 0 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Base “card look” for whatever JS injects (SAFE: does not force layout) */
#nmCartNew [data-nm-items] > *{
  background: var(--nm-soft);
  border: 1px solid rgba(17,24,39,.08);
  border-radius: var(--nm-r2);
  box-shadow: var(--nm-shadow2);
  padding: 14px;
  max-width: 100%;
  min-width: 0;
}

/* ✅ REAL LAYOUT: only force flex on likely item-root nodes */
#nmCartNew [data-nm-items] :is([data-key], .nm-it, .nm-item, .nm-row, .cart_item){
  display: flex !important;
  align-items: flex-start !important;
  gap: var(--nm-gap) !important;
  flex-wrap: wrap !important;
  padding: 14px !important;
  min-width: 0 !important;
}

/* Thumbnail wrapper (if exists) */
#nmCartNew [data-nm-items] :is([data-key], .nm-it, .nm-item, .nm-row, .cart_item)
  :is(.nm-it__img, .nm-item__img, .nm-thumb, .product-thumbnail){
  flex: 0 0 var(--nm-thumb) !important;
  width: var(--nm-thumb) !important;
  height: var(--nm-thumb) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* Thumbnail image (locks the “before/after add-ons” differences) */
#nmCartNew [data-nm-items] :is([data-key], .nm-it, .nm-item, .nm-row, .cart_item) img{
  width: var(--nm-thumb) !important;
  height: var(--nm-thumb) !important;
  object-fit: cover !important;
  border-radius: 16px !important;
  background: #fff;
  border: 1px solid rgba(17,24,39,.10);
}

/* Middle text block */
#nmCartNew [data-nm-items] :is(.nm-it__mid, .nm-item__mid, .nm-mid, .product-name, .nm-info){
  flex: 1 1 220px !important;
  min-width: 0 !important;
}

/* Title (avoid ugly narrow column + keep it readable) */
#nmCartNew [data-nm-items] :is(.nm-it__name, .nm-item__name, .product-name a, .nm-name){
  font-weight: 950 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

/* Meta line */
#nmCartNew [data-nm-items] :is(.nm-it__meta, .nm-item__meta, .variation, .nm-meta){
  margin-top: 6px !important;
  color: var(--nm-muted) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
}

/* Controls block on the right */
#nmCartNew [data-nm-items] :is(.nm-it__right, .nm-item__right, .nm-right, .product-quantity, .nm-actions){
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}

/* Price line (if separate element exists) -> always goes to bottom nicely */
#nmCartNew [data-nm-items] :is(.nm-it__price, .nm-item__price, .line-subtotal, .product-subtotal, .nm-priceLine){
  order: 99 !important;
  flex: 1 1 100% !important;
  font-weight: 950 !important;
  font-size: 18px !important;
  letter-spacing: -0.01em !important;
  margin-top: 10px !important;
  padding-left: calc(var(--nm-thumb) + var(--nm-gap)) !important;
}

/* MOQ pill */
#nmCartNew .nm-moq,
#nmCartNew .nm-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  font-weight: 950;
  font-size: 12px;
  color: var(--nm-red);
  background: rgba(232,52,42,.10);
  border: 1px solid rgba(232,52,42,.22);
  margin-left: 10px;
  white-space: nowrap;
}

/* ---------------- Universal Stepper (handles BOTH variants) ---------------- */

/* Container: custom or Woo-like */
#nmCartNew [data-nm-items] :is(.nm-step, .quantity){
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;

  padding: 10px 12px !important;
  border-radius: 999px !important;
  background: #fff !important;
  border: 1px solid rgba(17,24,39,.10) !important;
  box-shadow: 0 10px 20px rgba(17,24,39,.05) !important;

  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;

  float: none !important;
  position: relative !important;
}

/* Hide Woo quantity label if present */
#nmCartNew [data-nm-items] .quantity label{ display: none !important; }

/* Buttons inside stepper */
#nmCartNew [data-nm-items] :is(.nm-step, .quantity)
  :is(button, a, .plus, .minus, .nm-step__btn){
  width: 46px !important;
  height: 46px !important;
  border-radius: 999px !important;

  border: 1px solid rgba(17,24,39,.10) !important;
  background: rgba(17,24,39,.03) !important;

  color: var(--nm-ink) !important;
  -webkit-text-fill-color: var(--nm-ink) !important;

  font-weight: 950 !important;
  font-size: 22px !important;
  line-height: 1 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  padding: 0 !important;

  /* kill theme positioning that makes it “vertical/hidden” */
  position: static !important;
  transform: none !important;
  text-indent: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Disabled (MOQ etc.) */
#nmCartNew [data-nm-items] :is(.nm-step, .quantity)
  :is(button:disabled, .minus:disabled, .nm-step__btn:disabled){
  opacity: .45 !important;
  cursor: not-allowed !important;
}

/* Quantity number (span/div/input) */
#nmCartNew [data-nm-items] :is(
  .nm-step__val,
  .nm-step__num,
  [data-nm-step-val],
  input.qty,
  .quantity .qty,
  .qty
){
  width: 36px !important;
  min-width: 36px !important;
  text-align: center !important;

  font-weight: 950 !important;
  font-size: 18px !important;
  line-height: 1 !important;

  color: var(--nm-ink) !important;
  -webkit-text-fill-color: var(--nm-ink) !important;

  border: 0 !important;
  background: transparent !important;

  padding: 0 !important;
  margin: 0 !important;

  opacity: 1 !important;
  visibility: visible !important;
}

/* Remove number spinners */
#nmCartNew [data-nm-items] input.qty::-webkit-outer-spin-button,
#nmCartNew [data-nm-items] input.qty::-webkit-inner-spin-button{
  -webkit-appearance: none !important;
  margin: 0 !important;
}
#nmCartNew [data-nm-items] input.qty{
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}

/* Remove link/button */
#nmCartNew [data-nm-items] :is(.nm-remove, [data-remove], .remove, a.remove){
  color: var(--nm-red) !important;
  font-weight: 950 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

/* ---------------- Summary ---------------- */
#nmCartNew .nm-summary{ padding: 18px; }
#nmCartNew .nm-sum__rows{
  margin-top: 14px;
  display: grid;
  gap: 12px;
}
#nmCartNew .nm-sum__row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
#nmCartNew .nm-hr{
  border: 0;
  height: 1px;
  background: rgba(17,24,39,.10);
  margin: 6px 0;
}
#nmCartNew .nm-sum__row--total strong{ font-size: 18px; }

#nmCartNew .nm-cta{
  margin-top: 16px;
  display: flex;
  width: 100%;
  max-width: 100%;
  align-items: center;
  justify-content: center;
  padding: 14px 16px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(232,52,42,.92), rgba(232,52,42,1));
  color: #fff;
  font-weight: 950;
  border: 0;
  box-shadow: 0 18px 42px rgba(232,52,42,.22);
  text-align: center;
}
#nmCartNew .nm-cta:hover{ box-shadow: 0 22px 52px rgba(232,52,42,.28); }

#nmCartNew .nm-sum__note{
  margin-top: 10px;
  color: var(--nm-muted);
  font-weight: 650;
}

/* ---------------- Recommended add-ons ---------------- */
#nmCartNew .nm-addons{ padding: 18px; }

/* Desktop sidebar: stack cards (best look in 420px column) */
#nmCartNew .nm-addons__row{
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#nmCartNew [data-nm-addons] > *{
  background: var(--nm-soft);
  border: 1px solid rgba(17,24,39,.08);
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 10px 22px rgba(17,24,39,.06);

  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;

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

#nmCartNew [data-nm-addons] img{
  width: 56px !important;
  height: 56px !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  background: #fff;
  border: 1px solid rgba(17,24,39,.10);
}

#nmCartNew [data-nm-addons] :is(.nm-ad__name, .nm-name){
  font-weight: 950;
  line-height: 1.1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  min-width: 0;
}

#nmCartNew [data-nm-addons] :is(.nm-ad__price, .nm-price){
  margin-top: 4px;
  color: var(--nm-muted);
  font-weight: 750;
  font-size: 13px;
}

#nmCartNew [data-nm-addons] button,
#nmCartNew [data-nm-addons] .nm-ad__btn{
  border: 0;
  background: var(--nm-red);
  color: #fff;
  font-weight: 950;
  border-radius: 999px;
  padding: 10px 14px;
  cursor: pointer;
  box-shadow: 0 14px 34px rgba(232,52,42,.20);
  white-space: nowrap;
}
#nmCartNew [data-nm-addons] button:disabled{ opacity: .6; cursor: not-allowed; }

/* ---------------- Responsive ---------------- */
@media (max-width: 980px){
  #nmCartNew .nm-basket__grid{ grid-template-columns: 1fr; }

  /* When single-column, add-ons can be grid */
  #nmCartNew .nm-addons__row{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
  }
}

@media (max-width: 720px){
  #nmCartNew{ padding: 16px; }

  #nmCartNew .nm-basket__top{
    flex-direction: column;
    align-items: flex-start;
  }
  #nmCartNew .nm-basket__actions{
    width: 100%;
    justify-content: flex-start;
  }

  /* Min meta drop under if needed */
  #nmCartNew .nm-min__row{ grid-template-columns: 1fr; }
  #nmCartNew .nm-min__meta{ justify-self: start; }

  /* Item rows: keep image + text, controls below */
  #nmCartNew [data-nm-items] :is([data-key], .nm-it, .nm-item, .nm-row, .cart_item){
    flex-wrap: wrap !important;
  }

  #nmCartNew [data-nm-items] :is(.nm-it__mid, .nm-item__mid, .nm-mid, .product-name, .nm-info){
    flex: 1 1 calc(100% - (var(--nm-thumb) + var(--nm-gap))) !important;
    min-width: 0 !important;
  }

  #nmCartNew [data-nm-items] :is(.nm-it__right, .nm-item__right, .nm-right, .product-quantity, .nm-actions){
    flex: 1 1 100% !important;
    margin-left: 0 !important;
    padding-left: calc(var(--nm-thumb) + var(--nm-gap)) !important;
    justify-content: flex-start !important;
    margin-top: 10px !important;
  }

  #nmCartNew [data-nm-items] :is(.nm-it__price, .nm-item__price, .line-subtotal, .product-subtotal, .nm-priceLine){
    padding-left: calc(var(--nm-thumb) + var(--nm-gap)) !important;
  }

  /* Mobile add-ons carousel (your good look) */
  #nmCartNew .nm-addons__row{
    display: flex;
    gap: 12px;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding: 2px 2px 10px;
    overscroll-behavior-x: contain;
  }
  #nmCartNew [data-nm-addons] > *{
    flex: 0 0 84%;
    max-width: 84%;
    min-width: 260px;
    scroll-snap-align: start;
  }
  #nmCartNew .nm-addons__row::after{
    content: "";
    flex: 0 0 14px;
  }
}

@media (max-width: 420px){
  #nmCartNew{ --nm-thumb: 64px; }

  #nmCartNew .nm-h1{ font-size: 40px; }

  #nmCartNew [data-nm-addons] > *{
    flex-basis: 88%;
    max-width: 88%;
    min-width: 240px;
  }
}

/* Prevent theme styles from forcing weird widths inside our section */
#nmCartNew .woocommerce,
#nmCartNew .entry-content,
#nmCartNew .elementor-widget-container{
  max-width: 100% !important;
}

#nmCartNew button,
#nmCartNew input{ font-family: inherit; }
/* =========================================================
   HOTFIX v8 — Smaller stepper + remove "x qty" meta text
   Paste at the VERY END of Basket CSS
========================================================= */

/* 1) Smaller stepper everywhere (custom + Woo quantity) */
#nmCartNew [data-nm-items] :is(.nm-step, .quantity){
  padding: 8px 10px !important;
  gap: 10px !important;
  box-shadow: 0 8px 18px rgba(17,24,39,.05) !important;
}

#nmCartNew [data-nm-items] :is(.nm-step, .quantity)
  :is(button, a, .plus, .minus, .nm-step__btn){
  width: 38px !important;
  height: 38px !important;
  font-size: 18px !important;
}

#nmCartNew [data-nm-items] :is(
  .nm-step__val,
  .nm-step__num,
  [data-nm-step-val],
  input.qty,
  .quantity .qty,
  .qty
){
  width: 28px !important;
  min-width: 28px !important;
  font-size: 16px !important;
}

/* 2) Remove the "× qty" line/text in the card (keep title + price) */

/* If your JS prints it inside meta */
#nmCartNew [data-nm-items] :is(.nm-it__meta, .nm-item__meta, .nm-meta){
  font-size: 12px !important;
}

/* Hide lines that are exactly "× 1", "× 2", etc (common output uses a separate element) */
#nmCartNew [data-nm-items] :is(.nm-it__meta, .nm-item__meta, .nm-meta, .variation, .product-quantity, .qty-label)
  :is(.nm-times, .times, .mult, .xqty){
  display: none !important;
}

/* More defensive: if the meta contains just the multiplier line, hide it */
#nmCartNew [data-nm-items] :is(.nm-it__meta, .nm-item__meta, .nm-meta) br{
  display: none !important;
}

/* If your multiplier is rendered as its own line span/div */
#nmCartNew [data-nm-items] :is(.nm-it__meta, .nm-item__meta, .nm-meta) :is(.nm-x, .x, .multiplier){
  display: none !important;
}

/* 3) Slightly tighter spacing so card feels cleaner */
#nmCartNew [data-nm-items] :is([data-key], .nm-it, .nm-item, .nm-row, .cart_item){
  row-gap: 10px !important;
}
/* =========================================================
   HOTFIX v9 — Stepper EXTRA small (override)
   Paste at the VERY END of Basket CSS
========================================================= */

#nmCartNew [data-nm-items] :is(.nm-step, .quantity){
  padding: 6px 8px !important;
  gap: 8px !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 14px rgba(17,24,39,.04) !important;
}

#nmCartNew [data-nm-items] :is(.nm-step, .quantity)
  :is(button, a, .plus, .minus, .nm-step__btn){
  width: 32px !important;
  height: 32px !important;
  font-size: 16px !important;
}

#nmCartNew [data-nm-items] :is(
  .nm-step__val,
  .nm-step__num,
  [data-nm-step-val],
  input.qty,
  .quantity .qty,
  .qty
){
  width: 24px !important;
  min-width: 24px !important;
  font-size: 15px !important;
}

/* optional: keep Remove from dominating visually */
#nmCartNew [data-nm-items] :is(.nm-remove, [data-remove], .remove, a.remove){
  font-size: 14px !important;
}
/* =========================================================
   HOTFIX v10 — Stepper ULTRA small (final)
   Paste at the VERY END of Basket CSS
========================================================= */

#nmCartNew [data-nm-items] :is(.nm-step, .quantity){
  padding: 5px 6px !important;
  gap: 6px !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 12px rgba(17,24,39,.035) !important;
}

#nmCartNew [data-nm-items] :is(.nm-step, .quantity)
  :is(button, a, .plus, .minus, .nm-step__btn){
  width: 28px !important;
  height: 28px !important;
  font-size: 14px !important;
}

#nmCartNew [data-nm-items] :is(
  .nm-step__val,
  .nm-step__num,
  [data-nm-step-val],
  input.qty,
  .quantity .qty,
  .qty
){
  width: 20px !important;
  min-width: 20px !important;
  font-size: 14px !important;
}

/* tighten control row spacing so it feels less “empty” */
#nmCartNew [data-nm-items] :is(.nm-it__right, .nm-item__right, .nm-right, .product-quantity, .nm-actions){
  gap: 10px !important;
}/* End custom CSS */