/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 5.138
*/

/* ==========================================================================
   1. DESIGN TOKENS
   Single source of truth — đổi brand tại đây, toàn site tự cập nhật.
   Chain: Flatsome Customizer → brand vars → derived vars → component styles
   ========================================================================== */

:root {
  /* ── Core Brand ──
     Synced với Flatsome Customizer (WP Admin → Appearance → Customize)
     Đổi màu trong Customizer → CSS vars tự inherit ──────────────── */
  --brand-primary:   var(--fs-color-primary, var(--primary-color, #050b1e));
  --brand-secondary: var(--main-hnc-color, var(--secondary-color, #c48b07));

  /* ── Brand Palette ── */
  --brand-accent:       var(--brand-primary);
  --brand-ink:          #221f1f;
  --brand-price:        #7b2e2f;
  --brand-radius:       6px;

  /* ── Brand Surfaces ── */
  --brand-surface:      #faf8f5;
  --brand-surface-alt:  #f5f0ea;
  --brand-border:       color-mix(in srgb, var(--brand-secondary) 24%, transparent);
  --brand-shadow-color: color-mix(in srgb, var(--brand-ink) 30%, transparent);

  /* ── Shadows ── (derived from brand-shadow-color) */
  --brand-shadow:       0 1px 2px var(--brand-shadow-color);
  --brand-shadow-focus: 0 0 0 3px var(--brand-shadow-color), 0 2px 6px var(--brand-shadow-color);

  /* ── Layout ── */
  --jmn-gap:            0px;
  --jmn-label-gap:      8px;

  /* ── CTA (Add to Cart row) ── */
  --jmn-cta-h:          80px;
  --jmn-cta-radius:     var(--brand-radius);

  /* ── Reviews ── */
  --jmn-review-avatar:  36px;
  --jmn-review-gap:     12px;
}


/* ==========================================================================
   2. PERFORMANCE
   ========================================================================== */

/* Prevent layout shift from images without dimensions */
img {
  height: auto;
  max-width: 100%;
}

/* Reserve space for common embed ratios */
.video-container,
.wp-block-embed__wrapper {
  aspect-ratio: 16 / 9;
}

/* Ensure custom @font-face declarations use swap */
@font-face {
  font-display: swap !important;
}

/* Contain for scroll perf */
.product-small,
.product-small .box-image {
  contain: content;
}
.products .product {
  contain: layout style;
}

/* Reduce paint on hover */
.image-zoom-cursor .product-image img {
  will-change: transform;
}

/* Smooth font rendering */
body {
  text-rendering: optimizeSpeed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* Sections 3 (Product) and 8 (Sticky CTA) → css/product.css */
/* Section 6 (Checkout) → css/checkout.css */

/* ==========================================================================
   3. GLOBAL BUTTON RADIUS
   Đồng bộ border-radius cho toàn bộ button theo --brand-radius (6px).
   ========================================================================== */

.button,
button,
input[type="submit"],
input[type="button"],
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  border-radius: var(--brand-radius);
}
/* Inputs & selects — consistent with button radius */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="number"],
textarea,
select,
.woocommerce .input-text {
  border-radius: var(--brand-radius);
}

/* ==========================================================================
   4. WISHLIST
   Source: pmcs-12-theme-css
   ========================================================================== */

/* Re-skin YITH wishlist hearts to brand. YITH sets these on :root via inline
   CSS as pure #000 (off-brand). Override → ink default, gold when added.
   One heart system: jmn-icon--heart everywhere visible, YITH SVG (popup +
   wishlist page) follows the same brand tokens. */
:root {
  --add-to-wishlist-icon-color: var(--brand-primary, #050b1e) !important;
  --added-to-wishlist-icon-color: var(--brand-secondary, #c48b07) !important;
}
.yith-wcwl-icon-svg {
  color: var(--brand-primary, #050b1e);
  transition: color .15s ease;
}
.yith-wcwl-wishlistexistsbrowse .yith-wcwl-icon-svg,
.yith-wcwl-add-to-wishlist a:hover .yith-wcwl-icon-svg {
  color: var(--brand-secondary, #c48b07);
}

.wishlist-icon .wishlist-button.button.is-outline.circle.icon {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: auto !important;
  border-radius: 0 !important;
}
.wishlist-icon .wishlist-button .icon-heart {
  font-size: 18px;
  line-height: 1;
  display: inline-block;
  transition: color .15s ease;
}
.wishlist-icon .wishlist-button:hover .icon-heart,
.wishlist-icon .wishlist-button:focus .icon-heart,
.wishlist-icon .wishlist-button:active .icon-heart {
  color: var(--brand-price, #7b2e2f) !important;
}
.wishlist-icon .wishlist-button:focus,
.wishlist-icon .wishlist-button:active {
  outline: none !important;
  box-shadow: none !important;
}
.wishlist-popup .yith-wcwl-add-to-wishlist a {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: auto !important;
}
.wishlist-popup .yith-wcwl-add-to-wishlist a .yith-wcwl-icon-svg {
  width: 25px;
  height: 25px;
  display: inline-block;
  transition: fill .15s ease;
}
.wishlist-popup .yith-wcwl-add-to-wishlist a:hover .yith-wcwl-icon-svg,
.wishlist-popup .yith-wcwl-add-to-wishlist a:focus .yith-wcwl-icon-svg,
.wishlist-popup .yith-wcwl-add-to-wishlist a:active .yith-wcwl-icon-svg {
  fill: var(--brand-price, #7b2e2f) !important;
}
.yith-wcwl-add-to-wishlist a span,
.yith-wcwl-add-to-wishlist .feedback,
.yith-wcwl-wishlistaddedbrowse span,
.yith-wcwl-wishlistexistsbrowse span {
  display: none !important;
}
.wishlist-icon .wishlist-button:hover,
.wishlist-popup .yith-wcwl-add-to-wishlist a:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.wishlist-icon .wishlist-popup {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* ==========================================================================
   5. MINI-CART — Brand Overhaul
   Desktop dropdown + Mobile sidebar.
   v5.113 — Added header, variation styling, exit animation, mobile polish
   ========================================================================== */

/* ── 5a. Dropdown Container ── */
li.cart-item.has-dropdown .nav-dropdown {
  min-width: 380px;
  max-width: 400px;
  border-radius: var(--brand-radius);
  border: 1px solid var(--brand-border, rgba(139,115,85,.14));
  box-shadow: 0 8px 32px rgba(0,0,0,.10), 0 2px 8px rgba(0,0,0,.06);
  padding: 0;
  overflow: hidden;
  animation: jmnSlideDown .22s cubic-bezier(.4,0,.2,1);
}
@keyframes jmnSlideDown {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Keyboard access: Flatsome opens the dropdown on hover only. Reveal it when the
   cart trigger or any child receives keyboard focus, mirroring the hover state. */
li.cart-item.has-dropdown:focus-within .nav-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

/* ── 5b. Mini Cart Header (injected via PHP hook) ── */
li.jmn-minicart-header {
  list-style: none;
  padding: 12px 16px;
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--brand-primary, #050b1e);
  border-bottom: 1px solid var(--brand-border, rgba(139,115,85,.12));
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 6px;
}
li.jmn-minicart-header .jmn-minicart-count {
  font-weight: 500;
  color: #999;
  font-size: 12px;
  letter-spacing: .02em;
}

/* ── 5c. Delivery Badge (injected via PHP hook) ── */
.jmn-minicart-delivery {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 16px;
  background: color-mix(in srgb, var(--brand-secondary) 8%, #fff);
  border-bottom: 1px solid var(--brand-border, rgba(139,115,85,.12));
  color: var(--brand-secondary, #c48b07);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.jmn-minicart-delivery svg {
  flex-shrink: 0;
  opacity: .7;
}

/* ── 5d. Product List ── */
.widget_shopping_cart_content .woocommerce-mini-cart {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 320px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.18) transparent;
}
ul.woocommerce-mini-cart li.mini_cart_item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 16px;
  padding-right: 40px; /* room for remove button */
  border-bottom: 1px solid rgba(0,0,0,.05);
  position: relative;
  transition: background .15s ease;
}
ul.woocommerce-mini-cart li.mini_cart_item:hover {
  background: var(--brand-surface, #faf8f5);
}
ul.woocommerce-mini-cart li.mini_cart_item:last-child {
  border-bottom: none;
}

/* Product image.
   Flatsome positions the thumbnail absolutely at 60×60 with object-fit:cover, so
   the legacy a:first-child rule below never matched (remove link is the first
   child). Target the real thumbnail by class: show the whole image (contain) on a
   warm backdrop so transparent/non-square shots aren't cropped. NOTE: most product
   images are square message cards — for those, legibility is a photography fix
   (use a clean necklace shot as the featured image), not CSS. */
ul.woocommerce-mini-cart li.mini_cart_item img.attachment-woocommerce_thumbnail,
.cart-popup-inner li.mini_cart_item img.attachment-woocommerce_thumbnail {
  left: 16px; /* align the absolute thumbnail to the 16px content gutter */
  object-fit: contain;
  background: var(--brand-surface, #faf8f5);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: calc(var(--brand-radius) - 2px);
}
ul.woocommerce-mini-cart li.mini_cart_item a:first-child img {
  width: 60px;
  height: 60px;
  min-width: 60px;
  object-fit: cover;
  border-radius: calc(var(--brand-radius) - 2px);
  border: 1px solid rgba(0,0,0,.06);
}

/* Product name */
ul.woocommerce-mini-cart li.mini_cart_item a:not(.remove) {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--brand-ink, #221f1f);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-decoration: none;
}

/* Variation + personalization metadata (e.g. "Material: 14K White Gold",
   "Message: Always & forever"). For a personalized, final-sale gift this is the
   buyer's last chance to confirm what he typed — lift it out of faint grey into
   a readable warm chip with a gold accent. */
ul.woocommerce-mini-cart li.mini_cart_item dl.variation {
  margin: 6px 0 0;
  padding: 6px 9px;
  font-size: 11.5px;
  line-height: 1.45;
  color: var(--brand-ink, #3a3330);
  background: var(--brand-surface, #faf8f5);
  border-left: 2px solid var(--brand-secondary, #c48b07);
  border-radius: 0 3px 3px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
}
ul.woocommerce-mini-cart li.mini_cart_item dl.variation dt {
  font-weight: 500;
  color: #8a857c;
  margin: 0;
}
ul.woocommerce-mini-cart li.mini_cart_item dl.variation dd {
  margin: 0;
  padding: 0;
  color: var(--brand-ink, #3a3330);
}
ul.woocommerce-mini-cart li.mini_cart_item dl.variation dd p {
  margin: 0;
}

/* On lines that carry WCPA personalization (class added by
   jmn_minicart_personalized_class), prepend a "please review" cue to the chip —
   sits above the fields, outside the 2-line-clamped name anchor. */
ul.woocommerce-mini-cart li.mini_cart_item.jmn-has-personalization dl.variation::before {
  content: "\2713\00a0 Please review your personalization";
  display: block;
  flex: 1 0 100%;
  margin-bottom: 2px;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--brand-secondary, #c48b07);
}

/* WCPA renders personalization as ul.wcpa_cart_meta on most products (the dl.variation
   rules above only cover core variation attributes). Without this it rendered unstyled
   and broke the mini-cart line layout. Style it as the SAME gold chip so personalized
   lines match /cart/ + /checkout/. WCPA also reserves min-height:80px per item (for
   image/photo fields) — collapse it for TEXT items so name/message lines sit tight. */
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta {
  flex: 1 1 100%;
  list-style: none;
  margin: 6px 0 0;
  padding: 6px 9px;
  font-size: 11.5px;
  line-height: 1.45;
  color: var(--brand-ink, #3a3330);
  background: var(--brand-surface, #faf8f5);
  border-left: 2px solid var(--brand-secondary, #c48b07);
  border-radius: 0 3px 3px 0;
  box-sizing: border-box;
}
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta li.wcpa_cart_meta_item {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
  margin: 0;
  padding: 0;
}
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta li.wcpa_cart_meta_item.wcpa_cart_item_text {
  min-height: 0;
}
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta li.wcpa_cart_meta_item.wcpa_cart_item_text + li {
  margin-top: 3px;
}
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta .wcpa_cart_meta_item-label {
  margin: 0;
  font-weight: 500;
  color: #8a857c;
}
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta .wcpa_cart_meta_item-value,
ul.woocommerce-mini-cart li.mini_cart_item ul.wcpa_cart_meta .wcpa_cart_meta_item-value p {
  margin: 0;
  padding: 0;
  color: var(--brand-ink, #3a3330);
}
ul.woocommerce-mini-cart li.mini_cart_item.jmn-has-personalization ul.wcpa_cart_meta::before {
  content: "\2713\00a0 Please review your personalization";
  display: block;
  margin-bottom: 2px;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--brand-secondary, #c48b07);
}

/* Quantity & price — inline so "qty × unit · line-total" reads on one line. */
ul.woocommerce-mini-cart li.mini_cart_item .quantity {
  display: inline;
  font-size: 12px;
  color: #777;
}
ul.woocommerce-mini-cart li.mini_cart_item .quantity .woocommerce-Price-amount {
  color: var(--brand-price, #7b2e2f);
  font-weight: 600;
}

/* Remove button — vertically centered, clear of text */
ul.woocommerce-mini-cart li.mini_cart_item a.remove {
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 400;
  color: #bbb;
  background: rgba(0,0,0,.03);
  border-radius: 50%;
  transition: all .15s ease;
  text-decoration: none;
  line-height: 1;
}
ul.woocommerce-mini-cart li.mini_cart_item a.remove:hover {
  color: var(--brand-price, #c30202);
  background: rgba(195,2,2,.08);
  transform: translateY(-50%) scale(1.1);
}
/* Uniform 16px side gutters on the line item (matches every other block).
   flatsome-shop.css sets padding-right:30px at (0,2,2) and loads after this file —
   beat it with (0,3,2). The absolute thumbnail (left:16px) and remove × (right:16px)
   sit on the gutters; the name/price clear them via their own padding. */
.widget_shopping_cart ul.woocommerce-mini-cart li.mini_cart_item,
.cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item {
  padding-left: 16px;
  padding-right: 16px;
  flex-wrap: wrap; /* let the price drop to its own line below the name */
}
/* Name spans the full row (cleaner for long names); padding clears the thumbnail
   (left) and the remove × (right) so neither renders under them. */
.widget_shopping_cart ul.woocommerce-mini-cart li.mini_cart_item > a:not(.remove),
.cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item > a:not(.remove) {
  flex: 1 1 100%;
  min-width: 0;
  padding-left: 72px;
  padding-right: 32px;
}
/* Price on its own full-width line below the name, aligned under the name text
   (past the thumbnail). "qty × unit · line-total" reads inline. */
.widget_shopping_cart ul.woocommerce-mini-cart li.mini_cart_item .ux-mini-cart-qty,
.cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item .ux-mini-cart-qty {
  display: block;
  flex: 1 1 100%;
  padding-left: 72px;
  margin: 3px 0 0;
}

/* ── 5e. Subtotal ── */
.widget_shopping_cart_content .woocommerce-mini-cart__total {
  /* !important: Flatsome zeroes this padding at higher specificity, which broke
     the 16px gutter alignment with the other blocks. */
  padding: 12px 16px !important;
  margin: 0;
  background: var(--brand-surface, #faf8f5);
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.12));
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}
.widget_shopping_cart_content .woocommerce-mini-cart__total strong {
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .06em;
  color: #888;
  font-weight: 600;
}
.widget_shopping_cart_content .woocommerce-mini-cart__total .woocommerce-Price-amount {
  font-size: 16px;
  font-weight: 700;
  color: var(--brand-price, #7b2e2f);
}

/* ── 5e1. Subtotal with BMSM discount applied (was → now) ──
   The discount is a cart-level negative fee, so WC's subtotal shows the pre-discount
   figure; jmn_minicart_subtotal_with_discount() renders the original struck through
   next to the discounted total. <ins>/<del> mirror WC's own sale-price markup. */
.widget_shopping_cart_content .woocommerce-mini-cart__total .jmn-minicart-subtotal {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.widget_shopping_cart_content .woocommerce-mini-cart__total del {
  text-decoration: line-through;
}
.widget_shopping_cart_content .woocommerce-mini-cart__total del .woocommerce-Price-amount {
  font-size: 12px;
  font-weight: 400;
  color: #a8a29a; /* muted = original price, pre-discount */
}
.widget_shopping_cart_content .woocommerce-mini-cart__total ins {
  text-decoration: none; /* browsers underline <ins> by default */
}
/* The <ins> (discounted "now") amount inherits the 16px/700/brand-price rule above. */

/* ── 5e2. Per-line subtotal (qty > 1) ──
   The price now lives on its own full-width line under the name (see §5d), so the
   line total sits inline after the unit price: "2 × $79.99 · $159.98". */
ul.woocommerce-mini-cart li.mini_cart_item .jmn-line-subtotal {
  color: var(--brand-price, #7b2e2f);
  font-weight: 600;
}
ul.woocommerce-mini-cart li.mini_cart_item .jmn-line-subtotal::before {
  content: "·\00a0";
  color: #c9c4bc;
  font-weight: 400;
}
/* When a line total is shown, de-emphasize the unit price so the total leads. */
ul.woocommerce-mini-cart li.mini_cart_item:has(.jmn-line-subtotal) .quantity .woocommerce-Price-amount {
  color: #8a857c;
  font-weight: 400;
}

/* ── 5e2b. BMSM "buy more, save more" nudge (per line, mini cart + /cart/) ── */
.jmn-bmsm-nudge {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.3;
  color: #7c5904;
  background: rgba(196,139,7,.10);
  border-radius: 4px;
  padding: 3px 8px;
}
.jmn-bmsm-nudge strong {
  font-weight: 600;
  color: var(--brand-secondary, #c48b07);
}
.jmn-bmsm-nudge--on {
  color: var(--brand-secondary, #c48b07);
  background: transparent;
  padding-left: 0;
}
.jmn-bmsm-nudge--on svg {
  vertical-align: -2px;
}

/* ── 5e2c. BMSM active-saving note (mini cart, right under the subtotal) ── */
.widget_shopping_cart_content .jmn-minicart-savings {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 4px 16px 10px;
  font-size: 12px;
  color: #2f7d4f; /* green = achieved saving, matches cart/checkout fee row */
}
.widget_shopping_cart_content .jmn-minicart-savings svg {
  flex-shrink: 0;
  color: #2f7d4f;
}
.widget_shopping_cart_content .jmn-minicart-savings strong {
  color: #2f7d4f;
  font-weight: 600;
}

/* ── 5e3. Trust badges (icon row) below the buttons ── */
.widget_shopping_cart_content .jmn-mc-trust {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  padding: 12px 16px 14px;
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.12));
}
.jmn-mc-trust__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #6a655d;
}
.jmn-mc-trust__item svg {
  flex-shrink: 0;
  color: var(--brand-secondary, #c48b07);
}

/* ── 5f. CTA Buttons ── */
.widget_shopping_cart_content .woocommerce-mini-cart__buttons {
  padding: 12px 16px 16px;
  margin: 0;
  display: flex;
  flex-direction: column-reverse;
  gap: 8px;
}
.widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button {
  display: block;
  width: 100%;
  padding: 12px 16px;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: var(--brand-radius);
  box-sizing: border-box;
  transition: all .2s ease;
  text-decoration: none;
}
/* Checkout — primary CTA (gold) */
li.cart-item .widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button.checkout {
  background: var(--brand-secondary, #c48b07);
  color: #fff;
  border: 1.5px solid var(--brand-secondary, #c48b07);
}
li.cart-item .widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button.checkout:hover {
  filter: brightness(.92);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(196,139,7,.30);
}
/* View Cart — secondary (outline, strengthened border) */
li.cart-item .widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button:not(.checkout) {
  background: transparent;
  color: var(--brand-primary, #050b1e);
  border: 1.5px solid rgba(139,115,85,.40);
}
li.cart-item .widget_shopping_cart_content .woocommerce-mini-cart__buttons a.button:not(.checkout):hover {
  border-color: var(--brand-secondary, #c48b07);
  color: var(--brand-secondary, #c48b07);
  background: rgba(196,139,7,.04);
}

/* ── 5g. Empty State ── */
.ux-mini-cart-empty {
  padding: 40px 24px;
  text-align: center;
}
.ux-mini-cart-empty .ux-mini-cart-empty-icon svg {
  opacity: .12;
  height: 56px;
  color: var(--brand-secondary, #c48b07);
}
.ux-mini-cart-empty .empty {
  font-size: 14px;
  color: #999;
  margin: 16px 0 0;
  line-height: 1.5;
}
.ux-mini-cart-empty .return-to-shop .button {
  background: var(--brand-secondary, #c48b07);
  border-color: var(--brand-secondary, #c48b07);
  color: #fff;
  border-radius: var(--brand-radius);
  padding: 10px 24px;
  font-size: 13px;
  letter-spacing: .04em;
  transition: all .2s ease;
}
.ux-mini-cart-empty .return-to-shop .button:hover {
  filter: brightness(.92);
  transform: translateY(-1px);
}

/* ── 5i. Cross-sell "She might also love" (below the buttons) ── */
.widget_shopping_cart_content .jmn-minicart-xsell {
  padding: 12px 16px 14px;
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.12));
}
.jmn-minicart-xsell__title {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #8a857c;
}
.jmn-minicart-xsell__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
/* Compact horizontal card: 2 per row, 64px tall (thumb left, name+price right). */
.jmn-xsell-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  height: 64px;
  padding: 6px;
  overflow: hidden;
  text-decoration: none;
  border: 1px solid var(--brand-border, rgba(139,115,85,.14));
  border-radius: var(--brand-radius);
  transition: border-color .15s ease;
}
.jmn-xsell-card:hover {
  border-color: var(--brand-secondary, #c48b07);
}
.jmn-xsell-card img {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  object-fit: cover;
  border-radius: calc(var(--brand-radius) - 2px);
  background: var(--brand-surface, #faf8f5);
}
.jmn-xsell-card__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0; /* allow the name to truncate instead of overflowing */
}
.jmn-xsell-card__name {
  font-size: 10.5px;
  line-height: 1.25;
  color: var(--brand-ink, #221f1f);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jmn-xsell-card__price {
  font-size: 11px;
  font-weight: 600;
  color: var(--brand-price, #7b2e2f);
}

/* ── 5h. Mobile Cart Sidebar ── */
.cart-popup-inner {
  background: #fff;
}
.cart-popup-title .heading-font {
  font-size: 14px;
  letter-spacing: .1em;
  color: var(--brand-primary, #050b1e);
}
.cart-popup-title .is-divider {
  border-color: var(--brand-border, rgba(139,115,85,.15));
}
/* Mobile sidebar: wider product layout, larger touch targets */
@media (max-width: 849px) {
  .cart-popup-inner .widget_shopping_cart_content {
    padding: 0;
  }
  .cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item {
    padding: 14px 16px;
    padding-right: 44px;
    gap: 14px;
  }
  .cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item a:first-child img {
    width: 64px;
    height: 64px;
    min-width: 64px;
  }
  .cart-popup-inner ul.woocommerce-mini-cart li.mini_cart_item a.remove {
    width: 30px;
    height: 30px;
    font-size: 18px;
    right: 12px;
  }
  .cart-popup-inner .woocommerce-mini-cart__buttons a.button {
    padding: 14px 16px;
    font-size: 14px;
  }
}


/* ── 5j. Viewport fit — desktop dropdown never exceeds the screen ──
   Cap the dropdown to the viewport height and scroll the whole content inside it
   (one scroll, so the item list + footer + CTA are always reachable on short
   screens). The mobile off-canvas drawer is already viewport-height. */
li.cart-item.has-dropdown .nav-dropdown {
  max-height: calc(100vh - 104px);
}
li.cart-item.has-dropdown .nav-dropdown .widget_shopping_cart_content {
  max-height: calc(100vh - 104px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.18) transparent;
}
li.cart-item.has-dropdown .nav-dropdown ul.woocommerce-mini-cart {
  max-height: none;
  overflow: visible; /* defer to the single outer scroll */
}


/* ==========================================================================
   5b. CF7 INLINE FORM (Newsletter subscribe)
   Dùng trên homepage + checkout → phải ở global CSS.
   ========================================================================== */

.cf7-inline > p {
  display: flex;
  align-items: stretch;
  gap: 0;
  width: 100%;
  margin: 0 !important;
}
.cf7-inline > p > .wpcf7-form-control-wrap {
  flex: 1 1 0;
}
.cf7-inline > p > .wpcf7-form-control-wrap > input.wpcf7-email {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  margin: 0 !important;
  box-sizing: border-box;
  border: 1.5px solid var(--brand-border, rgba(139,115,85,.18));
  border-right: none;
  border-radius: var(--brand-radius) 0 0 var(--brand-radius);
  background: #fff;
  font-size: 15px;
  outline: none;
  transition: border-color .2s ease;
}
.cf7-inline > p > .wpcf7-form-control-wrap > input.wpcf7-email:focus {
  border-color: var(--brand-secondary, #c48b07);
}
.cf7-inline > p > input.wpcf7-submit {
  flex: 0 0 auto;
  height: 48px;
  padding: 0 28px;
  margin: 0 !important;
  box-sizing: border-box;
  border-radius: 0 var(--brand-radius) var(--brand-radius) 0;
  background: var(--brand-primary) !important;
  border: 1.5px solid var(--brand-primary) !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: filter .15s ease, transform .06s ease;
}
.cf7-inline > p > input.wpcf7-submit:hover {
  filter: brightness(.92);
}
.cf7-inline > p > input.wpcf7-submit:active {
  transform: translateY(1px);
}
.cf7-inline > p > .wpcf7-spinner {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cf7-inline > p > br {
  display: none;
}

@media (max-width: 480px) {
  .cf7-inline > p {
    flex-direction: column;
    gap: 8px;
  }
  .cf7-inline > p > .wpcf7-form-control-wrap > input.wpcf7-email {
    border-right: 1.5px solid var(--brand-border, rgba(139,115,85,.18));
    border-radius: var(--brand-radius);
  }
  .cf7-inline > p > .wpcf7-form-control-wrap,
  .cf7-inline > p > input.wpcf7-submit {
    flex: 0 0 auto;
    width: 100%;
  }
  .cf7-inline > p > input.wpcf7-submit {
    border-radius: var(--brand-radius);
  }
}


/* ==========================================================================
   6. FOOTER
   Hide Flatsome's absolute footer — đã dùng Custom Footer Block.
   ========================================================================== */

.absolute-footer {
  display: none;
}

/* Social icons — one branded source (sprite). Muted ink, gold on hover. */
a.icon.plain .jmn-icon,
.social-icons a .jmn-icon {
  color: var(--brand-primary, #050b1e);
  opacity: .55;
  transition: opacity .15s ease, color .15s ease, transform .15s ease;
}
a.icon.plain:hover .jmn-icon,
.social-icons a:hover .jmn-icon {
  opacity: 1;
  color: var(--brand-secondary, #c48b07);
  transform: translateY(-1px);
}


/* ==========================================================================
   6b. HOMEPAGE — Flip Book shadow removal
   ========================================================================== */

.flipContainer.box-shadow-2 {
  box-shadow: none !important;
}


/* ==========================================================================
   7. CROWN LINE — Header Icon Overrides
   Custom SVG icons (sprite #jmn-*) server-rendered in place of Flatsome
   icon font. Source of truth: inc/icons.php.
   ========================================================================== */

/* Base — all Crown Line glyphs */
.jmn-icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Cart bag icon — server-rendered (OB), re-injected on fragment refresh */
.cart-icon.image-icon.jmn-cart-replaced {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  position: relative;
}
.cart-icon.jmn-cart-replaced .jmn-icon--cart {
  color: inherit;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.header-cart-link:hover .jmn-icon--cart {
  transform: scale(1.08) rotate(-3deg);
}
/* Cart count badge */
.cart-icon.jmn-cart-replaced strong {
  position: absolute;
  top: -4px;
  right: -6px;
  background: var(--brand-secondary, #c48b07);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  min-width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: none;
}
.cart-icon.jmn-cart-replaced strong:empty,
.cart-icon.jmn-cart-replaced strong:after {
  display: none;
}

/* Search icon */
.jmn-icon--search {
  color: inherit;
  transition: transform 0.3s ease;
}
.header-search:hover .jmn-icon--search,
a:hover > .jmn-icon--search {
  transform: scale(1.1);
}

/* Heart / wishlist icon — ink default (matches cart/search/account),
   gold on hover + when wishlisted (active). */
.jmn-icon--heart {
  color: var(--brand-primary, #050b1e);
  transition: transform 0.3s ease, color 0.15s ease;
}
.wishlist-link:hover .jmn-icon--heart,
.wishlist-button:hover .jmn-icon--heart,
.add_to_wishlist:hover .jmn-icon--heart,
.jmn-icon--heart:hover {
  color: var(--brand-secondary, #c48b07);
  transform: scale(1.15);
}
.jmn-icon--heart-active {
  color: var(--brand-secondary, #c48b07);
}

/* Profile / account icon */
.jmn-icon--profile {
  color: inherit;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.account-item a:hover .jmn-icon--profile {
  transform: scale(1.1);
}


/* ==========================================================================
   6. CART PAGE (/cart/)
   Brings the §5 (mini-cart) trust system to the full cart page.
   PHP hooks: inc/conversion.php §5. All scoped to .woocommerce-cart.
   ========================================================================== */

/* ── 6a. Estimated-arrival row inside Cart Totals (jmn_cart_delivery_eta) ── */
.woocommerce-cart .cart_totals tr.jmn-cart-eta th,
.woocommerce-cart .cart_totals tr.jmn-cart-eta td {
  border-top: 0;
  padding-top: 2px;
  padding-bottom: 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--brand-secondary, #c48b07);
}
.woocommerce-cart .cart_totals tr.jmn-cart-eta th {
  font-weight: 600;
  text-transform: none;
  letter-spacing: .01em;
  white-space: nowrap;
}
.woocommerce-cart .cart_totals tr.jmn-cart-eta th svg {
  vertical-align: -2px;
  margin-right: 5px;
  opacity: .8;
}
.woocommerce-cart .cart_totals tr.jmn-cart-eta td {
  text-align: right;
}
.woocommerce-cart .cart_totals tr.jmn-cart-eta strong {
  color: var(--brand-ink, #221f1f);
  font-weight: 700;
}

/* ── 6b. Secure-checkout microcopy under the primary CTA (jmn_cart_secure_line) ── */
.woocommerce-cart .jmn-cart-secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 11px 0 0;
  font-size: 12px;
  line-height: 1.3;
  color: #6a655d;
}
.woocommerce-cart .jmn-cart-secure svg {
  flex-shrink: 0;
  color: var(--brand-secondary, #c48b07);
  opacity: .85;
}

/* ── 6c. "or pay faster with" divider before PayPal express (jmn_cart_express_divider)
   The PayPal plugin reorders the proceed block at runtime (its message div lands
   between our nodes), so we can't rely on source order. Force the visual order with
   flex + order, and show the divider whenever a PayPal button exists in the block. ── */
.woocommerce-cart .wc-proceed-to-checkout {
  display: flex;
  flex-direction: column;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button   { order: 1; }
.woocommerce-cart .wc-proceed-to-checkout .jmn-cart-secure   { order: 2; }
.woocommerce-cart .wc-proceed-to-checkout .jmn-cart-or       { order: 3; }
.woocommerce-cart .wc-proceed-to-checkout .ppcp-messages     { order: 4; }
.woocommerce-cart .wc-proceed-to-checkout .ppc-button-wrapper { order: 5; }
.woocommerce-cart .wc-proceed-to-checkout .jmn-cart-or {
  display: none;
}
.woocommerce-cart .wc-proceed-to-checkout:has(.ppc-button-wrapper) .jmn-cart-or {
  display: flex;
}
.woocommerce-cart .jmn-cart-or {
  align-items: center;
  gap: 12px;
  margin: 16px 0 6px;
  color: #9a948b;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.woocommerce-cart .jmn-cart-or::before,
.woocommerce-cart .jmn-cart-or::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--brand-border, rgba(139,115,85,.18));
}

/* ── 6d. Gift-assurance panel in the left column (jmn_cart_assurance_panel) ── */
.woocommerce-cart .jmn-cart-assurance {
  margin-top: 26px;
  padding: 20px 22px;
  background: var(--brand-surface, #faf8f5);
  border: 1px solid var(--brand-border, rgba(139,115,85,.16));
  border-radius: var(--brand-radius, 6px);
}
.jmn-cart-assurance__title {
  margin: 0 0 16px;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--brand-ink, #221f1f);
}
.jmn-cart-assurance__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.jmn-cart-assurance__list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.jmn-cart-assurance__ic {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--brand-secondary) 10%, #fff);
  color: var(--brand-secondary, #c48b07);
}
.jmn-cart-assurance__txt {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
  line-height: 1.4;
  color: #6a655d;
}
.jmn-cart-assurance__txt strong {
  color: var(--brand-ink, #221f1f);
  font-weight: 600;
  font-size: 13.5px;
}
@media (min-width: 850px) {
  .jmn-cart-assurance__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

/* ── 6d-bis. "Complete her gift" cross-sell row (jmn_cart_complete_gift_row,
   after_cart_table @15). Tag-overlap picks; reuses the .jmn-xsell-card primitive
   from the mini cart, sized up for the wider cart column. ── */
.woocommerce-cart .jmn-cart-xsell {
  margin: 20px 0 4px;
  padding-top: 18px;
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.14));
}
.jmn-cart-xsell__title {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--brand-ink, #221f1f);
}
.jmn-cart-xsell__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.jmn-xsell-card--cart {
  height: 76px;
  padding: 8px;
}
.jmn-xsell-card--cart img {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
}
.jmn-xsell-card--cart .jmn-xsell-card__name { font-size: 11.5px; }
.jmn-xsell-card--cart .jmn-xsell-card__price { font-size: 12px; }
@media (max-width: 549px) {
  .jmn-cart-xsell__grid { grid-template-columns: 1fr 1fr; }
}

/* ── 6d-ter. Thank-you "next occasion" cross-sell (jmn_thankyou_xsell,
   woocommerce_thankyou). Reuses .jmn-xsell-card, sized up for the wide
   order-received page; 2-up on mobile, 4-up on desktop. ── */
.jmn-ty-xsell {
  margin: 32px 0 8px;
  padding-top: 24px;
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.14));
}
.jmn-ty-xsell__title {
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 600;
  color: var(--brand-ink, #221f1f);
  font-family: var(--flatsome-heading-font, var(--heading-font, inherit));
}
.jmn-ty-xsell__sub {
  margin: 0 0 16px;
  font-size: 13.5px;
  line-height: 1.45;
  color: #6f6a63;
}
.jmn-ty-xsell__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.jmn-xsell-card--ty { height: 80px; padding: 8px; }
.jmn-xsell-card--ty img { width: 64px; height: 64px; flex: 0 0 64px; }
.jmn-xsell-card--ty .jmn-xsell-card__name { font-size: 12px; }
.jmn-xsell-card--ty .jmn-xsell-card__price { font-size: 12.5px; }
@media (min-width: 700px) {
  .jmn-ty-xsell__grid { grid-template-columns: repeat(4, 1fr); }
}

/* ── 6d-quater. "Shop by occasion" strip on shop/tag archives
   (jmn_archive_occasion_strip, woocommerce_after_shop_loop @25). ── */
.jmn-occasion-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 24px 0 8px;
  padding-top: 18px;
  border-top: 1px solid var(--brand-border, rgba(139,115,85,.14));
}
.jmn-occasion-strip__lead {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #8a857c;
}
.jmn-occasion-strip__links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.jmn-occasion-strip__links a {
  display: inline-block;
  padding: 6px 14px;
  font-size: 13px;
  line-height: 1.3;
  color: var(--brand-ink, #221f1f);
  text-decoration: none;
  border: 1px solid var(--brand-border, rgba(139,115,85,.18));
  border-radius: 999px;
  transition: border-color .15s ease, color .15s ease;
}
.jmn-occasion-strip__links a:hover {
  border-color: var(--brand-secondary, #c48b07);
  color: var(--brand-secondary, #c48b07);
}

/* ── 6e. Branded empty-cart state (jmn_cart_empty_intro) ── */
.woocommerce-cart .jmn-empty-cart {
  text-align: center;
  padding: 8px 16px 4px;
}
.jmn-empty-cart__ic {
  display: inline-flex;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  background: color-mix(in srgb, var(--brand-secondary) 10%, #fff);
  color: var(--brand-secondary, #c48b07);
}
.jmn-empty-cart__lead {
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 600;
  color: var(--brand-ink, #221f1f);
  font-family: var(--flatsome-heading-font, var(--heading-font, inherit));
}
.jmn-empty-cart__sub {
  margin: 0 auto 22px;
  max-width: 420px;
  font-size: 14px;
  line-height: 1.5;
  color: #6a655d;
}
.jmn-empty-cart__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-bottom: 10px;
}
.jmn-empty-cart__links a {
  display: inline-block;
  padding: 9px 18px;
  border-radius: 50px;
  border: 1.5px solid var(--brand-border, rgba(139,115,85,.4));
  font-size: 13px;
  font-weight: 600;
  color: var(--brand-ink, #221f1f);
  text-decoration: none;
  transition: all .18s ease;
}
.jmn-empty-cart__links a:hover {
  border-color: var(--brand-secondary, #c48b07);
  color: var(--brand-secondary, #c48b07);
  background: color-mix(in srgb, var(--brand-secondary) 6%, #fff);
}

/* ── 6f. Cross-sell heading — was a [button style=link] (jmn_cart_fix_xsell_heading) ── */
.woocommerce-cart .jmn-cart-xsell-title {
  margin: 32px 0 4px;
  font-size: 18px;
  letter-spacing: .02em;
  color: var(--brand-ink, #221f1f);
}

/* ── 6g. Coupon — fix the muted/disabled-looking "Apply coupon" button ── */
.woocommerce-cart .cart-collaterals .ux-cart-coupon button.button {
  background: transparent;
  color: var(--brand-ink, #221f1f);
  border: 1.5px solid var(--brand-border, rgba(139,115,85,.4));
  text-transform: none;
  font-weight: 600;
  opacity: 1;
  transition: all .18s ease;
}
.woocommerce-cart .cart-collaterals .ux-cart-coupon button.button:hover {
  border-color: var(--brand-secondary, #c48b07);
  color: var(--brand-secondary, #c48b07);
  background: color-mix(in srgb, var(--brand-secondary) 6%, #fff);
}

/* ── 6h. Personalization chip on the /cart/ line (jmn_cart_personalized_class)
   Parity with the §5 mini-cart chip. On /cart/, WCPA renders fields as
   ul.wcpa_cart_meta (NOT the core dl.variation it uses in the mini cart), so we
   style that into the same gold-edged "please review" chip — the gift buyer
   verifies the name/message before a final-sale checkout. ── */
.woocommerce-cart td.product-name ul.wcpa_cart_meta {
  list-style: none;
  margin: 8px 0 0;
  padding: 7px 10px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--brand-ink, #3a3330);
  background: var(--brand-surface, #faf8f5);
  border-left: 2px solid var(--brand-secondary, #c48b07);
  border-radius: 0 4px 4px 0;
}
.woocommerce-cart td.product-name ul.wcpa_cart_meta li.wcpa_cart_meta_item {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 6px;
  margin: 0;
  padding: 0;
}
.woocommerce-cart td.product-name ul.wcpa_cart_meta .wcpa_cart_meta_item-label {
  margin: 0;
  font-weight: 500;
  color: #8a857c;
}
.woocommerce-cart td.product-name ul.wcpa_cart_meta .wcpa_cart_meta_item-value,
.woocommerce-cart td.product-name ul.wcpa_cart_meta .wcpa_cart_meta_item-value p {
  margin: 0;
  color: var(--brand-ink, #3a3330);
}
.woocommerce-cart tr.cart_item.jmn-has-personalization td.product-name ul.wcpa_cart_meta::before {
  content: "\2713\00a0 Please review your personalization";
  display: block;
  margin-bottom: 4px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--brand-secondary, #c48b07);
}

/* ── 6i. Sticky Cart Totals sidebar (desktop) — follows long carts; clears the
   sticky site header (~80px). No-op on short carts; stacked on mobile. ── */
@media (min-width: 850px) {
  .woocommerce-cart .cart-collaterals .col-inner {
    position: sticky;
    top: 80px;
  }
}

/* ── 6j. BMSM saving row in Cart Totals — green "you saved" treatment, matching
   the checkout order-review fee row (css/checkout.css §3c) so the achieved saving
   reads the SAME way across the funnel (cart → checkout). A second cart-totals
   upsell would be redundant — the per-line "+ Add N more" nudge already drives the
   buy-more action — so we just colour the saving. BMSM is the only cart fee. ── */
.woocommerce-cart .cart_totals tr.fee th,
.woocommerce-cart .cart_totals tr.fee td,
.woocommerce-cart .cart_totals tr.fee td .woocommerce-Price-amount {
  color: #2f7d4f;
}