@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
  --k-olive: #7C9039;
  --k-olive-dark: #5E7A2A;
  --k-olive-darker: #4A6020;
  --k-deep: #2E3320;
  --k-amber: #A6792E;
  --k-amber-light: #F3E7D6;
  --k-bg: #F2F5EC;
  --k-surface: #FFFFFF;
  --k-tint: #EDF1E2;
  --k-border: #E6EAD9;
  --k-muted: #8A9170;
  --k-text: #2E3320;
  --k-text-soft: #5A6348;
  --k-dark-img: #11140C;
  --k-radius: 14px;
  --k-radius-sm: 10px;
  --k-radius-pill: 24px;
  --k-shadow: 0 1px 3px rgba(46,51,32,0.06), 0 4px 16px rgba(46,51,32,0.04);
  --k-shadow-hover: 0 6px 24px rgba(46,51,32,0.10);
  --k-maxw: 1280px;
}

body {
  font-family: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--k-bg);
  color: var(--k-text);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, .h1, .h2, .h3 {
  font-family: 'Outfit', sans-serif;
  font-weight: 600;
  color: var(--k-deep);
  letter-spacing: -0.4px;
}

a { color: var(--k-olive-dark); }
a:hover { color: var(--k-olive); text-decoration: none; }

.container { max-width: var(--k-maxw); }
/* NOTE: .container-fluid intentionally excluded — it must stay full-width
   per Bootstrap conventions. Constraining it broke the checkout payment column. */

#wrapper { background: var(--k-bg); }

.k-ico { width: 17px; height: 17px; flex-shrink: 0; vertical-align: middle; }
.k-add-btn .k-ico { width: 16px; height: 16px; }
.k-trust-item .k-ico { width: 21px; height: 21px; color: var(--k-olive); }
.k-sticky-cart .k-ico { width: 18px; height: 18px; }

/* ---------- Buttons ---------- */
.btn-primary,
.btn.btn-primary {
  background: var(--k-olive);
  border-color: var(--k-olive);
  color: #fff;
  font-weight: 500;
  border-radius: var(--k-radius-sm);
  padding: 11px 22px;
  transition: background .15s ease, transform .1s ease;
}
.btn-primary:hover, .btn.btn-primary:hover {
  background: var(--k-deep);
  border-color: var(--k-deep);
  color: #fff;
}
.btn-primary:active { transform: scale(0.985); }

.btn-secondary {
  background: #fff;
  border: 1px solid var(--k-border);
  color: var(--k-deep);
  border-radius: var(--k-radius-sm);
  font-weight: 500;
}
.btn-secondary:hover { background: var(--k-tint); color: var(--k-deep); }

/* ---------- Green info bar (contact + lab-tested | sign-in + cart) ---------- */
.k-greenbar.header-nav {
  background: var(--k-olive);
  color: #fff;
  border: none;
  padding: 6px 0;
  margin: 0;
  min-height: 0;
}
.k-greenbar-row { display: flex; align-items: center; min-height: 24px; }
.k-greenbar-left { display: flex; align-items: center; gap: 20px; flex: 1 1 auto; }
.k-greenbar-right { display: flex; align-items: center; justify-content: flex-end; gap: 22px; flex: 0 0 auto; white-space: nowrap; }
.k-greenbar .k-tb-item { display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: 13px; }
.k-greenbar .k-tb-link { color: #fff !important; }
.k-greenbar .k-tb-link:hover { color: #fff !important; opacity: .85; }

/* cart + sign-in inside the green bar */
.k-greenbar #_desktop_cart,
.k-greenbar #_desktop_user_info,
.k-greenbar .blockcart,
.k-greenbar .user-info {
  background: transparent !important;
  margin: 0; padding: 0;
}
.k-greenbar a, .k-greenbar .blockcart a, .k-greenbar .user-info a {
  color: #fff !important;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.k-greenbar a:hover, .k-greenbar a:hover * { color: #fff !important; opacity: .9; }
.k-greenbar .blockcart, .k-greenbar .blockcart.active,
.k-greenbar .blockcart:hover { background: transparent !important; }
.k-greenbar .blockcart .cart-products-count {
  background: #fff !important;
  color: var(--k-olive-dark) !important;
  min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; font-size: 11px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 4px;
}
.k-greenbar .material-icons { font-size: 18px; vertical-align: middle; color: #fff; }
@media (max-width: 767px) {
  .k-tb-lab { display: none; }
  .k-greenbar { font-size: 12px; }
}

/* ---------- White header (logo + nav + search) ---------- */
.header-top, #header .header-top {
  background: var(--k-surface);
  border-bottom: 1px solid var(--k-border);
  box-shadow: none;
  padding: 14px 0;
}
#header { background: var(--k-surface); }

.k-logo {
  font-family: 'Outfit', sans-serif;
  font-size: 27px;
  font-weight: 600;
  letter-spacing: -1px;
  color: var(--k-olive-dark);
  text-decoration: none;
  line-height: 1;
  display: inline-block;
}
.k-logo:hover { color: var(--k-olive-dark); }
.k-logo .k-o { color: var(--k-amber); }

#_desktop_top_menu .top-menu a,
.header-top .menu a {
  color: var(--k-deep);
  font-weight: 400;
  font-size: 14.5px;
}
#_desktop_top_menu .top-menu a:hover,
#_desktop_top_menu .top-menu a:focus,
#_desktop_top_menu .top-menu .sub-menu a:hover,
#_desktop_top_menu .top-menu li:hover > a,
.header-top .menu a:hover,
.menu-dropdown a:hover {
  color: var(--k-olive) !important;
}
#_desktop_top_menu .top-menu a.dropdown-submenu:hover,
#_desktop_top_menu .top-menu .collapse a:hover {
  color: var(--k-olive) !important;
  background: var(--k-tint);
}
#header .header-top a:hover, #header .header-top a:focus,
.header-top a:hover {
  color: var(--k-olive) !important;
}
#header .blockcart:hover, #header .blockcart:hover * { color: #fff !important; }

/* general link hover safety net — kill Classic's default blue site-wide */
a:hover, a:focus { color: var(--k-olive); }
.header-top a:hover { color: var(--k-olive) !important; }

/* nuclear override for ps_mainmenu blue hover — target every rendered state */
#_desktop_top_menu a:hover,
#_desktop_top_menu a:focus,
#_desktop_top_menu a:active,
#_desktop_top_menu li:hover > a,
#_desktop_top_menu .top-menu > li > a:hover,
#_desktop_top_menu .top-menu .sub-menu a:hover,
#_desktop_top_menu .top-menu li.menu-item:hover > a,
.menu .top-menu a:hover,
.top-menu a:hover,
.top-menu a:focus,
.top-menu li:hover > a,
ul.top-menu li a:hover,
#header .top-menu a:hover {
  color: var(--k-olive) !important;
  text-decoration: none !important;
}

.header-nav i, .header-top i { color: var(--k-text-soft); }
.header-nav a:hover i, .header-top a:hover i,
.header .search-widget a:hover, .header i:hover { color: var(--k-olive); }

.cart-preview .header { color: var(--k-deep); }
.blockcart { position: relative; }
/* kill Classic's blue cart block background */
.blockcart,
.blockcart.active,
.header-top .blockcart,
#_desktop_cart .blockcart {
  background: transparent !important;
  border-radius: var(--k-radius-sm);
}
.blockcart a, .blockcart .header a { color: #fff !important; }
/* Desktop only — mobile cart should always stay transparent on the olive bar */
@media (min-width: 992px) {
  .blockcart:hover, .blockcart.active { background: var(--k-tint) !important; }
}
@media (max-width: 991px) {
  .k-mh-cart, .k-mh-cart:hover,
  .k-mh-cart .blockcart, .k-mh-cart .blockcart.active,
  #_mobile_cart, #_mobile_cart .blockcart, #_mobile_cart .blockcart.active {
    background: transparent !important;
    border-radius: 0 !important;
  }
}
.blockcart:hover a, .blockcart.active a { color: #fff !important; }
.blockcart .cart-products-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: var(--k-olive);
  color: #fff;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  vertical-align: top;
  margin-left: 4px;
}
.blockcart.cart-empty .cart-products-count { display: none; }

/* ---------- Product grid card ---------- */
.products, .featured-products .products { gap: 16px; }

/* Product grid: 4 per row by default (home, full-width listings) */
#products .products,
.featured-products .products,
.products.product_list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
#products .products .product-miniature,
.featured-products .products .product-miniature,
.products .js-product {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* When a left filter sidebar is present, drop to 3 per row so cards don't squeeze */
#content-wrapper.left-column #js-product-list .products,
#content-wrapper.left-column .products.product_list,
#content-wrapper.col-md-8 #js-product-list .products {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1199px) {
  #products .products, .featured-products .products, .products.product_list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 991px) {
  #products .products, .featured-products .products, .products.product_list,
  #content-wrapper.left-column #js-product-list .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 575px) {
  #products .products, .featured-products .products, .products.product_list,
  #content-wrapper.left-column #js-product-list .products {
    grid-template-columns: 1fr;
  }
}

.product-miniature {
  background: var(--k-surface);
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.product-miniature .thumbnail-container { display: flex; flex-direction: column; height: 100%; }
.product-miniature .product-description {
  padding: 12px 13px 14px;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
/* uniform product name height (2 lines) so prices/buttons align */
.product-miniature .product-title {
  min-height: 2.7em;
  margin-bottom: 4px;
}
.product-miniature .product-title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
}
/* push price + button to the bottom of every card */
.product-miniature .k-card-foot { margin-top: auto; }
/* make grid cells stretch so all cards in a row match the tallest */
#products .products, .featured-products .products, .products.product_list {
  align-items: stretch;
}
#products .products > *, .featured-products .products > *, .products .js-product {
  display: flex;
}
.product-miniature:hover {
  box-shadow: var(--k-shadow-hover);
  transform: translateY(-2px);
}
.product-miniature .thumbnail-container {
  background: var(--k-dark-img);
  border-radius: var(--k-radius) var(--k-radius) 0 0;
  margin: 0;
  box-shadow: none;
}
.product-miniature .thumbnail-top {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--k-dark-img);
}
.product-miniature .thumbnail-top .product-thumbnail { display: block; height: 100%; }
.product-miniature .thumbnail-top img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-miniature .product-description { padding: 12px 13px 14px; }
.product-miniature .product-title a {
  color: var(--k-deep);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.35;
}
.product-miniature .product-price-and-shipping .price {
  color: var(--k-deep);
  font-size: 16px;
  font-weight: 600;
}
.product-miniature .regular-price { color: var(--k-muted); font-size: 13px; }

.k-card-foot {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  margin-top: 10px;
}
.k-card-foot .k-add-form { width: 100%; margin: 0; }
.k-card-foot .product-price-and-shipping { display: flex; align-items: baseline; gap: 8px; }
.k-badge {
  position: absolute;
  top: 9px; right: 9px;
  background: var(--k-tint);
  color: var(--k-olive-darker);
  font-size: 10px;
  font-weight: 500;
  padding: 3px 9px;
  border-radius: var(--k-radius-pill);
  z-index: 2;
}
.k-badge.k-badge-amber { background: var(--k-amber-light); color: var(--k-amber); }

/* compact add button that collapses on mobile */
.k-add-btn {
  border: none;
  background: var(--k-olive);
  color: #fff;
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  padding: 11px 14px;
  border-radius: var(--k-radius-sm);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  text-align: center;
  transition: background .15s ease;
  white-space: nowrap;
}
.k-add-btn, .k-add-btn:link, .k-add-btn:visited,
.k-add-btn .k-add-label,
a.k-add-btn, a.k-add-btn .k-add-label,
.k-add-btn svg { color: #fff !important; fill: #fff !important; }
.k-add-btn:hover { background: var(--k-deep); color: #fff !important; }
.k-add-btn:hover .k-add-label, .k-add-btn:hover svg { color: #fff !important; fill: #fff !important; }
.k-add-btn .k-add-label { display: inline; }

/* ---------- Sticky add-to-cart bar (product page) ---------- */
.k-sticky-cart {
  position: fixed;
  left: 0; right: 0; bottom: -100px;
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(8px);
  border-top: 1px solid var(--k-border);
  box-shadow: 0 -4px 20px rgba(46,51,32,0.08);
  padding: 12px 0;
  z-index: 1040;
  transition: bottom .3s cubic-bezier(.2,.8,.2,1);
}
.k-sticky-cart.k-visible { bottom: 0; }
.k-sticky-cart .container {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.k-sticky-cart .k-sc-info { display: flex; align-items: center; gap: 14px; min-width: 0; }
.k-sticky-cart .k-sc-thumb {
  width: 44px; height: 44px; border-radius: 9px;
  background: var(--k-dark-img); flex-shrink: 0;
  object-fit: cover;
}
.k-sticky-cart .k-sc-name {
  font-weight: 500; font-size: 14px; color: var(--k-deep);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.k-sticky-cart .k-sc-price { color: var(--k-olive-dark); font-weight: 600; font-size: 16px; }
.k-sticky-cart .btn { white-space: nowrap; }
@media (max-width: 600px) {
  .k-sticky-cart .k-sc-name { max-width: 130px; }
}

/* ---------- Product page ---------- */
.product-prices .current-price .price,
.product-prices .current-price span,
.current-price .price, .product-price, .h1 + .product-prices .price {
  color: var(--k-deep) !important; font-weight: 600; font-size: 28px;
}
.product-prices, .product-prices * { color: var(--k-deep); }
.product-information a, .product-description a, .tab-content a,
.product-tabs a:not(.nav-link) { color: var(--k-olive-dark); }
.product-information a:hover, .product-description a:hover { color: var(--k-olive); }
.product-discount .regular-price { color: var(--k-muted); }
.discount.discount-percentage, .product-flag.discount {
  background: #FCEBEB; color: #A32D2D;
  border-radius: var(--k-radius-pill);
  font-weight: 500;
}

/* volume / quantity discount tiles */
.k-volume-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 9px;
  margin: 14px 0 18px;
}
.k-volume-tile {
  border: 1.5px solid var(--k-border);
  border-radius: var(--k-radius-sm);
  padding: 11px 10px;
  cursor: pointer;
  position: relative;
  text-align: left;
  background: #fff;
  transition: border-color .12s ease, background .12s ease;
}
.k-volume-tile:hover { border-color: var(--k-olive); }
.k-volume-tile.k-selected {
  border-color: var(--k-olive);
  background: var(--k-tint);
}
.k-volume-tile .k-vt-units { font-weight: 600; font-size: 14px; color: var(--k-deep); }
.k-volume-tile .k-vt-price { font-size: 12.5px; color: var(--k-text-soft); margin-top: 2px; }
.k-volume-tile .k-vt-save {
  position: absolute; top: -8px; right: 8px;
  background: var(--k-olive); color: #fff;
  font-size: 10px; font-weight: 500;
  padding: 2px 7px; border-radius: var(--k-radius-pill);
}

/* quantity stepper */
.k-qty {
  display: inline-flex; align-items: center;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-sm);
  overflow: hidden;
}
.k-qty button {
  border: none; background: #fff; width: 40px; height: 48px;
  font-size: 19px; color: var(--k-deep); cursor: pointer;
}
.k-qty button:hover { background: var(--k-tint); }
.k-qty input {
  width: 42px; height: 48px; text-align: center; border: none;
  font-weight: 600; font-size: 15px; color: var(--k-deep);
  background: #fff; -moz-appearance: textfield;
}
.k-qty input::-webkit-outer-spin-button,
.k-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* product tabs */
.product-tabs .nav-tabs { border-bottom: 1px solid var(--k-border); gap: 4px; }

/* tabs are relocated below the product-container by JS and get this class */
.k-tabs-fullwidth {
  width: 100%;
  margin-top: 36px;
  clear: both;
}
.tabs .nav-tabs .nav-link,
.product-tabs .nav-tabs .nav-link {
  border: none; color: var(--k-text-soft) !important; font-weight: 500;
  padding: 12px 18px; border-radius: 0;
  border-bottom: 2px solid transparent;
}
.tabs .nav-tabs .nav-link.active,
.tabs .nav-tabs .nav-link.js-product-nav-active,
.product-tabs .nav-tabs .nav-link.active,
.nav-tabs .nav-link.active {
  color: var(--k-olive-dark) !important;
  border-bottom-color: var(--k-olive) !important;
  background: transparent !important;
}
.tabs .nav-tabs .nav-link:hover { color: var(--k-olive) !important; }

/* reassurance row */
.k-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin: 20px 0;
}
.k-trust-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--k-text-soft);
}
.k-trust-item i { color: var(--k-olive); }

/* keep product page content aligned, not pushed right */
#main .product-container { margin-left: 0; }
.product-information { padding-left: 0; }

/* rounded product page images + thumbnails */
#main .product-cover,
#main .product-cover img,
#main .images-container .product-cover {
  border-radius: var(--k-radius) !important;
  overflow: hidden;
}
#main .product-cover img { display: block; width: 100%; }
#main .product-images .thumb-container .thumb,
#main .js-qv-product-images img,
#main .product-images img,
#main .thumb {
  border-radius: var(--k-radius-sm) !important;
  overflow: hidden;
}
#main .product-cover .layer { border-radius: var(--k-radius); }

/* ---------- Age gate ---------- */
.k-agegate-overlay {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(17,20,12,0.72);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.k-agegate {
  background: #fff; border-radius: var(--k-radius);
  max-width: 420px; width: 100%;
  padding: 36px 32px; text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.k-agegate .k-ag-logo {
  font-size: 26px; font-weight: 600; color: var(--k-olive-dark);
  letter-spacing: -1px; margin-bottom: 18px;
}
.k-agegate .k-ag-logo .k-o { color: var(--k-amber); }
.k-agegate h2 { font-size: 21px; margin-bottom: 10px; }
.k-agegate p { color: var(--k-text-soft); font-size: 14px; margin-bottom: 24px; line-height: 1.5; }
.k-agegate .k-ag-btns { display: flex; gap: 12px; }
.k-agegate .k-ag-btns button {
  flex: 1; padding: 13px; border-radius: var(--k-radius-sm);
  font-weight: 600; font-size: 14px; cursor: pointer; border: none;
  font-family: 'Outfit', sans-serif;
}
.k-ag-yes { background: var(--k-olive); color: #fff; }
.k-ag-yes:hover { background: var(--k-olive-dark); }
.k-ag-no { background: #F1EFE8; color: var(--k-text-soft); }
.k-ag-no:hover { background: #E4E2D8; }
body.k-agegate-open { overflow: hidden; }


/* ---------- Footer ---------- */
#footer { background: var(--k-bg); color: var(--k-text-soft); padding-top: 40px; border-top: 1px solid #DCE3CB; }
#footer .k-logo, #footer .k-foot-logo {
  color: var(--k-olive-dark); font-size: 24px; font-weight: 600; letter-spacing: -1px;
}
#footer .k-foot-logo .k-o { color: var(--k-amber); }
#footer h3, #footer .h3,
#footer .links .title,
#footer .block-title,
#footer .footer__title { color: var(--k-deep) !important; font-size: 14px; margin-bottom: 14px; font-weight: 600; }
#footer,
#footer a, #footer li a, #footer p, #footer span, #footer li, #footer .toggle, #footer .navbar-toggler,
.footer-container, .footer-container a, .footer-container li a, .footer-container p, .footer-container span {
  color: var(--k-text-soft) !important;
}
#footer a:hover, .footer-container a:hover { color: var(--k-olive) !important; }
#footer .k-logo, #footer .k-foot-logo, #footer h3, #footer .h3 { color: var(--k-deep) !important; }
#footer .links ul { list-style: none; padding: 0; }
#footer .links li { margin-bottom: 8px; }
/* Brand block above footer columns */
.k-foot-brand {
  text-align: center;
  padding: 28px 0 18px;
  border-bottom: 1px solid #DCE3CB;
  margin-bottom: 24px;
}
.k-foot-brand .k-foot-logo {
  font-family: 'Outfit', sans-serif;
  font-size: 28px; font-weight: 600; letter-spacing: -1px;
  color: var(--k-olive-dark) !important;
  text-decoration: none;
  display: inline-block;
}
.k-foot-brand .k-foot-logo .k-o { color: var(--k-amber); }
.k-foot-brand .k-foot-tagline {
  font-size: 13px; color: var(--k-text-soft); margin: 6px 0 0;
}

/* Unified footer strip — legal disclaimer + cards/copyright together */
.k-foot-strip {
  background: #E8EDDD;
  border-top: 1px solid #DCE3CB;
  padding: 28px 0 22px;
}
.k-foot-strip .k-legal-disclaimer {
  background: transparent;
  padding: 0 0 18px;
  border: none;
}
.k-foot-strip .k-legal-disclaimer p {
  max-width: 1000px; margin: 0 auto; text-align: center;
  font-size: 12px; line-height: 1.7; color: var(--k-text-soft);
}
.k-foot-strip .k-foot-bottom {
  border-top: 1px solid #DCE3CB;
  margin-top: 0;
  padding: 18px 0 0;
  font-size: 12px; color: var(--k-muted);
  text-align: center;
}
.k-foot-cards {
  display: flex; gap: 9px; justify-content: center; flex-wrap: wrap;
  margin-bottom: 14px;
}
.k-foot-cards svg { border-radius: 4px; }
.k-foot-copy { margin: 0; color: var(--k-muted); }

/* ---------- Compliance / blocked shipping notice ---------- */
.k-ship-blocked {
  background: #FCEBEB; border: 1px solid #F09595;
  border-radius: var(--k-radius-sm); padding: 14px 16px;
  color: #A32D2D; font-size: 13.5px; line-height: 1.5;
  display: flex; gap: 10px; align-items: flex-start;
}
.k-ship-blocked i { font-size: 18px; margin-top: 1px; }

/* ============================================================
   FINAL OVERRIDES (loaded last — highest priority)
   ============================================================ */
.k-add-btn.k-loading { opacity: .7; pointer-events: none; }

/* kill Classic blue everywhere in header on hover/focus/active */
#header a,
#header a:link,
.header-top a,
.header-nav a { color: var(--k-deep); }

#header .header-top a:hover, #header .header-top a:focus,
.header-top a:hover, .header-top a:focus {
  color: var(--k-olive) !important;
}
#header .header-top a:hover *, .header-top a:hover * { color: var(--k-olive) !important; }

/* cart block — force no blue background anywhere */
#header .blockcart, #header .blockcart.active,
.header-top .blockcart, .header-top .blockcart.active,
#_desktop_cart > .blockcart, #_desktop_cart .blockcart.active {
  background-color: transparent !important;
  background-image: none !important;
}
@media (min-width: 992px) {
  #header .blockcart.active, #header .blockcart:hover {
    background-color: var(--k-tint) !important;
  }
}
#header .blockcart * { color: #fff !important; }
#header .blockcart:hover *, #header .blockcart.active * { color: #fff !important; }
#header .blockcart .cart-products-count { color: var(--k-olive-dark) !important; background: #fff !important; }

/* product page thumbnail selected state — olive rounded instead of blue square */
#main .product-images .thumb.selected,
#main .product-images li.selected img,
#main .thumb-container .thumb.selected {
  border: 2px solid var(--k-olive) !important;
  border-radius: var(--k-radius-sm) !important;
}

/* ===== Green bar cart/sign-in cleanup — kill the cart box ===== */
.k-greenbar .blockcart,
.k-greenbar .blockcart.active,
.k-greenbar .blockcart:hover,
.k-greenbar #_desktop_cart,
.k-greenbar #_desktop_cart .blockcart {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.k-greenbar .header-top-right,
.k-greenbar .right-nav { padding: 0 !important; }
.k-greenbar-right { gap: 24px; }
.k-greenbar-right .blockcart a,
.k-greenbar-right .user-info a {
  padding: 0 !important;
  background: transparent !important;
  font-weight: 500;
}
.k-greenbar .cart-products,
.k-greenbar .header { background: transparent !important; }
/* vertically center everything in the green bar */
.k-greenbar-row { min-height: 24px; }
.k-greenbar-left, .k-greenbar-right { align-items: center; }

/* ===== Green bar: sign-in + cart rendered individually, side by side ===== */
.k-greenbar-right {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 24px !important;
  flex-wrap: nowrap !important;
}
.k-gb-signin, .k-gb-cart {
  display: inline-flex !important;
  align-items: center !important;
}
.k-gb-signin *, .k-gb-cart * {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
/* white text + icons, readable size */
.k-greenbar-right, .k-greenbar-right *,
.k-gb-signin a, .k-gb-cart a,
.k-greenbar-right .material-icons {
  color: #fff !important;
  font-size: 15px !important;
}
.k-greenbar-right .material-icons { font-size: 20px !important; margin-right: 6px; }
.k-gb-cart a, .k-gb-signin a { gap: 6px; }
/* count badge: white circle, olive number */
.k-greenbar-right .cart-products-count {
  background: #fff !important;
  color: var(--k-olive-dark) !important;
  font-size: 12px !important;
  min-width: 20px; height: 20px; border-radius: 10px;
  display: inline-flex !important; align-items: center; justify-content: center;
  padding: 0 6px; margin-left: 5px;
}
.k-greenbar-left, .k-greenbar-left * { font-size: 14px !important; }

/* ===== Sticky header on scroll ===== */
#header {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: var(--k-surface);
  transition: box-shadow .2s ease;
}
#header.k-stuck {
  box-shadow: 0 2px 12px rgba(46,51,32,0.10);
}
/* keep the age-gate and any modals above the sticky header */
.k-agegate-overlay { z-index: 2000; }

/* ===== Force cart + account icons white in green bar ===== */
.k-greenbar .material-icons,
.k-greenbar i.material-icons,
.k-gb-signin .material-icons,
.k-gb-cart .material-icons,
.k-greenbar-right i,
.k-greenbar-right svg,
.k-greenbar-right .material-icons {
  color: #fff !important;
  fill: #fff !important;
}
.k-gb-signin a *, .k-gb-cart a * { color: #fff !important; }
/* the cart count badge stays olive-on-white though */
.k-greenbar-right .cart-products-count,
.k-greenbar-right .cart-products-count * { color: var(--k-olive-dark) !important; }

/* ===== DEFINITIVE green-bar colors (last = wins) ===== */
/* everything in the green bar is white, including on hover/focus */
.k-greenbar a, .k-greenbar a *, .k-greenbar span, .k-greenbar i,
.k-greenbar .material-icons, .k-greenbar svg,
.k-greenbar-left a, .k-greenbar-left a *,
.k-greenbar-right a, .k-greenbar-right a *,
.k-gb-signin a, .k-gb-signin a *, .k-gb-cart a, .k-gb-cart a * {
  color: #fff !important;
  fill: #fff !important;
}
.k-greenbar a:hover, .k-greenbar a:hover *, .k-greenbar a:focus, .k-greenbar a:focus *,
.k-greenbar-left a:hover, .k-greenbar-left a:hover *,
.k-greenbar-right a:hover, .k-greenbar-right a:hover *,
.k-gb-signin a:hover, .k-gb-signin a:hover *,
.k-gb-cart a:hover, .k-gb-cart a:hover * {
  color: #fff !important;
  fill: #fff !important;
  opacity: .85;
}
/* count badge is the ONE exception: olive number on white circle */
.k-greenbar .cart-products-count,
.k-greenbar .cart-products-count *,
.k-greenbar-right .cart-products-count {
  color: var(--k-olive-dark) !important;
  background: #fff !important;
}

/* ============================================================
   HOMEPAGE
   ============================================================ */
.k-home { padding: 24px 0 0; }
.k-home .container { max-width: var(--k-maxw); }

/* Section heading */
.k-section { margin: 48px 0; }
.k-section-head { text-align: center; margin-bottom: 24px; }
.k-section-head h2 { font-size: 26px; font-weight: 600; color: var(--k-deep); margin: 0 0 6px; letter-spacing: -0.5px; }
.k-section-head p { font-size: 14px; color: var(--k-text-soft); margin: 0; }

/* 1. Hero slider — rounded corners + no arrows */
.k-hero { margin-bottom: 0; border-radius: var(--k-radius); overflow: hidden; }
.k-hero .homeslider-container,
.k-hero .rslides,
.k-hero .slide,
.k-hero .slide img,
.k-hero .rslides_container {
  border-radius: var(--k-radius) !important;
  overflow: hidden;
}
.k-hero .slide img { display: block; width: 100%; height: auto; border-radius: var(--k-radius) !important; }
.k-hero .rslides_nav,
.k-hero a.rslides_nav,
.k-hero .rslides_nav.prev,
.k-hero .rslides_nav.next,
.k-hero .prev, .k-hero .next,
.k-hero a.prev, .k-hero a.next,
.homeslider-container .rslides_nav,
.homeslider-container .prev,
.homeslider-container .next,
.homeslider-container a.prev,
.homeslider-container a.next,
#homepage-slider .rslides_nav,
.rslides_nav { display: none !important; visibility: hidden !important; opacity: 0 !important; }
.k-hero .rslides_tabs { bottom: 14px; }
.k-hero .rslides_tabs a, .k-hero .rslides_tabs li a { background: rgba(255,255,255,0.5); border: none; }
.k-hero .rslides_tabs .rslides_here a, .k-hero .rslides_tabs li.rslides_here a { background: #fff; }
.k-hero .caption { background: rgba(0,0,0,0.35); color: #fff; border-radius: var(--k-radius-sm); }

/* 2. Trust strip */
.k-trust-strip {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  margin: -1px 0 8px;
  padding: 22px 24px;
  background: #E8EDDD;
  border: 1px solid #DCE3CB;
  border-radius: var(--k-radius);
}
.k-trust-strip .k-trust-item {
  display: flex; align-items: center; gap: 12px;
  font-size: 13px; color: var(--k-text-soft);
}
.k-trust-strip .k-trust-item strong {
  display: block; color: var(--k-deep); font-weight: 600; font-size: 14px;
}
.k-trust-strip .k-trust-item span {
  display: block; font-size: 12px; color: var(--k-text-soft);
}
@media (max-width: 767px) {
  .k-trust-strip { grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 14px; }
}

/* 3. Shop by form */
.k-form-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.k-form-tile {
  position: relative; aspect-ratio: 16/10;
  border-radius: var(--k-radius); overflow: hidden;
  background: var(--k-dark-img);
  display: flex; align-items: flex-end;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.k-form-tile:hover { transform: translateY(-3px); box-shadow: var(--k-shadow-hover); }
.k-form-tile .k-form-tile-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
}
.k-form-tile .k-form-tile-shade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.7) 100%);
  z-index: 2;
}
.k-form-tile .k-form-tile-label {
  position: relative; z-index: 3;
  color: #fff !important; font-size: 18px; font-weight: 600;
  padding: 16px 20px; width: 100%;
}
@media (max-width: 767px) {
  .k-form-grid { grid-template-columns: 1fr; }
}

/* 5. Shop by color */
.k-vein-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
}
.k-vein-tile {
  display: flex; flex-direction: column; align-items: center;
  padding: 22px 14px; border-radius: var(--k-radius);
  text-decoration: none;
  border: 1.5px solid transparent;
  transition: transform .2s ease, border-color .2s ease;
  text-align: center;
}
.k-vein-tile:hover { transform: translateY(-3px); }
.k-vein-dot {
  width: 28px; height: 28px; border-radius: 50%;
  margin-bottom: 10px;
}
.k-vein-name { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.k-vein-desc { font-size: 12px; opacity: 0.85; }

.k-vein-red    { background: #FCEBEB; }
.k-vein-red    .k-vein-dot { background: #C0392B; }
.k-vein-red    .k-vein-name, .k-vein-red .k-vein-desc { color: #791F1F; }
.k-vein-red:hover { border-color: #C0392B; }

.k-vein-green  { background: #EAF3DE; }
.k-vein-green  .k-vein-dot { background: #5E7A2A; }
.k-vein-green  .k-vein-name, .k-vein-green .k-vein-desc { color: #27500A; }
.k-vein-green:hover { border-color: #5E7A2A; }

.k-vein-white  { background: #F4F4F0; }
.k-vein-white  .k-vein-dot { background: #fff; border: 2px solid #D3D1C7; box-sizing: content-box; width: 24px; height: 24px; }
.k-vein-white  .k-vein-name, .k-vein-white .k-vein-desc { color: #444441; }
.k-vein-white:hover { border-color: #888780; }

.k-vein-yellow { background: #FAEEDA; }
.k-vein-yellow .k-vein-dot { background: #D4A22F; }
.k-vein-yellow .k-vein-name, .k-vein-yellow .k-vein-desc { color: #633806; }
.k-vein-yellow:hover { border-color: #D4A22F; }

@media (max-width: 767px) {
  .k-vein-grid { grid-template-columns: repeat(2, 1fr); }
}

/* 6. Why Kratoma */
.k-why { background: var(--k-tint); border-radius: var(--k-radius); padding: 36px; margin-top: 48px; }
.k-why-inner {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 36px; align-items: center;
}
.k-why-text h2 { font-size: 26px; font-weight: 600; color: var(--k-deep); margin: 0 0 12px; letter-spacing: -0.5px; }
.k-why-text p { font-size: 14.5px; color: var(--k-text-soft); line-height: 1.65; margin: 0 0 16px; }
.k-why-list { list-style: none; padding: 0; margin: 0 0 22px; }
.k-why-list li {
  font-size: 14px; color: var(--k-deep);
  padding: 6px 0; display: flex; align-items: center; gap: 8px;
}
.k-why-list .k-check {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--k-olive); color: #fff !important;
  font-size: 12px; font-weight: 600; flex-shrink: 0;
}
.k-why-btn { padding: 12px 24px; font-weight: 600; }

.k-why-stats {
  display: grid; grid-template-columns: 1fr; gap: 12px;
}
.k-stat {
  background: #fff; border: 1px solid var(--k-border);
  border-radius: var(--k-radius); padding: 18px 22px;
  text-align: center;
}
.k-stat-num { font-size: 32px; font-weight: 700; color: var(--k-olive-dark); line-height: 1; letter-spacing: -1px; }
.k-stat-lbl { font-size: 13px; color: var(--k-text-soft); margin-top: 6px; }

@media (max-width: 767px) {
  .k-why { padding: 22px; }
  .k-why-inner { grid-template-columns: 1fr; gap: 22px; }
}

/* ============================================================
   CHECKOUT — Personal Information cleanup
   Social title: handled in Back Office.
   Format helper text: removed at source via templates/_partials/form-fields.tpl override.
   ============================================================ */

/* ============================================================
   CHECKOUT — modern, rounded, on-brand styling
   ============================================================ */

/* --- Header (focused checkout header) --- */
.k-checkout-topbar {
  background: var(--k-olive);
  color: #fff;
  padding: 8px 0;
  min-height: 0;
  border: none;
  margin: 0;
}
.k-checkout-topbar-row {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 13px;
}
.k-checkout-topbar .k-checkout-back,
.k-checkout-topbar .k-checkout-help {
  color: #fff !important;
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: none;
}
.k-checkout-topbar .k-checkout-back:hover { color: #fff !important; opacity: .85; }

.k-checkout-logo-bar {
  background: var(--k-surface);
  padding: 26px 0 22px;
  border-bottom: 1px solid var(--k-border);
}
.k-checkout-logo {
  font-family: 'Outfit', sans-serif;
  font-size: 36px; font-weight: 600; letter-spacing: -1.2px;
  color: var(--k-olive-dark) !important;
  text-decoration: none;
  display: inline-block;
}
.k-checkout-logo .k-o { color: var(--k-amber); }
.k-checkout-logo:hover { color: var(--k-olive-dark) !important; }
.k-checkout-tagline {
  font-size: 12px; color: var(--k-text-soft);
  margin: 8px 0 0;
  letter-spacing: 0.4px;
}

/* --- Body background to match site --- */
body#checkout, body.checkout { background: var(--k-bg); }

/* --- Step boxes (Personal Info / Addresses / Shipping / Payment) --- */
body#checkout section.checkout-step,
body.checkout section.checkout-step {
  background: var(--k-surface) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  margin-bottom: 16px !important;
  box-shadow: none !important;
  overflow: hidden;
}
body#checkout section.checkout-step .step-title,
body.checkout section.checkout-step .step-title {
  padding: 18px 22px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--k-deep) !important;
  letter-spacing: 0.3px;
  text-transform: none !important;
  background: transparent !important;
  border-bottom: 1px solid var(--k-border);
}
body#checkout section.checkout-step .content,
body.checkout section.checkout-step .content {
  padding: 24px !important;
}
/* Hide the bottom border between header and content for unchecked steps */
body#checkout section.checkout-step.-unreachable .step-title,
body#checkout section.checkout-step.-current .step-title {
  border-bottom-color: var(--k-border);
}

/* Step number badges */
body#checkout .step-number,
body.checkout .step-number {
  background: var(--k-olive) !important;
  color: #fff !important;
  width: 28px; height: 28px;
  border-radius: 50%;
  font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  margin-right: 10px;
}
body#checkout section.checkout-step.-unreachable .step-number {
  background: #C5C9B8 !important;
}

/* Form inputs - rounded + theme styling */
body#checkout .form-control,
body.checkout .form-control,
body#checkout input[type=text],
body#checkout input[type=email],
body#checkout input[type=password],
body#checkout input[type=tel],
body#checkout select,
body#checkout textarea {
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  background: #fff !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
body#checkout .form-control:focus,
body.checkout .form-control:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
}

/* Form labels */
body#checkout .form-control-label,
body.checkout .form-control-label {
  color: var(--k-deep) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

/* Continue/Save buttons */
body#checkout .btn-primary,
body.checkout .btn-primary,
body#checkout button.continue,
body.checkout button.continue {
  background: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
  padding: 12px 28px !important;
  border-radius: var(--k-radius-sm) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  transition: background .15s ease;
}
body#checkout .btn-primary:hover,
body.checkout .btn-primary:hover {
  background: var(--k-deep) !important;
}

/* Cart summary sidebar (right side during checkout) */
body#checkout .cart-summary,
body.checkout .cart-summary,
body#checkout #js-checkout-summary,
body.checkout #js-checkout-summary {
  background: var(--k-surface) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  padding: 22px !important;
  box-shadow: none !important;
}
body#checkout .cart-summary .h6,
body#checkout .cart-summary .card-title {
  color: var(--k-deep) !important;
  font-weight: 600;
}
body#checkout .cart-summary-line { padding: 8px 0 !important; font-size: 14px; }
body#checkout .cart-summary-line .value { color: var(--k-deep) !important; font-weight: 500; }
body#checkout .cart-total .value,
body#checkout .cart-summary-totals .value { color: var(--k-olive-dark) !important; font-weight: 700; }

/* Carrier options (Shipping step) */
body#checkout .delivery-options .delivery-option {
  background: var(--k-tint) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 14px 18px !important;
  margin-bottom: 10px !important;
  transition: border-color .15s ease, background .15s ease;
}
body#checkout .delivery-options .delivery-option:hover {
  border-color: var(--k-olive) !important;
}
body#checkout .delivery-options .delivery-option:has(input:checked) {
  background: rgba(124, 144, 57, 0.08) !important;
  border-color: var(--k-olive) !important;
}

/* Payment options */
body#checkout .payment-options .payment-option {
  background: var(--k-tint) !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 14px 18px !important;
  margin-bottom: 10px !important;
}
body#checkout .payment-options .payment-option:hover { border-color: var(--k-olive) !important; }

/* Place order button - extra emphasis */
body#checkout #payment-confirmation .btn-primary {
  font-size: 16px !important;
  padding: 14px 36px !important;
  border-radius: var(--k-radius-sm) !important;
  width: 100%;
}

/* Custom radio / checkbox to match theme olive */
body#checkout .custom-radio input[type="radio"]:checked + span,
body#checkout .custom-checkbox input[type="checkbox"]:checked + span {
  background: var(--k-olive) !important;
  border-color: var(--k-olive) !important;
}

/* Terms of service section */
body#checkout #conditions-to-approve {
  background: var(--k-tint);
  border-radius: var(--k-radius-sm);
  padding: 16px 18px;
  margin-top: 18px;
}
body#checkout #conditions-to-approve ul { margin: 0; padding: 0; list-style: none; }
body#checkout #conditions-to-approve li { padding: 4px 0; font-size: 14px; }

/* "Sign in" / "Create an account" toggle styling */
body#checkout .nav-inline {
  border-bottom: 1px solid var(--k-border);
  padding-bottom: 14px;
  margin-bottom: 22px;
}
body#checkout .nav-inline .nav-link {
  color: var(--k-text-soft) !important;
  font-weight: 500;
  padding: 0 16px 0 0;
}
body#checkout .nav-inline .nav-link.active {
  color: var(--k-olive-dark) !important;
  font-weight: 600;
}

/* Checkout footer styling */
.k-checkout-foot {
  margin-top: 32px;
}

/* Hide PrestaShop "Ecommerce software by PrestaShop" credit (replaced by Kratoma copyright) */
#footer .text-sm-center:not(.k-foot-bottom):not(.js-terms) {
  display: none;
}

/* ===== Address selector cards - olive instead of default blue ===== */
body#checkout .address-item,
body#checkout .address-selector .address,
body#checkout .address {
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  background: #fff !important;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
body#checkout .address-item:hover,
body#checkout .address-selector .address:hover {
  border-color: var(--k-olive) !important;
}
/* Selected address — olive border instead of blue */
body#checkout .address-item.selected,
body#checkout .address-selector .address.selected,
body#checkout .address-item:has(input[type="radio"]:checked),
body#checkout .address-selector .address:has(input[type="radio"]:checked) {
  border-color: var(--k-olive) !important;
  background: rgba(124, 144, 57, 0.06) !important;
  box-shadow: 0 0 0 1px var(--k-olive);
}
/* The radio dot itself */
body#checkout .address-selector .custom-radio input[type="radio"]:checked + span,
body#checkout .address .custom-radio input[type="radio"]:checked + span {
  background: var(--k-olive) !important;
  border-color: var(--k-olive) !important;
}

/* ===== Kill the white inner box inside address cards ===== */
body#checkout .address-item .address,
body#checkout .address-selector .address-item .address,
body#checkout .address-item .alias,
body#checkout .address-item .address-alias,
body#checkout .address-item article,
body#checkout .address-item .address-body,
body#checkout .address-selector article {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Also when the address-item IS the .address element itself, ensure no inner whites */
body#checkout .address-item > *,
body#checkout .address-selector > .address > * {
  background: transparent !important;
}
/* Keep our outer card styling intact (re-assert) */
body#checkout .address-item {
  padding: 18px !important;
}
body#checkout .address-item.selected,
body#checkout .address-item:has(input[type="radio"]:checked) {
  background: rgba(124, 144, 57, 0.06) !important;
}

/* ============================================================
   CUSTOMER ACCOUNT — rounded, on-brand styling
   Applies to: Your account hub, Information, Addresses, Order history,
   Credit slips, Wishlist, GDPR, Login, Registration, Password recovery
   ============================================================ */

/* Page title styling */
body.customer-account .page-header,
body.my-account .page-header,
body.identity .page-header,
body.history .page-header,
body.order-detail .page-header,
body.address .page-header,
body.addresses .page-header,
body.password .page-header,
body.registration .page-header {
  margin-bottom: 24px;
  padding-bottom: 0;
  border-bottom: none;
}
body.customer-account h1.page-title,
body.my-account h1.page-title,
body.identity h1.page-title,
body.history h1.page-title,
body.order-detail h1.page-title,
body.address h1.page-title,
body.addresses h1.page-title {
  font-size: 28px !important;
  font-weight: 600 !important;
  color: var(--k-deep) !important;
  letter-spacing: -0.5px;
  text-transform: none !important;
}

/* --- "Your account" hub: the 6 link cards --- */
body.my-account .links {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
body.my-account .links .col-lg-4 {
  max-width: 100% !important;
  flex: none !important;
  padding: 0 !important;
}
body.my-account .links a {
  background: #fff !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  padding: 28px 22px !important;
  box-shadow: none !important;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
body.my-account .links a:hover {
  transform: translateY(-2px);
  border-color: var(--k-olive) !important;
  box-shadow: var(--k-shadow-hover) !important;
}
/* Icon styling */
body.my-account .links a i,
body.my-account .links a .material-icons {
  color: var(--k-olive) !important;
  font-size: 40px !important;
  margin-bottom: 12px;
  background: var(--k-tint);
  width: 64px; height: 64px;
  border-radius: 50%;
  display: inline-flex !important;
  align-items: center; justify-content: center;
}
/* Label styling — sentence case, theme color */
body.my-account .links a .link-item,
body.my-account .links a span {
  text-transform: none !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--k-deep) !important;
  letter-spacing: 0;
  margin-top: 4px;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}

/* Sign out link at bottom */
body.my-account .logout {
  display: inline-block;
  margin-top: 24px;
  padding: 10px 28px;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius-sm);
  background: #fff;
  color: var(--k-deep) !important;
  font-weight: 500;
  text-decoration: none;
  transition: border-color .15s ease, background .15s ease;
}
body.my-account .logout:hover {
  border-color: var(--k-olive);
  background: var(--k-tint);
}

/* --- Account sub-pages: forms, address blocks, history tables --- */

/* Form panels (identity, password change, address forms) */
body.identity #content,
body.password #content,
body.address #content,
body.registration #content {
  background: #fff;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding: 28px;
}

/* Form inputs to match checkout */
body.customer-account .form-control,
body.my-account .form-control,
body.identity .form-control,
body.password .form-control,
body.address .form-control,
body.addresses .form-control,
body.registration .form-control {
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 10px 14px !important;
  background: #fff !important;
}
body.customer-account .form-control:focus,
body.my-account .form-control:focus,
body.identity .form-control:focus,
body.password .form-control:focus,
body.address .form-control:focus,
body.registration .form-control:focus,
body.authentication .form-control:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
}

/* Login/registration: also style other input types (date, password show/hide buttons, etc.) */
body.registration input:focus,
body.registration select:focus,
body.registration textarea:focus,
body.authentication input:focus,
body.authentication select:focus,
body.authentication textarea:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
}

/* Fallback: target by form action URL — works regardless of body class.
   This catches login + registration even if PrestaShop uses different body classes
   than the ones above. Specificity boosted with multiple selector levels. */
form[action*="login"] input:focus,
form[action*="login"] select:focus,
form[action*="login"] textarea:focus,
form[action*="authentication"] input:focus,
form[action*="authentication"] select:focus,
form[action*="authentication"] textarea:focus,
form[action*="registration"] input:focus,
form[action*="registration"] select:focus,
form[action*="registration"] textarea:focus,
form#login-form input:focus,
form#login-form select:focus,
form#customer-form input:focus,
form#customer-form select:focus,
form#customer-form textarea:focus,
form.js-customer-form input:focus,
form.js-customer-form select:focus,
form.js-customer-form textarea:focus,
section#content .form-control:focus,
#main .form-control:focus,
section.login-form .form-control:focus,
section.register-form .form-control:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
  -webkit-box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
}

/* Nuclear option: kill Bootstrap's default blue focus ring globally on form inputs.
   This is safe because we explicitly set our own focus colors above for known pages,
   and other pages get a sensible neutral fallback. */
.form-control:focus,
input.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="url"]:focus,
select.form-control:focus,
textarea.form-control:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
  -webkit-box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
}

/* Buttons in account sections */
body.customer-account .btn-primary,
body.my-account .btn-primary,
body.identity .btn-primary,
body.password .btn-primary,
body.address .btn-primary,
body.addresses .btn-primary,
body.registration .btn-primary,
body.authentication .btn-primary {
  background: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
  padding: 11px 26px !important;
  border-radius: var(--k-radius-sm) !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
body.customer-account .btn-primary:hover,
body.my-account .btn-primary:hover,
body.identity .btn-primary:hover {
  background: var(--k-deep) !important;
}

/* --- Addresses page: saved address cards --- */
body.addresses .addresses-footer,
body.addresses .address {
  margin-bottom: 16px;
}
body.addresses article.address {
  background: #fff;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  padding: 22px !important;
  box-shadow: none !important;
}
body.addresses article.address h4,
body.addresses article.address .h4 {
  color: var(--k-deep) !important;
  font-weight: 600;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--k-border);
}
body.addresses .address-body { padding: 0 !important; }
body.addresses .address-footer {
  background: transparent !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid var(--k-border);
  margin-top: 12px;
}
body.addresses .address-footer a { color: var(--k-text-soft) !important; }
body.addresses .address-footer a:hover { color: var(--k-olive) !important; }

/* "Add new address" button */
body.addresses .addresses-footer a {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--k-olive) !important;
  font-weight: 600;
  text-decoration: none;
}
body.addresses .addresses-footer a:hover { color: var(--k-deep) !important; }

/* --- Order history table --- */
body.history #content,
body.order-detail #content {
  background: #fff;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding: 24px;
}
body.history table.table,
body.order-detail table.table {
  border-radius: var(--k-radius-sm);
  overflow: hidden;
  border: 1px solid var(--k-border);
}
body.history .table thead th,
body.order-detail .table thead th {
  background: var(--k-tint) !important;
  border-bottom: 1px solid var(--k-border);
  color: var(--k-deep);
  font-weight: 600;
  text-transform: none;
  padding: 12px 14px;
}
body.history .table td,
body.order-detail .table td { padding: 12px 14px; }

/* Status badge (Awaiting, Delivered, etc.) */
body.history .label,
body.order-detail .label {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
}

/* --- Wishlist --- */
body.wishlist .wishlist-list,
body#module-blockwishlist-lists .wishlist-list {
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  background: #fff;
  padding: 20px;
}

/* --- Login + Registration pages --- */
body.authentication #content,
body.registration #content {
  max-width: 540px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding: 32px;
}
body.authentication h1.page-title,
body.registration h1.page-title { text-align: center; }
body.authentication .forgot-password { text-align: center; margin-top: 12px; }
body.authentication .forgot-password a { color: var(--k-olive) !important; font-weight: 500; }
body.authentication .no-account a { color: var(--k-olive-dark) !important; font-weight: 600; }

/* Account sidebar (left nav on some sub-pages) */
body.customer-account .links-aside,
body.my-account .links-aside,
body.identity .links-aside,
body.history .links-aside,
body.order-detail .links-aside,
body.address .links-aside,
body.addresses .links-aside {
  background: #fff;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding: 16px;
}
body.customer-account .links-aside li,
body.my-account .links-aside li,
body.identity .links-aside li {
  list-style: none;
  margin: 4px 0;
}
body.customer-account .links-aside li a,
body.my-account .links-aside li a {
  display: block;
  padding: 8px 12px;
  border-radius: var(--k-radius-sm);
  color: var(--k-deep) !important;
  text-decoration: none;
  font-size: 14px;
}
body.customer-account .links-aside li a:hover {
  background: var(--k-tint);
  color: var(--k-olive-dark) !important;
}
body.customer-account .links-aside li a.active,
body.customer-account .links-aside li.active a {
  background: var(--k-olive);
  color: #fff !important;
}

/* Responsive: stack cards on mobile */
@media (max-width: 767px) {
  body.my-account .links { grid-template-columns: 1fr; }
  body.identity #content,
  body.password #content,
  body.address #content,
  body.registration #content,
  body.authentication #content { padding: 20px; }
}

/* ============================================================
   QUICK VIEW — replace PrestaShop blues with theme olive
   ============================================================ */

.product-miniature .quick-view,
.product-miniature a.quick-view,
.product-miniature .js-quick-view {
  background: transparent !important;
  color: #000 !important;
  border: none !important;
  padding: 6px 10px !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}
.product-miniature .quick-view:hover,
.product-miniature a.quick-view:hover,
.product-miniature .js-quick-view:hover {
  background: transparent !important;
  color: #000 !important;
  text-decoration: underline !important;
}
.product-miniature .quick-view i,
.product-miniature .quick-view .material-icons {
  color: #000 !important;
  font-size: 14px !important;
  vertical-align: middle;
  margin-right: 2px;
}

/* --- Quick view modal --- */
.modal-content,
#blockcart-modal .modal-content,
.quickview .modal-content {
  border-radius: var(--k-radius) !important;
  border: 1px solid var(--k-border) !important;
}

/* Selected thumbnail border in quick view (and product page gallery) */
.quickview .product-images li.thumb-container .thumb.selected,
.quickview .product-images img.selected,
.quickview .images-container .thumb.selected,
#product .product-images li.thumb-container .thumb.selected,
#product .images-container .thumb.selected,
.product-images .thumb-container .thumb:hover,
.product-images .thumb.selected,
.product-images img.selected {
  border: 2px solid var(--k-olive) !important;
  outline: none !important;
  box-shadow: 0 0 0 1px var(--k-olive) !important;
}
.quickview .product-images li.thumb-container .thumb,
.quickview .images-container .thumb,
#product .product-images li.thumb-container .thumb,
.product-images .thumb-container .thumb,
.product-images .thumb {
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  transition: border-color .15s ease !important;
}

/* Quick view product layout cleanup */
.quickview .product-actions .add-to-cart,
.quickview .product-add-to-cart .btn-primary {
  background: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
  border-radius: var(--k-radius-sm) !important;
  font-weight: 600;
  text-transform: uppercase;
}
.quickview .product-actions .add-to-cart:hover {
  background: var(--k-deep) !important;
}
.quickview .product-prices .current-price .price,
.quickview .current-price .price { color: var(--k-olive-dark) !important; }
.quickview .product-variants .input-color:checked + span,
.quickview .product-variants input:checked + .color {
  outline: 2px solid var(--k-olive) !important;
  outline-offset: 2px;
}

/* Modal close (X) */
.modal .close, .modal-header .close {
  color: var(--k-deep) !important;
  opacity: 0.6;
}
.modal .close:hover { opacity: 1; color: var(--k-olive) !important; }

/* "Item added to cart" modal — the one that pops up after Add to cart */
#blockcart-modal .modal-title,
#blockcart-modal .h6 { color: var(--k-deep) !important; }
#blockcart-modal .cart-content a.btn-primary {
  background: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
}
#blockcart-modal .cart-content a.btn-secondary {
  background: #fff !important;
  border: 1px solid var(--k-border) !important;
  color: var(--k-deep) !important;
}
#blockcart-modal .cart-content a.btn-secondary:hover {
  border-color: var(--k-olive) !important;
  color: var(--k-olive-dark) !important;
}

/* ============================================================
   CONTACT page — restyle the file upload "Choose file" button
   + footer "Contact us" link styling
   ============================================================ */

/* Footer Contact us link */
.k-footer-contact-link {
  display: inline-block;
  margin-top: 6px;
  color: var(--k-olive-dark) !important;
  font-weight: 500;
  text-decoration: none;
}
.k-footer-contact-link:hover {
  color: var(--k-olive) !important;
  text-decoration: underline;
}

/* Contact form file input — kill the browser blue button */
body#contact .form-control-file,
body#contact input[type="file"],
body.contact input[type="file"],
body#contact .input-file {
  background: var(--k-tint) !important;
  border: 1px dashed var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 14px 16px !important;
  color: var(--k-deep) !important;
  font-size: 14px;
  cursor: pointer;
  width: 100%;
}
/* The actual "Choose file" button inside the input (webkit / firefox) */
body#contact input[type="file"]::-webkit-file-upload-button,
body.contact input[type="file"]::-webkit-file-upload-button {
  background: var(--k-olive) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 8px 18px !important;
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  cursor: pointer;
  margin-right: 12px;
  transition: background .15s ease;
}
body#contact input[type="file"]::-webkit-file-upload-button:hover {
  background: var(--k-deep) !important;
}
/* Firefox */
body#contact input[type="file"]::file-selector-button,
body.contact input[type="file"]::file-selector-button {
  background: var(--k-olive) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--k-radius-sm) !important;
  padding: 8px 18px !important;
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  cursor: pointer;
  margin-right: 12px;
}
body#contact input[type="file"]::file-selector-button:hover {
  background: var(--k-deep) !important;
}

/* The whole contact form panel */
body#contact #content-wrapper #content,
body.contact #content-wrapper #content {
  background: #fff;
  border: 1px solid var(--k-border);
  border-radius: var(--k-radius);
  padding: 32px;
}
body#contact .form-control,
body.contact .form-control {
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius-sm) !important;
  background: #fff !important;
}
body#contact .form-control:focus,
body.contact .form-control:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
}
body#contact .btn-primary,
body.contact .btn-primary {
  background: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
  border-radius: var(--k-radius-sm) !important;
  text-transform: uppercase;
  font-weight: 600;
  padding: 11px 26px;
}
body#contact .btn-primary:hover,
body.contact .btn-primary:hover { background: var(--k-deep) !important; }

/* ===== Contact form: kill the blue CHOOSE FILE button ===== */
/* The button is a real <button> inside an input-group, not a file input pseudo */
body#contact .input-group .btn,
body#contact .input-group-btn .btn,
body#contact .input-group button,
body.contact .input-group .btn,
body.contact .input-group-btn .btn,
body.contact .input-group button,
body#contact button[class*="file"],
body#contact .file-upload-wrapper .btn {
  background: var(--k-olive) !important;
  background-color: var(--k-olive) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 0 var(--k-radius-sm) var(--k-radius-sm) 0 !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  box-shadow: none !important;
}
body#contact .input-group .btn:hover,
body#contact .input-group-btn .btn:hover,
body.contact .input-group .btn:hover,
body.contact .input-group-btn .btn:hover {
  background: var(--k-deep) !important;
  background-color: var(--k-deep) !important;
  color: #fff !important;
}

/* The hidden file input visual (the input field beside the button) */
body#contact .input-group input[type="text"],
body#contact .input-group .form-control,
body.contact .input-group input[type="text"] {
  border: 1px solid var(--k-border) !important;
  border-right: none !important;
  border-radius: var(--k-radius-sm) 0 0 var(--k-radius-sm) !important;
  background: #fff !important;
}

/* ===== Kill huge empty space on short pages (cart with 1 item, etc.) =====
   PrestaShop sets aggressive min-heights on content areas which creates dead zones
   on pages with little content. Reduce them. */
#main, #content-wrapper, #content, .page-content, .page-wrapper {
  min-height: 0 !important;
}
body main { min-height: 0 !important; }

/* Add reasonable bottom spacing to the cart page specifically */
body#cart #content-wrapper,
body.cart #content-wrapper { padding-bottom: 40px; }

/* Same for other typically-short pages */
body.contact #content-wrapper,
body.password #content-wrapper,
body.authentication #content-wrapper,
body.identity #content-wrapper,
body.address #content-wrapper { padding-bottom: 40px; }

/* ===== Homepage: remove dead space between last section and footer ===== */
.k-home .k-section:last-child { margin-bottom: 24px; }
.k-home > *:last-child { margin-bottom: 24px; }
/* Make sure the page-content wrapper doesn't add extra padding on homepage */
body#index #wrapper, body.index #wrapper,
body#index #content-wrapper, body.index #content-wrapper { padding-bottom: 0 !important; }

/* ===== Add-to-cart popup: rounded corners + theme polish ===== */
#blockcart-modal .modal-content,
#blockcart-modal.modal .modal-content {
  border-radius: var(--k-radius) !important;
  border: 1px solid var(--k-border) !important;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(46,51,32,0.15);
}
#blockcart-modal .modal-header {
  background: var(--k-tint) !important;
  border-bottom: 1px solid var(--k-border) !important;
  padding: 18px 22px;
}
#blockcart-modal .modal-header .modal-title {
  color: var(--k-deep) !important;
  font-weight: 600;
  font-size: 16px;
  display: flex; align-items: center; gap: 8px;
}
#blockcart-modal .modal-header .material-icons { color: var(--k-olive) !important; }
#blockcart-modal .modal-body { padding: 22px; }
#blockcart-modal .product-image,
#blockcart-modal img { border-radius: var(--k-radius-sm); }
#blockcart-modal .cart-content { padding: 14px 0 0; }
#blockcart-modal .cart-content .btn {
  border-radius: var(--k-radius-sm) !important;
  padding: 11px 22px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  font-size: 13px;
}
#blockcart-modal .modal-footer {
  border-top: 1px solid var(--k-border);
  padding: 16px 22px;
}

/* ============================================================
   CONSISTENCY SWEEP — anything that should be rounded but wasn't covered
   ============================================================ */

/* Search bar (header) */
#search_widget input[type="text"],
#search_widget .form-control,
.search-widget input[type="text"],
.search-widget .form-control {
  border-radius: var(--k-radius-sm) !important;
  border: 1px solid var(--k-border) !important;
}
#search_widget input:focus, .search-widget input:focus {
  border-color: var(--k-olive) !important;
  box-shadow: 0 0 0 3px rgba(124, 144, 57, 0.15) !important;
  outline: none !important;
}

/* Alerts and notifications */
.alert, .alert-success, .alert-danger, .alert-warning, .alert-info {
  border-radius: var(--k-radius-sm) !important;
  border: 1px solid var(--k-border);
}
.alert-success { background: rgba(124, 144, 57, 0.08); color: var(--k-olive-dark); border-color: var(--k-olive); }
.alert-danger { background: #FCEBEB; color: #791F1F; border-color: #C0392B; }
.alert-warning { background: #FAEEDA; color: #633806; border-color: #D4A22F; }
.alert-info { background: var(--k-tint); color: var(--k-deep); border-color: var(--k-border); }

/* Pagination */
.pagination > li > a, .pagination > li > span,
.page-link {
  border-radius: var(--k-radius-sm) !important;
  border: 1px solid var(--k-border) !important;
  color: var(--k-deep) !important;
  margin: 0 3px;
}
.pagination > li.active > a,
.pagination > li > a:hover,
.page-link:hover, .page-item.active .page-link {
  background: var(--k-olive) !important;
  border-color: var(--k-olive) !important;
  color: #fff !important;
}

/* Breadcrumb */
.breadcrumb {
  background: transparent !important;
  padding: 12px 0 !important;
  border-radius: 0 !important;
  font-size: 13px;
}
.breadcrumb a { color: var(--k-text-soft) !important; }
.breadcrumb a:hover { color: var(--k-olive) !important; }
.breadcrumb .active, .breadcrumb [aria-current="page"] { color: var(--k-deep) !important; }

/* Generic .card / .panel anywhere */
.card, .panel, .card-block, .panel-body {
  border-radius: var(--k-radius) !important;
  border: 1px solid var(--k-border) !important;
}

/* Any input that wasn't caught */
.form-control, input.form-control, select.form-control, textarea.form-control {
  border-radius: var(--k-radius-sm) !important;
}

/* Buttons not yet caught */
.btn, button.btn {
  border-radius: var(--k-radius-sm) !important;
}

/* Modals beyond what's already styled */
.modal-content { border-radius: var(--k-radius) !important; }

/* Dropdown menus */
.dropdown-menu {
  border-radius: var(--k-radius-sm) !important;
  border: 1px solid var(--k-border) !important;
  box-shadow: 0 8px 24px rgba(46,51,32,0.10);
}

/* Tags / chips (e.g. on facet filter results) */
.tag, .ui-autocomplete .ui-menu-item {
  border-radius: var(--k-radius-pill) !important;
}

/* Tooltip */
.tooltip-inner {
  border-radius: var(--k-radius-sm) !important;
  background: var(--k-deep) !important;
}

/* Product list filter sidebar */
#search_filters .facet,
.block-categories,
#category-description {
  border-radius: var(--k-radius) !important;
}

/* ============================================================
   CONSISTENCY FIXES — square corners spotted in audit
   ============================================================ */

/* --- Image 1: Your Addresses page — address cards still square --- */
body.addresses .address-item,
body.addresses article.address,
body.addresses .col-lg-4 article,
body.addresses .col-md-6 article,
body.addresses #content article {
  background: #fff !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  overflow: hidden;
  margin-bottom: 16px;
  box-shadow: none !important;
}
body.addresses .address-item .address-body,
body.addresses article.address .address-body {
  padding: 22px !important;
  background: transparent !important;
}
body.addresses .address-item .address-footer,
body.addresses article.address .address-footer {
  padding: 12px 22px !important;
  background: transparent !important;
  border-top: 1px solid var(--k-border) !important;
  margin-top: 0 !important;
}

/* --- Image 2/3: Cart count badge (8) in green bar --- */
.k-greenbar .cart-products-count,
.k-greenbar-right .cart-products-count,
.k-gb-cart .cart-products-count {
  background: #fff !important;
  color: var(--k-olive-dark) !important;
  border-radius: var(--k-radius-pill) !important;
  min-width: 22px;
  height: 22px;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin-left: 5px;
}

/* --- Image 4: Your Account hub cards (6 cards) --- */
body.my-account #content,
body.my-account .links {
  background: transparent !important;
}
body.my-account .links a,
body.my-account #content .links a,
body.my-account .col-lg-4 a.bg-light,
body.my-account .col-md-4 a.bg-light,
body.my-account a[href*="my-account"],
body.my-account a[href*="identity"],
body.my-account a[href*="addresses"],
body.my-account a[href*="history"],
body.my-account a[href*="discount"],
body.my-account a[href*="order-slip"],
body.my-account a[href*="module-blockwishlist"],
body.my-account a[href*="psgdpr"] {
  background: #fff !important;
  border: 1px solid var(--k-border) !important;
  border-radius: var(--k-radius) !important;
  padding: 28px 22px !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  text-decoration: none !important;
}
body.my-account .links a:hover,
body.my-account #content .links a:hover {
  transform: translateY(-2px);
  border-color: var(--k-olive) !important;
  box-shadow: var(--k-shadow-hover) !important;
}
/* Card icons — olive in tinted circle */
body.my-account .links a i,
body.my-account .links a .material-icons,
body.my-account #content .links a i,
body.my-account #content .links a .material-icons {
  color: var(--k-olive) !important;
  font-size: 36px !important;
  margin-bottom: 14px !important;
  background: var(--k-tint) !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
/* Card label — sentence case (NOT all caps) */
body.my-account .links a span,
body.my-account .links a .link-item,
body.my-account #content .links a span,
body.my-account #content .links a {
  text-transform: none !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--k-deep) !important;
  letter-spacing: 0 !important;
  background: transparent !important;
}

/* --- Image 5: Cart summary inner boxes --- */
.cart-summary,
#js-checkout-summary,
.cart-detailed-totals,
.cart-summary-products {
  background: #fff !important;
  border-radius: var(--k-radius) !important;
}
/* Kill the inner box around subtotal/shipping that creates double-box look */
.cart-summary .cart-summary-line,
.cart-summary .cart-detailed-totals .cart-summary-line,
.cart-summary .cart-summary-totals,
.cart-summary .cart-detailed-totals,
.cart-detailed-totals > div,
#js-checkout-summary .cart-summary-line,
#js-checkout-summary .card,
#js-checkout-summary .card-block {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 22px !important;
}
/* The summary card wrapper gets proper top/bottom padding (sides handled by rows above) */
.cart-summary, #js-checkout-summary {
  padding: 22px 0 !important;
}
.cart-summary .cart-summary-products,
.cart-summary > .h6,
.cart-summary > .card-title { padding: 0 22px !important; }
/* The Total row gets a top border separator instead of being its own box */
.cart-summary .cart-summary-totals,
#js-checkout-summary .cart-total {
  border-top: 1px solid var(--k-border) !important;
  margin-top: 14px !important;
  padding-top: 18px !important;
  padding-bottom: 4px !important;
  font-weight: 700;
}
.cart-summary .cart-summary-totals .value,
#js-checkout-summary .cart-total .value {
  font-size: 18px !important;
  color: var(--k-olive-dark) !important;
}

/* Checkout cart summary line items: shrink the line item product price
   so the TOTAL row stays visually dominant. The .product-price class is
   reused from the product page where it's 28px — too big in this context. */
body#checkout .cart-summary-products .product-price,
body#checkout .cart-summary-products .price,
body#checkout .cart-summary-products .current-price .price,
body#checkout .cart-summary-products .current-price span,
body.checkout .cart-summary-products .product-price,
body.checkout .cart-summary-products .price,
#js-checkout-summary .cart-summary-products .product-price,
#js-checkout-summary .cart-summary-products .price {
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* Also tone down the line item product name (was inheriting the cart-summary olive color too brightly) */
body#checkout .cart-summary-products .product-name,
body#checkout .cart-summary-products .product-line-info,
body.checkout .cart-summary-products .product-name {
  font-size: 13px !important;
  color: var(--k-deep) !important;
}

/* Cart summary: proceed-to-checkout button and any inner buttons get side margin */
.cart-summary .btn-primary,
.cart-summary a.btn-primary,
.cart-summary .checkout > a,
.cart-summary .checkout {
  margin: 16px 22px 4px !important;
  width: calc(100% - 44px) !important;
  display: block;
}

/* ============================================================
   MOBILE FIXES — responsive issues from audit
   ============================================================ */
@media (max-width: 767px) {

  /* 1. Logo letter spacing — letters shouldn't have gaps */
  #header .k-logo,
  .k-logo,
  .k-checkout-logo {
    letter-spacing: -1px !important;
    white-space: nowrap;
    font-size: 24px !important;
  }
  #header .k-logo .k-o,
  .k-logo .k-o,
  .k-checkout-logo .k-o {
    margin: 0 !important;
    padding: 0 !important;
    display: inline !important;
  }

  /* 2. Cart badge — keep it small on mobile, not full-width pill */
  .k-greenbar .cart-products-count,
  .k-greenbar-right .cart-products-count,
  .k-gb-cart .cart-products-count,
  .k-greenbar #_mobile_cart .cart-products-count,
  #_mobile_cart .cart-products-count {
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 6px !important;
    font-size: 11px !important;
    border-radius: 10px !important;
    line-height: 1 !important;
  }

  /* 3. Slider arrows — kill them harder on mobile (CSS belt + JS suspenders) */
  .k-hero .rslides_nav,
  .homeslider-container .rslides_nav,
  .homeslider-container .prev,
  .homeslider-container .next,
  .homeslider-container a.prev,
  .homeslider-container a.next,
  .k-hero .prev, .k-hero .next,
  .k-hero a.prev, .k-hero a.next {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
  }

  /* 4a. Product title — sentence case on mobile, smaller */
  #product .h1, #product h1.h1, .product-title, #product .product-information h1 {
    text-transform: none !important;
    font-size: 22px !important;
    line-height: 1.3 !important;
    margin-bottom: 12px !important;
  }

  /* 4b. SAVE badge — smaller on mobile */
  #product .discount, #product .product-discount,
  #product .product-discount .discount-percentage,
  .discount-percentage, .product-flag.discount-percentage {
    font-size: 13px !important;
    padding: 4px 10px !important;
    border-radius: var(--k-radius-pill) !important;
  }

  /* 4c. Hide "No tax" label — not relevant for US store */
  #product .tax-shipping-delivery-label,
  .product-prices .tax-shipping-delivery-label { display: none !important; }

  /* 5. Quantity stepper — arrows beside input on mobile, not below */
  #product .product-quantity,
  #product .product-add-to-cart .qty {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px;
  }
  #product .qty .input-group,
  #product .product-quantity .input-group {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: auto !important;
  }
  #product .qty input.input-group-field,
  #product .product-quantity input,
  #product input#quantity_wanted {
    width: 50px !important;
    height: 44px !important;
    text-align: center !important;
    border: 1px solid var(--k-border) !important;
    border-radius: var(--k-radius-sm) 0 0 var(--k-radius-sm) !important;
    padding: 0 !important;
  }
  #product .input-group-btn-vertical,
  #product .qty .input-group-btn,
  #product .qty .bootstrap-touchspin-down,
  #product .qty .bootstrap-touchspin-up {
    display: inline-flex !important;
    flex-direction: column !important;
    width: 30px !important;
    height: 44px !important;
  }
  #product .input-group-btn-vertical button,
  #product .qty button.btn-touchspin,
  #product .qty .bootstrap-touchspin-up,
  #product .qty .bootstrap-touchspin-down {
    flex: 1 !important;
    width: 30px !important;
    height: 22px !important;
    padding: 0 !important;
    background: var(--k-tint) !important;
    border: 1px solid var(--k-border) !important;
    border-left: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #product .input-group-btn-vertical button:first-child,
  #product .qty .bootstrap-touchspin-up {
    border-top-right-radius: var(--k-radius-sm) !important;
    border-bottom: none !important;
  }
  #product .input-group-btn-vertical button:last-child,
  #product .qty .bootstrap-touchspin-down {
    border-bottom-right-radius: var(--k-radius-sm) !important;
  }

  /* Wishlist heart button — fix oversize on mobile */
  #product .wishlist-button-product,
  #product .wishlist-button-add,
  .wishlist-button-product {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Bonus: trust strip on mobile — 2-col grid with cleaner text wrap */
  .k-trust-strip { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; padding: 16px !important; }
  .k-trust-strip .k-trust-item { font-size: 12px !important; }
  .k-trust-strip .k-trust-item strong { font-size: 13px !important; }
  .k-trust-strip .k-trust-item span { display: none !important; }

  /* Sticky add-to-cart bar — give the product title more room */
  .k-sticky-cart .k-sticky-name {
    font-size: 13px !important;
    max-width: 50% !important;
  }
}

/* Also kill duplicate reassurance block — happens because blockreassurance is hooked twice */
#product #product-additional-info ~ #product-additional-info,
#product .reassurance-tabs + .reassurance-tabs { display: none !important; }

/* ============================================================
   IMAGE LOGO sizing — when SEO team uploads a logo via Back Office
   ============================================================ */

/* Main header logo (desktop) */
#_desktop_logo img,
#_desktop_logo .logo {
  max-height: 48px;
  width: auto;
  display: block;
}
#_desktop_logo h1 { line-height: 1; margin: 0; }

/* Mobile logo in green bar */
#_mobile_logo img,
#_mobile_logo .logo {
  max-height: 32px;
  width: auto;
  margin: 0 auto;
  display: block;
}

/* Checkout logo — larger, prominent */
.k-checkout-logo-bar .k-checkout-logo-link img,
.k-checkout-logo-bar img.logo {
  max-height: 60px;
  width: auto;
  display: inline-block;
}

/* Footer brand logo — medium */
.k-foot-brand .k-foot-logo-link img,
.k-foot-brand img.logo {
  max-height: 44px;
  width: auto;
  display: inline-block;
}

/* Responsive — slightly smaller on mobile */
@media (max-width: 767px) {
  #_desktop_logo img { max-height: 36px; }
  .k-checkout-logo-bar img { max-height: 48px; }
  .k-foot-brand img { max-height: 36px; }
}

/* ============================================================
   MOBILE FIXES — cart badge oversize + sticky cart bar overflow
   ============================================================ */
@media (max-width: 767px) {

  /* Cart count badge — force small on mobile (v51 made it big with min-width 22) */
  .k-greenbar .cart-products-count,
  .k-greenbar-right .cart-products-count,
  .k-gb-cart .cart-products-count,
  #_mobile_cart .cart-products-count,
  .header-nav .cart-products-count,
  .blockcart .cart-products-count {
    min-width: 18px !important;
    width: auto !important;
    height: 18px !important;
    padding: 0 5px !important;
    font-size: 10px !important;
    line-height: 18px !important;
    border-radius: 9px !important;
    margin-left: 3px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Mobile cart icon area — don't let it expand to fill */
  #_mobile_cart, .k-greenbar #_mobile_cart {
    flex: 0 0 auto !important;
    width: auto !important;
    padding: 0 !important;
  }

  /* Sticky bottom add-to-cart bar — contain it properly within viewport */
  .k-sticky-cart, .k-sticky-cart-bar, #k-sticky-cart {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    overflow: hidden;
  }
  .k-sticky-cart > *, .k-sticky-cart-bar > * { box-sizing: border-box; }
  .k-sticky-cart .k-sticky-thumb,
  .k-sticky-cart img {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
  }
  .k-sticky-cart .k-sticky-info,
  .k-sticky-cart .k-sticky-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .k-sticky-cart .k-sticky-add,
  .k-sticky-cart .btn-primary,
  .k-sticky-cart a.btn,
  .k-sticky-cart button {
    flex: 0 0 auto !important;
    margin-right: 0 !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
    max-width: 50% !important;
  }
}

/* ============================================================
   ROOT FIX — horizontal overflow on mobile (wishlist heart)
   The wishlist button was positioned outside its container causing the
   whole document width to exceed viewport, making everything else off-screen.
   ============================================================ */

/* Universal overflow guard — no element can push the page wider than viewport.
   Uses `clip` (not `hidden`) so position:sticky on #header still works. */
html, body { overflow-x: clip !important; max-width: 100vw !important; }
body { position: relative; }

/* Product page wishlist heart — contain it within the form area on mobile */
@media (max-width: 767px) {
  #product .wishlist-button-product,
  #product .wishlist-button-add,
  .wishlist-button-product,
  .product-add-to-cart .wishlist-button-product,
  .product-actions .wishlist-button-product {
    position: static !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 0 0 8px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    flex: 0 0 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fff !important;
    border: 1px solid var(--k-border) !important;
    box-shadow: none !important;
  }

  /* Product add-to-cart row layout — wrap everything cleanly */
  #product .product-add-to-cart,
  #product .product-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    max-width: 100% !important;
  }
  #product .product-add-to-cart > *,
  #product .product-actions > * { max-width: 100% !important; }

  /* The cart icon area in green bar — align with sign-in vertically */
  .k-greenbar-right {
    align-items: center !important;
    gap: 14px !important;
  }
  .k-gb-cart, .k-gb-signin,
  .k-gb-cart a, .k-gb-signin a {
    display: inline-flex !important;
    align-items: center !important;
    height: 24px;
  }
  .k-greenbar .material-icons,
  .k-greenbar svg { vertical-align: middle !important; }
}

/* ============================================================
   MOBILE — sticky header same as desktop
   ============================================================ */
@media (max-width: 991px) {
  #header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1030 !important;
    background: var(--k-surface);
    transition: box-shadow .2s ease;
  }
  #header.k-stuck {
    box-shadow: 0 2px 12px rgba(46,51,32,0.10);
  }
  /* Make sure ancestors don't break the sticky behavior */
  body, #wrapper, #page, main { overflow-x: clip !important; }
}

/* ============================================================
   WISHLIST — fully hide. Module can also be uninstalled in BO.
   ============================================================ */
.wishlist-button-product,
.wishlist-button-add,
.wishlist-list-item,
.wishlist-add-to-new,
.wishlist-modal,
.product-actions .wishlist-button-product,
.product-add-to-cart .wishlist-button-product,
body.my-account .links a[href*="module-blockwishlist"],
body.my-account .links a[href*="blockwishlist"],
#blockwishlist,
.wishlist-toast {
  display: none !important;
}

/* ============================================================
   Sticky add-to-cart bar — proper right margin so ADD TO CART
   doesn't kiss the edge
   ============================================================ */
@media (max-width: 991px) {
  .k-sticky-cart, .k-sticky-cart-bar, #k-sticky-cart {
    padding: 10px 14px !important;
    padding-right: 14px !important;
  }
  .k-sticky-cart .btn-primary,
  .k-sticky-cart a.btn,
  .k-sticky-cart button,
  .k-sticky-cart .k-sticky-add {
    margin-right: 0 !important;
  }
}

/* (v57 mobile header overrides removed — replaced with .k-mobile-header dedicated block) */

/* ============================================================
   MOBILE HEADER — dedicated, compact, 3 elements only
   ============================================================ */
.k-mobile-header {
  display: none;
  background: var(--k-olive);
  color: #fff;
  padding: 0;
  border: none;
  align-items: center;
  justify-content: space-between;
  height: 56px;
  position: relative;
  z-index: 100;
}
@media (max-width: 991px) {
  .k-mobile-header { display: flex; }
  /* Hide the desktop bars on mobile */
  .k-greenbar.hidden-sm-down,
  .header-top.hidden-sm-down { display: none !important; }
}

.k-mobile-header .k-mh-menu {
  background: transparent;
  border: none;
  color: #fff !important;
  padding: 0 16px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
}
.k-mobile-header .k-mh-menu:hover { opacity: 0.85; }
.k-mobile-header .k-mh-menu svg { color: #fff !important; stroke: #fff !important; }
/* When menu is open, rotate hamburger to indicate close action */
.k-mobile-header .k-mh-menu.k-mh-open svg {
  transform: rotate(90deg);
  transition: transform .15s ease;
}

/* Logo absolutely centered in the bar — independent of side element widths */
.k-mobile-header .k-mh-logo {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  text-decoration: none;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 60%;
  z-index: 1;
}
.k-mobile-header .k-mh-logo img {
  max-height: 36px !important;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
}
.k-mobile-header .k-mh-logo .k-logo {
  color: #fff !important;
  font-family: 'Outfit', sans-serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.5px;
}
.k-mobile-header .k-mh-logo .k-logo .k-o { color: var(--k-amber); }

.k-mobile-header .k-mh-cart {
  background: transparent;
  border: none;
  color: #fff !important;
  padding: 0 16px 0 12px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
  z-index: 2;
  margin-right: 4px;
}
.k-mobile-header .k-mh-cart:hover { opacity: 0.85; color: #fff !important; }
.k-mobile-header .k-mh-cart svg { color: #fff !important; stroke: #fff !important; }
.k-mobile-header .k-mh-cart-count {
  background: #fff;
  color: var(--k-olive-dark);
  font-size: 11px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  line-height: 1;
}

/* Force any PrestaShop-rendered account icon white on the olive bar */
.k-mobile-header svg,
.k-mobile-header i,
.k-mobile-header .material-icons,
#_mobile_user_info, #_mobile_user_info i,
#_mobile_user_info .material-icons,
#_mobile_user_info svg,
#_mobile_user_info a,
.k-mobile-header #_mobile_user_info * {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* Sticky on mobile */
@media (max-width: 991px) {
  #header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1030 !important;
    background: transparent;
  }
}

/* ============================================================
   Mobile menu — PrestaShop's native top-menu.js shows/hides #mobile_top_menu_wrapper.
   It adds `is-open` to #header when menu opens. We just style the result.
   ============================================================ */
#mobile_top_menu_wrapper {
  background: #fff;
  border-bottom: 1px solid var(--k-border);
  margin: 0;
  padding: 8px 0 16px;
}
/* Visible when PrestaShop reveals it (either inline style:block from JS or .is-open on header) */
#header.is-open #mobile_top_menu_wrapper {
  display: block !important;
}

/* Menu items list */
#mobile_top_menu_wrapper .js-top-menu ul,
#mobile_top_menu_wrapper .top-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
#mobile_top_menu_wrapper .js-top-menu li,
#mobile_top_menu_wrapper .top-menu li {
  border-bottom: 1px solid var(--k-tint);
}
#mobile_top_menu_wrapper .js-top-menu li:last-child,
#mobile_top_menu_wrapper .top-menu li:last-child { border-bottom: none; }
#mobile_top_menu_wrapper .js-top-menu li a,
#mobile_top_menu_wrapper .top-menu li a {
  display: block;
  padding: 14px 20px;
  color: var(--k-deep) !important;
  text-decoration: none;
  font-weight: 500;
  font-size: 15px;
}
#mobile_top_menu_wrapper .js-top-menu li a:hover,
#mobile_top_menu_wrapper .top-menu li a:hover {
  background: var(--k-tint);
  color: var(--k-olive-dark) !important;
}

/* Sign in / Create account links injected at the bottom */
.k-mh-drawer-account {
  border-top: 1px solid var(--k-border);
  margin-top: 8px;
  padding: 12px 0;
}
.k-mh-drawer-account a {
  display: block;
  padding: 12px 20px;
  color: var(--k-deep) !important;
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
}
.k-mh-drawer-account a:hover {
  background: var(--k-tint);
  color: var(--k-olive-dark) !important;
}

/* Hamburger rotates when menu opens — PrestaShop adds .is-open to #header */
#header.is-open .k-mh-menu svg {
  transform: rotate(90deg);
  transition: transform .15s ease;
}

/* ============================================================
   STICKY ADD-TO-CART BAR — final fix for right edge cut-off
   ============================================================ */
@media (max-width: 991px) {
  .k-sticky-cart, .k-sticky-cart-bar, #k-sticky-cart, .product-add-to-cart-sticky {
    box-sizing: border-box !important;
    padding: 8px 12px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    gap: 10px !important;
  }
  .k-sticky-cart > *,
  .product-add-to-cart-sticky > * {
    box-sizing: border-box;
  }
  /* Thumbnail smaller on mobile */
  .k-sticky-cart .k-sticky-thumb,
  .k-sticky-cart img,
  .product-add-to-cart-sticky img {
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 40px !important;
  }
  /* Button smaller — fixed sensible size, not percentage */
  .k-sticky-cart .btn,
  .k-sticky-cart button,
  .k-sticky-cart a.btn-primary,
  .product-add-to-cart-sticky .btn-primary {
    margin-right: 0 !important;
    flex: 0 0 auto !important;
    max-width: none !important;
    width: auto !important;
    padding: 9px 16px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
    border-radius: var(--k-radius-sm) !important;
  }
  /* Info column — give the product name + price proper room */
  .k-sticky-cart .k-sticky-info,
  .product-add-to-cart-sticky .product-info {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden;
  }
  .k-sticky-cart .k-sticky-name,
  .product-add-to-cart-sticky .product-name {
    font-size: 13px !important;
    line-height: 1.25 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0 2px;
  }
  .k-sticky-cart .k-sticky-price,
  .product-add-to-cart-sticky .price {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--k-olive-dark) !important;
  }
}

/* Very narrow screens (≤375px) — even tighter */
@media (max-width: 375px) {
  .k-sticky-cart .btn,
  .k-sticky-cart button,
  .k-sticky-cart a.btn-primary,
  .product-add-to-cart-sticky .btn-primary {
    padding: 9px 12px !important;
    font-size: 11px !important;
  }
}

/* ============================================================
   Mobile bar — hide ALL traces of the user/account icon
   PrestaShop's ps_customersignin module injects into #_mobile_user_info
   regardless of our `d-none` class. Hide hard.
   ============================================================ */
@media (max-width: 991px) {
  .k-mobile-header #_mobile_user_info,
  #_mobile_user_info,
  .k-mobile-header .user-info,
  .k-mobile-header .header_user_info,
  .k-mobile-header [class*="user-info"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
  }
}

/* ============================================================
   Final mobile cart background killer — beats #header specificity
   ============================================================ */
@media (max-width: 991px) {
  .k-mobile-header .k-mh-cart,
  .k-mobile-header .k-mh-cart.active,
  .k-mobile-header .k-mh-cart:hover,
  .k-mobile-header #_mobile_cart,
  .k-mobile-header #_mobile_cart.active,
  #header .k-mobile-header .k-mh-cart,
  #header .k-mobile-header .k-mh-cart.active,
  #header .k-mobile-header #_mobile_cart,
  #header .k-mobile-header #_mobile_cart.active,
  #header .k-mobile-header .blockcart,
  #header .k-mobile-header .blockcart.active,
  #header .k-mobile-header .blockcart:hover {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }
}

/* ============================================================
   PAYMENT FORM FIELDS (Authorize.Net + others)
   Fix cramped expiration/CVC inputs visible in screenshot.
   ============================================================ */

/* Payment form container — give inputs room to breathe */
.payment-options form input[type="text"],
.payment-options form input[type="tel"],
.payment-options form input[type="number"],
.payment-options form input[type="email"],
.js-payment-form input[type="text"],
.js-payment-form input[type="tel"],
form[id*="payment"] input[type="text"],
form[id*="payment"] input[type="tel"],
form[id*="authorize"] input[type="text"],
form[id*="authorize"] input[type="tel"] {
  min-width: 0 !important;
  width: 100% !important;
  font-size: 15px !important;
  padding: 10px 14px !important;
}

/* Specific to Authorize.Net field IDs/names */
input[name="cc_number"],
input[name="card_number"],
input[name="cardNumber"],
input[id*="card-number"],
input[id*="card_number"] {
  width: 100% !important;
  min-width: 240px !important;
  letter-spacing: 1px !important;
  font-size: 16px !important;
}

input[name="cc_expiration"],
input[name="cc_expiry"],
input[name="cc_expire"],
input[name="expiration"],
input[name="expiry"],
input[id*="expir"] {
  width: 100% !important;
  min-width: 140px !important;
  font-size: 15px !important;
  letter-spacing: 1px !important;
}

input[name="cc_cvc"],
input[name="cc_cvv"],
input[name="cvc"],
input[name="cvv"],
input[id*="cvc"],
input[id*="cvv"],
input[id*="security"] {
  width: 100% !important;
  min-width: 100px !important;
  font-size: 15px !important;
  letter-spacing: 1px !important;
}

/* Hide the empty translation placeholder " []" that some payment modules append to labels.
   Targets generic patterns; safe because [] in payment labels is always a stray placeholder. */
.payment-options label,
.js-payment-form label {
  /* No direct selector for "ends with []" in CSS — handled by JS below if needed */
}

/* Ensure payment form input rows wrap and fields are visible.
   Some themes constrain .form-group widths too aggressively on checkout payment step. */
.payment-options .form-group,
.payment-options .row > .form-group,
form[id*="payment"] .form-group,
form[id*="authorize"] .form-group {
  max-width: 100% !important;
  margin-bottom: 16px !important;
}

/* Two-column layout for expiration + CVC (typical pattern) */
.payment-options .form-row,
.payment-options .row.cc-row {
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.payment-options .form-row > *,
.payment-options .row.cc-row > * {
  flex: 1 1 140px !important;
  min-width: 120px !important;
}

/* The card icon prefix box should not be square-crushed — make it taller for visual balance */
.payment-options .input-group-prepend,
.payment-options .input-group-text {
  padding: 0 14px !important;
}

/* Place Order button: slightly less imposing, still prominent */
.payment-options .btn-primary,
button[type="submit"][name*="confirm"],
button[type="submit"][id*="place-order"] {
  padding: 14px 32px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
}

/* Empty "[]" placeholder fix injection.
   The tfauthorizedotnet payment module has a translation key that renders as
   literal "[]" in input placeholders. Pure CSS cannot rewrite placeholder
   attribute content, so this style tag carries a JS fixup via the linked
   <style data-fix-placeholders> hook — see theme.yml + JS section below.
   Until the proper module fix is in, we rely on the CSS-only hack below
   which uses transparent text color on placeholders that contain "[]". */
input[placeholder="[]"]::placeholder,
input[placeholder="[ ]"]::placeholder {
  color: transparent !important;
}
input[placeholder="[]"]:focus::placeholder,
input[placeholder="[ ]"]:focus::placeholder {
  color: transparent !important;
}

/* ============================================================
   PAYMENT FORM — bulletproof containment
   The Authorize.Net (tfauthorizedotnet) module renders form fields
   that overflow the parent container on narrow viewports.
   Fix: constrain the whole payment options area + force inputs to
   respect their container width.
   ============================================================ */

/* Outer containment — keep the payment area inside its column */
#checkout-payment-step,
.payment-options,
.payment-options > *,
.payment-options form,
.payment-option,
.payment-option > *,
[id*="payment-form"],
[class*="payment-form"] {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible;
}

/* Force ALL inputs inside the payment area to shrink to container width */
.payment-options input[type="text"],
.payment-options input[type="tel"],
.payment-options input[type="number"],
.payment-options input[type="password"],
.payment-options input[type="email"],
.payment-options select,
.payment-options textarea,
[id*="payment-form"] input,
[id*="payment-form"] select,
[class*="payment-form"] input,
[class*="payment-form"] select,
form[id*="authorize"] input,
form[id*="authorize"] select {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  padding: 10px 14px !important;
  font-size: 15px !important;
}

/* Form groups inside payment options: shrink to fit, no horizontal overflow */
.payment-options .form-group,
.payment-options .row,
.payment-options [class*="col-"],
[id*="payment-form"] .form-group,
[id*="payment-form"] .row,
[id*="payment-form"] [class*="col-"] {
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* The grid row that holds card number / expiration / CVC inputs:
   stack on mobile, side-by-side on tablet+, but never overflow */
.payment-options .row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.payment-options .row > .col-md-6,
.payment-options .row > .col-md-4,
.payment-options .row > .col-sm-6,
.payment-options .row > .col-sm-4,
.payment-options .row > [class*="col-"] {
  flex: 1 1 200px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Specific input-group prefix boxes (the card icon, calendar, padlock):
   keep them compact and aligned with the input */
.payment-options .input-group,
[id*="payment-form"] .input-group {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
}
.payment-options .input-group-prepend,
.payment-options .input-group-text,
[id*="payment-form"] .input-group-prepend,
[id*="payment-form"] .input-group-text {
  flex: 0 0 auto !important;
  padding: 0 12px !important;
  display: flex !important;
  align-items: center !important;
}
.payment-options .input-group input,
[id*="payment-form"] .input-group input {
  flex: 1 1 0% !important;
  min-width: 0 !important;
}

/* Hide the empty "[]" placeholder text via transparent color
   (the JS fixup in kratoma.js replaces it with proper text on most pages) */
input[placeholder="[]"]::placeholder,
input[placeholder="[ ]"]::placeholder {
  color: transparent !important;
}

/* Place Order button: ensure it fits the column */
.payment-options .btn,
.payment-options button[type="submit"],
#payment-confirmation .btn,
#payment-confirmation button[type="submit"] {
  max-width: 100% !important;
  box-sizing: border-box !important;
}
