/* ═══════════════════════════════════════════════════════════════════════════
   Boba's Plants — site-wide parts of the shopping-journey look
   (mu-plugins/bobas-checkout-look.php). Scoped to html.bco-on, which a tiny head
   script sets from the preview cookie (pages here are page-cached, so the server
   can't decide per visitor) or unconditionally once the look is live.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Big screens: scale the whole site in proportion ──────────────────────
   The theme is laid out for ~1140px. On a 2560px or 4K (3840px) desktop at 100%
   scaling it sat small in the middle. Zoom keeps every proportion, including the
   Stripe card form, and media queries still see the real screen width. */
@media (min-width: 1800px) { html.bco-on { zoom: 1.12; --bco-z: 1.12; } }
@media (min-width: 2200px) { html.bco-on { zoom: 1.3;  --bco-z: 1.3; } }
@media (min-width: 2800px) { html.bco-on { zoom: 1.6;  --bco-z: 1.6; } }
@media (min-width: 3400px) { html.bco-on { zoom: 1.8;  --bco-z: 1.8; } }
/* zoom also scales vh, so undo it where the theme uses full-height boxes */
html.bco-on body.woocommerce-cart #page,
html.bco-on body.woocommerce-checkout #page,
html.bco-on body.woocommerce-page #page { min-height: calc(100vh / var(--bco-z, 1)) !important; }

/* ── Header between 992px and 1399px ──────────────────────────────────────
   Logo + six links + two buttons + a 200px search didn't fit: the logo shrank to
   nothing and the search hung off the right edge on laptops. */
@media (min-width: 992px) and (max-width: 1599.98px) {
  html.bco-on header .logo { width: 150px !important; min-width: 150px; flex: none; margin-right: 1.25rem !important; }
  html.bco-on header .navbar-nav { column-gap: .25rem !important; }
  html.bco-on header a.nav-link { font-size: .92rem !important; padding-left: .45rem !important; padding-right: .45rem !important; white-space: nowrap; }
  html.bco-on header .nav-button > a.nav-link,
  html.bco-on .bpc-members-nav-btn > a.nav-link { padding: 9px 14px !important; font-size: .8rem !important; letter-spacing: .3px !important; white-space: nowrap; }
  /* search folds to an icon that opens on tap/focus */
  html.bco-on .bobas-header-search { position: relative; margin-left: .5rem !important; }
  html.bco-on .bobas-header-search .input-group { width: 34px !important; flex-wrap: nowrap; transition: width .25s; }
  html.bco-on .bobas-header-search .form-control { width: 0 !important; min-width: 0; padding: 0 !important; opacity: 0; }
  html.bco-on .bobas-header-search:focus-within .input-group { width: 190px !important; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: #fff; box-shadow: 0 8px 20px -10px rgba(20,50,35,.4); padding: 4px 8px; }
  html.bco-on .bobas-header-search:focus-within .form-control { width: auto !important; flex: 1; opacity: 1; padding: 4px 0 !important; }
  html.bco-on .bobas-header-search .btn { order: -1; padding: 6px !important; }
  html.bco-on .bobas-header-search .btn i { font-size: 1rem !important; }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  html.bco-on header .logo { width: 170px !important; min-width: 170px; margin-right: 2rem !important; }
  html.bco-on header a.nav-link { font-size: .98rem !important; padding-left: .6rem !important; padding-right: .6rem !important; }
}
@media (min-width: 1400px) {
  html.bco-on header .logo { width: 200px !important; min-width: 200px; flex: none; margin-right: 2.5rem !important; }
}
@media (min-width: 1400px) and (max-width: 1599.98px) {
  html.bco-on header a.nav-link { font-size: 1rem !important; padding-left: .7rem !important; padding-right: .7rem !important; }
}

/* ═══ PRODUCT PAGE ═════════════════════════════════════════════════════════ */
html.bco-on body.single-product .summary .stock,
html.bco-on body.single-product .bobas-status-container .stock { text-transform: none !important; letter-spacing: 0 !important; }
html.bco-on body.single-product form.cart table.variations.bco-has-sw { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.bco-on .bco-swatches { margin: 6px 0 18px; }
html.bco-on .bco-swatches__label { font-weight: 700; color: #143223; font-size: .95rem; margin: 0 0 10px; }
html.bco-on .bco-swatches__label span { font-weight: 400; color: #4b5a4f; }
html.bco-on .bco-swatches__list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
html.bco-on .bco-sw {
  position: relative; width: 68px; height: 68px; padding: 0; border: 0; background: #fff; cursor: pointer;
  border-radius: 0 16px 0 16px; overflow: hidden; box-shadow: 0 0 0 1.5px #d7d3c2; transition: box-shadow .15s, transform .15s;
}
html.bco-on .bco-sw img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0 !important; }
html.bco-on .bco-sw--text { width: auto; height: auto; min-height: 44px; padding: 10px 16px; font-weight: 700; color: #143223; }
html.bco-on .bco-sw:hover { transform: translateY(-1px); box-shadow: 0 0 0 2px #8B3F5D; }
html.bco-on .bco-sw[aria-pressed="true"] { box-shadow: 0 0 0 3px #8B3F5D, 0 8px 18px -10px rgba(109,48,73,.8); }
html.bco-on .bco-sw:focus-visible { outline: 3px solid #143223; outline-offset: 3px; }
html.bco-on .bco-sw[disabled] { opacity: .35; cursor: not-allowed; transform: none; }
html.bco-on .bco-sw[disabled]::after { content: ""; position: absolute; left: -10%; top: 50%; width: 120%; height: 2px; background: #8B3F5D; transform: rotate(-45deg); }
html.bco-on body.single-product form.cart .reset_variations { display: none !important; }
html.bco-on body.single-product form.cart .woocommerce-variation-price { display: none; } /* the price card above already shows it */
html.bco-on body.single-product form.cart .quantity.bco-one { display: none !important; }
html.bco-on body.single-product form.cart .woocommerce-variation-add-to-cart,
html.bco-on body.single-product form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
html.bco-on body.single-product .single_add_to_cart_button {
  flex: 1 1 220px; min-height: 56px !important; padding: 14px 24px !important; margin: 0 !important;
  background: #8B3F5D !important; border: 2px solid #8B3F5D !important; color: #fff !important;
  border-radius: 0 20px 0 20px !important; text-transform: none !important; letter-spacing: .01em !important;
  font-weight: 800 !important; font-size: 1.06rem !important; box-shadow: 0 14px 26px -16px rgba(109,48,73,.9) !important;
  transition: background-color .25s, border-color .25s, border-radius .25s !important;
}
html.bco-on body.single-product .single_add_to_cart_button:hover:not(.disabled) { background: #4a5d23 !important; border-color: #4a5d23 !important; border-radius: 20px 0 20px 0 !important; }
html.bco-on body.single-product .single_add_to_cart_button.disabled { opacity: .55 !important; }
html.bco-on body.single-product .quantity:not(.bco-one) .qty { min-height: 56px; width: 76px; border: 1.5px solid #d7d3c2; border-radius: 0 10px 0 10px; text-align: center; font-size: 16px; }
html.bco-on body.single-product #wc-stripe-express-checkout-element { margin-top: 12px !important; width: 100%; }
html.bco-on body.single-product .woocommerce-message,
html.bco-on body.single-product .woocommerce-info,
html.bco-on body.single-product .woocommerce-error {
  background: #fff !important; border: 0 !important; border-left: 4px solid #8B3F5D !important; border-radius: 0 14px 0 14px !important;
  padding: 14px 16px 14px 46px !important; box-shadow: 0 10px 26px -22px rgba(20,50,35,.5) !important; color: #2f3a31 !important;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
}
html.bco-on body.single-product .woocommerce-message .button { order: 2; border-radius: 0 14px 0 14px !important; text-transform: none !important; background: #8B3F5D !important; color: #fff !important; padding: 10px 18px !important; }

/* ═══ SHOP & CATEGORY LISTINGS ═════════════════════════════════════════════ */
html.bco-on .boba-shop-topbar__links { display: none !important; }
html.bco-on .woocommerce-result-count { color: #66706a !important; font-size: .9rem !important; }
html.bco-on .woocommerce-ordering select {
  min-height: 44px; padding: 8px 36px 8px 14px; border: 1.5px solid #d7d3c2; border-radius: 0 10px 0 10px; background-color: #fff;
  color: #143223; font-size: .95rem; font-family: inherit;
}
html.bco-on ul.products {
  display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px !important; margin: 0 0 32px !important; padding: 0 !important;
}
@media (min-width: 768px) { html.bco-on ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px !important; } }
@media (min-width: 1400px) { html.bco-on ul.products.columns-3, html.bco-on ul.products.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
html.bco-on ul.products li.product {
  width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important;
  border: 0 !important; border-radius: 0 24px 0 24px !important; overflow: hidden !important; background: #fff !important;
  box-shadow: 0 1px 0 rgba(20,50,35,.04), 0 18px 40px -28px rgba(20,50,35,.35) !important;
  transition: transform .25s, box-shadow .25s !important;
}
html.bco-on ul.products li.product:hover { transform: translateY(-3px) !important; box-shadow: 0 22px 44px -26px rgba(20,50,35,.45) !important; }
html.bco-on ul.products li.product a img {
  aspect-ratio: 1 / 1 !important; width: 100% !important; height: auto !important; object-fit: cover !important;
  padding: 0 !important; margin: 0 0 12px !important; border-radius: 0 !important; background: #f7f5ee !important;
}
html.bco-on ul.products li.product .woocommerce-loop-product__title {
  margin: 0 14px 4px !important; padding: 0 !important; height: auto !important; min-height: 2.6em;
  font-family: var(--ff-body, "Nunito Sans", sans-serif) !important; font-weight: 800 !important; font-size: 1rem !important; line-height: 1.3 !important; color: #143223 !important;
}
html.bco-on ul.products li.product .price {
  margin: 0 14px 12px !important; display: block; font-family: var(--ff-heading, "Bubblegum Sans", cursive) !important;
  font-weight: 400 !important; font-size: 1.3rem !important; color: #143223 !important;
}
html.bco-on ul.products li.product .button {
  width: auto !important; height: auto !important; min-height: 44px; margin: auto 14px 14px !important; padding: 10px 12px !important;
  background: #fff !important; color: #8B3F5D !important; border: 2px solid #8B3F5D !important; border-radius: 0 16px 0 16px !important;
  text-transform: none !important; letter-spacing: 0 !important; font-weight: 800 !important; font-size: .92rem !important; box-shadow: none !important;
}
html.bco-on ul.products li.product .button:hover { background: #8B3F5D !important; color: #fff !important; border-radius: 16px 0 16px 0 !important; }
@media (max-width: 420px) {
  html.bco-on ul.products li.product .woocommerce-loop-product__title { font-size: .92rem !important; margin: 0 10px 4px !important; }
  html.bco-on ul.products li.product .price { margin: 0 10px 10px !important; font-size: 1.15rem !important; }
  html.bco-on ul.products li.product .button { margin: auto 10px 10px !important; font-size: .84rem !important; }
}
html.bco-on nav.woocommerce-pagination ul { border: 0 !important; display: flex; gap: 8px; justify-content: center; }
html.bco-on nav.woocommerce-pagination ul li { border: 0 !important; }
html.bco-on nav.woocommerce-pagination ul li a,
html.bco-on nav.woocommerce-pagination ul li span { min-width: 44px; min-height: 44px; display: grid !important; place-items: center; border-radius: 0 12px 0 12px; background: #fff; color: #143223; font-weight: 700; }
html.bco-on nav.woocommerce-pagination ul li span.current { background: #8B3F5D; color: #fff; }

/* product page: the price card and description already say this */
html.bco-on body.single-product .woocommerce-variation-availability { display: none !important; }
/* a colour's own description stays (127 colours have one); only a copy of the main text is hidden */
html.bco-on body.single-product .woocommerce-variation-description.bco-dup { display: none !important; }
html.bco-on body.single-product .woocommerce-variation-description {
  font-style: normal !important; color: #3b4a3f !important; font-size: .95rem !important; line-height: 1.55 !important;
  border: 0 !important; border-left: 3px solid #88bc88 !important; padding: 2px 0 2px 14px !important; margin: 0 0 16px !important; background: none !important;
}
html.bco-on body.single-product .woocommerce-variation-description p { margin: 0 0 6px; font-style: normal !important; }
html.bco-on body.single-product .single_variation_wrap { margin-top: 4px; }

/* add-to-basket confirmation */
html.bco-on .bco-toast {
  position: fixed; z-index: 1100; left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom));
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding: 14px 44px 14px 16px;
  background: #fff; border-left: 4px solid #8B3F5D; border-radius: 0 18px 0 18px; box-shadow: 0 22px 50px -18px rgba(20,50,35,.55);
  animation: bco-up .35s cubic-bezier(.2,.8,.2,1);
}
@media (min-width: 768px) { html.bco-on .bco-toast { left: auto; right: 24px; top: 120px; bottom: auto; max-width: 420px; } }
@keyframes bco-up { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { html.bco-on .bco-toast { animation: none; } }
html.bco-on .bco-toast .woocommerce-notices-wrapper { display: contents; }
html.bco-on .bco-toast .woocommerce-message,
html.bco-on .bco-toast .woocommerce-error,
html.bco-on .bco-toast .woocommerce-info {
  flex: 1 1 100%; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
  color: #143223 !important; font-weight: 700; font-size: .98rem; line-height: 1.4; display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
html.bco-on .bco-toast .woocommerce-message::before,
html.bco-on .bco-toast .woocommerce-error::before,
html.bco-on .bco-toast .woocommerce-info::before { display: none !important; }
html.bco-on .bco-toast .woocommerce-error li { list-style: none; }
html.bco-on .bco-toast .woocommerce-message .button,
html.bco-on .bco-toast__go {
  order: 2; display: inline-flex; align-items: center; min-height: 42px; padding: 8px 16px !important; margin: 0 !important; border-radius: 0 14px 0 14px !important;
  font-weight: 800; font-size: .92rem; text-transform: none !important; letter-spacing: 0 !important; text-decoration: none !important; float: none !important;
}
html.bco-on .bco-toast .woocommerce-message .button { background: #fff !important; color: #8B3F5D !important; border: 2px solid #8B3F5D !important; }
html.bco-on .bco-toast__go { background: #8B3F5D; color: #fff !important; border: 2px solid #8B3F5D; }
html.bco-on .bco-toast__x { position: absolute; top: 6px; right: 8px; width: 34px; height: 34px; border: 0; background: none; font-size: 1.5rem; line-height: 1; color: #66706a; cursor: pointer; }

/* shop cards: photo edge to edge, no inner panel, full-width button */
html.bco-on ul.products li.product > a.woocommerce-LoopProduct-link {
  background: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; transform: none !important; overflow: visible !important;
}
html.bco-on ul.products li.product .button { align-self: stretch; text-align: center; justify-content: center; display: flex !important; }
html.bco-on ul.products li.product .button + span { display: none; }
/* the theme hides WooCommerce messages on product pages — not inside our card */
html.bco-on .bco-toast .woocommerce-notices-wrapper { display: contents !important; }
html.bco-on .bco-toast .woocommerce-message,
html.bco-on .bco-toast .woocommerce-error,
html.bco-on .bco-toast .woocommerce-info { display: flex !important; visibility: visible !important; opacity: 1 !important; height: auto !important; }

/* express row on product pages: Apple Pay / Google Pay only, as on checkout
   (no order has ever used Amazon Pay; Link still works inside the card form) */
html.bco-on body.single-product #wc-stripe-express-checkout-element-amazonPay,
html.bco-on body.single-product #wc-stripe-express-checkout-element-link { display: none !important; }
/* The theme's own "in your basket" panel sits right under the button — on desktop
   that's enough; the card is for phones, where the panel is below the fold. */
@media (min-width: 768px) { html.bco-on .bco-toast { display: none !important; } }
html.bco-on .bco-toast .woocommerce-message:focus,
html.bco-on .bco-toast [role="alert"]:focus { outline: none !important; }
html.bco-on .bco-toast .woocommerce-message .button.wc-forward { float: none !important; margin: 0 !important; }

html.bco-on .boba-inline-notice {
  margin-top: 14px !important; padding: 16px 18px !important; border: 0 !important; border-radius: 0 16px 0 16px !important;
  background: #e8f3e8 !important; flex: 1 1 100%;
}
html.bco-on .boba-inline-notice > span { color: #143223 !important; font-size: .98rem; }
html.bco-on .boba-inline-notice > div { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px !important; }
html.bco-on .boba-inline-notice .btn {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px !important; margin: 0 !important;
  border-radius: 0 14px 0 14px !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 800 !important; font-size: .95rem !important;
}
html.bco-on .boba-inline-notice .btn-outline-success { background: #fff !important; color: #8B3F5D !important; border: 2px solid #8B3F5D !important; }
html.bco-on .boba-inline-notice .btn-success { background: #8B3F5D !important; color: #fff !important; border: 2px solid #8B3F5D !important; }
html.bco-on body.single-product .bco-toast .woocommerce-message,
html.bco-on body.single-product .bco-toast .woocommerce-error,
html.bco-on body.single-product .bco-toast .woocommerce-info {
  padding: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: none !important; display: block !important;
}
html.bco-on body.single-product .bco-toast .woocommerce-message .button { display: none !important; }
html.bco-on .bco-toast__row { display: flex; gap: 10px; flex: 1 1 100%; }
html.bco-on .bco-toast__row a {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 14px;
  border-radius: 0 14px 0 14px; font-weight: 800; font-size: .95rem; text-decoration: none !important; border: 2px solid #8B3F5D;
}
html.bco-on .bco-toast__basket { background: #fff; color: #8B3F5D !important; }
html.bco-on .bco-toast__row .bco-toast__go { background: #8B3F5D; color: #fff !important; order: 0; }

/* Product page: Bootstrap's g-5 gutter (-24px each side) is wider than the page's
   12px padding, so every product page wobbled sideways on phones — live too. */
@media (max-width: 991.98px) {
  html.bco-on .woocommerce-single-product > .row.g-5,
  html.bco-on .woocommerce-single-product .row.g-5 { --bs-gutter-x: 1.5rem; }
}
html.bco-on body.single-product form.cart table.variations.bco-has-sw { left: 0; top: 0; }
html.bco-on body.single-product form.cart table.variations.bco-has-sw { display: none !important; }
html.bco-on .bco-sw--text { width: 68px; height: 68px; min-height: 0; padding: 4px; font-size: .68rem; line-height: 1.15; display: grid; place-items: center; text-align: center; overflow: hidden; }

/* ═══ Apple Pay / Google Pay: space held before they arrive (ece-reserve.js) ═══ */
/* the plugin's own layout (express-checkout.css): flex, wrap, 10px gap, 260px minimum per button */
html.bco-on #wc-stripe-express-checkout-element[data-bco-ece] { display: flex !important; flex-wrap: wrap; gap: 10px; position: relative; transition: min-height .25s ease; }
html.bco-on #wc-stripe-express-checkout-element[data-bco-ece="none"] { margin: 0 !important; }
/* a soft placeholder in the shape of the buttons, while Stripe loads */
html.bco-on #wc-stripe-express-checkout-element[data-bco-ece="pending"]::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: 4px; opacity: .55;
  background: #d9d6c8; animation: bco-ece-pulse 1.4s ease-in-out infinite;
}
html.bco-on #wc-stripe-express-checkout-element[data-bco-ece="pending"][data-bco-cols="row"]::before {
  background: linear-gradient(90deg, #d9d6c8 calc(50% - 5px), transparent calc(50% - 5px), transparent calc(50% + 5px), #d9d6c8 calc(50% + 5px));
}
html.bco-on #wc-stripe-express-checkout-element[data-bco-ece="pending"][data-bco-cols="stack"]::before {
  background: linear-gradient(180deg, #d9d6c8 48px, transparent 48px, transparent 58px, #d9d6c8 58px);
}
@keyframes bco-ece-pulse { 0%, 100% { opacity: .35; } 50% { opacity: .6; } }
@media (prefers-reduced-motion: reduce) {
  html.bco-on #wc-stripe-express-checkout-element[data-bco-ece] { transition: none; }
  html.bco-on #wc-stripe-express-checkout-element[data-bco-ece="pending"]::before { animation: none; }
}
/* "or pay by card" also used to appear late on checkout: show it with the held space */
html.bco-on[data-bco-ece="yes"] #wc-stripe-express-checkout-button-separator { display: flex !important; }
html.bco-on[data-bco-ece="no"] #wc-stripe-express-checkout-button-separator { display: none !important; }
/* product page: a colour's own description sits under the button, so it can never push the button down */
html.bco-on body.single-product .single_variation_wrap { display: flex; flex-direction: column; }
html.bco-on body.single-product .single_variation_wrap .woocommerce-variation-add-to-cart { order: 1; }
html.bco-on body.single-product .single_variation_wrap .single_variation { order: 2; margin-top: 14px; }
html.bco-on body.single-product .bco-sw img { width: 100%; height: 100%; }
/* product gallery: give slides and thumbnails their final size before the slider starts */
html.bco-on #product-gallery:not(.is-initialized) .splide__list { display: flex; }
html.bco-on #product-gallery:not(.is-initialized) .splide__slide { flex: 0 0 100%; width: 100%; }
html.bco-on #product-gallery:not(.is-initialized) .splide__slide:not(:first-child) { visibility: hidden; }
html.bco-on #product-thumbnails:not(.is-initialized) .splide__list { display: flex; gap: 10px; }
html.bco-on #product-thumbnails:not(.is-initialized) .splide__slide { flex: 0 0 80px; width: 80px; height: 80px; overflow: hidden; }
html.bco-on #product-thumbnails:not(.is-initialized) .splide__slide img { width: 80px; height: 80px; object-fit: cover; }
/* the photo is full width from the very first frame (it briefly drew at 300px — a browser's
   default for an image whose width hasn't resolved yet — then snapped wider and pushed
   the Add to basket button down 62px when the real photo arrived) */
html.bco-on #product-gallery,
html.bco-on #product-gallery .splide__track,
html.bco-on #product-gallery .splide__list { width: 100%; }
html.bco-on #product-gallery .splide__slide { min-width: 100%; }
html.bco-on #product-gallery .splide__slide img { width: 100% !important; height: auto !important; }
html.bco-on #product-gallery .splide__slide > a { display: block; width: 100%; }
/* The page body painted at y=0, then the main content's 65px top margin (room for the fixed
   header) collapsed through it and moved the whole body down 65px. flow-root keeps that
   margin inside the body, so the page starts where it ends up. */
html.bco-on body { display: flow-root !important; }

/* "You may also like" / "More …" cards on product pages — the same card as the shop:
   white leaf-cornered card, photo edge to edge, full name, price, outline plum button.
   (single-product.php → bobas_related_card()) */
html.bco-on .related-products-wrapper h2 { font-family: var(--ff-heading, "Bubblegum Sans", cursive) !important; font-weight: 400 !important; color: #143223 !important; font-size: 1.6rem !important; }
html.bco-on .related-products-wrapper .row { --bs-gutter-x: 14px; --bs-gutter-y: 14px; }
@media (min-width: 768px) { html.bco-on .related-products-wrapper .row { --bs-gutter-x: 22px; --bs-gutter-y: 22px; } }
html.bco-on .related-products-wrapper .product__card.bco-rel {
  display: flex !important; flex-direction: column !important; height: 100%; padding: 0 !important; margin: 0 !important;
  background: #fff !important; border: 0 !important; border-radius: 0 24px 0 24px !important; overflow: hidden !important;
  box-shadow: 0 1px 0 rgba(20,50,35,.04), 0 18px 40px -28px rgba(20,50,35,.35) !important; transition: transform .25s, box-shadow .25s !important;
}
html.bco-on .related-products-wrapper .product__card.bco-rel:hover { transform: translateY(-3px) !important; box-shadow: 0 22px 44px -26px rgba(20,50,35,.45) !important; }
html.bco-on .related-products-wrapper .product__card.bco-rel .product__image-wrap { padding: 0 !important; margin: 0 0 12px !important; background: #f7f5ee !important; aspect-ratio: 1 / 1; border-radius: 0 !important; overflow: hidden; }
html.bco-on .related-products-wrapper .product__card.bco-rel .product__image-wrap img { width: 100% !important; height: 100% !important; object-fit: cover !important; padding: 0 !important; margin: 0 !important; border-radius: 0 !important; aspect-ratio: auto !important; }
html.bco-on .related-products-wrapper .product__card.bco-rel .product__detail { flex: 1 1 auto; padding: 0 14px !important; background: none !important; display: flex; flex-direction: column; }
html.bco-on .related-products-wrapper .product__card.bco-rel .product__title-mini {
  margin: 0 0 4px !important; padding: 0 !important; min-height: 2.6em; text-align: left !important;
  font-family: var(--ff-body, "Nunito Sans", sans-serif) !important; font-weight: 800 !important; font-size: 1rem !important; line-height: 1.3 !important; color: #143223 !important;
  white-space: normal !important; overflow: visible !important; text-overflow: clip !important; display: block !important; -webkit-line-clamp: unset !important;
}
html.bco-on .related-products-wrapper .product__card.bco-rel .product__price {
  position: static !important; display: block !important; opacity: 1 !important; grid-area: auto !important; width: auto !important; height: auto !important; z-index: auto !important;
  margin: 0 0 12px !important; padding: 0 !important; background: none !important; border-radius: 0 !important;
  font-family: var(--ff-heading, "Bubblegum Sans", cursive) !important; font-weight: 400 !important; font-size: 1.3rem !important; color: #143223 !important; text-align: left !important;
}
html.bco-on .related-products-wrapper .product__card.bco-rel .product__price del { color: #66706a; font-size: .9rem; }
html.bco-on .related-products-wrapper .product__card.bco-rel .reserve {
  display: flex !important; align-items: center; justify-content: center; width: auto !important; min-height: 44px; margin: auto 14px 14px !important; padding: 10px 12px !important;
  background: #fff !important; color: #8B3F5D !important; border: 2px solid #8B3F5D !important; border-radius: 0 16px 0 16px !important;
  text-transform: none !important; letter-spacing: 0 !important; font-weight: 800 !important; font-size: .92rem !important; text-align: center !important;
}
html.bco-on .related-products-wrapper .product__card.bco-rel:hover .reserve { background: #8B3F5D !important; color: #fff !important; border-radius: 16px 0 16px 0 !important; }
@media (max-width: 420px) {
  html.bco-on .related-products-wrapper .product__card.bco-rel .product__detail { padding: 0 10px !important; }
  html.bco-on .related-products-wrapper .product__card.bco-rel .product__title-mini { font-size: .92rem !important; }
  html.bco-on .related-products-wrapper .product__card.bco-rel .product__price { font-size: 1.15rem !important; margin-bottom: 10px !important; }
  html.bco-on .related-products-wrapper .product__card.bco-rel .reserve { margin: auto 10px 10px !important; font-size: .84rem !important; }
}