/* Bluesprings storefront redesign - loaded ONLY on the Bluesprings store view (theme Bluesprings/storefront).
 * Source of truth for the design: docs/bluesprings-redesign/design/ (Main/Header/Footer .dc.html). */
:root {
  --bs-navy: #1E3A5F;
  --bs-rust: #B4531A;
  --bs-cream: #F5F2ED;
  --bs-white: #FFFFFF;
  --bs-ink: #16202B;
  --bs-ink-2: #3E4955;
  --bs-muted: #55606B;
  --bs-line: #E2DCD2;
  --bs-sky: #E4EBF3;
  --bs-font-display: 'Fraunces', Georgia, serif;
  --bs-font-text: 'Figtree', system-ui, sans-serif;
}

/* =====================================================================================================
   HEADER  (design: Header.dc.html)   Bands: #header-top (navy) / #header-middle (cream) / #header-bottom (white nav)
   All selectors are scoped to .page-header.header-style-22 so nothing else on the page is touched.
   ===================================================================================================== */
.page-header.header-style-22 {
  background: transparent; border: 0; margin: 0; padding: 0;
  font-family: var(--bs-font-text); color: var(--bs-ink); line-height: normal;
}
.page-header.header-style-22 > .container.sticky-menu {
  width: 100%; max-width: none; margin: 0; padding: 0; background: transparent;
}
.page-header.header-style-22 #header-sections { background: transparent; margin: 0; padding: 0; border: 0; }
.page-header.header-style-22 a:hover { color: var(--bs-rust); }

/* ---- top bar (header "extra text 1") ---- */
.page-header.header-style-22 #header-top { background: var(--bs-navy); color: var(--bs-sky); font-size: 14px; margin: 0; padding: 0; border: 0; min-height: 0; }
.bs-topbar__inner {
  max-width: 1488px; box-sizing: border-box; margin: 0 auto; padding: 0 24px; min-height: 40px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px;
}
.bs-topbar__lead { display: flex; gap: 12px; align-items: center; }
.bs-pill { background: var(--bs-rust); color: #FFFFFF; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; padding: 3px 9px; border-radius: 999px; }
.bs-topbar__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }
.bs-topbar__links li { margin: 0; padding: 0; }
.page-header.header-style-22 .bs-topbar__links a { color: var(--bs-sky); text-decoration: none; font-weight: 400; }
.page-header.header-style-22 .bs-topbar__links a.bs-topbar__call { color: #FFFFFF; font-weight: 700; }
.page-header.header-style-22 .bs-topbar__links a:hover { color: var(--bs-rust); }

/* ===== DESKTOP / TABLET LAYOUT (>= 768px). Phones (< 768px) keep the parent theme mobile header (hamburger, search overlay, bottom toolbar) - see PHONE section at the end ===== */
@media (min-width: 768px) {
/* ---- middle band: logo / search / account / cart ---- */
.page-header.header-style-22 #header-middle { background: var(--bs-cream); border-bottom: 1px solid var(--bs-line); margin: 0; padding: 0; }
.page-header.header-style-22 #header-middle .panel.header { background: transparent; border: 0; margin: 0; padding: 0; min-height: 0; height: auto; }
.page-header.header-style-22 #header-middle .header-panel-container {
  width: 100%; max-width: 1488px; box-sizing: border-box; margin: 0 auto; padding: 18px 24px;
}
.page-header.header-style-22 #header-middle .header-panel-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; margin: 0;
}
.page-header.header-style-22 #header-middle .header-panel-row::before,
.page-header.header-style-22 #header-middle .header-panel-row::after { display: none; }
.page-header.header-style-22 #header-middle .header-panel-left { flex: 0 0 auto; width: auto; float: none; padding: 0; margin: 0; position: static; }
.page-header.header-style-22 #header-middle .header-panel-center { flex: 1 1 360px; max-width: 646px; width: auto; float: none; padding: 0; margin: 0; position: relative; }
.page-header.header-style-22 #header-middle .header-panel-right { flex: 0 0 auto; width: auto; float: none; padding: 0; margin: 0 0 0 auto; }
.page-header.header-style-22 #header-middle .header-panel-right-inner { display: flex; align-items: center; margin: 0; padding: 0; }

}

/* logo lockup */
.page-header.header-style-22 #header-middle .bs-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--bs-ink); margin: 0; padding: 0; max-width: none; width: auto; height: auto; }
.page-header.header-style-22 #header-middle .bs-logo__mark { display: block; flex: 0 0 auto; }
.page-header.header-style-22 #header-middle .bs-logo__text { display: flex; flex-direction: column; line-height: 1; white-space: nowrap; }
.page-header.header-style-22 #header-middle .bs-logo__name { font-family: var(--bs-font-display); font-size: 26px; font-weight: 600; letter-spacing: -0.01em; }
.page-header.header-style-22 #header-middle .bs-logo__tag { font-size: 11px; font-weight: 700; letter-spacing: 0.24em; color: var(--bs-muted); margin-top: 4px; }

@media (min-width: 768px) {
/* search pill: the native search form, restyled */
.page-header.header-style-22 #header-middle .header-search,
.page-header.header-style-22 #header-middle .header-search .search-form,
.page-header.header-style-22 #header-middle .header-search .block-search,
.page-header.header-style-22 #header-middle .header-search .block-search .block-content { display: block; position: static; margin: 0; padding: 0; border: 0; background: transparent; width: 100%; max-width: none; float: none; box-shadow: none; }
.page-header.header-style-22 #header-middle .header-search .block-search > .block-title { display: none; }
.page-header.header-style-22 #header-middle .header-search form.minisearch {
  position: relative; display: flex; align-items: center; box-sizing: border-box; width: 100%; margin: 0;
  background: #FFFFFF; border: 1px solid #CFC7BA; border-radius: 999px; padding: 4px 4px 4px 20px;
}
.page-header.header-style-22 #header-middle .header-search form.minisearch .field.search { flex: 1; min-width: 0; margin: 0; padding: 0; float: none; width: auto; position: static; }
.page-header.header-style-22 #header-middle .header-search form.minisearch .control { margin: 0; padding: 0; border: 0; position: static; }
.page-header.header-style-22 #header-middle .header-search form.minisearch input#search {
  display: block; width: 100%; min-width: 0; box-sizing: border-box; height: 40px; margin: 0; padding: 0;
  border: 0; outline: 0; box-shadow: none; background: transparent; border-radius: 0;
  font-family: var(--bs-font-text); font-size: 16px; font-weight: 400; line-height: normal; color: var(--bs-ink); text-transform: none;
}
.page-header.header-style-22 #header-middle .header-search form.minisearch input#search::placeholder { color: #6B7580; opacity: 1; }
.page-header.header-style-22 #header-middle .header-search form.minisearch .nested { display: none; }
.page-header.header-style-22 #header-middle .header-search form.minisearch .actions { margin: 0; padding: 0; float: none; position: static; width: auto; flex: 0 0 auto; }
.page-header.header-style-22 #header-middle .header-search form.minisearch button.action.search {
  display: block; position: static; width: 44px; height: 44px; min-width: 44px; min-height: 44px; max-height: none; margin: 0; padding: 0; box-sizing: content-box;
  border: 0; border-radius: 999px; box-shadow: none; opacity: 1; cursor: pointer; font-size: 0; line-height: 0; overflow: hidden;
  background: var(--bs-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}
.page-header.header-style-22 #header-middle .header-search form.minisearch button.action.search::before,
.page-header.header-style-22 #header-middle .header-search form.minisearch button.action.search::after { display: none; content: none; }

/* account + cart (right) */
.page-header.header-style-22 #header-middle ul.features-links { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 12px; }
.page-header.header-style-22 #header-middle ul.features-links > li { margin: 0; padding: 0; float: none; border: 0; background: transparent; }
.page-header.header-style-22 #header-middle ul.features-links > li.wishlist { display: none; }   /* design has no wishlist link in the header (still reachable from the account area) */
.page-header.header-style-22 #header-middle ul.features-links > li.authorization-link .account-wrapper { margin: 0; padding: 0; }
.page-header.header-style-22 #header-middle .authorization-link a.account-trigger {
  display: block; position: relative; box-sizing: content-box; width: 48px; height: 48px; margin: 0; padding: 0;
  border: 1px solid #CFC7BA; border-radius: 999px; overflow: hidden; font-size: 0; line-height: 0; color: transparent;
  background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%2316202B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E") center / 22px 22px no-repeat;
}
.page-header.header-style-22 #header-middle .authorization-link a.account-trigger span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.page-header.header-style-22 #header-middle .authorization-link a.account-trigger::before,
.page-header.header-style-22 #header-middle .authorization-link a.account-trigger::after { display: none; content: none; }
.page-header.header-style-22 #header-middle li.cart-link .minicart-wrapper { margin: 0; padding: 0; float: none; position: relative; }
.page-header.header-style-22 #header-middle li.cart-link .cdz-dropdown { display: block; position: relative; }
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart {
  display: flex; align-items: center; gap: 10px; position: relative; box-sizing: content-box; height: 48px; margin: 0; padding: 0 18px 0 14px;
  background: #FFFFFF; border: 1px solid #CFC7BA; border-radius: 999px; color: var(--bs-ink); text-decoration: none; box-shadow: none;
}
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart::before {
  content: ""; display: block; position: static; width: 22px; height: 22px; flex: 0 0 22px; margin: 0; font-size: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%2316202B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.8a2 2 0 0 0 2-1.5L21 8H6'/%3E%3Ccircle cx='10' cy='20.5' r='1.3'/%3E%3Ccircle cx='17' cy='20.5' r='1.3'/%3E%3C/svg%3E") center / 22px 22px no-repeat;
}
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart::after { display: none; content: none; }
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .text { display: inline; margin: 0; padding: 0; font-family: var(--bs-font-text); font-weight: 700; font-size: 15px; line-height: normal; letter-spacing: normal; text-transform: none; color: var(--bs-ink); }
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .cart-subtotal { display: none; }
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .counter.qty,
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .counter.qty.empty {
  display: flex; position: static; box-sizing: border-box; min-width: 22px; height: 22px; margin: 0; padding: 0 6px; top: auto; right: auto;
  border: 0; border-radius: 999px; background: var(--bs-rust); color: #FFFFFF; align-items: center; justify-content: center;
  font-family: var(--bs-font-text); font-size: 12px; font-weight: 700; line-height: normal; letter-spacing: normal; text-transform: none; opacity: 1; visibility: visible;
}
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .counter-number { display: block; margin: 0; padding: 0; color: #FFFFFF; font: inherit; line-height: normal; }
.page-header.header-style-22 #header-middle li.cart-link a.action.showcart .counter-label { display: none; }

/* ---- navigation band ---- */
.page-header.header-style-22 #header-bottom { background: #FFFFFF; border-bottom: 1px solid var(--bs-line); margin: 0; padding: 0; }
.page-header.header-style-22 #header-bottom > .container { width: 100%; max-width: 1488px; box-sizing: border-box; margin: 0 auto; padding: 0 24px; }
.page-header.header-style-22 #header-bottom .row.menu-area { display: flex; align-items: center; margin: 0; gap: 24px; }
.page-header.header-style-22 #header-bottom .row.menu-area::before,
.page-header.header-style-22 #header-bottom .row.menu-area::after { display: none; }
.page-header.header-style-22 #header-bottom .header-menu-wrap { flex: 1 1 auto; width: auto; float: none; padding: 0; margin: 0; min-width: 0; }
.page-header.header-style-22 #header-bottom .header-phone { display: none; }  /* phone now lives in the top bar */
.page-header.header-style-22 #header-bottom .cdz-menu { background: transparent; margin: 0; padding: 0; border: 0; }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu { display: flex; gap: 4px; white-space: nowrap; margin: 0; padding: 0; list-style: none; background: transparent; }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top:first-child { display: none; }  /* home icon: not in the design (the logo links home) */
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top { margin: 0; padding: 0; float: none; border: 0; background: transparent; }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link {
  display: block; margin: 0; padding: 17px 12px 15px; box-sizing: border-box; background: transparent;
  font-family: var(--bs-font-text); font-size: 15px; font-weight: 600; letter-spacing: 0.04em; line-height: normal; text-transform: none; text-decoration: none;
  color: var(--bs-ink); border: 0; border-bottom: 2px solid transparent; height: auto;
}
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link > span { font: inherit; letter-spacing: inherit; text-transform: none; color: inherit; }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link[href*="clearance"] { color: var(--bs-rust); }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link:hover { color: var(--bs-rust); }

/* old category chooser inside the search box: not part of the design */
.page-header.header-style-22 #header-middle .header-search .cdz-cat-search { display: none; }

/* parent theme leaks its font + 1.35 line-height into the top bar */
.page-header.header-style-22 #header-top, .page-header.header-style-22 #header-top * { font-family: var(--bs-font-text); line-height: normal; }
/* visually-hidden search label (matches the design: 1px clipped) */
.page-header.header-style-22 #header-middle .header-search form.minisearch label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); font-family: var(--bs-font-text); font-size: 16px; line-height: normal; text-transform: none; color: var(--bs-ink); }

/* nav wrapper: parent theme adds a 20px side margin */
.page-header.header-style-22 #header-bottom nav.cdz-navigation { margin: 0; padding: 0; }

/* =====================================================================================================
   HEADER MINI-CART DROPDOWN  (design: Header.dc.html "block-minicart" / MiniCart.dc.html)
   Markup: child theme Magento_Checkout/web/template/minicart/{content,item/default}.html
   ===================================================================================================== */
.page-header.header-style-22 #header-middle li.cart-link .cdz-dd-content {
  position: absolute; top: 60px; right: 0; left: auto; z-index: 30; box-sizing: border-box;
  width: 400px; max-width: calc(100vw - 48px); margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; border-radius: 0;
}
.page-header.header-style-22 #header-middle li.cart-link .cdz-dd-content .cdz-dd-content-inner { padding: 0; margin: 0; max-height: none; overflow: visible; height: auto; background: transparent; border: 0; box-shadow: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart {
  box-sizing: border-box; width: 100%; margin: 0; padding: 22px; background: #FFFFFF; border: 0; border-radius: 24px;
  box-shadow: 0 30px 70px rgba(18, 26, 36, 0.22); text-align: left; font-family: var(--bs-font-text); font-weight: 400; color: var(--bs-ink); line-height: normal; height: auto !important;
}
.page-header.header-style-22 #header-middle li.cart-link .block-minicart #minicart-content-wrapper { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; height: auto; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title {
  display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 0; border: 0; background: transparent; text-transform: none; font-size: 16px; font-weight: 400; line-height: normal; min-height: 0;
}
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title .bs-mini__title { font-size: 16px; font-weight: 400; color: var(--bs-ink); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title strong { font-weight: 700; font-size: inherit; text-transform: none; color: var(--bs-ink); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title strong.text { color: var(--bs-rust); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart {
  display: block; position: static; width: auto; height: auto; margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; font-size: 14px; font-weight: 700; line-height: normal; text-decoration: none; color: var(--bs-navy); text-indent: 0;
}
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart::before,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart::after { display: none; content: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart span { position: static; width: auto; height: auto; clip: auto; overflow: visible; font: inherit; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-content { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; background: transparent; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-content > strong.subtitle:not(.empty) { display: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-content strong.subtitle.empty { display: block; margin: 0; padding: 0; font-size: 14px; font-weight: 400; color: var(--bs-muted); text-transform: none; text-align: left; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cdz-cart-validation-message:empty,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .minicart-widgets:empty,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions .primary > div:empty { display: none; }

/* items */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .minicart-items-wrapper { display: flex; flex-direction: column; max-height: 300px; overflow: auto; margin: 0; padding: 0; width: auto; height: auto !important; border: 0; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart ol.minicart-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart li.bs-mini__item { display: flex; gap: 12px; align-items: flex-start; margin: 0; padding: 12px 0; border: 0; border-top: 1px solid #ECE6DC; background: transparent; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb { position: relative; flex-shrink: 0; display: block; margin: 0; padding: 0; width: auto; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb .product-item-photo { display: block; position: static; margin: 0; padding: 0; width: 64px; height: 64px; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb .product-image-container { display: block; width: 64px !important; height: 64px !important; margin: 0; padding: 0; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb .product-image-wrapper { display: block; height: 64px !important; padding: 0 !important; margin: 0; position: static; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb img.product-image-photo { position: static; display: block; width: 64px !important; height: 64px !important; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 12px; object-fit: contain; background: var(--bs-cream); }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete {
  position: absolute; top: -8px; left: -8px; right: auto; display: block; width: 24px; height: 24px; margin: 0; padding: 0; box-sizing: border-box; border: 0; border-radius: 999px;
  background: var(--bs-rust); color: #FFFFFF; font-size: 0; line-height: 0; text-align: center; cursor: pointer; overflow: hidden; text-indent: 0; box-shadow: none; opacity: 1;
}
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete::before { content: "\2715"; display: block; position: static; width: auto; height: 24px; margin: 0; font-family: var(--bs-font-text); font-size: 12px; font-weight: 700; line-height: 24px; color: #FFFFFF; text-align: center; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete::after { display: none; content: none; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__body strong.product-item-name { display: block; margin: 0; font-size: 14px; font-weight: 700; line-height: 1.35; color: var(--bs-ink); text-transform: none; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__body strong.product-item-name a { color: var(--bs-ink); font-weight: 700; text-decoration: none; font-size: inherit; line-height: inherit; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__meta { display: block; font-size: 13px; font-weight: 400; line-height: normal; color: var(--bs-muted); }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__meta a { color: var(--bs-navy); font-weight: 700; text-decoration: none; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__meta a:hover { color: var(--bs-rust); }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__price { display: block; margin: 0; padding: 0; width: auto; float: none; font-size: 15px; font-weight: 700; line-height: normal; color: var(--bs-rust); white-space: nowrap; text-align: right; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__price .price-container,
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__price .price-wrapper,
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__price .price { display: inline; margin: 0; padding: 0; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; color: var(--bs-rust); }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__qty { display: none; }   /* quantity is shown as text; editing happens on the cart page (input stays in the DOM for the sidebar script) */

/* subtotal + buttons */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; background: transparent; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal {
  display: flex; justify-content: space-between; align-items: baseline; margin: 0; padding: 12px 0 0; border: 0; border-top: 1px solid #ECE6DC; background: transparent; text-align: left;
}
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .label { display: block; float: none; margin: 0; padding: 0; font-size: 14px; font-weight: 700; letter-spacing: 0.08em; line-height: normal; text-transform: uppercase; color: var(--bs-muted); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .label::after { display: none; content: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount { display: block; float: none; margin: 0; padding: 0; text-align: right; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount .price-wrapper,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount .price { display: inline; margin: 0; padding: 0; font-family: var(--bs-font-display); font-size: 26px; font-weight: 600; line-height: normal; color: var(--bs-rust); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount .price-wrapper + .price-wrapper { display: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions { margin: 0; padding: 0; display: block; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions .primary { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; float: none; width: auto; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions .primary > button.action.close { display: none; }  /* "Keep Shopping": not in the design (click outside closes the panel) */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions a.action.button.secondary {
  display: block; box-sizing: content-box; margin: 0; padding: 13px; text-align: center; text-decoration: none; border: 1px solid #CFC7BA; border-radius: 999px; background: transparent; box-shadow: none;
  color: var(--bs-ink); font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; text-transform: none; width: auto; height: auto; min-height: 0;
}
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions a.action.button.secondary span { font: inherit; color: inherit; text-transform: none; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .actions button#top-cart-btn-checkout {
  display: block; box-sizing: border-box; width: 100%; margin: 0; padding: 14px; text-align: center; border: 0; border-radius: 999px; background: var(--bs-rust); box-shadow: none; cursor: pointer;
  color: #FFFFFF; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; text-transform: none; height: auto; min-height: 0;
}

/* ---- mini-cart corrections (measured against the design) ---- */
.page-header.header-style-22 #header-middle li.cart-link .cdz-dd-content { top: 60px !important; right: 0 !important; left: auto !important; width: 400px !important; margin: 0 !important; transform: none !important; }   /* parent theme pins right:-10px and adds a top margin */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart a,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart span,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart strong,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart button,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart label { font-family: var(--bs-font-text); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount .price-wrapper,
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .cart-total .subtotal .amount .price { font-family: var(--bs-font-display); }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .minicart-widgets:not(:has(*)) { display: none; }   /* empty placeholder regions must not add a flex gap */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart > span { display: inline; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .block-title a.action.viewcart { text-indent: 0; overflow: visible; width: auto !important; height: auto !important; line-height: normal; }

}

/* ---- keyboard focus + hover (design only defines "a:hover = rust"; focus rings added for accessibility) ---- */
.page-header.header-style-22 a:focus-visible,
.page-header.header-style-22 button:focus-visible,
.page-header.header-style-22 [tabindex]:focus-visible { outline: 2px solid var(--bs-navy); outline-offset: 2px; }
.page-header.header-style-22 #header-top a:focus-visible { outline-color: #FFFFFF; }
.page-header.header-style-22 #header-middle .header-search form.minisearch:focus-within { border-color: var(--bs-navy); box-shadow: 0 0 0 3px rgba(30, 58, 95, 0.16); }
.page-header.header-style-22 #header-middle .header-search form.minisearch input#search:focus,
.page-header.header-style-22 #header-middle .header-search form.minisearch input#search:focus-visible { outline: 0; box-shadow: none; }
.page-header.header-style-22 #header-middle .header-search form.minisearch button.action.search:focus-visible { outline-color: var(--bs-rust); }
.page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link:focus-visible { outline-offset: -2px; }

/* =====================================================================================================
   PHONE HEADER (< 768px) - the parent theme's mobile structure is KEPT (hamburger menu, search overlay, mobile cart icon,
   bottom toolbar). Only colours / fonts follow the design. Decision recorded in DEPLOY-LOG CHG-005.
   ===================================================================================================== */
@media (max-width: 767px) {
  .page-header.header-style-22 #header-top { display: block; }                           /* the design keeps the top bar on phones (trimmed below) */
  .page-header.header-style-22 #header-middle { position: relative; background: var(--bs-cream); border-bottom: 1px solid var(--bs-line); }   /* anchors the parent's absolutely-positioned search/cart icons to this row, not the whole header */
  .page-header.header-style-22 .nav-toggle::before,
  .page-header.header-style-22 .nav-toggle > span::before,
  .page-header.header-style-22 .nav-toggle > span::after { background: var(--bs-ink); }
  .page-header.header-style-22 .header-search .search-toggle::before,
  .page-header.header-style-22 #mobi_cart-wrapper a.showcart::before { color: var(--bs-ink); }
  .page-header.header-style-22 #mobi_cart-wrapper .counter.qty { background: var(--bs-rust); color: #FFFFFF; font-family: var(--bs-font-text); font-weight: 700; }
  .page-header.header-style-22 .bs-logo { margin-left: 34px; gap: 8px; }
  .page-header.header-style-22 .bs-logo__mark { width: 30px; height: 33px; }
  .page-header.header-style-22 .bs-logo__name { font-size: 21px; }
  .page-header.header-style-22 .bs-logo__tag { font-size: 8.5px; letter-spacing: 0.18em; margin-top: 3px; }
  #mb-bottom-toolbar.mb-bottom-toolbar { background: var(--bs-navy); font-family: var(--bs-font-text); }
  #mb-bottom-toolbar .counter, #mb-bottom-toolbar .qty, #mb-bottom-toolbar .counter-number { background-color: var(--bs-rust); color: #FFFFFF; font-family: var(--bs-font-text); font-weight: 700; }
  /* slide-in menu (hamburger): same structure + behaviour, design fonts/colours */
  .sections.nav-sections { font-family: var(--bs-font-text); color: var(--bs-ink); background: #FFFFFF; }
  .sections.nav-sections .nav-sections-item-title { font-family: var(--bs-font-text); font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: var(--bs-muted); background: var(--bs-cream); border-bottom: 1px solid var(--bs-line); }
  .sections.nav-sections .nav-sections-item-title.active { color: var(--bs-navy); background: #FFFFFF; border-bottom: 2px solid var(--bs-rust); }
  .sections.nav-sections a.menu-link { font-family: var(--bs-font-text); font-size: 15px; font-weight: 600; letter-spacing: 0.04em; color: var(--bs-ink); text-transform: none; }
  .sections.nav-sections a.menu-link > span { color: inherit; font: inherit; letter-spacing: inherit; }
  .sections.nav-sections a.menu-link[href*="clearance"] { color: var(--bs-rust); }
  .sections.nav-sections .dropdown-toggle::before { color: var(--bs-ink); }
}
/* design: .hdr-note / .hdr-sec are hidden at <= 900px */
@media (max-width: 900px) {
  .page-header.header-style-22 .bs-topbar__note,
  .page-header.header-style-22 .bs-topbar li.bs-sec { display: none !important; }
}

/* tablet / small laptop (768-1120px): the design scrolls the category bar sideways, but a scroll container would clip the dropdown submenus and the hidden submenu lists inflate its width. The bar wraps onto a second line instead: every item stays visible and dropdowns keep working. (Deliberate, logged deviation.) */
@media (min-width: 768px) and (max-width: 1120px) {
  .page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu { flex-wrap: wrap; white-space: normal; }
}

/* ---- pinned (sticky) header, >= 768px: the parent theme hides the logo column, shifts the search box (left:-137px; top:16px) and
   takes the account/cart group out of the flow while pinned. Keep the design's layout instead: same two bands, logo visible. ---- */
@media (min-width: 768px) {
  .page-header.header-style-22 .sticky-menu.active #header-middle .header-panel-left { display: block; }
  .page-header.header-style-22 .sticky-menu.active #header-middle .header-panel-center { left: auto; right: auto; top: auto; }
  .page-header.header-style-22 .sticky-menu.active #header-middle .header-panel-right { position: static; left: auto; right: auto; top: auto; margin: 0 0 0 auto; }
  .page-header.header-style-22 .sticky-menu.active { box-shadow: 0 8px 24px rgba(18, 26, 36, 0.10); }
}

/* pinned header on tablets / small laptops: pin only the logo + search + account + cart row (the wrapped category bar would take ~25% of the screen) */
@media (min-width: 768px) and (max-width: 1120px) {
  .page-header.header-style-22 .sticky-menu.active #header-bottom { display: none; }
}

/* =====================================================================================================
   HOME PAGE BODY  (design: Main.dc.html)  - markup lives in the Codazon page-builder layout `bluesprings-page`
   (sources: docs/bluesprings-redesign/deploy/content/home/*.html). Bands = builder containers `.bs-band--*`.
   ===================================================================================================== */
.bs-band, .bs-band *, .bs-band *::before, .bs-band *::after { box-sizing: content-box; }       /* the design uses default (content-box) sizing */
.bs-band { width: 100%; font-family: var(--bs-font-text); font-size: 16px; line-height: normal; color: var(--bs-ink); margin: 0; padding: 0; float: none; }
.container-fluid.bs-band { padding-left: 0; padding-right: 0; }   /* parent adds 10px gutters below 768px -> 20px horizontal overflow */
.bs-band--cream { background: var(--bs-cream); }
.bs-band--white { background: #FFFFFF; }
.bs-band--sky   { background: var(--bs-sky); }
.bs-band--navy  { background: var(--bs-navy); color: #FFFFFF; }
.bs-band--hero  { padding-bottom: 80px; }
.bs-band :where(h1, h2, h3, p, ul, ol, li) { margin: 0; padding: 0; }
.bs-band :where(h1, h2, h3, p, ul, ol, li, div, span, strong, a, summary, details, label) { font-family: inherit; line-height: inherit; }
.bs-band :where(ul, ol) { list-style: none; }
.bs-band :where(a) { text-decoration: none; }
.bs-band :where(img) { max-width: none; border: 0; }
.bs-band :where(summary) { cursor: pointer; list-style: none; }
.bs-band summary::-webkit-details-marker { display: none; }

/* shared section wrapper: max 1488, padded 24 */
.bs-hs, .bs-seo__inner { max-width: 1488px; width: 100%; margin: 0 auto; }
.bs-hs, .bs-seo__inner, .bs-hs *, .bs-seo__inner * { box-sizing: border-box; }
.bs-hs *, .bs-seo__inner * { box-sizing: content-box; }
.bs-hs { padding: 0 24px; }
.bs-btn { display: inline; text-decoration: none; font-weight: 700; font-size: 18px; padding: 18px 28px; border-radius: 999px; }
.bs-band a.bs-btn--rust, .bs-band a.bs-btn--rust:hover { background: var(--bs-rust); color: #FFFFFF; }
.bs-band a.bs-btn--white, .bs-band a.bs-btn--white:hover { background: #FFFFFF; color: var(--bs-navy); }
.bs-btn--md { font-size: 17px; padding: 16px 26px; align-self: flex-start; }
.bs-eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.16em; }
.bs-eyebrow--rust { color: var(--bs-rust); }
.bs-eyebrow--peach { color: #F0B98C; }
.bs-h2 { font-family: var(--bs-font-display); font-weight: 500; font-size: clamp(32px, 3.2vw, 44px); line-height: 1.08; letter-spacing: -0.02em; color: var(--bs-ink); }
.bs-h2--38 { font-size: 38px; line-height: 1.12; letter-spacing: normal; }
.bs-p { font-size: 17px; line-height: 1.7; color: var(--bs-ink-2); }

/* ---- hero ---- */
.bs-hs--hero { padding-top: 40px; }
.bs-hero { display: flex; flex-wrap: wrap; border-radius: 32px; overflow: hidden; background: var(--bs-navy); color: #FFFFFF; }
.bs-hero__text { flex: 1 1 340px; padding: clamp(32px, 4.5vw, 64px) clamp(24px, 4vw, 56px); display: flex; flex-direction: column; gap: 22px; justify-content: center; }
.bs-hero__badge { align-self: flex-start; background: var(--bs-rust); color: #FFFFFF; font-size: 13px; font-weight: 700; letter-spacing: 0.08em; padding: 7px 14px; border-radius: 999px; }
.bs-hero__title { font-family: var(--bs-font-display); font-weight: 500; font-size: clamp(38px, 4.4vw, 60px); line-height: 1.04; letter-spacing: -0.025em; color: #FFFFFF; }
.bs-hero__lead { font-size: 19px; line-height: 1.6; color: #D5DFEA; max-width: 560px; }
.bs-hero__lead strong { color: #FFFFFF; }
.bs-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.bs-hero__media { flex: 1 1 340px; min-height: 460px; position: relative; background: #2A4A70; }
.bs-hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 75% center; }
.bs-hero__card { position: absolute; left: 24px; bottom: 24px; background: #FFFFFF; color: var(--bs-ink); border-radius: 20px; padding: 16px 20px; display: flex; gap: 16px; align-items: center; box-shadow: 0 20px 40px rgba(18, 26, 36, 0.25); }
.bs-hero__card img { width: 72px; height: 72px; object-fit: cover; border-radius: 12px; }
.bs-hero__card-meta { display: flex; flex-direction: column; gap: 2px; }
.bs-hero__card-name { font-size: 14px; color: var(--bs-muted); }
.bs-hero__card-price { font-family: var(--bs-font-display); font-size: 28px; font-weight: 600; color: var(--bs-rust); }
.bs-band a.bs-hero__card-btn, .bs-band a.bs-hero__card-btn:hover { background: var(--bs-navy); color: #FFFFFF; font-size: 14px; font-weight: 700; padding: 12px 16px; border-radius: 999px; text-decoration: none; }

/* ---- benefit strip ---- */
.bs-hs--usps { padding-top: 24px; }
.bs-usps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.bs-usp { background: #FFFFFF; border-radius: 20px; padding: 20px 22px; display: flex; gap: 14px; align-items: center; }
.bs-usp__icon { flex-shrink: 0; width: 44px; height: 44px; border-radius: 14px; background: var(--bs-sky); display: flex; align-items: center; justify-content: center; }
.bs-usp__text { display: flex; flex-direction: column; gap: 2px; }
.bs-usp__title { font-size: 16px; font-weight: 700; }
.bs-usp__sub { font-size: 14px; color: var(--bs-muted); }

/* ---- section heads ---- */
.bs-hs--cats, .bs-hs--picks { padding-top: 80px; padding-bottom: 80px; display: flex; flex-direction: column; gap: 28px; }
.bs-hs__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.bs-hs__headline { display: flex; flex-direction: column; gap: 8px; }
.bs-hs__note { font-size: 16px; color: var(--bs-muted); }
.bs-band a.bs-hs__link, .bs-band a.bs-hs__link:hover { font-size: 17px; font-weight: 700; text-decoration: none; color: var(--bs-navy); }
.bs-band a.bs-hs__link:hover { color: var(--bs-rust); }

/* ---- category cards ---- */
.bs-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 46%), 1fr)); gap: 20px; }
.bs-band a.bs-cat, .bs-band a.bs-cat:hover { background: var(--bs-cream); border-radius: 24px; overflow: hidden; text-decoration: none; color: var(--bs-ink); display: flex; flex-direction: column; }
.bs-cat__img { display: block; aspect-ratio: 4 / 3; background: #ECE6DC; }
.bs-cat__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bs-cat__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }
.bs-cat__title { font-family: var(--bs-font-display); font-size: 26px; font-weight: 500; line-height: 1.15; }
.bs-cat__desc { font-size: 15px; line-height: 1.5; color: var(--bs-ink-2); }
.bs-cat__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 12px; margin-top: auto; padding-top: 10px; }
.bs-cat__from { font-size: 14px; color: var(--bs-muted); }
.bs-cat__from strong { font-family: var(--bs-font-display); font-size: clamp(20px, 1.6vw, 26px); color: var(--bs-rust); }
.bs-cat__go { background: var(--bs-navy); color: #FFFFFF; font-size: 14px; font-weight: 700; padding: 10px 16px; border-radius: 999px; white-space: nowrap; }
.bs-band a.bs-cat-cta, .bs-band a.bs-cat-cta:hover { background: var(--bs-navy); border-radius: 24px; text-decoration: none; color: #FFFFFF; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; padding: 32px; }
.bs-cat-cta__top { display: flex; flex-direction: column; gap: 14px; }
.bs-cat-cta__eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.14em; color: #F0B98C; }
.bs-cat-cta__text { font-family: var(--bs-font-display); font-size: clamp(22px, 2vw, 30px); line-height: 1.15; }
.bs-cat-cta__btn { align-self: flex-start; background: var(--bs-rust); color: #FFFFFF; font-weight: 700; font-size: 16px; padding: 14px 22px; border-radius: 999px; }

/* ---- SEO intro (navy) ---- */
.bs-seo { background: var(--bs-navy); color: #FFFFFF; }
.bs-seo__inner { padding: clamp(48px, 5vw, 80px) 24px; display: flex; flex-wrap: wrap; gap: 56px; align-items: center; }
.bs-seo__left { flex: 1 1 460px; display: flex; flex-direction: column; gap: 18px; }
.bs-seo__title { font-family: var(--bs-font-display); font-weight: 500; font-size: clamp(30px, 3vw, 42px); line-height: 1.1; letter-spacing: -0.02em; color: #FFFFFF; }
.bs-seo__text { font-size: 17px; line-height: 1.7; color: #D5DFEA; }
.bs-seo__searches { display: flex; flex-direction: column; gap: 10px; }
.bs-seo__searches-label { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; color: #C9D6E4; }
.bs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bs-band .bs-chips a, .bs-band .bs-chips a:hover { display: block; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px; padding: 9px 16px; font-size: 14px; font-weight: 600; color: #FFFFFF; text-decoration: none; }
.bs-why { flex: 1 1 460px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; }
.bs-why__item { background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 22px; padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.bs-why__icon { width: 48px; height: 48px; border-radius: 14px; background: var(--bs-rust); display: flex; align-items: center; justify-content: center; }
.bs-why__title { font-size: 18px; font-weight: 700; color: #FFFFFF; }
.bs-why__text { font-size: 15px; line-height: 1.55; color: #D5DFEA; }

/* ---- featured products (native Catalog Products List widget, Bluesprings template) ---- */
.bs-picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(230px, 46%), 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.bs-pick { background: #FFFFFF; border-radius: 22px; overflow: hidden; display: flex; flex-direction: column; margin: 0; padding: 0; width: auto; float: none; }
.bs-pick__photo { position: relative; display: block; aspect-ratio: 1 / 1; background: #ECE6DC; }
.bs-pick__photo .product-image-container { position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; max-width: none; }
.bs-pick__photo .product-image-wrapper { position: absolute; inset: 0; display: block; padding: 0 !important; height: 100%; }
.bs-pick__photo img.product-image-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; max-width: none; margin: 0; }
.bs-pick__badge { position: absolute; top: 12px; left: 12px; background: var(--bs-rust); color: #FFFFFF; font-size: 12px; font-weight: 700; padding: 5px 10px; border-radius: 999px; z-index: 2; }
.bs-pick__details { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }
.bs-band a.bs-pick__name, .bs-band a.bs-pick__name:hover { font-family: var(--bs-font-text); font-size: 15px; font-weight: 600; line-height: 1.4; min-height: 2.8em; color: var(--bs-ink); text-decoration: none; }
.bs-band .bs-pick .price-box { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; margin: auto 0 0; padding: 0; }
.bs-band .bs-pick .price-box .price-container, .bs-band .bs-pick .price-box .price-wrapper { display: inline; }
.bs-band .bs-pick .price-box .price-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.bs-band .bs-pick .price-box .price { font-family: var(--bs-font-display); font-size: 26px; font-weight: 600; line-height: normal; color: var(--bs-rust); }
.bs-band .bs-pick .price-box .old-price { order: 2; }
.bs-band .bs-pick .price-box .old-price .price { font-family: var(--bs-font-text); font-size: 14px; font-weight: 400; color: #6B7580; text-decoration: line-through; }
.bs-pick__actions { display: flex; gap: 8px; }
.bs-band .bs-pick__btn, .bs-band .bs-pick__btn:hover { flex: 1; height: 44px; border-radius: 999px; background: var(--bs-navy); color: #FFFFFF; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; text-decoration: none; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0; border: 0; }

/* ---- designer steps + clearance (sky band) ---- */
.bs-hs--designer { padding-top: 80px; }
.bs-designer { background: #FFFFFF; border-radius: 32px; padding: clamp(28px, 4vw, 56px); display: flex; flex-wrap: wrap; gap: 48px; align-items: center; }
.bs-designer__left { flex: 1 1 380px; display: flex; flex-direction: column; gap: 16px; }
.bs-steps { flex: 2 1 340px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.bs-step { background: var(--bs-cream); border-radius: 22px; padding: 26px; display: flex; flex-direction: column; gap: 10px; }
.bs-step__n { font-size: 16px; width: 40px; height: 40px; border-radius: 999px; background: var(--bs-navy); color: #FFFFFF; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.bs-step__title { font-size: 18px; font-weight: 700; }
.bs-step__text { font-size: 15px; line-height: 1.55; color: var(--bs-ink-2); }
.bs-hs--clearance { padding-top: 24px; padding-bottom: 80px; }
.bs-band a.bs-clearance, .bs-band a.bs-clearance:hover { display: flex; flex-wrap: wrap; border-radius: 32px; overflow: hidden; background: var(--bs-rust); color: #FFFFFF; text-decoration: none; }
.bs-clearance__media { flex: 1 1 320px; min-height: 300px; position: relative; background: #8E4214; }
.bs-clearance__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bs-clearance__body { flex: 1 1 340px; padding: clamp(28px, 4vw, 48px) clamp(24px, 4vw, 56px); display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.bs-clearance__eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.16em; color: #FBE7D8; }
.bs-clearance__title { font-family: var(--bs-font-display); font-size: clamp(32px, 3.2vw, 44px); line-height: 1.08; }
.bs-clearance__btn { align-self: flex-start; background: #FFFFFF; color: var(--bs-ink); font-weight: 700; font-size: 17px; padding: 15px 24px; border-radius: 999px; }

/* ---- SEO text + FAQ ---- */
.bs-hs--faq { padding-top: 80px; padding-bottom: 80px; display: flex; flex-wrap: wrap; gap: 56px; }
.bs-faq__left { flex: 1 1 340px; display: flex; flex-direction: column; gap: 16px; }
.bs-faq__right { flex: 1 1 340px; display: flex; flex-direction: column; gap: 12px; }
.bs-qa { background: var(--bs-cream); border-radius: 18px; padding: 22px 26px; }
.bs-qa__q { font-size: 18px; font-weight: 700; display: flex; justify-content: space-between; gap: 16px; }
.bs-qa__q span { color: var(--bs-navy); }
.bs-qa__a { margin: 12px 0 0; font-size: 16px; line-height: 1.65; color: var(--bs-ink-2); }

/* =====================================================================================================
   FOOTER (CHG-009) - design: Footer.dc.html. Markup = deploy/content/footer.html (Codazon footer `bluesprings-footer`).
   ===================================================================================================== */
.page-footer { background: #121A24; color: #C9D1DA; margin: 0; padding: 0; border: 0; }
.bs-ft, .bs-ft *, .bs-ft *::before, .bs-ft *::after { box-sizing: content-box; }
.bs-ft { width: 100%; font-family: var(--bs-font-text); font-size: 16px; line-height: normal; background: #121A24; color: #C9D1DA; }
.bs-ft :where(h2, p, span, a, div, form, label, input, button) { font-family: inherit; line-height: inherit; }
.bs-ft :where(h2, p) { margin: 0; padding: 0; }
.bs-ft a { text-decoration: none; }
.bs-ft a, .page-footer .bs-ft a { color: #C9D1DA; }
.bs-ft a:hover, .page-footer .bs-ft a:hover { color: #FFFFFF; text-decoration: none; }
.bs-ft__news { background: var(--bs-navy); }
.bs-ft__news-in { max-width: 1488px; width: 100%; box-sizing: border-box; margin: 0 auto; padding: 40px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.bs-ft__news-text { display: flex; flex-direction: column; gap: 6px; flex: 1 1 320px; }
.bs-ft__news-title { font-family: var(--bs-font-display); font-weight: 500; font-size: 30px; line-height: normal; color: #FFFFFF; }
.bs-ft__news-sub { font-size: 16px; color: #D5DFEA; }
.bs-ft .bs-news__form { flex: 1 1 320px; max-width: 560px; display: flex; gap: 10px; margin: 0; padding: 0; }
.bs-ft .bs-news__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; padding: 0; }
.bs-ft .bs-news__field { flex: 1; min-width: 0; }
body .page-footer .bs-ft .bs-news__input { display: block; line-height: normal; width: 100%; box-sizing: border-box; height: 52px; border: 0; border-radius: 999px; padding: 0 22px; margin: 0; font-family: var(--bs-font-text); font-size: 16px; color: var(--bs-ink); background: #FFFFFF; box-shadow: none; }
.bs-ft .bs-news__input::placeholder { color: #6B7580; }
body .page-footer .bs-ft .bs-news__field div.mage-error, body .page-footer .bs-ft .bs-news__field label.mage-error { display: block; margin: 6px 0 0 22px; padding: 0; font-size: 13px; line-height: 1.3; font-weight: 500; color: #F0B98C; background: none; }
.bs-ft .bs-news__btn, .bs-ft .bs-news__btn:hover { height: 52px; box-sizing: border-box; border: 0; border-radius: 999px; padding: 0 26px; margin: 0; background: var(--bs-rust); color: #FFFFFF; font-family: var(--bs-font-text); font-size: 16px; font-weight: 700; cursor: pointer; text-transform: none; box-shadow: none; }
.bs-ft__main { max-width: 1488px; width: 100%; box-sizing: border-box; margin: 0 auto; padding: 64px 24px 32px; display: flex; flex-direction: column; gap: 48px; }
.bs-ft__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 40px; }
.bs-ft__col { display: flex; flex-direction: column; gap: 14px; }
.bs-ft__col--links { gap: 12px; font-size: 15px; }
.bs-ft__brand { font-family: var(--bs-font-display); font-size: 24px; font-weight: 600; color: #FFFFFF; }
.bs-ft__text { font-size: 15px; line-height: 1.6; }
.bs-ft a.bs-ft__phone, .page-footer .bs-ft a.bs-ft__phone { color: #FFFFFF; font-weight: 700; }
.bs-ft__head { color: #FFFFFF; font-weight: 700; margin-bottom: 4px; }
.bs-ft__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 24px; border-top: 1px solid #2A3542; font-size: 14px; color: #9AA5B1; }
.bs-ft__legal { display: flex; gap: 24px; }
.bs-ft .bs-ft__legal a, .page-footer .bs-ft .bs-ft__legal a { color: #9AA5B1; }
.bs-ft .bs-ft__legal a:hover { color: #FFFFFF; }

/* ---- home: narrow-phone polish (product cards) ---- */
.bs-band .bs-pick, .bs-band .bs-pick .bs-pick__details, .bs-band a.bs-pick__name { text-align: left; }
.bs-band .bs-pick__btn { white-space: nowrap; }
@media (max-width: 480px) {
  .bs-band .bs-pick__details { padding: 14px 12px 16px; }
  .bs-band .bs-pick__btn { font-size: 14px; gap: 6px; }
}

/* ---- footer: tablet = 2 columns x 2 rows, phone = 1 column ---- */
.bs-ft .bs-ft__legal { flex-wrap: wrap; gap: 8px 24px; }
@media (min-width: 520px) and (max-width: 1023px) {
  .bs-ft .bs-ft__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 519px) {
  .bs-ft .bs-ft__grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---- home: phone = one category / one product per row ---- */
@media (max-width: 519px) {
  .bs-band .bs-cats, .bs-band .bs-picks { grid-template-columns: minmax(0, 1fr); }
}

/* hidden mega-menu dropdowns (position:absolute) stick out past the viewport on narrower desktops and made every page scroll sideways; clip (not hidden) keeps the sticky header working */
.page-wrapper { overflow-x: clip; }

/* ---- QA fixes (CHG-011): narrow-phone hero card + comfortable tap targets ---- */
@media (max-width: 480px) {
  .bs-hero__card { right: 24px; flex-wrap: wrap; }
  .bs-hero__card-meta { flex: 1 1 110px; min-width: 0; }
  .bs-band a.bs-hero__card-btn { margin-left: auto; }
}
@media (max-width: 768px) {
  .bs-ft__col--links { gap: 0; }
  .bs-ft__col--links .bs-ft__head { margin-bottom: 8px; }
  .bs-ft__col--links a, .bs-ft__col > a { display: block; padding: 7px 0; }
  .bs-ft__legal a { display: inline-block; padding: 7px 0; }
  .bs-band a.bs-hs__link { display: inline-block; padding: 8px 0; }
}

/* ---- keyboard focus rings for the home page + footer (design defines none; navy ring, white on dark areas) ---- */
.bs-band a:focus-visible, .bs-band summary:focus-visible, .bs-band button:focus-visible, .bs-band [tabindex]:focus-visible,
.bs-ft a:focus-visible, .bs-ft button:focus-visible, .bs-ft input:focus-visible { outline: 2px solid var(--bs-navy); outline-offset: 3px; }
.bs-band--navy a:focus-visible, .bs-hero a:focus-visible, .bs-clearance:focus-visible, .bs-ft a:focus-visible, .bs-ft button:focus-visible, .bs-ft input:focus-visible { outline-color: #FFFFFF; }

/* ---- CHG-013 follow-up: Magento confirm dialogs (remove item from cart, ...) in the new style ---- */
aside.modal-popup.confirm { font-family: var(--bs-font-text); color: var(--bs-ink); }
aside.modal-popup.confirm .modal-inner-wrap { position: relative; width: 440px; max-width: calc(100% - 32px); margin: 0 auto; top: 50%; transform: translateY(-50%); background: #FFFFFF; border: 0; border-radius: 24px; box-shadow: 0 30px 70px rgba(18, 26, 36, 0.3); padding: 28px; box-sizing: border-box; overflow: visible; }
aside.modal-popup.confirm .modal-header { padding: 0; margin: 0; border: 0; background: none; min-height: 0; }
aside.modal-popup.confirm .modal-header .action-close { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 999px; background: var(--bs-cream); padding: 0; margin: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: none; }
aside.modal-popup.confirm .modal-header .action-close::before { content: "✕"; font-size: 15px; line-height: 1; color: var(--bs-ink); margin: 0; }
aside.modal-popup.confirm .modal-header .action-close > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
aside.modal-popup.confirm .modal-content { padding: 6px 28px 6px 0; margin: 0; background: none; border: 0; font-size: 17px; line-height: 1.5; font-weight: 600; color: var(--bs-ink); }
aside.modal-popup.confirm .modal-footer { display: flex; flex-direction: row-reverse; justify-content: flex-start; gap: 10px; padding: 22px 0 0; margin: 0; border: 0; background: none; text-align: left; }
aside.modal-popup.confirm .modal-footer button { height: 46px; min-width: 110px; padding: 0 24px; margin: 0; border-radius: 999px; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; text-transform: none; letter-spacing: normal; cursor: pointer; box-shadow: none; }
aside.modal-popup.confirm .modal-footer .action-primary { background: var(--bs-rust); border: 1px solid var(--bs-rust); color: #FFFFFF; }
aside.modal-popup.confirm .modal-footer .action-primary:hover { background: #9A4515; }
aside.modal-popup.confirm .modal-footer .action-secondary { background: #FFFFFF; border: 1px solid #CFC7BA; color: var(--bs-ink); }
aside.modal-popup.confirm .modal-footer .action-secondary:hover { background: var(--bs-sky); }
aside.modal-popup.confirm .modal-footer button span { font: inherit; color: inherit; }

/* ---- CHG-015: guest "Checkout as a new customer / using your account" popup (Magento authentication popup) - design Cart.dc.html ---- */
aside.popup-authentication { font-family: var(--bs-font-text); color: var(--bs-ink); }
aside.popup-authentication .modal-inner-wrap { position: relative; width: 860px; max-width: calc(100% - 32px); margin: 0 auto; top: 50%; transform: translateY(-50%); max-height: calc(100vh - 32px); overflow: auto; background: #FFFFFF; border: 0; border-radius: 28px; box-shadow: 0 40px 90px rgba(18, 26, 36, 0.3); padding: clamp(24px, 3vw, 40px); box-sizing: border-box; }
aside.popup-authentication .modal-header { padding: 0; margin: 0; border: 0; background: none; min-height: 0; }
aside.popup-authentication .modal-header .action-close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; border: 0; border-radius: 999px; background: var(--bs-cream); padding: 0; margin: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: none; z-index: 2; }
aside.popup-authentication .modal-header .action-close::before { content: "✕"; font-family: var(--bs-font-text); font-size: 17px; line-height: 1; color: var(--bs-ink); margin: 0; }
aside.popup-authentication .modal-header .action-close > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
aside.popup-authentication .modal-content { padding: 0; margin: 0; background: none; border: 0; overflow: visible; }
aside.popup-authentication .block-authentication { display: flex; flex-wrap: wrap; gap: 32px; margin: 0; padding: 0; border: 0; width: 100%; }
aside.popup-authentication .block-authentication::before, aside.popup-authentication .block-authentication::after { content: none; display: none; }
aside.popup-authentication .block-authentication .block { flex: 1 1 300px; width: auto; float: none; margin: 0; padding: 0; border: 0; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
aside.popup-authentication .block-authentication .block::before, aside.popup-authentication .block-authentication .block::after { content: none; display: none; }
aside.popup-authentication .block-new-customer { padding-right: 32px; border-right: 1px solid #ECE6DC; }
aside.popup-authentication .block-title { margin: 0; padding: 0; border: 0; }
aside.popup-authentication .block-title strong { font-family: var(--bs-font-display); font-size: 26px; font-weight: 500; line-height: 1.2; color: var(--bs-ink); text-transform: none; }
aside.popup-authentication .block-content { display: flex; flex-direction: column; gap: 14px; flex: 1; margin: 0; padding: 0; }
aside.popup-authentication .block-content > p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--bs-ink-2); }
aside.popup-authentication .block-new-customer ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 15px; color: var(--bs-ink-2); list-style: disc; }
aside.popup-authentication .block-new-customer li { margin: 0; padding: 0; }
aside.popup-authentication .block-new-customer .actions-toolbar { margin: auto 0 0; padding: 0; }
aside.popup-authentication .block-new-customer .actions-toolbar .primary { margin: 0; padding: 0; float: none; }
aside.popup-authentication a.action-register { display: inline-flex; align-items: center; justify-content: center; height: auto; margin: 0; padding: 15px 24px; border: 0; border-radius: 999px; background: var(--bs-rust); color: #FFFFFF; font-family: var(--bs-font-text); font-size: 16px; font-weight: 700; text-transform: none; text-decoration: none; letter-spacing: normal; box-shadow: none; }
aside.popup-authentication a.action-register:hover { background: #9A4515; color: #FFFFFF; }
aside.popup-authentication a.action-register span { font: inherit; color: inherit; }
aside.popup-authentication .block-customer-login .messages { margin: 0; }
aside.popup-authentication form.form-login { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; flex: 1; }
aside.popup-authentication form.form-login .fieldset { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; flex: 1; }
aside.popup-authentication form.form-login .field { margin: 0; display: flex; flex-direction: column; gap: 6px; }
aside.popup-authentication form.form-login .field > .label { position: static; width: auto; height: auto; clip: auto; margin: 0; padding: 0; font-size: 14px; font-weight: 600; color: var(--bs-ink); float: none; text-align: left; }
aside.popup-authentication form.form-login .field.required > .label::after { content: " *"; color: var(--bs-rust); margin: 0; }
aside.popup-authentication form.form-login .control { margin: 0; width: auto; }
aside.popup-authentication form.form-login input.input-text { width: 100%; height: 50px; box-sizing: border-box; border: 1px solid #CFC7BA; border-radius: 12px; padding: 0 14px; background: #FBFAF7; font-family: var(--bs-font-text); font-size: 16px; color: var(--bs-ink); box-shadow: none; }
aside.popup-authentication form.form-login input.input-text:focus { outline: 2px solid var(--bs-navy); outline-offset: 1px; border-color: var(--bs-navy); }
aside.popup-authentication form.form-login .actions-toolbar { display: flex; flex-direction: row-reverse; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin: auto 0 0; padding: 0; }
aside.popup-authentication form.form-login .actions-toolbar > .primary, aside.popup-authentication form.form-login .actions-toolbar > .secondary { margin: 0; padding: 0; float: none; width: auto; }
aside.popup-authentication button.action-login { display: inline-flex; align-items: center; justify-content: center; height: auto; margin: 0; padding: 15px 28px; border: 0; border-radius: 999px; background: var(--bs-navy); color: #FFFFFF; font-family: var(--bs-font-text); font-size: 16px; font-weight: 700; text-transform: none; letter-spacing: normal; cursor: pointer; box-shadow: none; }
aside.popup-authentication button.action-login:hover { background: #17304F; }
aside.popup-authentication button.action-login span { font: inherit; color: inherit; }
aside.popup-authentication form.form-login .secondary a.action { font-size: 14px; font-weight: 600; color: var(--bs-navy); text-decoration: none; }
aside.popup-authentication form.form-login .secondary a.action:hover { color: var(--bs-rust); }
aside.popup-authentication .block-authentication .block-new-customer + .block-customer-login::before { content: none; }
aside.popup-authentication .modal-inner-wrap .or, aside.popup-authentication .block-authentication .or { display: none; }
@media (max-width: 760px) { aside.popup-authentication .block-new-customer { padding-right: 0; border-right: 0; padding-bottom: 18px; border-bottom: 1px solid #ECE6DC; } }
aside.popup-authentication .modal-inner-wrap { overflow-x: hidden; }
aside.popup-authentication a.action.action-register.primary, aside.popup-authentication .block-new-customer a.action-register { padding: 15px 24px !important; height: auto !important; line-height: normal !important; min-width: 0; background: var(--bs-rust) !important; color: #FFFFFF !important; border-radius: 999px !important; font-size: 16px !important; font-weight: 700 !important; display: inline-flex !important; width: auto !important; }
aside.popup-authentication button.action.action-login.secondary, aside.popup-authentication button.action-login { padding: 15px 28px !important; height: auto !important; line-height: normal !important; background: var(--bs-navy) !important; color: #FFFFFF !important; border: 0 !important; border-radius: 999px !important; font-size: 16px !important; font-weight: 700 !important; width: auto !important; }
aside.popup-authentication .modal-header .action-close { display: flex !important; opacity: 1 !important; visibility: visible !important; }
aside.popup-authentication .modal-header .action-close::before { content: "✕" !important; font-family: var(--bs-font-text) !important; font-size: 17px !important; line-height: 1 !important; color: var(--bs-ink) !important; width: auto !important; height: auto !important; position: static !important; margin: 0 !important; display: block !important; opacity: 1 !important; }
aside.popup-authentication .block-authentication { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box; }
aside.popup-authentication .block-authentication .block { border-left: 0 !important; border-top: 0 !important; margin: 0 !important; box-sizing: border-box; }
aside.popup-authentication .block-authentication .block-customer-login { padding: 0 !important; width: auto !important; }
aside.popup-authentication .block-authentication .block-new-customer { width: auto !important; padding-right: 32px !important; border-right: 1px solid #ECE6DC !important; }
@media (max-width: 760px) { aside.popup-authentication .block-authentication .block-new-customer { padding-right: 0 !important; border-right: 0 !important; padding-bottom: 18px !important; border-bottom: 1px solid #ECE6DC !important; } }
aside.popup-authentication .modal-inner-wrap { display: flex; flex-direction: column; }
aside.popup-authentication .modal-content { flex: 1 1 auto; width: 100%; max-width: 100%; box-sizing: border-box; }
aside.modal-popup.confirm .modal-inner-wrap { display: flex; flex-direction: column; }
aside.modal-popup.confirm .modal-content, aside.modal-popup.confirm .modal-footer { width: 100%; box-sizing: border-box; }
aside.popup-authentication .modal-header .action-close, aside.popup-authentication .modal-inner-wrap .action-close { position: absolute !important; top: 16px !important; right: 16px !important; left: auto !important; bottom: auto !important; width: 40px !important; height: 40px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: var(--bs-cream) !important; box-shadow: none !important; z-index: 5 !important; }
aside.popup-authentication .modal-header .action-close:hover { background: var(--bs-sky) !important; }

/* header mini cart: the round remove button overhangs the thumbnail by 8px - give the scrolling list room so it is not clipped */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .minicart-items-wrapper { padding: 10px 10px 0 10px; margin: 0 -10px; box-sizing: content-box; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart li.bs-mini__item:first-child { border-top: 0; padding-top: 6px; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete { z-index: 2; }
.page-header.header-style-22 #header-middle li.cart-link .bs-mini__thumb a.action.delete::before { font-size: 12px; line-height: 24px; color: #FFFFFF !important; font-family: var(--bs-font-text) !important; }

/* CHG-016: first cart row keeps the design's divider + 12px padding (wrapper is pulled up by its own top padding so the remove button is not clipped). */
.page-header.header-style-22 #header-middle li.cart-link .block-minicart .minicart-items-wrapper { padding-top: 8px; margin-top: -8px; }
.page-header.header-style-22 #header-middle li.cart-link .block-minicart li.bs-mini__item:first-child { border-top: 1px solid #ECE6DC; padding-top: 12px; }

/* CHG-024: home "Design & Buy" buttons keep white text when the product was already visited / focused */
.bs-band .bs-pick__btn:visited, .bs-band .bs-pick__btn:focus, .bs-band .bs-pick__btn:active { color: #FFFFFF !important; }

/* CHG-024b: theme-owned links that turned grey / blue / yellow once visited (parent theme a:visited rules) */
.mb-bottom-toolbar .menu-items .item a.action:visited, .mb-bottom-toolbar .menu-items .item a.action:visited > * { color: #FFFFFF !important; }
.cdz-cat-search .inner a.current-cat:visited { color: #000000 !important; }
.section-items .section-item-title a.nav-sections-item-switch:visited { color: inherit !important; }
.actions-toolbar .primary a.action.action-register.primary:visited { color: #FFFFFF !important; }

/* CHG-026: phone top bar - the wrapped "BEST PRICES ONLINE" pill touched the top edge of the bar */
@media (max-width: 767px) {
  .bs-topbar__inner { padding-top: 8px; padding-bottom: 8px; row-gap: 6px; min-height: 0; }
}

/* CHG-028c: header account slide-in panel (right sidebar) - Bluesprings palette instead of the parent theme's yellow. No separate design file: follows the Account page nav card. */
.md-sidenav-right.cdz-sidebar { background: var(--bs-cream); font-family: var(--bs-font-text); }
.md-sidenav-right .utilies-section#utilities-main { padding: 0 !important; }
.md-sidenav-right .account-info-summary { background: var(--bs-navy); padding: 28px 24px 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; text-align: left; }
.md-sidenav-right .account-info-summary .info-summary-top { padding: 0; }
.md-sidenav-right .account-info-summary .icon-account { width: 64px; height: 64px; border-radius: 999px; background: var(--bs-rust) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-8 8-8s8 3.6 8 8'/%3E%3C/svg%3E") center / 32px 32px no-repeat; }
.md-sidenav-right .account-info-summary .icon-account::before, .md-sidenav-right .account-info-summary .icon-account::after { content: none; display: none; }
.md-sidenav-right .account-info-summary .info-summary-bottom { padding: 0; text-align: left; }
.md-sidenav-right .account-info-summary .info-summary-bottom .md-content { padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.md-sidenav-right .account-info-summary .info-summary-bottom p { margin: 0; padding: 0; }
.md-sidenav-right .account-info-summary .info-summary-bottom .title a { font-family: var(--bs-font-display); font-size: 26px; font-weight: 500; line-height: 1.2; text-transform: none; letter-spacing: normal; color: #FFFFFF !important; text-decoration: none; }
.md-sidenav-right .account-info-summary .info-summary-bottom a.md-raised { display: inline-flex; align-items: center; height: auto; min-height: 0; margin: 0; padding: 10px 20px; border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 999px; background: transparent; box-shadow: none; font-family: var(--bs-font-text); font-size: 14px; font-weight: 600; line-height: normal; text-transform: none; letter-spacing: normal; color: #FFFFFF !important; text-decoration: none; }
.md-sidenav-right .account-info-summary .info-summary-bottom a.md-raised:hover { background: rgba(255, 255, 255, 0.12); }
.md-sidenav-right .acount-menu { padding: 20px 16px 28px; }
.md-sidenav-right .account-menu-items { margin: 0; padding: 8px !important; list-style: none; background: #FFFFFF; border-radius: 20px; display: flex; flex-direction: column; gap: 2px; }
.md-sidenav-right .account-menu-items > li { margin: 0; padding: 0; border: 0; float: none; width: auto; }
.md-sidenav-right .account-menu-items > li > a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 13px 14px; border-radius: 12px; font-family: var(--bs-font-text); font-size: 15px; font-weight: 500; line-height: normal; text-transform: none; letter-spacing: normal; text-decoration: none; color: var(--bs-ink) !important; }
.md-sidenav-right .account-menu-items > li > a:hover { background: var(--bs-sky); color: var(--bs-navy) !important; }
.md-sidenav-right .account-menu-items > li > a .counter { color: var(--bs-muted); font-size: 13px; }
.md-sidenav-right .account-info-summary .icon-account { width: 64px !important; height: 64px !important; border-radius: 999px !important; background-color: var(--bs-rust) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-8 8-8s8 3.6 8 8'/%3E%3C/svg%3E") !important; background-position: center !important; background-size: 32px 32px !important; background-repeat: no-repeat !important; margin: 0 !important; }
.md-sidenav-right .account-info-summary .info-summary-top { margin: 0 !important; padding: 0 !important; height: auto !important; }
.md-sidenav-right .account-info-summary .info-summary-bottom .title a { font-size: 26px !important; font-weight: 500 !important; font-family: var(--bs-font-display) !important; text-transform: none !important; }
.md-sidenav-right .account-menu-items > li > a { font-size: 15px !important; font-weight: 500 !important; text-transform: none !important; padding: 13px 14px !important; font-family: var(--bs-font-text) !important; }
.md-sidenav-right .account-menu-items { font-family: var(--bs-font-text); }
.md-sidenav-right .account-info-summary .info-summary-bottom a.md-raised { padding: 10px 20px !important; }

/* CHG-030: phone top bar on ONE row (pill left, Call + Sign In right) instead of wrapping to two rows */
@media (max-width: 767px) {
  .bs-topbar__inner { flex-wrap: nowrap; gap: 8px 10px; padding-left: 12px; padding-right: 12px; min-height: 40px; }
  .bs-topbar__lead { flex: 0 1 auto; min-width: 0; gap: 8px; }
  .bs-topbar__lead .bs-pill { font-size: 11px; letter-spacing: 0.04em; padding: 3px 8px; white-space: nowrap; }
  .bs-topbar__links { flex-wrap: nowrap; flex: 0 0 auto; gap: 12px; }
  .bs-topbar__links li, .bs-topbar__links a { white-space: nowrap; font-size: 13px; }
}
@media (max-width: 359px) {
  .bs-topbar__inner { padding-left: 8px; padding-right: 8px; gap: 8px; }
  .bs-topbar__lead .bs-pill { font-size: 10px; padding: 3px 6px; letter-spacing: 0.02em; }
  .bs-topbar__links { gap: 8px; }
  .bs-topbar__links li, .bs-topbar__links a { font-size: 12px; }
}

/* QA: phone header - the logo's tagline ran under the search / cart icons below ~430px (found at 320-414). The earlier phone sizes (max-width:767 block) lose against the #header-middle rules, so these carry the id as well. */
@media (max-width: 480px) {
  .page-header.header-style-22 #header-middle .bs-logo { margin-left: 35px; margin-right: 71px; justify-content: center; gap: 8px; }
  .page-header.header-style-22 #header-middle .bs-logo__mark { width: 30px; height: 33px; }
  .page-header.header-style-22 #header-middle .bs-logo__name { font-size: 21px; }
  .page-header.header-style-22 #header-middle .bs-logo__tag { font-size: 8.5px; letter-spacing: 0.18em; margin-top: 3px; }
}
@media (max-width: 400px) {
  .page-header.header-style-22 #header-middle .bs-logo { gap: 6px; }
  .page-header.header-style-22 #header-middle .bs-logo__mark { width: 26px; height: 29px; }
  .page-header.header-style-22 #header-middle .bs-logo__name { font-size: 19px; }
  .page-header.header-style-22 #header-middle .bs-logo__tag { font-size: 8px; letter-spacing: 0.12em; }
}
@media (max-width: 340px) {
  .page-header.header-style-22 #header-middle .bs-logo { gap: 5px; }
  .page-header.header-style-22 #header-middle .bs-logo__mark { width: 22px; height: 25px; }
  .page-header.header-style-22 #header-middle .bs-logo__name { font-size: 16px; }
  .page-header.header-style-22 #header-middle .bs-logo__tag { font-size: 7px; letter-spacing: 0.08em; margin-top: 2px; }
}

/* QA: phone search overlay (opened by the magnifier) - old parent look (category chooser, uppercase Heebo text, square box) -> same as the desktop search: no category chooser, Figtree, pill field */
@media (max-width: 767px) {
  .page-header.header-style-22 .header-search .block-search .cdz-cat-search { display: none !important; }
  .page-header.header-style-22 .header-search form.minisearch input#search { height: 40px; padding: 0 48px 0 18px !important; border: 1px solid #CFC7BA; border-radius: 999px; background: #FFFFFF; font-family: var(--bs-font-text); font-size: 15px; font-weight: 500; text-transform: none; letter-spacing: normal; color: var(--bs-ink); box-shadow: none; }
  .page-header.header-style-22 .header-search form.minisearch input#search::placeholder { text-transform: none; color: var(--bs-muted); opacity: 1; }
}
@media (max-width: 767px) {
  .page-header.header-style-22 .header-search .search-form { background: var(--bs-cream); border-bottom: 1px solid var(--bs-line); }
}
/* QA: top bar wrapped to two rows between 901 and ~1120px (note + 4 links do not fit one row) - the note is hidden from 1120px down; the pill and the links stay on one row */
@media (max-width: 1120px) {
  .page-header.header-style-22 .bs-topbar__note { display: none !important; }
}

/* QA: pinned (sticky) header, 768px and up - the parent collapses the search to a 35px icon and shows the field only on mouse HOVER (so it looked like an empty pill, and could not be used on a touch tablet). The field now stays visible and usable, like in the un-pinned header. */
@media (min-width: 768px) {
  .page-header.header-style-22 .sticky-menu.active #header-middle .header-search .block-search .control { visibility: visible !important; opacity: 1 !important; width: auto; }
  .page-header.header-style-22 .sticky-menu.active #header-middle .header-search input.input-text { opacity: 1 !important; visibility: visible !important; }
}

/* QA: the 11-item category bar needs ~1230px at full size and was cut off (MORE ITEMS / CLEARANCE) between 1121 and 1260px: slightly tighter items in that range keep it on one row down to 1121px */
@media (min-width: 768px) and (max-width: 1260px) {
  .page-header.header-style-22 #header-bottom .cdz-menu ul.groupmenu > li.level-top > a.menu-link { padding-left: 8px; padding-right: 8px; font-size: 14px; letter-spacing: 0.03em; }
}
/* CHG-035: tawk.to chat "attention grabber" - its picture comes from embed.tawk.to, which the site's img-src security policy (pub/.htaccess) blocks, so visitors saw a broken-image box with the text "Chat attention grabber" at the bottom right. The grabber is hidden; the round chat button and the "Hi! How can we help?" preview still work. */
#chat-bubble { display: none !important; }

/* >>> GENERATED phone mini cart (tools/gen-mobile-minicart.js) - do not edit by hand */
@media (max-width: 767px) {
  /* panel itself: a sheet under the header row instead of the theme's small dropdown */
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .cdz-dd-content { position: fixed; top: 88px; left: 12px; right: 12px; width: auto; max-width: none; margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; border-radius: 0; z-index: 60; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .cdz-dd-content .cdz-dd-content-inner { padding: 0; margin: 0; max-height: none; overflow: visible; height: auto; background: transparent; border: 0; box-shadow: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-items-wrapper { max-height: calc(100vh - 360px); min-height: 0; overflow-y: auto; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .minicart-wrapper { margin: 0; padding: 0; float: none; position: relative; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .cdz-dd-content .cdz-dd-content-inner { padding: 0; margin: 0; max-height: none; overflow: visible; height: auto; background: transparent; border: 0; box-shadow: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart {
    box-sizing: border-box; width: 100%; margin: 0; padding: 22px; background: #FFFFFF; border: 0; border-radius: 24px;
    box-shadow: 0 30px 70px rgba(18, 26, 36, 0.22); text-align: left; font-family: var(--bs-font-text); font-weight: 400; color: var(--bs-ink); line-height: normal; height: auto !important;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart #minicart-content-wrapper { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; height: auto; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title {
    display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 0; border: 0; background: transparent; text-transform: none; font-size: 16px; font-weight: 400; line-height: normal; min-height: 0;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title .bs-mini__title { font-size: 16px; font-weight: 400; color: var(--bs-ink); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title strong { font-weight: 700; font-size: inherit; text-transform: none; color: var(--bs-ink); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title strong.text { color: var(--bs-rust); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart {
    display: block; position: static; width: auto; height: auto; margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; font-size: 14px; font-weight: 700; line-height: normal; text-decoration: none; color: var(--bs-navy); text-indent: 0;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart::before,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart::after { display: none; content: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart span { position: static; width: auto; height: auto; clip: auto; overflow: visible; font: inherit; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-content { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; background: transparent; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-content > strong.subtitle:not(.empty) { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-content strong.subtitle.empty { display: block; margin: 0; padding: 0; font-size: 14px; font-weight: 400; color: var(--bs-muted); text-transform: none; text-align: left; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cdz-cart-validation-message:empty,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-widgets:empty,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions .primary > div:empty { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-items-wrapper { display: flex; flex-direction: column; max-height: 300px; overflow: auto; margin: 0; padding: 0; width: auto; height: auto !important; border: 0; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart ol.minicart-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart li.bs-mini__item { display: flex; gap: 12px; align-items: flex-start; margin: 0; padding: 12px 0; border: 0; border-top: 1px solid #ECE6DC; background: transparent; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb { position: relative; flex-shrink: 0; display: block; margin: 0; padding: 0; width: auto; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb .product-item-photo { display: block; position: static; margin: 0; padding: 0; width: 64px; height: 64px; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb .product-image-container { display: block; width: 64px !important; height: 64px !important; margin: 0; padding: 0; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb .product-image-wrapper { display: block; height: 64px !important; padding: 0 !important; margin: 0; position: static; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb img.product-image-photo { position: static; display: block; width: 64px !important; height: 64px !important; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 12px; object-fit: contain; background: var(--bs-cream); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete {
    position: absolute; top: -8px; left: -8px; right: auto; display: block; width: 24px; height: 24px; margin: 0; padding: 0; box-sizing: border-box; border: 0; border-radius: 999px;
    background: var(--bs-rust); color: #FFFFFF; font-size: 0; line-height: 0; text-align: center; cursor: pointer; overflow: hidden; text-indent: 0; box-shadow: none; opacity: 1;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete::before { content: "\2715"; display: block; position: static; width: auto; height: 24px; margin: 0; font-family: var(--bs-font-text); font-size: 12px; font-weight: 700; line-height: 24px; color: #FFFFFF; text-align: center; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete::after { display: none; content: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__body strong.product-item-name { display: block; margin: 0; font-size: 14px; font-weight: 700; line-height: 1.35; color: var(--bs-ink); text-transform: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__body strong.product-item-name a { color: var(--bs-ink); font-weight: 700; text-decoration: none; font-size: inherit; line-height: inherit; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__meta { display: block; font-size: 13px; font-weight: 400; line-height: normal; color: var(--bs-muted); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__meta a { color: var(--bs-navy); font-weight: 700; text-decoration: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__meta a:hover { color: var(--bs-rust); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__price { display: block; margin: 0; padding: 0; width: auto; float: none; font-size: 15px; font-weight: 700; line-height: normal; color: var(--bs-rust); white-space: nowrap; text-align: right; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__price .price-container,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__price .price-wrapper,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__price .price { display: inline; margin: 0; padding: 0; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; color: var(--bs-rust); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__qty { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; border: 0; background: transparent; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal {
    display: flex; justify-content: space-between; align-items: baseline; margin: 0; padding: 12px 0 0; border: 0; border-top: 1px solid #ECE6DC; background: transparent; text-align: left;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .label { display: block; float: none; margin: 0; padding: 0; font-size: 14px; font-weight: 700; letter-spacing: 0.08em; line-height: normal; text-transform: uppercase; color: var(--bs-muted); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .label::after { display: none; content: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount { display: block; float: none; margin: 0; padding: 0; text-align: right; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount .price-wrapper,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount .price { display: inline; margin: 0; padding: 0; font-family: var(--bs-font-display); font-size: 26px; font-weight: 600; line-height: normal; color: var(--bs-rust); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount .price-wrapper + .price-wrapper { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions { margin: 0; padding: 0; display: block; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions .primary { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; float: none; width: auto; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions .primary > button.action.close { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions a.action.button.secondary {
    display: block; box-sizing: content-box; margin: 0; padding: 13px; text-align: center; text-decoration: none; border: 1px solid #CFC7BA; border-radius: 999px; background: transparent; box-shadow: none;
    color: var(--bs-ink); font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; text-transform: none; width: auto; height: auto; min-height: 0;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions a.action.button.secondary span { font: inherit; color: inherit; text-transform: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .actions button#top-cart-btn-checkout {
    display: block; box-sizing: border-box; width: 100%; margin: 0; padding: 14px; text-align: center; border: 0; border-radius: 999px; background: var(--bs-rust); box-shadow: none; cursor: pointer;
    color: #FFFFFF; font-family: var(--bs-font-text); font-size: 15px; font-weight: 700; line-height: normal; text-transform: none; height: auto; min-height: 0;
  }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart a,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart span,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart strong,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart button,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart label { font-family: var(--bs-font-text); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount .price-wrapper,
    .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .cart-total .subtotal .amount .price { font-family: var(--bs-font-display); }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-widgets:not(:has(*)) { display: none; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart > span { display: inline; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .block-title a.action.viewcart { text-indent: 0; overflow: visible; width: auto !important; height: auto !important; line-height: normal; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-items-wrapper { padding: 10px 10px 0 10px; margin: 0 -10px; box-sizing: content-box; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart li.bs-mini__item:first-child { border-top: 0; padding-top: 6px; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete { z-index: 2; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .bs-mini__thumb a.action.delete::before { font-size: 12px; line-height: 24px; color: #FFFFFF !important; font-family: var(--bs-font-text) !important; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart .minicart-items-wrapper { padding-top: 8px; margin-top: -8px; }
  .page-header.header-style-22 #header-middle #mobi_cart-wrapper .block-minicart li.bs-mini__item:first-child { border-top: 1px solid #ECE6DC; padding-top: 12px; }
}
/* <<< END GENERATED phone mini cart */