/* ==========================================================
   MEF Theme — WooCommerce styles
   ========================================================== */

/* ---------- Product grid ---------- */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin: 0;
  padding: 0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none; }
.woocommerce ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  background: #fff;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
  padding-bottom: 18px;
  text-align: left;
}
.woocommerce ul.products li.product:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.woocommerce ul.products li.product a img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  background: #fff;
  margin: 0 0 14px;
  padding: 10px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-head);
  text-transform: uppercase;
  letter-spacing: .5px;
  font-size: 1.1rem !important;
  color: var(--black);
  padding: 0 18px !important;
  line-height: 1.2;
}
.woocommerce ul.products li.product .price {
  color: var(--red) !important;
  font-weight: 700;
  font-size: 1.1rem !important;
  padding: 0 18px;
  margin-bottom: 14px !important;
}
.woocommerce ul.products li.product .button {
  margin: auto 18px 0 !important;
  text-align: center;
  background: var(--black);
  color: #fff;
  padding: 12px 20px;
  font-size: .9rem;
}
.woocommerce ul.products li.product .button:hover { background: var(--red); color: #fff; }
.woocommerce ul.products li.product .added_to_cart { display: block; text-align: center; margin-top: 8px; font-size: .85rem; }
.woocommerce span.onsale {
  background: var(--red);
  border-radius: 999px;
  min-height: 0;
  min-width: 0;
  padding: 4px 12px;
  line-height: 1.4;
  font-family: var(--font-head);
  text-transform: uppercase;
  top: 12px;
  left: 12px;
  right: auto;
  margin: 0;
}

/* Dark homepage sections */
.theme-dark .woocommerce ul.products li.product { background: var(--charcoal); border-color: #2c2c2c; }
.theme-dark .woocommerce ul.products li.product a img { background: #fff; }
.theme-dark .woocommerce ul.products li.product .woocommerce-loop-product__title { color: #fff; }
.theme-dark .woocommerce ul.products li.product .button { background: var(--red); }
.theme-dark .woocommerce ul.products li.product .button:hover { background: #fff; color: var(--black); }

/* ---------- Shop toolbar ---------- */
.woocommerce .woocommerce-result-count { color: var(--muted); margin-bottom: 24px; }
.woocommerce .woocommerce-ordering select {
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-family: var(--font-body);
}
.woocommerce nav.woocommerce-pagination ul { border: 0; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; margin: 0 3px; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span { border-radius: 6px; padding: 10px 14px; background: var(--cream); color: var(--black); }
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--red); color: #fff; }

/* ---------- Single product ---------- */
.woocommerce div.product { margin-top: 10px; }
.woocommerce div.product .product_title { font-size: clamp(2rem, 4vw, 3rem); }
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--red); font-size: 1.8rem; font-weight: 700; }
.woocommerce div.product div.images img { border-radius: var(--radius); background: #fff; }
.woocommerce div.product form.cart { margin: 24px 0; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.woocommerce div.product form.cart .button { background: var(--red); color: #fff; padding: 15px 36px; }
.woocommerce div.product form.cart .button:hover { background: var(--red-dark); }
.woocommerce .quantity .qty {
  width: 80px;
  padding: 12px;
  border: 2px solid var(--border);
  border-radius: 999px;
  text-align: center;
  font-weight: 600;
}
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; border-bottom: 2px solid var(--border); }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background: none; border: 0; border-radius: 0; margin: 0 20px 0 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--font-head);
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--muted);
  padding: 12px 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--black); box-shadow: inset 0 -3px 0 var(--red); }
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2 { margin: 50px 0 24px; }
.woocommerce .product_meta { font-size: .9rem; color: var(--muted); }

/* Variation swatches / selects */
.woocommerce div.product form.cart .variations select {
  padding: 10px 14px;
  border: 2px solid var(--border);
  border-radius: 8px;
  min-width: 200px;
}

/* ---------- Notices ---------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-top-color: var(--red) !important;
  background: var(--cream) !important;
  border-radius: 8px;
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--red) !important; }

/* ---------- Cart / checkout / account ---------- */
.woocommerce table.shop_table { border-radius: var(--radius); border-color: var(--border); overflow: hidden; }
.woocommerce table.shop_table th { font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; background: var(--cream); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text {
  padding: 12px 14px;
  border: 1px solid #d6cfc4;
  border-radius: 8px;
  font-family: var(--font-body);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus { outline: 2px solid var(--red); border-color: transparent; }
.woocommerce #payment { background: var(--cream) !important; border-radius: var(--radius); }
.woocommerce #payment #place_order,
.woocommerce .wc-proceed-to-checkout a.checkout-button {
  background: var(--red);
  color: #fff;
  width: 100%;
  font-size: 1.1rem;
  padding: 16px;
}
.woocommerce #payment #place_order:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover { background: var(--red-dark); }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 12px 16px;
  border-radius: 8px;
  color: var(--black);
  font-weight: 500;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: var(--cream); color: var(--red); }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 768px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 14px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: .95rem !important; padding: 0 12px !important; }
  .woocommerce ul.products li.product .price { padding: 0 12px; }
  .woocommerce ul.products li.product .button { margin: auto 12px 0 !important; padding: 10px; font-size: .8rem; }
}

/* ---------- Homepage product sections ----------
   Cards line up across each row: one image frame size, titles reserve
   two lines so prices sit level, and the button uses the brand red. */
.cat-section .woocommerce ul.products li.product {
  border-radius: 14px;
  padding-bottom: 20px;
}
.cat-section .woocommerce ul.products li.product a img {
  aspect-ratio: 1;
  object-fit: contain;
  background: var(--cream);
  padding: 18px;
  margin: 0 0 16px;
  border-radius: 0;
}
.theme-dark .woocommerce ul.products li.product a img { background: #fff; }
.cat-section .woocommerce ul.products li.product .woocommerce-loop-product__title {
  min-height: 2.4em;              /* room for two lines, so prices align */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 6px;
}
.cat-section .woocommerce ul.products li.product .price {
  font-size: 1.2rem !important;
  margin-bottom: 16px !important;
}
.cat-section .woocommerce ul.products li.product .button {
  background: var(--red);
  color: #fff;
  border-radius: 999px;
  padding: 13px 20px;
  font-size: .95rem;
  letter-spacing: .5px;
}
.cat-section .woocommerce ul.products li.product .button:hover { background: var(--red-dark); color: #fff; }
.theme-dark .woocommerce ul.products li.product .button:hover { background: #fff; color: var(--black); }

/* ---------- Homepage product cards: plain style ----------
   Image, title and price only: no card box, no ratings. The image and
   title link to the product page. Add to Cart is hidden on the homepage. */
.cat-section .woocommerce ul.products li.product {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}
.cat-section .woocommerce ul.products li.product:hover { transform: none; box-shadow: none; }
.cat-section .woocommerce ul.products li.product a img {
  background: transparent;
  padding: 8px;
  margin: 0 0 12px;
  border-radius: 0;
}
.cat-section .woocommerce ul.products li.product .star-rating,
.cat-section .woocommerce ul.products li.product .added_to_cart { display: none !important; }
.cat-section .woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-body);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  font-size: 1rem !important;
  padding: 0 4px !important;
  margin: 0 0 6px;
  min-height: 2.4em;
  color: var(--black);
}
.theme-dark .woocommerce ul.products li.product .woocommerce-loop-product__title { color: #fff; }
.cat-section .woocommerce ul.products li.product .price {
  font-size: 1.05rem !important;
  font-weight: 700;
  padding: 0 4px;
  margin-bottom: 0 !important;
}

/* ---------- Homepage add-to-cart: small "+" beside the price ----------
   A 22px black circle with a plus drawn from two white bars. On hover it
   widens into a red "Add to Cart" pill. The link keeps its text for screen
   readers and WooCommerce. */
.cat-section .woocommerce ul.products li.product { position: relative; }
.cat-section .woocommerce ul.products li.product .price {
  min-height: 22px;
  display: flex;
  align-items: center;
  margin: 0 !important;
  padding-right: 40px !important;   /* keep the price clear of the + button */
}
.cat-section .woocommerce ul.products li.product .button {
  position: absolute;
  right: 10px;
  bottom: 0;
  display: block !important;
  box-sizing: border-box;
  width: 22px;
  height: 22px;
  min-width: 22px;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50%;
  background: var(--black);
  color: transparent;
  font-family: var(--font-body);
  font-size: 0;
  font-weight: 600;
  letter-spacing: .5px;
  line-height: 22px;
  text-align: center;
  white-space: nowrap;
  transition: width .2s, background .2s;
}
.cat-section .woocommerce ul.products li.product .button::before,
.cat-section .woocommerce ul.products li.product .button::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  transform: translate(-50%, -50%);
}
.cat-section .woocommerce ul.products li.product .button::before { width: 10px; height: 2px; }
.cat-section .woocommerce ul.products li.product .button::after { width: 2px; height: 10px; }
.cat-section .woocommerce ul.products li.product .button:hover,
.theme-dark .woocommerce ul.products li.product .button:hover {
  width: auto;
  padding: 0 12px !important;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  font-size: .75rem;
}
.cat-section .woocommerce ul.products li.product .button:hover::before,
.cat-section .woocommerce ul.products li.product .button:hover::after { display: none; }

/* ---------- Homepage cards: prices on one baseline ----------
   Cards stretch to the tallest title in each row. The price row is pinned
   to the bottom of every card, so prices and + buttons line up across the row. */
.cat-section .woocommerce ul.products li.product {
  display: flex;
  flex-direction: column;
}
.cat-section .woocommerce ul.products li.product .price {
  margin-top: auto !important;
}

/* Carousel row: every card stretches to the height of the tallest one,
   so the price rows (pinned to the bottom above) sit on one line. */
.mef-carousel ul.products {
  align-items: stretch !important;
}
.mef-carousel ul.products li.product {
  align-self: stretch !important;
  height: auto !important;
}

/* ---------- Homepage carousels: fixed row, aligned prices and + buttons ----------
   The carousel is a single grid row. Each card fills its column and the row
   height is set by the tallest card, so every price row and + button sits
   on the same horizontal line across the section. */
.cat-section .mef-carousel ul.products {
  display: grid !important;
  grid-template-columns: none !important;
  grid-template-rows: 1fr !important;
  grid-auto-flow: column !important;
  grid-auto-columns: calc((100% - 100px) / 6) !important;   /* six per row, 20px gaps */
  column-gap: 20px !important;
  row-gap: 0 !important;
  align-items: stretch !important;
}
.cat-section .mef-carousel ul.products li.product {
  width: auto !important;
  height: auto !important;
  min-width: 0;
  align-self: stretch !important;
}
@media (min-width: 768px) and (max-width: 1099px) {
  .cat-section .mef-carousel ul.products {
    grid-auto-columns: calc(33.333% - 14px) !important;   /* three per row */
  }
}
@media (max-width: 767px) {
  .cat-section .mef-carousel ul.products {
    grid-auto-columns: calc(50% - 10px) !important;      /* two per row */
  }
}

/* Homepage cards: title and price centred under the product picture.
   Equal side padding keeps the price centred; the + button stays bottom-right. */
.cat-section .woocommerce ul.products li.product .woocommerce-loop-product__title {
  text-align: center;
}
.cat-section .woocommerce ul.products li.product .price {
  justify-content: center;
  padding-left: 40px !important;
  padding-right: 40px !important;
  text-align: center;
}

/* Beef & Veal section: white photo frames, all the same square size, so the
   pictures and their titles line up across each row. */
.cat-section-organic-beef .woocommerce ul.products li.product a img {
  background: #fff;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 12px;
  border-radius: 10px;
}

/* Premium Steak Cuts section: white photo frames, same as Beef & Veal */
.cat-section-premium-steak-cuts .woocommerce ul.products li.product a img {
  background: #fff;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 12px;
  border-radius: 10px;
}

/* Homepage cards with a sale price: regular price stacked above the sale price,
   both centred, so they don't run into each other or the + button. */
.cat-section .woocommerce ul.products li.product .price {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 26px;
  padding: 0 40px !important;
  line-height: 1.2;
}
.cat-section .woocommerce ul.products li.product .price del {
  font-size: .8rem;
  font-weight: 400;
  color: var(--muted);
  opacity: 1;
}
.cat-section .woocommerce ul.products li.product .price ins {
  text-decoration: none;
  color: var(--red);
}

/* Sale badge: charcoal ribbon tab with a notched bottom edge, matching the
   header cart. Reads "Off" at the top-right of the photo. */
.woocommerce span.onsale.mef-off,
.cat-section .woocommerce span.onsale {
  top: 0;
  right: 14px;
  left: auto;
  width: 64px;
  height: 40px;
  min-height: 0;
  min-width: 0;
  padding: 0 0 6px;               /* room for the notch, so the text sits centred */
  white-space: nowrap;
  margin: 0;
  border-radius: 0;
  background: var(--red);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--font-head);
  font-size: .75rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  transform: none;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 84%, 0 100%);
  box-shadow: none;
}

/* Homepage prices: slightly smaller so the widest sale price clears the + button */
.cat-section .woocommerce ul.products li.product .price {
  font-size: 1rem !important;
  padding: 0 36px !important;
}

/* "Save 10%" line in the homepage price block: small caps above the regular price.
   The sale price and + button stay on the bottom line. */
.mef-save {
  display: block;
  order: -1;                       /* shows above the regular price in the homepage cards */
  font-family: var(--font-head);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--black);
}

/* Aqeeqah carousel: five cards per row on desktop, and every product photo
   is cropped to the same square so the images line up across the row. */
@media (min-width: 1100px) {
  .cat-section-aqeeqa-service .mef-carousel ul.products {
    grid-auto-columns: calc((100% - 80px) / 5) !important;   /* five per row, 20px gaps */
  }
}
.cat-section-aqeeqa-service .woocommerce ul.products li.product a img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* "Click for more details" above the price on homepage cards */
.mef-details-hint {
  display: block;
  font-family: var(--font-body);
  font-size: .78rem;
  color: var(--muted);
  text-align: center;
  margin: 0 0 6px;
  letter-spacing: .2px;
}

/* "Most Popular" tag: red pill at the top-left of the product photo */
.cat-section .woocommerce ul.products li.product { position: relative; }
.mef-popular-tag {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  background: var(--red);
  color: #fff;
  font-family: var(--font-head);
  font-size: .6rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .4px;
  line-height: 1;
  padding: 4px 7px;
  border-radius: 999px;
}

/* ---------- My Account page (design only; functionality unchanged) ---------- */
.woocommerce-account .woocommerce { max-width: 1100px; margin: 0 auto; padding: 10px 0 80px; }
.woocommerce-account .woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-info {
  border-radius: 12px; border-top: 0; padding: 16px 20px 16px 48px; margin-bottom: 24px; background: var(--cream); color: var(--text);
}
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-error { background: #fdecec; color: #9b1c1c; }

/* Logged-out: login and register cards side by side */
.woocommerce-account .u-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin: 0; }
.woocommerce-account .u-column1,
.woocommerce-account .u-column2 { float: none !important; width: auto !important; margin: 0 !important; background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 40px; box-shadow: var(--shadow); }
.woocommerce-account .u-column1 h2,
.woocommerce-account .u-column2 h2 { font-family: var(--font-head); text-transform: uppercase; font-size: 1.6rem; letter-spacing: .5px; color: var(--black); margin: 0 0 22px; }
.woocommerce-account .woocommerce-form { border: 0; padding: 0; margin: 0; }
.woocommerce-account .woocommerce-form-row { margin: 0 0 18px; padding: 0; }
.woocommerce-account .woocommerce-form-row label,
.woocommerce-account .woocommerce-form__label { font-size: .88rem; font-weight: 600; color: var(--black); display: block; margin-bottom: 6px; }
.woocommerce-account .woocommerce-Input,
.woocommerce-account input.input-text,
.woocommerce-account .woocommerce-form input[type="text"],
.woocommerce-account .woocommerce-form input[type="email"],
.woocommerce-account .woocommerce-form input[type="password"],
.woocommerce-account .woocommerce-form input[type="tel"] {
  width: 100%; box-sizing: border-box; padding: 13px 15px; border: 1px solid var(--border); border-radius: 10px; background: #faf8f4; font: inherit; color: var(--text);
}
.woocommerce-account .woocommerce-Input:focus,
.woocommerce-account .woocommerce-form input:focus { outline: 2px solid var(--red); outline-offset: 1px; background: #fff; }
.woocommerce-account .woocommerce-form__label-for-checkbox { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; color: var(--text); }
.woocommerce-account .woocommerce-form-login__rememberme input { width: auto; margin: 0; accent-color: var(--red); }
.woocommerce-account .woocommerce-LostPassword { margin: 14px 0 0; font-size: .9rem; }
.woocommerce-account .woocommerce-LostPassword a,
.woocommerce-account .woocommerce-privacy-policy-text a { color: var(--red); font-weight: 600; }
.woocommerce-account .woocommerce-button,
.woocommerce-account button.woocommerce-Button,
.woocommerce-account .woocommerce-form button[type="submit"] {
  display: block; width: 100%; box-sizing: border-box; background: var(--red); color: #fff; border: 0; border-radius: 999px; padding: 15px 24px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; font-size: 1rem; cursor: pointer; margin-top: 6px; transition: background .2s;
}
.woocommerce-account .woocommerce-button:hover,
.woocommerce-account button.woocommerce-Button:hover { background: var(--red-dark); }
.woocommerce-account .woocommerce-privacy-policy-text { font-size: .85rem; color: var(--muted); margin: 0 0 14px; }

/* Logged-in: navigation card + content card */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { background: #fff; border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow); padding: 30px; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin-bottom: 6px; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 12px 16px; border-radius: 10px; color: var(--black); font-family: var(--font-head); text-transform: uppercase; letter-spacing: .6px; font-size: .9rem; }
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { background: var(--cream); color: var(--red); }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { background: var(--red); color: #fff; }
.woocommerce-account .woocommerce-MyAccount-content h2 { font-family: var(--font-head); text-transform: uppercase; color: var(--black); margin-top: 0; }
.woocommerce-account .woocommerce-MyAccount-content p { color: var(--text); line-height: 1.7; }
.woocommerce-account .woocommerce-MyAccount-content a { color: var(--red); font-weight: 600; }
.woocommerce-account .woocommerce-orders-table { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.woocommerce-account .woocommerce-orders-table th { background: var(--cream); font-family: var(--font-head); text-transform: uppercase; font-size: .8rem; letter-spacing: .5px; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; }
.woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 24px; }
.woocommerce-account .woocommerce-MyAccount-content { margin-bottom: 0; }

@media (min-width: 960px) {
  .woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) { display: grid; grid-template-columns: 260px 1fr; gap: 28px; align-items: start; }
  .woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 0; }
}
@media (max-width: 760px) {
  .woocommerce-account .u-columns { grid-template-columns: 1fr; }
  .woocommerce-account .u-column1, .woocommerce-account .u-column2 { padding: 26px 22px; }
}

/* Home page product carousels: every product photo uses the same frame and padding.
   The Chicken Wings (Without Skin) photo has extra white space, so it is enlarged slightly
   inside its frame to match the others. */
.cat-section .woocommerce ul.products li.product a img { padding: 6px; object-fit: contain; }
.cat-section .woocommerce ul.products li.post-3413 a img { transform: scale(1.3); }

/* Beef & Veal product photos: scaled so each visible product is the same size in its frame */
.cat-section-organic-beef .woocommerce ul.products li.post-3590 a img { transform: scale(0.91); }
.cat-section-organic-beef .woocommerce ul.products li.post-3445 a img { transform: scale(1.08); }
.cat-section-organic-beef .woocommerce ul.products li.post-3441 a img { transform: scale(1.0); }
.cat-section-organic-beef .woocommerce ul.products li.post-2535 a img { transform: scale(1.02); }
.cat-section-organic-beef .woocommerce ul.products li.post-2534 a img { transform: scale(0.82); }
.cat-section-organic-beef .woocommerce ul.products li.post-2533 a img { transform: scale(1.0); }
.cat-section-organic-beef .woocommerce ul.products li.post-2529 a img { transform: scale(1.01); }

/* ---------- Cart page: design + coupon box (block cart and classic cart) ---------- */
.woocommerce-cart .content-area, .woocommerce-cart .woo-area { background: #fff; }
.woocommerce-cart .woocommerce { max-width: 1100px; margin: 0 auto; padding: 30px 0 80px; }

/* Empty cart message */
.woocommerce-cart .cart-empty.woocommerce-info {
  background: var(--cream); border: 0; border-radius: 16px; padding: 22px 26px; color: var(--text); font-size: 1rem; margin-bottom: 24px;
}

/* Cards */
.wc-block-cart__main, .wc-block-cart__sidebar, .wc-block-components-sidebar,
.woocommerce-cart-form, .cart-collaterals .cart_totals {
  background: #fff; border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.wc-block-cart__main { padding: 24px; }

/* Coupon: input and apply button */
.wc-block-components-totals-coupon-form,
.wc-block-components-totals-coupon__form,
.woocommerce .coupon {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch;
}
.wc-block-components-text-input input[type="text"],
.wc-block-components-totals-coupon-form input[type="text"],
.woocommerce .coupon input.input-text,
.woocommerce-cart .coupon input.input-text {
  flex: 1 1 220px; min-width: 0; height: 46px; box-sizing: border-box; padding: 0 16px;
  border: 1px solid var(--border); border-radius: 10px; background: #faf8f4; color: var(--text);
  font: inherit; font-size: 16px; box-shadow: none;
}
.wc-block-components-text-input input[type="text"]:focus,
.woocommerce .coupon input.input-text:focus { outline: 2px solid var(--red); outline-offset: 1px; background: #fff; }
.wc-block-components-totals-coupon-form button,
.wc-block-components-totals-coupon__button,
.woocommerce .coupon button[name="apply_coupon"],
.woocommerce button[name="apply_coupon"] {
  height: 46px; min-width: 150px; padding: 0 22px; border: 0; border-radius: 999px;
  background: var(--red); color: #fff; font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; font-size: .9rem; cursor: pointer; transition: background .2s;
}
.wc-block-components-totals-coupon-form button:hover,
.woocommerce .coupon button[name="apply_coupon"]:hover { background: var(--red-dark); }

/* Checkout button */
.wc-block-cart__submit-button, .wc-block-cart__submit-container .wc-block-button,
.woocommerce .checkout-button, .woocommerce a.checkout-button {
  background: var(--red) !important; color: #fff !important; border-radius: 999px !important;
  font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; min-height: 50px;
}
.wc-block-cart__submit-button:hover, .woocommerce a.checkout-button:hover { background: var(--red-dark) !important; }

/* Headings */
.wc-block-cart h2, .wc-block-components-totals-wrapper h2, .cart_totals h2 {
  font-family: var(--font-head); text-transform: uppercase; color: var(--black); letter-spacing: .4px;
}

@media (max-width: 600px) {
  .wc-block-cart__main { padding: 16px; }
  .wc-block-components-totals-coupon-form button, .woocommerce .coupon button[name="apply_coupon"] { width: 100%; }
}

/* ---------- Checkout: payment methods and PayFast info ---------- */
.woocommerce-checkout #payment {
  background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.woocommerce-checkout #payment ul.payment_methods { list-style: none; margin: 0 0 16px; padding: 0; border: 0; }
.woocommerce-checkout #payment ul.payment_methods li { margin: 0 0 10px; padding: 0; }
.woocommerce-checkout #payment ul.payment_methods li > label {
  display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--black); cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods input[type="radio"] { accent-color: var(--red); width: 18px; height: 18px; margin: 0; }
.woocommerce-checkout #payment div.payment_box {
  background: var(--cream); color: var(--text); border-radius: 12px; padding: 16px 18px; margin: 10px 0 0; font-size: .95rem; line-height: 1.6;
}
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce-checkout #payment div.payment_box img {
  display: block; max-width: 340px; width: 100%; height: auto; margin: 14px auto 6px; border: 0; background: transparent; box-shadow: none; padding: 0;
}
.woocommerce-checkout #payment div.payment_box p:last-child { margin-bottom: 0; }
.woocommerce-checkout #payment .place-order { padding: 18px 0 0; }
.woocommerce-checkout #payment #place_order {
  width: 100%; background: var(--red); color: #fff; border-radius: 999px; min-height: 52px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; font-size: 1rem; border: 0;
}
.woocommerce-checkout #payment #place_order:hover { background: var(--red-dark); }
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper { margin: 0 0 14px; }
.woocommerce-checkout #payment .woocommerce-privacy-policy-text { font-size: .85rem; color: var(--muted); }

/* Checkout form fields */
.woocommerce-checkout .woocommerce-billing-fields, .woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields, .woocommerce-checkout .woocommerce-checkout-review-order {
  background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.woocommerce-checkout h3 { font-family: var(--font-head); text-transform: uppercase; color: var(--black); letter-spacing: .4px; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td { border-color: var(--border); }

/* ---------- Checkout page layout (matches the reference) ---------- */
.woocommerce-checkout .woocommerce { max-width: 1180px; margin: 0 auto; padding: 24px 0 80px; }
.woocommerce-checkout .entry-title, .woocommerce-checkout .page-hero { font-family: var(--font-head); text-transform: uppercase; letter-spacing: .5px; color: var(--black); }

/* Step indicator */
.ck-steps { list-style: none; display: flex; align-items: center; gap: 14px; margin: 0 0 22px; padding: 0; font-family: var(--font-head); text-transform: uppercase; font-size: .8rem; letter-spacing: 1px; color: #9a9a9a; }
.ck-steps li { display: flex; align-items: center; gap: 8px; }
.ck-steps li + li::before { content: ""; width: 40px; height: 1px; background: #d6d0c6; margin-right: 6px; }
.ck-dot { width: 26px; height: 26px; border-radius: 50%; background: #efeae2; color: #777; display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; }
.ck-steps .is-done { color: var(--black); }
.ck-steps .is-done .ck-dot { background: var(--black); color: #fff; }
.ck-steps .is-current { color: var(--red); }
.ck-steps .is-current .ck-dot { background: var(--red); color: #fff; }

/* Coupon banner (default WooCommerce toggle) */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
  background: var(--cream); border: 1px dashed #d6cdbf; border-radius: 12px; padding: 14px 18px; margin: 0 0 24px; color: var(--text);
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a { color: var(--red); font-weight: 600; }

/* Two columns: billing left, order summary right */
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 26px; align-items: start; }
.woocommerce-checkout form.checkout .col2-set { grid-column: 1; grid-row: 1 / span 2; width: 100%; float: none; }
.woocommerce-checkout form.checkout .col2-set .col-1, .woocommerce-checkout form.checkout .col2-set .col-2 { float: none; width: 100%; }
.woocommerce-checkout form.checkout .woocommerce-additional-fields { grid-column: 1; grid-row: 3; }
.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 1; align-self: start; margin: 0; background: #111; color: #fff; border-radius: 18px 18px 0 0; padding: 18px 22px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: .6px; font-size: 1.15rem; font-weight: 600; }
.woocommerce-checkout #order_review { grid-column: 2; grid-row: 2; align-self: start; background: #fff; border: 1px solid var(--border); border-top: 0; border-radius: 0 0 18px 18px; padding: 20px 22px 24px; box-shadow: 0 16px 36px rgba(0,0,0,.06); }
.woocommerce-checkout .woocommerce-billing-fields, .woocommerce-checkout .woocommerce-additional-fields { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.04); margin-bottom: 20px; }
.woocommerce-checkout .woocommerce-billing-fields h3, .woocommerce-checkout .woocommerce-additional-fields h3 { font-size: 1.2rem; margin-bottom: 14px; }
.woocommerce-checkout .form-row input.input-text, .woocommerce-checkout .form-row select, .woocommerce-checkout .form-row textarea {
  background: #faf8f4; border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; font: inherit; font-size: 16px; color: var(--text); width: 100%; box-sizing: border-box;
}
.woocommerce-checkout .form-row input.input-text:focus, .woocommerce-checkout .form-row select:focus, .woocommerce-checkout .form-row textarea:focus { outline: 2px solid var(--red); outline-offset: 1px; background: #fff; }
.woocommerce-checkout .form-row label { font-weight: 600; font-size: .88rem; color: var(--black); }

/* Order summary table */
.woocommerce-checkout .woocommerce-checkout-review-order-table { border: 0; margin: 0 0 14px; width: 100%; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th, .woocommerce-checkout .woocommerce-checkout-review-order-table td { border-color: #ece7de; padding: 12px 0; }
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th, .woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td { font-family: var(--font-head); font-size: 1.3rem; color: var(--red); border-top: 2px solid #ece7de; }

/* Payment methods as selectable cards */
.woocommerce-checkout #payment { background: transparent; border: 0; padding: 0; box-shadow: none; }
.woocommerce-checkout #payment ul.payment_methods li { border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px; margin: 0 0 10px; background: #fff; }
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) { border-color: var(--red); box-shadow: 0 0 0 1px var(--red); }
.woocommerce-checkout #payment ul.payment_methods li > label { font-family: var(--font-head); text-transform: uppercase; letter-spacing: .4px; font-size: .92rem; }
.woocommerce-checkout #payment ul.payment_methods li.payment_method_cod > label::after,
.woocommerce-checkout #payment ul.payment_methods li.payment_method_bacs > label::after { content: "Pay at your door"; margin-left: auto; font-family: var(--font-body); text-transform: none; font-size: .72rem; font-weight: 600; background: #efeae2; color: #555; padding: 4px 10px; border-radius: 999px; }
.woocommerce-checkout #payment ul.payment_methods li.payment_method_bacs > label::after { content: "No extra charges"; background: #e3f4ea; color: #1d6b35; }
.woocommerce-checkout #payment ul.payment_methods li > label { display: flex; }
.woocommerce-checkout #payment div.payment_box { background: #fbf6ee; border: 1px solid #f0e2c8; color: #6b5420; border-radius: 12px; }
.woocommerce-checkout #payment #place_order { border-radius: 999px; min-height: 54px; box-shadow: 0 10px 22px rgba(200,16,46,.22); }

/* Trust line and help under the button */
.ck-trust { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin: 16px 0 6px; padding: 0; font-size: .82rem; color: #1d6b35; }
.ck-help { text-align: center; font-size: .85rem; color: var(--muted); margin: 8px 0 0; }
.ck-help a { color: var(--black); font-weight: 600; }

@media (max-width: 900px) {
  .woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
  .woocommerce-checkout form.checkout .col2-set, .woocommerce-checkout form.checkout .woocommerce-additional-fields, .woocommerce-checkout #order_review_heading, .woocommerce-checkout #order_review { grid-column: 1; grid-row: auto; }
}

/* Checkout fixes: trust line full width, PayFast picture kept inside its box, labels not squeezed */
.woocommerce-checkout #order_review .ck-trust { display: flex !important; flex-direction: row !important; flex-wrap: wrap; justify-content: center; width: 100%; }
.woocommerce-checkout #order_review .ck-trust li { display: inline-flex !important; width: auto !important; float: none !important; margin: 0; padding: 0; }
.woocommerce-checkout #order_review .ck-help { width: 100%; text-align: center; }
.woocommerce-checkout #payment ul.payment_methods li > label { flex-wrap: wrap; }
.woocommerce-checkout #payment ul.payment_methods li > label img { display: none !important; }
.woocommerce-checkout #payment ul.payment_methods li[class*="payfast"] > label { display: flex; align-items: center; gap: 10px; }
.woocommerce-checkout #payment ul.payment_methods li[class*="payfast"] > label::after { display: none; }
.woocommerce-checkout #payment ul.payment_methods li[class*="payfast"] .payment_box img {
  display: block !important; position: static !important; float: none !important; max-width: 340px !important; width: 100% !important; height: auto !important; margin: 14px auto 6px !important; border: 0 !important; box-shadow: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li[class*="payfast"] .payment_box { overflow: hidden; }

/* Checkout: coupon line without the broken icon, and no empty space above the order table */
.woocommerce-checkout .woocommerce-info::before, .woocommerce-checkout .woocommerce-message::before { display: none !important; }
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info { padding-left: 18px !important; }
.woocommerce-checkout #order_review { padding-top: 0 !important; }
.woocommerce-checkout #order_review > *:first-child, .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table { margin-top: 0 !important; }
.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead { display: table-header-group; }

/* Checkout: space between Place Order and the trust line */
.woocommerce-checkout #order_review .ck-trust { margin: 18px 0 6px !important; }

/* Checkout: stronger spacing under Place Order (containers below the button) */
.woocommerce-checkout #payment .place-order { display: block; padding-bottom: 0 !important; }
.woocommerce-checkout #payment .place-order + *, .woocommerce-checkout #order_review .ck-trust { margin-top: 22px !important; }
.woocommerce-checkout #payment #place_order { margin-bottom: 22px !important; display: block; }

/* Checkout: room under the help line inside the summary card */
.woocommerce-checkout #order_review .ck-help { margin-bottom: 4px; }
.woocommerce-checkout #order_review { padding-bottom: 26px !important; }

/* Checkout: "Secure checkout" pill on the Your order heading */
.woocommerce-checkout #order_review_heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.woocommerce-checkout #order_review_heading::after {
  content: "Secure checkout"; order: 2; display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;
  font-family: var(--font-body); text-transform: none; letter-spacing: 0; font-size: .78rem; font-weight: 500;
  background: rgba(255,255,255,.12); color: #fff; padding: 6px 12px 6px 28px; border-radius: 999px; position: relative;
}
.woocommerce-checkout #order_review_heading::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 10px center;
}

/* ---------- Cart page layout (matches the checkout) ---------- */
.woocommerce-cart .woocommerce { display: grid; grid-template-columns: 1.6fr 1fr; gap: 26px; align-items: start; }
.woocommerce-cart .woocommerce > .ck-steps,
.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
.woocommerce-cart .woocommerce > .woocommerce-message,
.woocommerce-cart .woocommerce > .woocommerce-info,
.woocommerce-cart .woocommerce > .cart-empty,
.woocommerce-cart .woocommerce > .return-to-shop { grid-column: 1 / -1; }
.woocommerce-cart .ck-steps { margin-bottom: 22px; }
.woocommerce-cart .woocommerce-cart-form { grid-column: 1; background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 22px; box-shadow: 0 8px 24px rgba(0,0,0,.04); }
.woocommerce-cart .cart-collaterals { grid-column: 2; width: 100%; float: none; }

/* Cart items table */
.woocommerce-cart table.shop_table { border: 0; margin: 0; }
.woocommerce-cart table.shop_table th { font-family: var(--font-head); text-transform: uppercase; letter-spacing: .6px; font-size: .78rem; color: #777; border-bottom: 1px solid #ece7de; }
.woocommerce-cart table.shop_table td { border-color: #ece7de; padding: 16px 10px; vertical-align: middle; }
.woocommerce-cart table.shop_table td.product-thumbnail img { width: 74px; height: 74px; object-fit: contain; background: var(--cream); border-radius: 12px; padding: 6px; }
.woocommerce-cart table.shop_table td.product-name a { color: var(--black); font-weight: 600; }
.woocommerce-cart table.shop_table td.product-price, .woocommerce-cart table.shop_table td.product-subtotal { font-weight: 600; color: var(--black); }
.woocommerce-cart table.shop_table td.product-subtotal { color: var(--red); }
.woocommerce-cart td.product-quantity .quantity input.qty { border: 1px solid var(--border); border-radius: 999px; height: 40px; width: 70px; background: #faf8f4; text-align: center; font: inherit; }
.woocommerce-cart a.remove { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #efeae2 !important; color: #555 !important; font-size: 1.1rem; }
.woocommerce-cart a.remove:hover { background: var(--red) !important; color: #fff !important; }

/* Coupon and update row */
.woocommerce-cart td.actions { padding-top: 18px; }
.woocommerce-cart td.actions .coupon { display: flex; flex-wrap: wrap; gap: 10px; }
.woocommerce-cart td.actions .coupon input.input-text { flex: 1 1 200px; height: 46px; border: 1px solid var(--border); border-radius: 10px; padding: 0 14px; font-size: 16px; background: #faf8f4; box-sizing: border-box; }
.woocommerce-cart td.actions button[name="update_cart"] { height: 46px; border-radius: 999px; background: #efeae2; color: #333; border: 0; padding: 0 22px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; }
.woocommerce-cart td.actions button[name="update_cart"]:disabled { opacity: .6; }

/* Cart totals summary (dark header, like Your order) */
.woocommerce-cart .cart_totals { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 22px; box-shadow: 0 16px 36px rgba(0,0,0,.06); }
.woocommerce-cart .cart_totals h2 { background: #111; color: #fff; margin: -22px -22px 18px; padding: 18px 22px; border-radius: 18px 18px 0 0; font-family: var(--font-head); text-transform: uppercase; letter-spacing: .6px; font-size: 1.15rem; font-weight: 600; }
.woocommerce-cart .cart_totals table.shop_table th, .woocommerce-cart .cart_totals table.shop_table td { font-size: .95rem; }
.woocommerce-cart .cart_totals tr.order-total th, .woocommerce-cart .cart_totals tr.order-total td { font-family: var(--font-head); font-size: 1.3rem; color: var(--red); border-top: 2px solid #ece7de; }
.woocommerce-cart .wc-proceed-to-checkout { padding: 18px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { display: block; width: 100%; text-align: center; background: var(--red); color: #fff; border-radius: 999px; min-height: 52px; line-height: 52px; font-family: var(--font-head); text-transform: uppercase; letter-spacing: 1px; font-size: 1rem; box-shadow: 0 10px 22px rgba(200,16,46,.22); }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { background: var(--red-dark); }

@media (max-width: 900px) {
  .woocommerce-cart .woocommerce { grid-template-columns: 1fr; }
  .woocommerce-cart .woocommerce-cart-form, .woocommerce-cart .cart-collaterals { grid-column: 1; }
}

/* Cart totals: table fits inside its card, checkout button is a full-width pill */
.woocommerce-cart .cart_totals table.shop_table { width: 100%; table-layout: fixed; }
.woocommerce-cart .cart_totals table.shop_table th { width: 38%; word-break: normal; }
.woocommerce-cart .cart_totals table.shop_table td { word-break: break-word; text-align: left; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  height: auto !important; min-height: 52px; line-height: 1.2 !important; padding: 15px 18px !important;
  border-radius: 999px !important; white-space: normal; font-size: .95rem !important; display: block;
}

/* Cart: override WooCommerce's default 48% floated totals box; white background; pill checkout button */
body.woocommerce-cart, .woocommerce-cart .site-main, .woocommerce-cart .woo-area, .woocommerce-cart .content-area, .woocommerce-cart .woocommerce { background: #fff !important; }
.woocommerce-cart .cart-collaterals .cart_totals { float: none !important; width: 100% !important; box-sizing: border-box !important; }
.woocommerce-cart .cart_totals table.shop_table { width: 100% !important; }
.woocommerce-cart .wc-proceed-to-checkout { display: block !important; width: 100%; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: block !important; width: 100% !important; box-sizing: border-box !important; height: auto !important;
  min-height: 52px !important; border-radius: 999px !important; line-height: 1.2 !important; padding: 15px 18px !important;
  white-space: normal !important; float: none !important; margin: 0 !important;
}

/* Cart notices: remove the broken info icon so the text is clear (check icon on "removed" stays) */
.woocommerce .woocommerce-info::before, .woocommerce-cart .cart-empty::before { display: none !important; content: none !important; }
.woocommerce-cart .woocommerce-info, .woocommerce-cart .cart-empty.woocommerce-info { padding-left: 26px !important; }

/* ---------- Cart and checkout: phone layout ---------- */
@media (max-width: 767px) {
  .ck-steps { flex-wrap: wrap; gap: 8px 10px; font-size: .68rem; letter-spacing: .6px; }
  .ck-steps li + li::before { width: 14px; margin-right: 2px; }
  .ck-dot { width: 22px; height: 22px; font-size: .68rem; }

  /* Cart items: each product becomes a stacked card */
  .woocommerce-cart .woocommerce-cart-form { padding: 14px; min-width: 0; }
  .woocommerce-cart table.shop_table.cart thead { display: none; }
  .woocommerce-cart table.shop_table.cart,
  .woocommerce-cart table.shop_table.cart tbody,
  .woocommerce-cart table.shop_table.cart tr,
  .woocommerce-cart table.shop_table.cart td { display: block; width: 100%; box-sizing: border-box; }
  .woocommerce-cart table.shop_table.cart tr.cart_item {
    position: relative; border: 1px solid var(--border); border-radius: 14px; padding: 14px; margin-bottom: 12px; background: #fff;
    display: grid; grid-template-columns: 84px 1fr; gap: 6px 14px; align-items: center;
  }
  .woocommerce-cart table.shop_table.cart td { border: 0 !important; padding: 2px 0 !important; text-align: left !important; }
  .woocommerce-cart table.shop_table.cart td.product-remove { position: absolute; top: 8px; right: 8px; width: auto; padding: 0 !important; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail { grid-row: span 3; width: 84px; padding: 0 !important; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail img { width: 84px; height: 84px; }
  .woocommerce-cart table.shop_table.cart td.product-name { font-size: .95rem; padding-right: 30px !important; }
  .woocommerce-cart table.shop_table.cart td.product-price::before,
  .woocommerce-cart table.shop_table.cart td.product-quantity::before,
  .woocommerce-cart table.shop_table.cart td.product-subtotal::before {
    content: attr(data-title); display: inline-block; min-width: 80px; font-family: var(--font-head); text-transform: uppercase; font-size: .72rem; letter-spacing: .6px; color: #777; margin-right: 8px;
  }
  .woocommerce-cart table.shop_table.cart td.actions { padding-top: 12px !important; }
  .woocommerce-cart td.actions .coupon { flex-direction: column; }
  .woocommerce-cart td.actions .coupon input.input-text, .woocommerce-cart td.actions .coupon button { width: 100%; flex: none; }
  .woocommerce-cart td.actions button[name="update_cart"] { width: 100%; margin-top: 8px; }

  /* Totals and checkout button */
  .woocommerce-cart .cart_totals { padding: 16px; }
  .woocommerce-cart .cart_totals table.shop_table th { width: 40%; font-size: .85rem; }
  .woocommerce-cart .cart_totals table.shop_table td { font-size: .9rem; }
}

/* Cart totals: the shipping address link reads "Change address" as a small outlined button.
   The link keeps WooCommerce's behaviour (it opens the address form). */
.woocommerce-cart .cart_totals .shipping-calculator-button { font-size: 0 !important; display: inline-block; margin-top: 8px; }
.woocommerce-cart .cart_totals .shipping-calculator-button::after {
  content: "Change address"; font-size: .78rem; font-weight: 600; color: var(--red); border: 1px solid var(--red);
  border-radius: 999px; padding: 6px 14px; display: inline-block; line-height: 1.2;
}
.woocommerce-cart .cart_totals .shipping-calculator-button:hover::after { background: var(--red); color: #fff; }