/* Moved from shop/shop.css */
/* Mivek Solutions Shop - dedicated shop stylesheet
   Loaded after ../style.css from solutions/shop/index.html */
.shop-page {
  background:#f5f5f7;
  color:var(--ink);
}

.shop-page .site-header {
  z-index:80;
}

.desktop-nav a.is-current {
  color:var(--purple);
}

.desktop-nav a.is-current::after {
  content:"";
  display:block;
  width:100%;
  height:2px;
  margin-top:.32rem;
  background:var(--purple);
  border-radius:999px;
}

.shop-page .shop-pro-hero {
  padding:126px 5vw 1.35rem;
  background:#f4f2f8;
  display:block;
  border-bottom:1px solid #e5e0ec;
}

.shop-header {
  width:100%;
  padding:0;
  margin:0;
  background:transparent;
}

.shop-header-inner {
  max-width:1240px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1rem;
  align-items:center;
}

.shop-search {
  display:grid;
  grid-template-columns:200px minmax(260px,1fr) 128px;
  align-items:center;
  background:#fff;
  border:1px solid #ded8e8;
  border-radius:12px;
  box-shadow:0 14px 34px rgba(35,19,73,.07);
  overflow:hidden;
}

.shop-search select,.shop-search input {
  width:100%;
  height:54px;
  border:0;
  border-right:1px solid #ece7f2;
  background:#fff;
  color:#252431;
  padding:0 1rem;
  outline:0;
}

.shop-search input {
  font-size:.95rem;
}

.shop-search button {
  height:54px;
  border:0;
  background:var(--purple);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}

.shop-search button:hover {
  background:var(--purple-dark);
}

.shop-actions-head {
  display:flex;
  align-items:center;
  gap:.7rem;
}

.head-action {
  min-height:54px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:.55rem 1rem;
  border:1px solid #ded8e8;
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  text-decoration:none;
  box-shadow:0 14px 34px rgba(35,19,73,.06);
}

.head-action span {
  font-size:.72rem;
  color:var(--muted);
  font-weight:700;
}

.head-action strong {
  font-size:.9rem;
  color:var(--purple);
}

.cart-button {
  height:54px;
  padding:0 1rem;
  border:1px solid #ded8e8;
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  font-weight:800;
  cursor:pointer;
  box-shadow:0 14px 34px rgba(35,19,73,.06);
}

.cart-button strong {
  display:inline-grid;
  place-items:center;
  min-width:25px;
  height:25px;
  margin-left:.45rem;
  border-radius:999px;
  background:var(--orange);
  color:#fff;
  font-size:.8rem;
}

.shop-featured {
  background:#f5f5f7;
  padding-top:2.4rem;
}

.shop-featured .section-intro {
  max-width:1240px;
  margin:0 auto 1.4rem;
}

.shop-featured .section-intro h2 {
  font-size:clamp(2rem,3.2vw,3.4rem);
  letter-spacing:-.055em;
}

.shop-featured .section-intro>p:last-child {
  max-width:760px;
}

.product-grid {
  max-width:1240px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.05rem;
}

.shop-product {
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:hidden;
  border:1px solid #e1dce8;
  border-radius:14px;
  background:#fff;
  box-shadow:0 14px 34px rgba(35,19,73,.075);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.shop-product:hover {
  transform:translateY(-3px);
  border-color:rgba(79,22,199,.33);
  box-shadow:0 18px 45px rgba(35,19,73,.12);
}

.discount-badge {
  position:absolute;
  top:.75rem;
  left:.75rem;
  z-index:3;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 .62rem;
  border-radius:999px;
  background:#e02424;
  color:#fff;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.02em;
}

.wishlist {
  position:absolute;
  top:.7rem;
  right:.7rem;
  z-index:3;
  width:34px;
  height:34px;
  border:1px solid #e3deea;
  border-radius:50%;
  background:#fff;
  color:#5b5863;
  cursor:pointer;
  font-size:1.05rem;
  line-height:1;
}

.wishlist:hover {
  color:#e02424;
  border-color:#e02424;
}

.product-thumb {
  height:185px;
  padding:1.5rem 1.25rem 1rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#fff 0%,#f7f5fb 100%);
  border-bottom:1px solid #eeeaf4;
  text-decoration:none;
}

.product-thumb img {
  max-width:100%;
  max-height:142px;
  object-fit:contain;
}

.product-content {
  display:flex;
  flex-direction:column;
  gap:.62rem;
  padding:1rem 1rem 1.05rem;
  flex:1;
}

.product-cat {
  margin:0;
  color:var(--purple);
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.055em;
}

.shop-product h3 {
  min-height:52px;
  margin:0;
  color:#161522;
  font-size:.98rem;
  line-height:1.34;
  font-weight:800;
  letter-spacing:-.015em;
}

.product-specs {
  margin:.1rem 0 .2rem;
  padding:0;
  list-style:none;
  display:grid;
  gap:.32rem;
  color:#68636f;
  font-size:.78rem;
}

.product-specs li {
  position:relative;
  padding-left:.8rem;
}

.product-specs li::before {
  content:"";
  position:absolute;
  left:0;
  top:.58em;
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--orange);
}

.product-price {
  display:flex;
  align-items:baseline;
  gap:.5rem;
  flex-wrap:wrap;
  margin:.15rem 0 .3rem;
}

.product-price span {
  color:#151422;
  font-size:1.12rem;
  font-weight:900;
}

.product-price del {
  color:#97919e;
  font-size:.83rem;
}

.product-buttons {
  margin-top:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.45rem;
}

.product-buttons a,.product-buttons button {
  min-height:38px;
  border-radius:8px;
  font-size:.76rem;
  font-weight:850;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  cursor:pointer;
}

.quick-order {
  grid-column: auto !important;
  background:var(--purple);
  color:#fff;
  border:1px solid var(--purple);
}

.quick-order:hover {
  background:var(--purple-dark);
  border-color:var(--purple-dark);
}

.add-cart {
  border:1px solid #d9d2e4;
  background:#fff;
  color:#201f2a;
}

.add-cart:hover {
  border-color:var(--purple);
  color:var(--purple);
}

.quick-view {
  border:1px solid #d9d2e4;
  background:#f7f5fb;
  color:#201f2a;
}

.quick-view:hover {
  border-color:var(--orange);
  color:#9c5b00;
}

.quote-panel {
  max-width:none;
}

.shop-page .quote-panel {
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:1.25rem;
  align-items:stretch;
  background:linear-gradient(135deg,#170d2c 0%,#2a0b63 62%,#4f16c7 100%);
  color:#fff;
}

.quote-card-large,.quote-side {
  border:1px solid rgba(255,255,255,.16);
  border-radius:24px;
  background:rgba(255,255,255,.08);
  box-shadow:0 28px 80px rgba(0,0,0,.2);
}

.quote-card-large {
  padding:clamp(1.5rem,3vw,2.6rem);
}

.quote-card-large h2 {
  max-width:680px;
  margin-bottom:1rem;
  font-size:clamp(2.1rem,4vw,4.4rem);
  letter-spacing:-.06em;
}

.quote-card-large p {
  max-width:720px;
  color:rgba(255,255,255,.76);
  line-height:1.7;
}

.quote-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  margin-top:1.4rem;
}

.quote-panel .button-secondary {
  border-color:rgba(255,255,255,.28);
  color:#fff;
}

.quote-side {
  padding:1.4rem;
}

.quote-side strong {
  display:block;
  margin-bottom:1rem;
  font-size:1.05rem;
}

.quote-side ul {
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.7rem;
}

.quote-side li {
  padding:.8rem .9rem;
  border:1px solid rgba(255,255,255,.15);
  border-radius:14px;
  color:rgba(255,255,255,.84);
  background:rgba(255,255,255,.07);
}

.whatsapp-float {
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:60;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.8rem 1rem;
  border-radius:999px;
  background:#25d366;
  color:#062b15;
  text-decoration:none;
  font-size:.88rem;
  font-weight:900;
  box-shadow:0 16px 40px rgba(37,211,102,.3);
}

.whatsapp-float svg {
  width:22px;
  height:22px;
  stroke-width:1.9;
}

@media(max-width:1180px) {
  .product-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.shop-header-inner {
  grid-template-columns:1fr;
}

.shop-actions-head {
  justify-content:space-between;
}

.shop-search {
  grid-template-columns:185px minmax(180px,1fr) 118px;
}

}

@media(max-width:880px) {
  .product-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.shop-page .quote-panel {
  grid-template-columns:1fr;
}

.shop-search {
  grid-template-columns:1fr;
}

.shop-search select,.shop-search input {
  border-right:0;
  border-bottom:1px solid #ece7f2;
}

.shop-search button {
  width:100%;
}

.shop-actions-head {
  display:grid;
  grid-template-columns:1fr auto;
}

.product-thumb {
  height:165px;
}

}

@media(max-width:560px) {
  .shop-page .shop-pro-hero {
  padding:112px 1rem 1rem;
}

.shop-featured {
  padding-left:1rem;
  padding-right:1rem;
}

.product-grid {
  grid-template-columns:1fr;
}

.shop-actions-head {
  grid-template-columns:1fr;
}

.cart-button {
  width:100%;
}

.shop-product h3 {
  min-height:auto;
}

.product-buttons {
  grid-template-columns:1fr;
}

.whatsapp-float {
  left:14px;
  right:14px;
  justify-content:center;
}

.whatsapp-float span {
  white-space:nowrap;
}

}

[data-theme="dark"] .shop-page {
  background:#101018;
}

[data-theme="dark"] .shop-page .shop-pro-hero,[data-theme="dark"] .shop-featured {
  background:#111018;
}

[data-theme="dark"] .shop-search,[data-theme="dark"] .shop-search select,[data-theme="dark"] .shop-search input,[data-theme="dark"] .head-action,[data-theme="dark"] .cart-button,[data-theme="dark"] .shop-product {
  background:#171421;
  color:#f2eefb;
  border-color:#2b2537;
}

[data-theme="dark"] .product-thumb {
  background:linear-gradient(180deg,#181421 0%,#12101a 100%);
  border-color:#2b2537;
}

[data-theme="dark"] .shop-product h3,[data-theme="dark"] .product-price span {
  color:#fff;
}

[data-theme="dark"] .product-specs {
  color:#b5adbf;
}

[data-theme="dark"] .add-cart,[data-theme="dark"] .quick-view {
  background:#1e1829;
  color:#fff;
  border-color:#342846;
}

/* --- Product click modal update: quick view button removed --- */
.quick-view {
  display:none!important;
}

.shop-product {
  cursor:pointer;
}

.shop-product .product-buttons,.shop-product .product-buttons * {
  cursor:auto;
}

.product-buttons {
  grid-template-columns:1fr!important;
}

.product-buttons .quick-order,.product-buttons .add-cart {
  grid-column:1/-1;
  width:100%;
}

body.modal-open {
  overflow:hidden;
}

.product-modal[hidden] {
  display:none!important;
}

.product-modal {
  position:fixed;
  inset:0;
  z-index:999;
  display:grid;
  place-items:center;
  padding:1.25rem;
}

.product-modal-backdrop {
  position:absolute;
  inset:0;
  background:rgba(8,7,14,.66);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.product-modal-card {
  position:relative;
  z-index:1;
  width:min(920px,100%);
  max-height:min(760px,92vh);
  overflow:auto;
  display:grid;
  grid-template-columns:minmax(260px,.78fr) minmax(0,1fr);
  gap:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:24px;
  background:#fff;
  box-shadow:0 34px 100px rgba(0,0,0,.34);
}

.product-modal-close {
  position:absolute;
  top:14px;
  right:14px;
  z-index:2;
  width:42px;
  height:42px;
  border:1px solid #e3deea;
  border-radius:50%;
  background:#fff;
  color:#171522;
  font-size:1.6rem;
  line-height:1;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}

.product-modal-close:hover {
  border-color:var(--purple);
  color:var(--purple);
}

.product-modal-image-wrap {
  min-height:390px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:2rem;
  background:linear-gradient(180deg,#fff 0%,#f7f5fb 100%);
  border-right:1px solid #eeeaf4;
}

.product-modal-image-wrap img {
  max-width:100%;
  max-height:320px;
  object-fit:contain;
}

.product-modal-info {
  padding:2.2rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
}

.product-modal-category {
  margin:0;
  color:var(--purple);
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.product-modal-info h2 {
  margin:0;
  color:#171522;
  font-size:clamp(1.55rem,3vw,2.35rem);
  line-height:1.12;
  letter-spacing:-.045em;
}

.product-modal-price {
  display:flex;
  align-items:baseline;
  gap:.65rem;
  flex-wrap:wrap;
  margin:.1rem 0 .35rem;
}

.product-modal-price span {
  color:#151422;
  font-size:1.45rem;
  font-weight:950;
}

.product-modal-price del {
  color:#8f8798;
  font-size:.95rem;
}

.product-modal-specs {
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.55rem;
}

.product-modal-specs li {
  position:relative;
  padding:.75rem .75rem .75rem 1.6rem;
  border:1px solid #eeeaf4;
  border-radius:12px;
  background:#fbfaff;
  color:#504b59;
  font-size:.88rem;
  line-height:1.35;
}

.product-modal-specs li::before {
  content:"";
  position:absolute;
  left:.75rem;
  top:1.12rem;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--orange);
}

.product-modal-actions {
  margin-top:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.7rem;
}

.product-modal-actions .quick-order,.product-modal-actions .add-cart {
  min-height:46px;
  border-radius:10px;
  font-size:.86rem;
  font-weight:900;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  cursor:pointer;
}

.product-modal-actions .quick-order {
  background:var(--purple);
  color:#fff;
  border:1px solid var(--purple);
}

.product-modal-actions .quick-order:hover {
  background:var(--purple-dark);
  border-color:var(--purple-dark);
}

.product-modal-actions .add-cart {
  background:#fff;
  color:#201f2a;
  border:1px solid #d9d2e4;
}

.product-modal-actions .add-cart:hover {
  border-color:var(--purple);
  color:var(--purple);
}

@media(max-width:760px) {
  .product-modal {
  padding:.75rem;
}

.product-modal-card {
  grid-template-columns:1fr;
  max-height:92vh;
}

.product-modal-image-wrap {
  min-height:240px;
  border-right:0;
  border-bottom:1px solid #eeeaf4;
}

.product-modal-image-wrap img {
  max-height:210px;
}

.product-modal-info {
  padding:1.35rem;
}

.product-modal-specs {
  grid-template-columns:1fr;
}

.product-modal-actions {
  grid-template-columns:1fr;
}

}

[data-theme="dark"] .product-modal-card {
  background:#171421;
  border-color:#2b2537;
}

[data-theme="dark"] .product-modal-close {
  background:#1e1829;
  color:#fff;
  border-color:#342846;
}

[data-theme="dark"] .product-modal-image-wrap {
  background:linear-gradient(180deg,#181421 0%,#12101a 100%);
  border-color:#2b2537;
}

[data-theme="dark"] .product-modal-info h2,[data-theme="dark"] .product-modal-price span {
  color:#fff;
}

[data-theme="dark"] .product-modal-specs li {
  background:#1e1829;
  color:#c8c0d2;
  border-color:#342846;
}

[data-theme="dark"] .product-modal-actions .add-cart {
  background:#1e1829;
  color:#fff;
  border-color:#342846;
}

/* --- Requested update: product details pop-up buttons side by side --- */
.product-modal-actions {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:.5rem!important;
  align-items:stretch!important;
}

.product-modal-actions .quick-order,
.product-modal-actions .add-cart {
  width:100%!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
}

@media(max-width:420px) {
  .product-modal-actions {
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:.38rem!important;
}

.product-modal-actions .quick-order,
  .product-modal-actions .add-cart {
  font-size:.68rem!important;
  padding:.48rem .28rem!important;
}

}

/* --- REAL FIX: product details pop-up Quick Order + Add to cart side by side --- */
#productModal .product-modal-actions,
#productModal .modal-actions-row {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
  align-items:stretch!important;
  justify-content:space-between!important;
  width:100%!important;
}

#productModal .product-modal-actions > a,
#productModal .product-modal-actions > button,
#productModal .modal-actions-row > a,
#productModal .modal-actions-row > button {
  flex:1 1 0!important;
  width:50%!important;
  max-width:none!important;
  min-width:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  min-height:38px!important;
  padding:0.55rem 0.45rem!important;
  font-size:0.76rem!important;
  border-radius:8px!important;
  line-height:1.1!important;
  box-sizing:border-box!important;
  float:none!important;
  clear:none!important;
}

@media(max-width:420px) {
  #productModal .product-modal-actions,
  #productModal .modal-actions-row {
  gap:6px!important;
}

#productModal .product-modal-actions > a,
  #productModal .product-modal-actions > button,
  #productModal .modal-actions-row > a,
  #productModal .modal-actions-row > button {
  font-size:0.66rem!important;
  padding:0.5rem 0.25rem!important;
}

}

/* --- Balanced productGrid update: compact but not overcompressed --- */
#productGrid,
.productGrid,
.product-grid-compact {
  gap:18px!important;
  row-gap:22px!important;
}

#productGrid.shop-product-grid,
.productGrid.shop-product-grid,
.product-grid-compact.shop-product-grid {
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr))!important;
}

#productGrid .product-card,
#productGrid .shop-product,
.productGrid .product-card,
.productGrid .shop-product,
.product-grid-compact .product-card,
.product-grid-compact .shop-product {
  border-radius:18px!important;
  min-height:auto!important;
  overflow:hidden!important;
}

#productGrid .product-image,
#productGrid .product-media,
#productGrid .product-thumb,
#productGrid .shop-product-image,
.productGrid .product-image,
.productGrid .product-media,
.productGrid .product-thumb,
.productGrid .shop-product-image,
.product-grid-compact .product-image,
.product-grid-compact .product-media,
.product-grid-compact .product-thumb,
.product-grid-compact .shop-product-image {
  width:254px!important;
  max-width:100%!important;
  height:127px!important;
  min-height:127px!important;
  padding:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:hidden!important;
}

#productGrid img,
.productGrid img,
.product-grid-compact img {
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:none!important;
  object-fit:contain!important;
  display:block!important;
}

#productGrid .product-body,
#productGrid .product-content,
#productGrid .product-info,
.productGrid .product-body,
.productGrid .product-content,
.productGrid .product-info,
.product-grid-compact .product-body,
.product-grid-compact .product-content,
.product-grid-compact .product-info {
  padding:15px!important;
  gap:9px!important;
}

#productGrid h3,
#productGrid .product-title,
.productGrid h3,
.productGrid .product-title,
.product-grid-compact h3,
.product-grid-compact .product-title {
  font-size:1rem!important;
  line-height:1.28!important;
  margin:0!important;
}

#productGrid .product-category,
#productGrid .category,
.productGrid .product-category,
.productGrid .category,
.product-grid-compact .product-category,
.product-grid-compact .category {
  font-size:.70rem!important;
  margin:0!important;
  letter-spacing:.09em!important;
}

#productGrid .product-price,
#productGrid .price,
.productGrid .product-price,
.productGrid .price,
.product-grid-compact .product-price,
.product-grid-compact .price {
  font-size:.92rem!important;
  margin:0!important;
}

#productGrid .product-price span,
#productGrid .price span,
.productGrid .product-price span,
.productGrid .price span,
.product-grid-compact .product-price span,
.product-grid-compact .price span {
  font-size:1.05rem!important;
}

#productGrid .product-desc,
#productGrid .product-description,
#productGrid p,
.productGrid .product-desc,
.productGrid .product-description,
.productGrid p,
.product-grid-compact .product-desc,
.product-grid-compact .product-description,
.product-grid-compact p {
  font-size:.82rem!important;
  line-height:1.48!important;
  margin:0!important;
}

#productGrid .product-specs,
#productGrid ul,
.productGrid .product-specs,
.productGrid ul,
.product-grid-compact .product-specs,
.product-grid-compact ul {
  gap:5px!important;
  margin:7px 0!important;
}

#productGrid .product-specs li,
#productGrid li,
.productGrid .product-specs li,
.productGrid li,
.product-grid-compact .product-specs li,
.product-grid-compact li {
  font-size:.78rem!important;
  line-height:1.35!important;
}

#productGrid .product-buttons,
.productGrid .product-buttons,
.product-grid-compact .product-buttons {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:10px!important;
}

#productGrid .product-buttons a,
#productGrid .product-buttons button,
.productGrid .product-buttons a,
.productGrid .product-buttons button,
.product-grid-compact .product-buttons a,
.product-grid-compact .product-buttons button {
  min-height:38px!important;
  padding:9px 8px!important;
  border-radius:9px!important;
  font-size:.74rem!important;
  line-height:1.15!important;
}

@media(max-width:900px) {
  #productGrid.shop-product-grid,
  .productGrid.shop-product-grid,
  .product-grid-compact.shop-product-grid {
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr))!important;
}

}

@media(max-width:560px) {
  #productGrid,
  .productGrid,
  .product-grid-compact {
  gap:14px!important;
}

#productGrid.shop-product-grid,
  .productGrid.shop-product-grid,
  .product-grid-compact.shop-product-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

#productGrid .product-image,
  #productGrid .product-media,
  #productGrid .product-thumb,
  #productGrid .shop-product-image,
  .productGrid .product-image,
  .productGrid .product-media,
  .productGrid .product-thumb,
  .productGrid .shop-product-image,
  .product-grid-compact .product-image,
  .product-grid-compact .product-media,
  .product-grid-compact .product-thumb,
  .product-grid-compact .shop-product-image {
  width:254px!important;
  max-width:100%!important;
  height:127px!important;
  min-height:127px!important;
  padding:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

#productGrid img,
  .productGrid img,
  .product-grid-compact img {
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  object-fit:contain!important;
}

#productGrid .product-body,
  #productGrid .product-content,
  #productGrid .product-info,
  .productGrid .product-body,
  .productGrid .product-content,
  .productGrid .product-info,
  .product-grid-compact .product-body,
  .product-grid-compact .product-content,
  .product-grid-compact .product-info {
  padding:12px!important;
}

#productGrid h3,
  #productGrid .product-title,
  .productGrid h3,
  .productGrid .product-title,
  .product-grid-compact h3,
  .product-grid-compact .product-title {
  font-size:.88rem!important;
}

#productGrid .product-buttons a,
  #productGrid .product-buttons button,
  .productGrid .product-buttons a,
  .productGrid .product-buttons button,
  .product-grid-compact .product-buttons a,
  .product-grid-compact .product-buttons button {
  min-height:34px!important;
  font-size:.68rem!important;
  padding:7px 5px!important;
}

}

/* --- Compact product details pop-up update --- */
#productModal.product-modal,
.product-modal {
  padding:12px!important;
}

#productModal .product-modal-card,
.product-modal-card {
  width:min(620px,calc(100vw - 24px))!important;
  max-height:82vh!important;
  grid-template-columns:215px minmax(0,1fr)!important;
  border-radius:16px!important;
  overflow:hidden!important;
}

#productModal .product-modal-close,
.product-modal-close {
  top:8px!important;
  right:8px!important;
  width:30px!important;
  height:30px!important;
  font-size:1.1rem!important;
  line-height:1!important;
}

#productModal .product-modal-image-wrap,
.product-modal-image-wrap {
  min-height:220px!important;
  padding:14px!important;
}

#productModal .product-modal-image-wrap img,
.product-modal-image-wrap img {
  max-height:175px!important;
  max-width:100%!important;
  object-fit:contain!important;
}

#productModal .product-modal-info,
.product-modal-info {
  padding:18px!important;
  gap:8px!important;
}

#productModal .product-modal-category,
.product-modal-category {
  font-size:.64rem!important;
  letter-spacing:.1em!important;
  margin:0!important;
}

#productModal .product-modal-info h2,
.product-modal-info h2 {
  font-size:1.28rem!important;
  line-height:1.16!important;
  margin:0!important;
}

#productModal .product-modal-price,
.product-modal-price {
  margin:0!important;
  gap:6px!important;
}

#productModal .product-modal-price span,
.product-modal-price span {
  font-size:1.04rem!important;
}

#productModal .product-modal-price del,
.product-modal-price del {
  font-size:.76rem!important;
}

#productModal .product-modal-info p,
.product-modal-info p {
  font-size:.82rem!important;
  line-height:1.42!important;
  margin:0!important;
}

#productModal .product-modal-specs,
.product-modal-specs {
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:5px!important;
  margin:6px 0!important;
  padding:0!important;
}

#productModal .product-modal-specs li,
.product-modal-specs li {
  padding:7px 8px 7px 20px!important;
  border-radius:9px!important;
  font-size:.74rem!important;
  line-height:1.25!important;
}

#productModal .product-modal-specs li::before,
.product-modal-specs li::before {
  left:9px!important;
  top:13px!important;
  width:4px!important;
  height:4px!important;
}

#productModal .product-modal-actions,
#productModal .modal-actions-row,
.product-modal-actions.modal-actions-row {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:8px!important;
  width:100%!important;
}

#productModal .product-modal-actions > a,
#productModal .product-modal-actions > button,
#productModal .modal-actions-row > a,
#productModal .modal-actions-row > button {
  width:100%!important;
  min-height:36px!important;
  padding:8px 6px!important;
  border-radius:8px!important;
  font-size:.72rem!important;
  line-height:1.1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
}

@media(max-width:720px) {
  #productModal .product-modal-card,
  .product-modal-card {
  width:min(390px,calc(100vw - 18px))!important;
  max-height:84vh!important;
  grid-template-columns:1fr!important;
}

#productModal .product-modal-image-wrap,
  .product-modal-image-wrap {
  min-height:145px!important;
  padding:12px!important;
  border-right:0!important;
  border-bottom:1px solid rgba(0,0,0,.08)!important;
}

#productModal .product-modal-image-wrap img,
  .product-modal-image-wrap img {
  max-height:118px!important;
}

#productModal .product-modal-info,
  .product-modal-info {
  padding:14px!important;
  gap:7px!important;
}

#productModal .product-modal-info h2,
  .product-modal-info h2 {
  font-size:1.08rem!important;
}

#productModal .product-modal-specs li,
  .product-modal-specs li {
  font-size:.70rem!important;
  padding-top:6px!important;
  padding-bottom:6px!important;
}

}

@media(max-width:380px) {
  #productModal .product-modal-card,
  .product-modal-card {
  width:calc(100vw - 14px)!important;
}

#productModal .product-modal-actions,
  #productModal .modal-actions-row,
  .product-modal-actions.modal-actions-row {
  gap:6px!important;
}

#productModal .product-modal-actions > a,
  #productModal .product-modal-actions > button,
  #productModal .modal-actions-row > a,
  #productModal .modal-actions-row > button {
  font-size:.66rem!important;
  padding:7px 4px!important;
}

}

/* --- FINAL FIX: shop-pro-hero unhidden, full-width, no blank space --- */
body.shop-page > .site-header {
  position:sticky!important;
  top:0!important;
  inset:auto!important;
  z-index:1000!important;
  width:100%!important;
  box-sizing:border-box!important;
}

body.shop-page main#main-content,
body.shop-page main {
  padding-top:0!important;
  margin-top:0!important;
  overflow:visible!important;
  display:block!important;
}

body.shop-page #top.shop-pro-hero.hero-unhidden-final,
body.shop-page #top.shop-pro-hero,
body.shop-page .shop-pro-hero {
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:1!important;
  width:100vw!important;
  max-width:none!important;
  margin:0 calc(50% - 50vw)!important;
  padding:6px 0!important;
  min-height:0!important;
  height:auto!important;
  overflow:visible!important;
  border-radius:0!important;
  background:#f4f2f8!important;
  border-top:0!important;
  border-bottom:1px solid #e5e0ec!important;
  box-sizing:border-box!important;
  transform:none!important;
}

body.shop-page #top.shop-pro-hero .shop-header {
  display:block!important;
  visibility:visible!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}

body.shop-page #top.shop-pro-hero .shop-header-inner {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 5vw!important;
  box-sizing:border-box!important;
}

body.shop-page #top.shop-pro-hero .shop-search {
  display:grid!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body.shop-page #top.shop-pro-hero .shop-search select,
body.shop-page #top.shop-pro-hero .shop-search input,
body.shop-page #top.shop-pro-hero .shop-search button,
body.shop-page #top.shop-pro-hero .head-action,
body.shop-page #top.shop-pro-hero .cart-button {
  height:46px!important;
  min-height:46px!important;
}

body.shop-page #top.shop-pro-hero + * {
  margin-top:0!important;
}

@media(max-width:880px) {
  body.shop-page #top.shop-pro-hero .shop-header-inner {
  grid-template-columns:1fr!important;
  padding:0 1rem!important;
  gap:7px!important;
}

body.shop-page #top.shop-pro-hero .shop-search select,
  body.shop-page #top.shop-pro-hero .shop-search input,
  body.shop-page #top.shop-pro-hero .shop-search button,
  body.shop-page #top.shop-pro-hero .head-action,
  body.shop-page #top.shop-pro-hero .cart-button {
  height:43px!important;
  min-height:43px!important;
}

}

/* --- Shop pagination added below catalogue --- */
.catalog-pagination,
.shop-pagination {
  width:100%;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:18px!important;
  margin:10px auto 34px!important;
  padding:22px 0 4px!important;
  list-style:none!important;
  clear:both!important;
}

.catalog-pagination button,
.catalog-pagination .page-dots,
.shop-pagination button,
.shop-pagination .page-dots {
  appearance:none!important;
  border:0!important;
  background:transparent!important;
  color:#07152f!important;
  min-width:22px!important;
  height:34px!important;
  padding:0 4px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:7px!important;
  font-size:15px!important;
  font-weight:500!important;
  line-height:1!important;
  cursor:pointer!important;
}

.catalog-pagination .page-number.is-active,
.shop-pagination .page-number.is-active {
  min-width:34px!important;
  height:34px!important;
  background:#000!important;
  color:#fff!important;
  font-weight:700!important;
  box-shadow:0 8px 18px rgba(0,0,0,.12)!important;
}

.catalog-pagination .page-number:not(.is-active):hover,
.catalog-pagination .page-next:hover,
.shop-pagination .page-number:not(.is-active):hover,
.shop-pagination .page-next:hover {
  background:rgba(0,0,0,.07)!important;
}

.catalog-pagination .page-dots,
.shop-pagination .page-dots {
  cursor:default!important;
  pointer-events:none!important;
  font-weight:600!important;
}

.catalog-pagination .page-next,
.shop-pagination .page-next {
  font-size:26px!important;
  font-weight:400!important;
  min-width:32px!important;
}

.shop-product.is-page-hidden,
.product-card.is-page-hidden,
.shop-product-card.is-page-hidden {
  display:none!important;
}

@media(max-width:560px) {
  .catalog-pagination,
  .shop-pagination {
  gap:10px!important;
  margin:8px auto 24px!important;
  padding-top:16px!important;
}

.catalog-pagination button,
  .catalog-pagination .page-dots,
  .shop-pagination button,
  .shop-pagination .page-dots {
  font-size:13px!important;
  min-width:20px!important;
  height:32px!important;
}

.catalog-pagination .page-number.is-active,
  .shop-pagination .page-number.is-active {
  min-width:32px!important;
  height:32px!important;
}

}

/* --- FINAL FIX: Quick Order and Add to cart side by side --- */

/* Product cards */
#productGrid .product-buttons,
#productGrid .product-actions,
#productGrid .product-card-actions,
#productGrid .shop-product-actions,
#productGrid .mivek-actions-row,
.productGrid .product-buttons,
.productGrid .product-actions,
.productGrid .product-card-actions,
.productGrid .shop-product-actions,
.productGrid .mivek-actions-row,
.product-grid-compact .product-buttons,
.product-grid-compact .product-actions,
.product-grid-compact .product-card-actions,
.product-grid-compact .shop-product-actions,
.product-grid-compact .mivek-actions-row {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

/* The two buttons themselves */
#productGrid .quick-order,
#productGrid .add-cart,
#productGrid .add-to-cart,
#productGrid [data-quick-order],
#productGrid [data-add-cart],
.productGrid .quick-order,
.productGrid .add-cart,
.productGrid .add-to-cart,
.productGrid [data-quick-order],
.productGrid [data-add-cart],
.product-grid-compact .quick-order,
.product-grid-compact .add-cart,
.product-grid-compact .add-to-cart,
.product-grid-compact [data-quick-order],
.product-grid-compact [data-add-cart] {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  min-height:38px!important;
  padding:8px 6px!important;
  margin:0!important;
  float:none!important;
  clear:none!important;
  box-sizing:border-box!important;
  text-align:center!important;
  white-space:nowrap!important;
  line-height:1.1!important;
}

/* If the buttons are the only two direct children of the actions wrapper, force them into columns */
#productGrid .mivek-actions-row > *,
.productGrid .mivek-actions-row > *,
.product-grid-compact .mivek-actions-row > * {
  min-width:0!important;
}

/* Product details pop-up */
#productModal .product-modal-actions,
#productModal .modal-actions-row,
.product-modal-actions.modal-actions-row {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

#productModal .product-modal-actions > a,
#productModal .product-modal-actions > button,
#productModal .modal-actions-row > a,
#productModal .modal-actions-row > button {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  min-height:38px!important;
  padding:8px 6px!important;
  margin:0!important;
  float:none!important;
  clear:none!important;
  box-sizing:border-box!important;
  text-align:center!important;
  white-space:nowrap!important;
  line-height:1.1!important;
}

@media(max-width:420px) {
  #productGrid .product-buttons,
  #productGrid .product-actions,
  #productGrid .product-card-actions,
  #productGrid .shop-product-actions,
  #productGrid .mivek-actions-row,
  .productGrid .product-buttons,
  .productGrid .product-actions,
  .productGrid .product-card-actions,
  .productGrid .shop-product-actions,
  .productGrid .mivek-actions-row,
  .product-grid-compact .product-buttons,
  .product-grid-compact .product-actions,
  .product-grid-compact .product-card-actions,
  .product-grid-compact .shop-product-actions,
  .product-grid-compact .mivek-actions-row,
  #productModal .product-modal-actions,
  #productModal .modal-actions-row {
  gap:6px!important;
}

#productGrid .quick-order,
  #productGrid .add-cart,
  #productGrid .add-to-cart,
  #productGrid [data-quick-order],
  #productGrid [data-add-cart],
  .productGrid .quick-order,
  .productGrid .add-cart,
  .productGrid .add-to-cart,
  .productGrid [data-quick-order],
  .productGrid [data-add-cart],
  .product-grid-compact .quick-order,
  .product-grid-compact .add-cart,
  .product-grid-compact .add-to-cart,
  .product-grid-compact [data-quick-order],
  .product-grid-compact [data-add-cart],
  #productModal .product-modal-actions > a,
  #productModal .product-modal-actions > button,
  #productModal .modal-actions-row > a,
  #productModal .modal-actions-row > button {
  font-size:.66rem!important;
  padding:7px 4px!important;
}

}

/* --- TRUE FINAL FIX: Quick Order and Add to cart side by side --- */
html body.shop-page #productGrid .shop-product .product-content > .product-buttons,
html body.shop-page #productGrid .product-buttons.mivek-actions-row,
html body.shop-page .productGrid .product-buttons.mivek-actions-row,
html body.shop-page .product-grid-compact .product-buttons.mivek-actions-row {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

html body.shop-page #productGrid .product-buttons.mivek-actions-row > .quick-order,
html body.shop-page #productGrid .product-buttons.mivek-actions-row > .add-cart,
html body.shop-page .productGrid .product-buttons.mivek-actions-row > .quick-order,
html body.shop-page .productGrid .product-buttons.mivek-actions-row > .add-cart,
html body.shop-page .product-grid-compact .product-buttons.mivek-actions-row > .quick-order,
html body.shop-page .product-grid-compact .product-buttons.mivek-actions-row > .add-cart {
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
  float:none!important;
  clear:none!important;
}

html body.shop-page #productModal .product-modal-actions,
html body.shop-page #productModal .modal-actions-row {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

html body.shop-page #productModal .product-modal-actions > .quick-order,
html body.shop-page #productModal .product-modal-actions > .add-cart,
html body.shop-page #productModal .modal-actions-row > .quick-order,
html body.shop-page #productModal .modal-actions-row > .add-cart {
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
  float:none!important;
  clear:none!important;
}

/* Override the earlier mobile rule that changed product buttons to one column */
@media(max-width:560px) {
  html body.shop-page #productGrid .product-buttons.mivek-actions-row,
  html body.shop-page .productGrid .product-buttons.mivek-actions-row,
  html body.shop-page .product-grid-compact .product-buttons.mivek-actions-row,
  html body.shop-page #productModal .product-modal-actions,
  html body.shop-page #productModal .modal-actions-row {
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

}

/* Moved from root style.css */
/* --- Mivek Solutions Shop Professional Redesign --- */
.shop-redesign .site-header {
  z-index:50;
}

.desktop-nav a.is-current {
  color:var(--purple);
}

.desktop-nav a.is-current::after {
  content:"";
  display:block;
  width:100%;
  height:2px;
  margin-top:.32rem;
  background:var(--purple);
  border-radius:999px;
}

.shop-pro-hero {
  position:relative;
  isolation:isolate;
  padding:150px 5vw 72px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.62fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:center;
  overflow:hidden;
  background:radial-gradient(circle at 78% 16%,rgba(79,22,199,.18),transparent 31%),radial-gradient(circle at 12% 86%,rgba(216,135,24,.12),transparent 27%),linear-gradient(135deg,#f8f6fc 0%,#fff 58%,#f1ebff 100%);
}

.shop-pro-hero::after {
  content:"";
  position:absolute;
  right:-9rem;
  top:5rem;
  width:31rem;
  height:31rem;
  border:1px solid rgba(79,22,199,.14);
  border-radius:50%;
  box-shadow:0 0 0 4.8rem rgba(79,22,199,.035),0 0 0 9.6rem rgba(79,22,199,.025);
  z-index:-1;
}

.shop-pro-copy h1 {
  max-width:900px;
  margin-bottom:1.35rem;
  font-size:clamp(2.9rem,5.6vw,6rem);
  letter-spacing:-.075em;
  font-weight:800;
}

.shop-pro-copy .hero-lead {
  max-width:720px;
}

.shop-mini-points {
  margin:1.8rem 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  list-style:none;
}

.shop-mini-points li {
  padding:.7rem 1rem;
  border:1px solid rgba(79,22,199,.14);
  border-radius:999px;
  background:rgba(255,255,255,.72);
  box-shadow:0 12px 30px rgba(50,16,113,.06);
  color:var(--ink-soft);
  font-size:.88rem;
  font-weight:700;
}

.shop-pro-panel {
  padding:1.1rem;
  border:1px solid rgba(79,22,199,.12);
  border-radius:30px;
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.shop-panel-head {
  padding:1.2rem 1.25rem 1rem;
  border-radius:22px;
  background:linear-gradient(135deg,var(--ink) 0%,#22133f 55%,var(--purple-dark) 100%);
  color:#fff;
}

.shop-panel-head span {
  display:block;
  margin-bottom:.45rem;
  color:#d8a652;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.18em;
}

.shop-panel-head strong {
  display:block;
  font-size:1.3rem;
  line-height:1.12;
}

.shop-pro-panel ol {
  margin:1rem 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.75rem;
}

.shop-pro-panel li {
  display:flex;
  gap:.95rem;
  align-items:flex-start;
  padding:1rem;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--surface);
}

.shop-pro-panel li>span {
  flex:0 0 auto;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:var(--purple-soft);
  color:var(--purple);
  font-size:.78rem;
  font-weight:800;
}

.shop-pro-panel li strong {
  display:block;
  margin:.1rem 0 .22rem;
  color:var(--ink);
}

.shop-pro-panel li small {
  display:block;
  color:var(--muted);
  line-height:1.5;
}

.shop-category-strip {
  padding:1.1rem 5vw;
  display:flex;
  gap:.65rem;
  overflow:auto;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--surface);
  scrollbar-width:thin;
}

.shop-category-strip a {
  white-space:nowrap;
  padding:.75rem 1rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--ink-soft);
  font-size:.86rem;
  font-weight:800;
  text-decoration:none;
}

.shop-category-strip a:hover {
  border-color:var(--purple);
  color:var(--purple);
  background:var(--purple-soft);
}

.shop-featured {
  background:var(--paper);
}

.shop-product-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.15rem;
}

.product-card {
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:28px;
  background:var(--surface);
  box-shadow:0 20px 55px rgba(50,16,113,.08);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.product-card:hover {
  transform:translateY(-5px);
  border-color:rgba(79,22,199,.34);
  box-shadow:0 26px 70px rgba(50,16,113,.13);
}

.product-media {
  height:118px;
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  padding:1.2rem;
  background:radial-gradient(circle at 85% 24%,rgba(255,255,255,.34),transparent 28%),linear-gradient(135deg,var(--purple) 0%,#220a58 100%);
  color:#fff;
}

.product-media span {
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.32);
  border-radius:18px;
  background:rgba(255,255,255,.14);
  font-weight:800;
}

.product-body {
  padding:1.25rem;
  display:flex;
  flex-direction:column;
  gap:.75rem;
  flex:1;
}

.product-category {
  margin:0;
  color:var(--orange);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.product-body h3 {
  margin:0;
  font-size:1.25rem;
  letter-spacing:-.03em;
}

.product-body p {
  margin:0;
  color:var(--text);
  line-height:1.65;
}

.product-body ul {
  margin:.15rem 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.35rem;
  color:var(--muted);
  font-size:.9rem;
}

.product-body li {
  position:relative;
  padding-left:1rem;
}

.product-body li::before {
  content:"";
  position:absolute;
  left:0;
  top:.65em;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--purple);
}

.product-actions {
  margin-top:auto;
  display:flex;
  gap:.55rem;
  flex-wrap:wrap;
}

.product-actions .button {
  min-height:42px;
  padding:.66rem .95rem;
  font-size:.82rem;
}

.quote-panel {
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:1.25rem;
  align-items:stretch;
  background:linear-gradient(135deg,#170d2c 0%,#2a0b63 62%,#4f16c7 100%);
  color:#fff;
}

.quote-card-large,.quote-side {
  border:1px solid rgba(255,255,255,.16);
  border-radius:30px;
  background:rgba(255,255,255,.08);
  box-shadow:0 28px 80px rgba(0,0,0,.2);
}

.quote-card-large {
  padding:clamp(1.5rem,3vw,2.6rem);
}

.quote-card-large .eyebrow,.quote-card-large .hero-lead {
  color:#fff;
}

.quote-card-large h2 {
  max-width:680px;
  margin-bottom:1rem;
  font-size:clamp(2.1rem,4vw,4.4rem);
  letter-spacing:-.06em;
}

.quote-card-large p {
  max-width:720px;
  color:rgba(255,255,255,.76);
  line-height:1.7;
}

.quote-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  margin-top:1.4rem;
}

.quote-panel .button-secondary {
  border-color:rgba(255,255,255,.28);
  color:#fff;
}

.quote-panel .button-secondary:hover {
  background:rgba(255,255,255,.1);
  color:#fff;
}

.quote-side {
  padding:1.4rem;
}

.quote-side strong {
  display:block;
  margin-bottom:1rem;
  font-size:1.05rem;
}

.quote-side ul {
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.7rem;
}

.quote-side li {
  padding:.8rem .9rem;
  border:1px solid rgba(255,255,255,.15);
  border-radius:16px;
  color:rgba(255,255,255,.84);
  background:rgba(255,255,255,.07);
}

.whatsapp-float {
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:40;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.8rem 1rem;
  border-radius:999px;
  background:#25d366;
  color:#062b15;
  text-decoration:none;
  font-size:.88rem;
  font-weight:800;
  box-shadow:0 16px 40px rgba(37,211,102,.3);
}

.whatsapp-float svg {
  width:22px;
  height:22px;
  stroke-width:1.9;
}

@media (max-width:1080px) {
  .shop-pro-hero {
  grid-template-columns:1fr;
  padding-top:132px;
}

.shop-product-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.quote-panel {
  grid-template-columns:1fr;
}

}

@media (max-width:680px) {
  .shop-pro-hero {
  padding:118px 1.1rem 44px;
}

.shop-pro-copy h1 {
  font-size:2.8rem;
}

.shop-mini-points {
  display:grid;
}

.shop-category-strip {
  padding-inline:1.1rem;
}

.shop-product-grid {
  grid-template-columns:1fr;
}

.product-actions .button {
  width:100%;
}

.quote-panel {
  padding-inline:1.1rem;
}

.whatsapp-float {
  left:14px;
  right:14px;
  justify-content:center;
}

}

[data-theme="dark"] .shop-pro-hero {
  background:radial-gradient(circle at 78% 16%,rgba(111,66,255,.18),transparent 31%),radial-gradient(circle at 12% 86%,rgba(216,135,24,.12),transparent 27%),linear-gradient(135deg,#0c0b12 0%,#151022 58%,#1c1239 100%);
}

[data-theme="dark"] .shop-pro-panel,[data-theme="dark"] .shop-mini-points li {
  background:rgba(24,22,32,.82);
}

[data-theme="dark"] .shop-category-strip {
  background:var(--surface);
}

[data-theme="dark"] .product-media {
  background:radial-gradient(circle at 85% 24%,rgba(255,255,255,.16),transparent 28%),linear-gradient(135deg,#5b20dc 0%,#17063e 100%);
}

/* Inline style moved from shop/index.html — #mivek-shop-hero-unhidden-final */
/* FINAL: Stop the fixed site header from covering the shop search strip */
    body.shop-page > .site-header {
  position:sticky!important;
  top:0!important;
  inset:auto!important;
  z-index:1000!important;
  width:100%!important;
  box-sizing:border-box!important;
}

body.shop-page main#main-content,
    body.shop-page main {
  padding-top:0!important;
  margin-top:0!important;
  overflow:visible!important;
  display:block!important;
}

body.shop-page #top.shop-pro-hero.hero-unhidden-final,
    body.shop-page #top.shop-pro-hero,
    body.shop-page .shop-pro-hero {
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:1!important;
  width:100vw!important;
  max-width:none!important;
  margin:0 calc(50% - 50vw)!important;
  padding:6px 0!important;
  min-height:0!important;
  height:auto!important;
  overflow:visible!important;
  border-radius:0!important;
  background:#f4f2f8!important;
  border-top:0!important;
  border-bottom:1px solid #e5e0ec!important;
  box-sizing:border-box!important;
  transform:none!important;
}

body.shop-page #top.shop-pro-hero .shop-header {
  display:block!important;
  visibility:visible!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}

body.shop-page #top.shop-pro-hero .shop-header-inner {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 5vw!important;
  box-sizing:border-box!important;
}

body.shop-page #top.shop-pro-hero .shop-search {
  display:grid!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body.shop-page #top.shop-pro-hero .shop-search select,
    body.shop-page #top.shop-pro-hero .shop-search input,
    body.shop-page #top.shop-pro-hero .shop-search button,
    body.shop-page #top.shop-pro-hero .head-action,
    body.shop-page #top.shop-pro-hero .cart-button {
  height:46px!important;
  min-height:46px!important;
}

body.shop-page #top.shop-pro-hero + * {
  margin-top:0!important;
}

@media(max-width:880px) {
  body.shop-page #top.shop-pro-hero .shop-header-inner {
  grid-template-columns:1fr!important;
  padding:0 1rem!important;
  gap:7px!important;
}

body.shop-page #top.shop-pro-hero .shop-search select,
      body.shop-page #top.shop-pro-hero .shop-search input,
      body.shop-page #top.shop-pro-hero .shop-search button,
      body.shop-page #top.shop-pro-hero .head-action,
      body.shop-page #top.shop-pro-hero .cart-button {
  height:43px!important;
  min-height:43px!important;
}

}

/* Inline style moved from shop/index.html — #mivek-modal-buttons-real-fix */
#productModal .product-modal-actions,
    #productModal .modal-actions-row {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
  align-items:stretch!important;
  justify-content:space-between!important;
  width:100%!important;
}

#productModal .product-modal-actions > a,
    #productModal .product-modal-actions > button,
    #productModal .modal-actions-row > a,
    #productModal .modal-actions-row > button {
  flex:1 1 0!important;
  width:50%!important;
  max-width:none!important;
  min-width:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:nowrap!important;
  min-height:38px!important;
  padding:0.55rem 0.45rem!important;
  font-size:0.76rem!important;
  border-radius:8px!important;
  line-height:1.1!important;
  box-sizing:border-box!important;
  float:none!important;
  clear:none!important;
}

@media(max-width:420px) {
  #productModal .product-modal-actions,
      #productModal .modal-actions-row {
  gap:6px!important;
}

#productModal .product-modal-actions > a,
      #productModal .product-modal-actions > button,
      #productModal .modal-actions-row > a,
      #productModal .modal-actions-row > button {
  font-size:0.66rem!important;
  padding:0.5rem 0.25rem!important;
}

}

/* --- Shop local final overrides --- */

/* Ensure the shop CSS owns the product card button layout */
#productGrid .product-buttons,
#productGrid .product-actions,
#productGrid .product-card-actions,
#productGrid .shop-product-actions,
#productGrid .mivek-actions-row,
.productGrid .product-buttons,
.productGrid .product-actions,
.productGrid .product-card-actions,
.productGrid .shop-product-actions,
.productGrid .mivek-actions-row,
.product-grid-compact .product-buttons,
.product-grid-compact .product-actions,
.product-grid-compact .product-card-actions,
.product-grid-compact .shop-product-actions,
.product-grid-compact .mivek-actions-row {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

#productGrid .quick-order,
#productGrid .add-cart,
#productGrid .add-to-cart,
#productGrid [data-quick-order],
#productGrid [data-add-cart],
.productGrid .quick-order,
.productGrid .add-cart,
.productGrid .add-to-cart,
.productGrid [data-quick-order],
.productGrid [data-add-cart],
.product-grid-compact .quick-order,
.product-grid-compact .add-cart,
.product-grid-compact .add-to-cart,
.product-grid-compact [data-quick-order],
.product-grid-compact [data-add-cart] {
  grid-column:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  min-height:38px!important;
  padding:8px 6px!important;
  margin:0!important;
  float:none!important;
  clear:none!important;
  box-sizing:border-box!important;
  text-align:center!important;
  white-space:nowrap!important;
  line-height:1.1!important;
}

/* Product details pop-up buttons side by side */
#productModal .product-modal-actions,
#productModal .modal-actions-row,
.product-modal-actions.modal-actions-row {
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}

#productModal .product-modal-actions > a,
#productModal .product-modal-actions > button,
#productModal .modal-actions-row > a,
#productModal .modal-actions-row > button {
  grid-column:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  min-height:38px!important;
  padding:8px 6px!important;
  margin:0!important;
  float:none!important;
  clear:none!important;
  box-sizing:border-box!important;
  text-align:center!important;
  white-space:nowrap!important;
  line-height:1.1!important;
}

/* Keep shop hero/search strip visible and full-width */
body.shop-page main {
  padding-top:0!important;
  margin-top:0!important;
  overflow:visible!important;
}

body.shop-page #top.shop-pro-hero {
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  margin-bottom:0!important;
  padding-left:0!important;
  padding-right:0!important;
  border-radius:0!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}

body.shop-page #top.shop-pro-hero + * {
  margin-top:0!important;
}

/* Pagination below catalogue */
.catalog-pagination,
.shop-pagination {
  width:100%;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:18px!important;
  margin:10px auto 34px!important;
  padding:22px 0 4px!important;
  list-style:none!important;
  clear:both!important;
}

.catalog-pagination button,
.catalog-pagination .page-dots,
.shop-pagination button,
.shop-pagination .page-dots {
  appearance:none!important;
  border:0!important;
  background:transparent!important;
  color:#07152f!important;
  min-width:22px!important;
  height:34px!important;
  padding:0 4px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:7px!important;
  font-size:15px!important;
  font-weight:500!important;
  line-height:1!important;
  cursor:pointer!important;
}

.catalog-pagination .page-number.is-active,
.shop-pagination .page-number.is-active {
  min-width:34px!important;
  height:34px!important;
  background:#000!important;
  color:#fff!important;
  font-weight:700!important;
  box-shadow:0 8px 18px rgba(0,0,0,.12)!important;
}

.shop-product.is-page-hidden,
.product-card.is-page-hidden,
.shop-product-card.is-page-hidden {
  display:none!important;
}

@media(max-width:560px) {
  #productGrid .product-buttons,
  #productGrid .product-actions,
  #productGrid .product-card-actions,
  #productGrid .shop-product-actions,
  #productGrid .mivek-actions-row,
  #productModal .product-modal-actions,
  #productModal .modal-actions-row {
  gap:6px!important;
}

}

/* --- Fixed site-header and shop-header-inner while scrolling --- */
body.shop-page.fixed-shop-bars {
  --mivek-site-header-height: 76px;
  --mivek-shop-header-height: 66px;
  padding-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height))!important;
}

/* Main top navigation must not move while scrolling */
body.shop-page.fixed-shop-bars .site-header {
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  height:var(--mivek-site-header-height)!important;
  min-height:var(--mivek-site-header-height)!important;
  z-index:10000!important;
  transform:none!important;
  margin:0!important;
}

/* The shop search/category bar must also stay fixed below the main header */
body.shop-page.fixed-shop-bars .shop-header {
  position:fixed!important;
  top:var(--mivek-site-header-height)!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  min-height:var(--mivek-shop-header-height)!important;
  z-index:9999!important;
  margin:0!important;
  padding:0!important;
  background:#f4f2f8!important;
  border-bottom:1px solid #e5e0ec!important;
  box-shadow:0 10px 26px rgba(9,13,31,.08)!important;
  transform:none!important;
}

/* Force shop-header-inner to remain static inside the fixed shop-header */
body.shop-page.fixed-shop-bars .shop-header-inner {
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  width:100%!important;
  max-width:none!important;
  min-height:var(--mivek-shop-header-height)!important;
  margin:0!important;
  padding:8px 5vw!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
  transform:none!important;
}

/* Remove old hero spacing because body padding now creates the correct offset */
body.shop-page.fixed-shop-bars #top.shop-pro-hero {
  margin-top:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
  min-height:0!important;
  height:auto!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/* Keep the search row compact and full-width */
body.shop-page.fixed-shop-bars .shop-search {
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body.shop-page.fixed-shop-bars .shop-search select,
body.shop-page.fixed-shop-bars .shop-search input,
body.shop-page.fixed-shop-bars .shop-search button,
body.shop-page.fixed-shop-bars .head-action,
body.shop-page.fixed-shop-bars .cart-button {
  height:48px!important;
  min-height:48px!important;
}

/* Prevent anchors from hiding behind fixed bars */
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid,
body.shop-page.fixed-shop-bars section[id] {
  scroll-margin-top:calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height) + 18px)!important;
}

@media(max-width:880px) {
  body.shop-page.fixed-shop-bars {
  --mivek-site-header-height:70px;
  --mivek-shop-header-height:118px;
}

body.shop-page.fixed-shop-bars .shop-header-inner {
  grid-template-columns:1fr!important;
  gap:8px!important;
  padding:7px 1rem!important;
}

body.shop-page.fixed-shop-bars .shop-search select,
  body.shop-page.fixed-shop-bars .shop-search input,
  body.shop-page.fixed-shop-bars .shop-search button,
  body.shop-page.fixed-shop-bars .head-action,
  body.shop-page.fixed-shop-bars .cart-button {
  height:44px!important;
  min-height:44px!important;
}

}

@media(max-width:560px) {
  body.shop-page.fixed-shop-bars {
  --mivek-site-header-height:68px;
  --mivek-shop-header-height:116px;
}

}

/* --- Cart view visibility and drawer fix --- */
body.cart-open {
  overflow:hidden!important;
}

/* Keep the cart controls above normal content but below the open drawer */
body.shop-page.fixed-shop-bars .cart-button,
body.shop-page.fixed-shop-bars [data-cart-toggle],
.cart-button,
[data-cart-toggle] {
  position:relative!important;
  z-index:10020!important;
  pointer-events:auto!important;
  cursor:pointer!important;
}

/* Cart drawer must sit above fixed site-header and shop-header */
.cart-drawer {
  position:fixed!important;
  inset:0!important;
  z-index:20000!important;
  display:none!important;
  pointer-events:none!important;
}

.cart-drawer.is-open {
  display:block!important;
  pointer-events:auto!important;
}

.cart-drawer[aria-hidden="false"] {
  display:block!important;
  pointer-events:auto!important;
}

.cart-drawer-backdrop {
  position:absolute!important;
  inset:0!important;
  background:rgba(7,10,26,.58)!important;
  backdrop-filter:blur(4px)!important;
  -webkit-backdrop-filter:blur(4px)!important;
}

.cart-drawer-panel {
  position:absolute!important;
  top:0!important;
  right:0!important;
  width:min(420px,92vw)!important;
  height:100vh!important;
  max-height:100vh!important;
  display:flex!important;
  flex-direction:column!important;
  background:#fff!important;
  color:#07152f!important;
  box-shadow:-24px 0 70px rgba(0,0,0,.28)!important;
  border-left:1px solid rgba(0,0,0,.08)!important;
  transform:translateX(0)!important;
  overflow:hidden!important;
}

.cart-drawer-header {
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:1rem!important;
  padding:18px 18px 14px!important;
  border-bottom:1px solid #ece7f5!important;
}

.cart-drawer-eyebrow {
  margin:0 0 4px!important;
  color:#4f16c7!important;
  font-size:.72rem!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}

.cart-drawer-header h2 {
  margin:0!important;
  font-size:1.25rem!important;
  line-height:1.15!important;
}

.cart-drawer-close {
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #e5e0ec!important;
  border-radius:50%!important;
  background:#f8f6fc!important;
  color:#07152f!important;
  font-size:1.4rem!important;
  line-height:1!important;
  cursor:pointer!important;
}

.cart-items {
  flex:1!important;
  overflow:auto!important;
  padding:16px 18px!important;
}

.cart-empty {
  margin:0!important;
  padding:18px!important;
  border:1px dashed #d8cfee!important;
  border-radius:14px!important;
  background:#faf8ff!important;
  color:#5f6070!important;
  font-size:.92rem!important;
  line-height:1.5!important;
}

.cart-item {
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  padding:10px 0!important;
  border-bottom:1px solid #f0ecf6!important;
}

.cart-item img {
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  border-radius:10px!important;
  background:#f8f6fc!important;
}

.cart-item strong {
  display:block!important;
  font-size:.88rem!important;
  line-height:1.25!important;
}

.cart-item small {
  display:block!important;
  margin-top:3px!important;
  color:#737083!important;
  font-size:.74rem!important;
}

.cart-item button {
  border:0!important;
  background:transparent!important;
  color:#b42318!important;
  cursor:pointer!important;
  font-size:1.1rem!important;
}

.cart-drawer-footer {
  padding:16px 18px 18px!important;
  border-top:1px solid #ece7f5!important;
  background:#fff!important;
}

.cart-total-row {
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-bottom:12px!important;
  font-size:.95rem!important;
}

.cart-checkout-whatsapp {
  width:100%!important;
  min-height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:10px!important;
  background:#25d366!important;
  color:#062b15!important;
  font-weight:800!important;
  text-decoration:none!important;
}

@media(max-width:520px) {
  .cart-drawer-panel {
  width:100vw!important;
}

}

/* --- Add to cart confirmation toast --- */
.cart-add-toast {
  position:fixed!important;
  right:18px!important;
  bottom:18px!important;
  z-index:21000!important;
  min-width:132px!important;
  padding:10px 14px!important;
  border-radius:999px!important;
  background:#07152f!important;
  color:#fff!important;
  font-size:.82rem!important;
  font-weight:800!important;
  text-align:center!important;
  box-shadow:0 16px 40px rgba(7,21,47,.25)!important;
  opacity:0!important;
  transform:translateY(12px)!important;
  pointer-events:none!important;
  transition:opacity .18s ease, transform .18s ease!important;
}

.cart-add-toast.is-visible {
  opacity:1!important;
  transform:translateY(0)!important;
}

@media(max-width:560px) {
  .cart-add-toast {
  left:50%!important;
  right:auto!important;
  bottom:14px!important;
  transform:translate(-50%,12px)!important;
}

.cart-add-toast.is-visible {
  transform:translate(-50%,0)!important;
}

}

/* --- Cart quantity controls fix --- */
.cart-item {
  grid-template-columns:58px minmax(0,1fr) 34px!important;
  gap:10px!important;
}

.cart-item-main {
  min-width:0!important;
}

.cart-qty-control {
  margin-top:8px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:4px!important;
  border:1px solid #e5e0ec!important;
  border-radius:999px!important;
  background:#faf8ff!important;
}

.cart-qty-control button {
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:50%!important;
  background:#fff!important;
  color:#07152f!important;
  font-size:1rem!important;
  font-weight:800!important;
  line-height:1!important;
  cursor:pointer!important;
  box-shadow:0 3px 10px rgba(7,21,47,.08)!important;
}

.cart-qty-control span {
  min-width:44px!important;
  color:#07152f!important;
  font-size:.72rem!important;
  font-weight:800!important;
  text-align:center!important;
}

.cart-remove {
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  align-self:start!important;
  border:0!important;
  border-radius:50%!important;
  background:#fff3f2!important;
  color:#b42318!important;
  cursor:pointer!important;
  font-size:1.15rem!important;
  font-weight:800!important;
}

.cart-item-placeholder {
  width:58px!important;
  height:58px!important;
  border-radius:10px!important;
  background:#f8f6fc!important;
}

/* --- Final validated shop fixes --- */
#productGrid .product-buttons,
#productGrid .product-actions,
#productGrid .product-card-actions,
#productGrid .shop-product-actions,
#productGrid .mivek-actions-row,
.productGrid .product-buttons,
.productGrid .product-actions,
.productGrid .product-card-actions,
.productGrid .shop-product-actions,
.productGrid .mivek-actions-row,
.product-grid-compact .product-buttons,
.product-grid-compact .product-actions,
.product-grid-compact .product-card-actions,
.product-grid-compact .shop-product-actions,
.product-grid-compact .mivek-actions-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: stretch !important;
}

#productGrid .quick-order,
#productGrid .add-cart,
#productGrid .add-to-cart,
#productGrid [data-quick-order],
#productGrid [data-add-cart],
.productGrid .quick-order,
.productGrid .add-cart,
.productGrid .add-to-cart,
.productGrid [data-quick-order],
.productGrid [data-add-cart],
.product-grid-compact .quick-order,
.product-grid-compact .add-cart,
.product-grid-compact .add-to-cart,
.product-grid-compact [data-quick-order],
.product-grid-compact [data-add-cart],
#productModal .product-modal-actions > a,
#productModal .product-modal-actions > button,
#productModal .modal-actions-row > a,
#productModal .modal-actions-row > button {
  grid-column: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 38px !important;
  padding: 8px 6px !important;
  margin: 0 !important;
  float: none !important;
  clear: none !important;
  box-sizing: border-box !important;
  text-align: center !important;
  white-space: nowrap !important;
  line-height: 1.1 !important;
}

#productModal .product-modal-actions,
#productModal .modal-actions-row,
.product-modal-actions.modal-actions-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: stretch !important;
}

/* --- Fixed header layer protection: stop scrolling content appearing above headers --- */
body.shop-page.fixed-shop-bars {
  --mivek-site-header-height: 76px;
  --mivek-shop-header-height: 66px;
  padding-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height)) !important;
  overflow-x: hidden !important;
}

/* Highest normal page layers */
body.shop-page.fixed-shop-bars .site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999999 !important;
  isolation: isolate !important;
  transform: none !important;
  will-change: auto !important;
}

body.shop-page.fixed-shop-bars .shop-header {
  position: fixed !important;
  top: var(--mivek-site-header-height) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999998 !important;
  isolation: isolate !important;
  transform: none !important;
  will-change: auto !important;
  background: #f4f2f8 !important;
  box-shadow: 0 10px 26px rgba(9, 13, 31, .10) !important;
  border-bottom: 1px solid #e5e0ec !important;
}

body.shop-page.fixed-shop-bars .shop-header-inner {
  position: relative !important;
  z-index: 1 !important;
  transform: none !important;
  will-change: auto !important;
}

/* Keep all scrolling page content underneath both fixed bars */
body.shop-page.fixed-shop-bars main,
body.shop-page.fixed-shop-bars .shop-main,
body.shop-page.fixed-shop-bars .shop-layout,
body.shop-page.fixed-shop-bars .shop-content,
body.shop-page.fixed-shop-bars .shop-sidebar,
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid,
body.shop-page.fixed-shop-bars .productGrid,
body.shop-page.fixed-shop-bars .product-grid-compact,
body.shop-page.fixed-shop-bars .shop-product,
body.shop-page.fixed-shop-bars .product-card,
body.shop-page.fixed-shop-bars .shop-product-card,
body.shop-page.fixed-shop-bars .catalog-pagination,
body.shop-page.fixed-shop-bars .shop-pagination {
  position: relative !important;
  z-index: 1 !important;
}

/* Prevent hover/active product elements from jumping above fixed headers */
body.shop-page.fixed-shop-bars .shop-product:hover,
body.shop-page.fixed-shop-bars .product-card:hover,
body.shop-page.fixed-shop-bars .shop-product-card:hover,
body.shop-page.fixed-shop-bars .shop-product:focus-within,
body.shop-page.fixed-shop-bars .product-card:focus-within,
body.shop-page.fixed-shop-bars .shop-product-card:focus-within {
  z-index: 2 !important;
}

/* Any sticky/filter/scrollable elements must remain below the fixed bars */
body.shop-page.fixed-shop-bars .shop-toolbar,
body.shop-page.fixed-shop-bars .filter-panel,
body.shop-page.fixed-shop-bars .filters,
body.shop-page.fixed-shop-bars .shop-category-strip,
body.shop-page.fixed-shop-bars .category-strip,
body.shop-page.fixed-shop-bars .sidebar,
body.shop-page.fixed-shop-bars aside {
  z-index: 5 !important;
}

/* Modals/drawers are allowed to appear above headers */
body.shop-page.fixed-shop-bars .cart-drawer,
body.shop-page.fixed-shop-bars .product-modal,
body.shop-page.fixed-shop-bars #productModal,
body.shop-page.fixed-shop-bars #cartDrawer {
  z-index: 1000000 !important;
}

/* Anchor scroll spacing so content does not sit underneath fixed bars */
body.shop-page.fixed-shop-bars section[id],
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid {
  scroll-margin-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height) + 18px) !important;
}

@media (max-width: 880px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 70px;
    --mivek-shop-header-height: 118px;
  }
}

@media (max-width: 560px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 68px;
    --mivek-shop-header-height: 116px;
  }
}

/* --- Fix: keep second fixed shop section visible while scrolling --- */

/*
  The previous layer fix kept content under the fixed bars, but the second
  fixed shop section could be hidden because the offset did not reserve enough
  vertical space for it. This patch gives the two fixed bars explicit heights,
  places the shop bar exactly below the site header, and pushes page content
  below both bars.
*/
body.shop-page.fixed-shop-bars {
  --mivek-site-header-height: 82px !important;
  --mivek-shop-header-height: 72px !important;
  padding-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height)) !important;
  overflow-x: hidden !important;
}

/* First fixed section */
body.shop-page.fixed-shop-bars .site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-height: var(--mivek-site-header-height) !important;
  height: var(--mivek-site-header-height) !important;
  z-index: 1000000 !important;
  transform: none !important;
}

/* Second fixed section: keep it permanently visible below the site header */
body.shop-page.fixed-shop-bars .shop-header {
  position: fixed !important;
  top: var(--mivek-site-header-height) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-height: var(--mivek-shop-header-height) !important;
  height: var(--mivek-shop-header-height) !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 999999 !important;
  transform: none !important;
  overflow: visible !important;
  background: #f4f2f8 !important;
  border-bottom: 1px solid #e5e0ec !important;
  box-shadow: 0 10px 26px rgba(9, 13, 31, .10) !important;
}

/* The inner row must not collapse or slide under the first header */
body.shop-page.fixed-shop-bars .shop-header-inner {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--mivek-shop-header-height) !important;
  height: var(--mivek-shop-header-height) !important;
  margin: 0 !important;
  padding: 10px 5vw !important;
  box-sizing: border-box !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  transform: none !important;
  overflow: visible !important;
}

/* Keep controls inside the second fixed section visible */
body.shop-page.fixed-shop-bars .shop-header-inner *,
body.shop-page.fixed-shop-bars .shop-search,
body.shop-page.fixed-shop-bars .shop-search *,
body.shop-page.fixed-shop-bars .head-action,
body.shop-page.fixed-shop-bars .cart-button {
  visibility: visible !important;
  opacity: 1 !important;
}

body.shop-page.fixed-shop-bars .shop-search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.shop-page.fixed-shop-bars .shop-search select,
body.shop-page.fixed-shop-bars .shop-search input,
body.shop-page.fixed-shop-bars .shop-search button,
body.shop-page.fixed-shop-bars .head-action,
body.shop-page.fixed-shop-bars .cart-button {
  height: 48px !important;
  min-height: 48px !important;
}

/* The hero wrapper should not consume height or cover the second fixed bar */
body.shop-page.fixed-shop-bars #top.shop-pro-hero,
body.shop-page.fixed-shop-bars .shop-pro-hero {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 1 !important;
}

/* Scrolling content stays below both fixed sections */
body.shop-page.fixed-shop-bars main,
body.shop-page.fixed-shop-bars .shop-main,
body.shop-page.fixed-shop-bars .shop-layout,
body.shop-page.fixed-shop-bars .shop-content,
body.shop-page.fixed-shop-bars .shop-sidebar,
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid,
body.shop-page.fixed-shop-bars .productGrid,
body.shop-page.fixed-shop-bars .product-grid-compact,
body.shop-page.fixed-shop-bars .shop-product,
body.shop-page.fixed-shop-bars .product-card,
body.shop-page.fixed-shop-bars .shop-product-card,
body.shop-page.fixed-shop-bars .catalog-pagination,
body.shop-page.fixed-shop-bars .shop-pagination {
  position: relative !important;
  z-index: 1 !important;
}

/* Product hover should not cover the second fixed section */
body.shop-page.fixed-shop-bars .shop-product:hover,
body.shop-page.fixed-shop-bars .product-card:hover,
body.shop-page.fixed-shop-bars .shop-product-card:hover,
body.shop-page.fixed-shop-bars .shop-product:focus-within,
body.shop-page.fixed-shop-bars .product-card:focus-within,
body.shop-page.fixed-shop-bars .shop-product-card:focus-within {
  z-index: 2 !important;
}

/* Modals and cart drawer can still appear above both fixed sections */
body.shop-page.fixed-shop-bars .cart-drawer,
body.shop-page.fixed-shop-bars .product-modal,
body.shop-page.fixed-shop-bars #productModal,
body.shop-page.fixed-shop-bars #cartDrawer {
  z-index: 1000001 !important;
}

/* Anchor spacing below the two fixed sections */
body.shop-page.fixed-shop-bars section[id],
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid {
  scroll-margin-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height) + 18px) !important;
}

@media (max-width: 880px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 74px !important;
    --mivek-shop-header-height: 128px !important;
  }

  body.shop-page.fixed-shop-bars .shop-header-inner {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 8px 1rem !important;
    height: var(--mivek-shop-header-height) !important;
    min-height: var(--mivek-shop-header-height) !important;
  }

  body.shop-page.fixed-shop-bars .shop-search select,
  body.shop-page.fixed-shop-bars .shop-search input,
  body.shop-page.fixed-shop-bars .shop-search button,
  body.shop-page.fixed-shop-bars .head-action,
  body.shop-page.fixed-shop-bars .cart-button {
    height: 44px !important;
    min-height: 44px !important;
  }
}

@media (max-width: 560px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 70px !important;
    --mivek-shop-header-height: 126px !important;
  }
}

/* --- REAL FINAL FIX: fixed site header + fixed shop bar as separate top layers --- */

/*
  The second bar was disappearing because .shop-header was fixed inside a
  low z-index hero wrapper. This final fix makes the hero wrapper itself the
  second fixed top layer, then keeps .shop-header static inside it.
*/
body.shop-page.fixed-shop-bars {
  --mivek-site-header-height: 82px;
  --mivek-shop-header-height: 74px;
  padding-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height)) !important;
  overflow-x: hidden !important;
}

/* First fixed layer */
body.shop-page.fixed-shop-bars .site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-height: var(--mivek-site-header-height) !important;
  z-index: 1000002 !important;
  transform: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Second fixed layer: the full shop bar wrapper, not only the inner header */
body.shop-page.fixed-shop-bars #top.shop-pro-hero {
  position: fixed !important;
  top: var(--mivek-site-header-height) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  min-height: var(--mivek-shop-header-height) !important;
  height: auto !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  z-index: 1000001 !important;
  background: #f4f2f8 !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e0ec !important;
  box-shadow: 0 10px 26px rgba(9, 13, 31, .10) !important;
  transform: none !important;
  box-sizing: border-box !important;
}

/* .shop-header must NOT be fixed again; it lives inside the fixed #top layer */
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}

/* Stable visible row inside the second fixed layer */
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header-inner {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--mivek-shop-header-height) !important;
  margin: 0 !important;
  padding: 10px 5vw !important;
  box-sizing: border-box !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 1 !important;
  transform: none !important;
  overflow: visible !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search button,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .head-action,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-button {
  height: 48px !important;
  min-height: 48px !important;
}

/* All normal scrollable content stays underneath the two fixed layers */
body.shop-page.fixed-shop-bars main,
body.shop-page.fixed-shop-bars .shop-featured,
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid,
body.shop-page.fixed-shop-bars .productGrid,
body.shop-page.fixed-shop-bars .product-grid-compact,
body.shop-page.fixed-shop-bars .shop-product,
body.shop-page.fixed-shop-bars .product-card,
body.shop-page.fixed-shop-bars .shop-product-card,
body.shop-page.fixed-shop-bars .catalog-pagination,
body.shop-page.fixed-shop-bars .shop-pagination {
  position: relative !important;
  z-index: 1 !important;
}

body.shop-page.fixed-shop-bars .shop-product:hover,
body.shop-page.fixed-shop-bars .product-card:hover,
body.shop-page.fixed-shop-bars .shop-product-card:hover,
body.shop-page.fixed-shop-bars .shop-product:focus-within,
body.shop-page.fixed-shop-bars .product-card:focus-within,
body.shop-page.fixed-shop-bars .shop-product-card:focus-within {
  z-index: 2 !important;
}

/* Modals and cart drawer can appear above both bars */
body.shop-page.fixed-shop-bars .cart-drawer,
body.shop-page.fixed-shop-bars .product-modal,
body.shop-page.fixed-shop-bars #productModal,
body.shop-page.fixed-shop-bars #cartDrawer {
  z-index: 1000003 !important;
}

/* Anchor scroll spacing below both fixed layers */
body.shop-page.fixed-shop-bars section[id],
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars #productGrid {
  scroll-margin-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height) + 18px) !important;
}

@media (max-width: 880px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 74px;
    --mivek-shop-header-height: 128px;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header-inner {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 8px 1rem !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search button,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .head-action,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-button {
    height: 44px !important;
    min-height: 44px !important;
  }
}

@media (max-width: 560px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 70px;
    --mivek-shop-header-height: 126px;
  }
}

/* --- Theme-aware second fixed shop section background --- */
:root {
  --shop-second-bar-bg: rgba(244, 242, 248, .96);
  --shop-second-bar-text: #07152f;
  --shop-second-bar-muted: #5f6070;
  --shop-second-bar-border: rgba(229, 224, 236, .95);
  --shop-second-bar-shadow: 0 10px 26px rgba(9, 13, 31, .10);
  --shop-second-input-bg: #ffffff;
  --shop-second-input-text: #07152f;
  --shop-second-input-border: rgba(213, 205, 229, .95);
  --shop-second-chip-bg: rgba(255, 255, 255, .72);
}

html[data-theme="light"] {
  --shop-second-bar-bg: rgba(244, 242, 248, .96);
  --shop-second-bar-text: #07152f;
  --shop-second-bar-muted: #5f6070;
  --shop-second-bar-border: rgba(229, 224, 236, .95);
  --shop-second-bar-shadow: 0 10px 26px rgba(9, 13, 31, .10);
  --shop-second-input-bg: #ffffff;
  --shop-second-input-text: #07152f;
  --shop-second-input-border: rgba(213, 205, 229, .95);
  --shop-second-chip-bg: rgba(255, 255, 255, .72);
}

html[data-theme="dark"] {
  --shop-second-bar-bg: rgba(13, 11, 20, .96);
  --shop-second-bar-text: #f7f4ff;
  --shop-second-bar-muted: #c9c2d8;
  --shop-second-bar-border: rgba(255, 255, 255, .10);
  --shop-second-bar-shadow: 0 12px 30px rgba(0, 0, 0, .38);
  --shop-second-input-bg: rgba(28, 24, 40, .98);
  --shop-second-input-text: #f7f4ff;
  --shop-second-input-border: rgba(255, 255, 255, .14);
  --shop-second-chip-bg: rgba(255, 255, 255, .08);
}

/* Fallback for auto mode before JS resolves data-theme */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --shop-second-bar-bg: rgba(13, 11, 20, .96);
    --shop-second-bar-text: #f7f4ff;
    --shop-second-bar-muted: #c9c2d8;
    --shop-second-bar-border: rgba(255, 255, 255, .10);
    --shop-second-bar-shadow: 0 12px 30px rgba(0, 0, 0, .38);
    --shop-second-input-bg: rgba(28, 24, 40, .98);
    --shop-second-input-text: #f7f4ff;
    --shop-second-input-border: rgba(255, 255, 255, .14);
    --shop-second-chip-bg: rgba(255, 255, 255, .08);
  }
}

/* Second fixed section now follows Light / Dark / Auto */
body.shop-page.fixed-shop-bars #top.shop-pro-hero {
  background: var(--shop-second-bar-bg) !important;
  color: var(--shop-second-bar-text) !important;
  border-bottom-color: var(--shop-second-bar-border) !important;
  box-shadow: var(--shop-second-bar-shadow) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header-inner {
  background: transparent !important;
  color: var(--shop-second-bar-text) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .head-action,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-button {
  color: var(--shop-second-bar-text) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search button,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .head-action,
body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-button {
  background: var(--shop-second-input-bg) !important;
  color: var(--shop-second-input-text) !important;
  border-color: var(--shop-second-input-border) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input::placeholder {
  color: var(--shop-second-bar-muted) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select option {
  background: var(--shop-second-input-bg) !important;
  color: var(--shop-second-input-text) !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-count,
body.shop-page.fixed-shop-bars #top.shop-pro-hero [data-cart-count] {
  background: var(--shop-second-chip-bg) !important;
  color: var(--shop-second-bar-text) !important;
  border-color: var(--shop-second-input-border) !important;
}

/* Do not let older hard-coded shop-header rules override theme mode */
body.shop-page.fixed-shop-bars .shop-header {
  background: transparent !important;
  color: var(--shop-second-bar-text) !important;
}

/* --- Theme-aware cart drawer and view cart controls --- */
:root {
  --cart-bg: #ffffff;
  --cart-surface: #faf8ff;
  --cart-soft: #f8f6fc;
  --cart-text: #07152f;
  --cart-muted: #5f6070;
  --cart-border: #ece7f5;
  --cart-shadow: -24px 0 70px rgba(0, 0, 0, .28);
  --cart-backdrop: rgba(7, 10, 26, .58);
  --cart-danger-bg: #fff3f2;
  --cart-danger-text: #b42318;
}

html[data-theme="light"] {
  --cart-bg: #ffffff;
  --cart-surface: #faf8ff;
  --cart-soft: #f8f6fc;
  --cart-text: #07152f;
  --cart-muted: #5f6070;
  --cart-border: #ece7f5;
  --cart-shadow: -24px 0 70px rgba(0, 0, 0, .28);
  --cart-backdrop: rgba(7, 10, 26, .58);
  --cart-danger-bg: #fff3f2;
  --cart-danger-text: #b42318;
}

html[data-theme="dark"] {
  --cart-bg: #11101a;
  --cart-surface: #181522;
  --cart-soft: #211b31;
  --cart-text: #f7f4ff;
  --cart-muted: #c9c2d8;
  --cart-border: rgba(255, 255, 255, .12);
  --cart-shadow: -24px 0 80px rgba(0, 0, 0, .55);
  --cart-backdrop: rgba(0, 0, 0, .68);
  --cart-danger-bg: rgba(180, 35, 24, .16);
  --cart-danger-text: #ffb4aa;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --cart-bg: #11101a;
    --cart-surface: #181522;
    --cart-soft: #211b31;
    --cart-text: #f7f4ff;
    --cart-muted: #c9c2d8;
    --cart-border: rgba(255, 255, 255, .12);
    --cart-shadow: -24px 0 80px rgba(0, 0, 0, .55);
    --cart-backdrop: rgba(0, 0, 0, .68);
    --cart-danger-bg: rgba(180, 35, 24, .16);
    --cart-danger-text: #ffb4aa;
  }
}

.cart-drawer-backdrop {
  background: var(--cart-backdrop) !important;
}

.cart-drawer-panel {
  background: var(--cart-bg) !important;
  color: var(--cart-text) !important;
  border-left-color: var(--cart-border) !important;
  box-shadow: var(--cart-shadow) !important;
}

.cart-drawer-header,
.cart-drawer-footer,
.cart-item {
  border-color: var(--cart-border) !important;
}

.cart-drawer-header h2,
.cart-total-row,
.cart-item strong {
  color: var(--cart-text) !important;
}

.cart-drawer-eyebrow {
  color: #7c3cff !important;
}

.cart-drawer-close {
  background: var(--cart-soft) !important;
  color: var(--cart-text) !important;
  border-color: var(--cart-border) !important;
}

.cart-empty {
  background: var(--cart-surface) !important;
  color: var(--cart-muted) !important;
  border-color: var(--cart-border) !important;
}

.cart-items,
.cart-drawer-footer {
  background: var(--cart-bg) !important;
  color: var(--cart-text) !important;
}

.cart-item img,
.cart-item-placeholder {
  background: var(--cart-soft) !important;
}

.cart-item small,
.cart-qty-control span {
  color: var(--cart-muted) !important;
}

.cart-qty-control {
  background: var(--cart-surface) !important;
  border-color: var(--cart-border) !important;
}

.cart-qty-control button {
  background: var(--cart-soft) !important;
  color: var(--cart-text) !important;
}

.cart-remove {
  background: var(--cart-danger-bg) !important;
  color: var(--cart-danger-text) !important;
}

.cart-add-toast {
  background: var(--cart-text) !important;
  color: var(--cart-bg) !important;
}

/* --- Cart quantity and total display final fix --- */
.cart-line-price {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-top: 6px !important;
  padding: 6px 8px !important;
  border: 1px solid var(--cart-border) !important;
  border-radius: 10px !important;
  background: var(--cart-surface) !important;
}

.cart-line-price span {
  color: var(--cart-muted) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
}

.cart-line-price b {
  color: var(--cart-text) !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

.cart-total-row strong {
  color: var(--cart-text) !important;
  font-size: 1.05rem !important;
  font-weight: 900 !important;
}

#cartCount,
.cart-count,
[data-cart-count] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 22px !important;
  height: 22px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

/* --- Clear cart and cart total sum update --- */
.cart-total-row {
  padding: 10px 0 !important;
  border-top: 1px solid var(--cart-border) !important;
  border-bottom: 1px solid var(--cart-border) !important;
}

.cart-total-row span {
  color: var(--cart-muted) !important;
  font-weight: 800 !important;
}

.cart-total-row strong,
#cartTotal {
  color: var(--cart-text) !important;
  font-size: 1.15rem !important;
  font-weight: 950 !important;
}

.cart-clear-button {
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 0 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid var(--cart-border) !important;
  border-radius: 10px !important;
  background: var(--cart-soft) !important;
  color: var(--cart-text) !important;
  font-size: .85rem !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.cart-clear-button:hover {
  background: var(--cart-danger-bg) !important;
  color: var(--cart-danger-text) !important;
  border-color: var(--cart-danger-text) !important;
}

.cart-line-price {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-top: 6px !important;
  padding: 6px 8px !important;
  border: 1px solid var(--cart-border) !important;
  border-radius: 10px !important;
  background: var(--cart-surface) !important;
}

.cart-line-price span {
  color: var(--cart-muted) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
}

.cart-line-price b {
  color: var(--cart-text) !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
}

/* --- Final fix: product button click layer protection --- */
#productGrid,
.productGrid,
.product-grid-compact {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
}

#productGrid .shop-product,
.productGrid .shop-product,
.product-grid-compact .shop-product {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

#productGrid .shop-product:hover,
.productGrid .shop-product:hover,
.product-grid-compact .shop-product:hover {
  z-index: 3 !important;
}

#productGrid .shop-product::before,
#productGrid .shop-product::after,
.productGrid .shop-product::before,
.productGrid .shop-product::after,
.product-grid-compact .shop-product::before,
.product-grid-compact .shop-product::after {
  pointer-events: none !important;
}

#productGrid .discount-badge,
.productGrid .discount-badge,
.product-grid-compact .discount-badge {
  pointer-events: none !important;
}

#productGrid .product-thumb,
#productGrid .product-content,
#productGrid .product-buttons,
.productGrid .product-thumb,
.productGrid .product-content,
.productGrid .product-buttons,
.product-grid-compact .product-thumb,
.product-grid-compact .product-content,
.product-grid-compact .product-buttons {
  position: relative !important;
}

#productGrid .product-buttons,
.productGrid .product-buttons,
.product-grid-compact .product-buttons,
#productGrid .product-buttons.mivek-actions-row,
.productGrid .product-buttons.mivek-actions-row,
.product-grid-compact .product-buttons.mivek-actions-row {
  z-index: 50 !important;
  pointer-events: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: stretch !important;
}

#productGrid .product-buttons *,
.productGrid .product-buttons *,
.product-grid-compact .product-buttons * {
  pointer-events: auto !important;
}

#productGrid .quick-order,
#productGrid .add-cart,
#productGrid [data-quick-order],
#productGrid [data-add-cart],
.productGrid .quick-order,
.productGrid .add-cart,
.productGrid [data-quick-order],
.productGrid [data-add-cart],
.product-grid-compact .quick-order,
.product-grid-compact .add-cart,
.product-grid-compact [data-quick-order],
.product-grid-compact [data-add-cart] {
  position: relative !important;
  z-index: 60 !important;
  pointer-events: auto !important;
  grid-column: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
  margin: 0 !important;
  cursor: pointer !important;
}

/* Keep floating WhatsApp from blocking bottom-right product buttons */
.whatsapp-float {
  z-index: 20 !important;
}

#productGrid .product-buttons {
  z-index: 80 !important;
}

/* --- REAL BUTTON CLICK FIX: last column controls --- */
.shop-featured,
#catalogue,
#productGrid,
.productGrid,
.product-grid-compact {
  position: relative !important;
  z-index: 100 !important;
  isolation: isolate !important;
  overflow: visible !important;
}

#productGrid .shop-product,
.productGrid .shop-product,
.product-grid-compact .shop-product {
  position: relative !important;
  z-index: 1 !important;
  isolation: auto !important;
  overflow: visible !important;
}

#productGrid .shop-product:hover,
.productGrid .shop-product:hover,
.product-grid-compact .shop-product:hover,
#productGrid .shop-product:focus-within,
.productGrid .shop-product:focus-within,
.product-grid-compact .shop-product:focus-within {
  z-index: 200 !important;
}

#productGrid .shop-product::before,
#productGrid .shop-product::after,
.productGrid .shop-product::before,
.productGrid .shop-product::after,
.product-grid-compact .shop-product::before,
.product-grid-compact .shop-product::after,
#catalogue::before,
#catalogue::after,
.shop-featured::before,
.shop-featured::after {
  pointer-events: none !important;
}

#productGrid .discount-badge,
#productGrid .wishlist,
.productGrid .discount-badge,
.productGrid .wishlist,
.product-grid-compact .discount-badge,
.product-grid-compact .wishlist {
  pointer-events: auto !important;
}

#productGrid .product-buttons,
.productGrid .product-buttons,
.product-grid-compact .product-buttons,
#productGrid .mivek-actions-row,
.productGrid .mivek-actions-row,
.product-grid-compact .mivek-actions-row {
  position: relative !important;
  z-index: 1000 !important;
  pointer-events: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: stretch !important;
}

#productGrid .quick-order,
#productGrid .add-cart,
#productGrid [data-quick-order],
#productGrid [data-add-cart],
.productGrid .quick-order,
.productGrid .add-cart,
.productGrid [data-quick-order],
.productGrid [data-add-cart],
.product-grid-compact .quick-order,
.product-grid-compact .add-cart,
.product-grid-compact [data-quick-order],
.product-grid-compact [data-add-cart] {
  position: relative !important;
  z-index: 1001 !important;
  pointer-events: auto !important;
  grid-column: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
  margin: 0 !important;
  cursor: pointer !important;
}

/* The floating WhatsApp pill was covering bottom/right products on some screens */
.shop-page .whatsapp-float {
  z-index: 5 !important;
}

/* Fixed bars remain above catalogue even after raising product click layer */
body.shop-page.fixed-shop-bars .site-header {
  z-index: 1000002 !important;
}

body.shop-page.fixed-shop-bars #top.shop-pro-hero {
  z-index: 1000001 !important;
}

body.shop-page.fixed-shop-bars .cart-drawer,
body.shop-page.fixed-shop-bars .product-modal,
body.shop-page.fixed-shop-bars #productModal,
body.shop-page.fixed-shop-bars #cartDrawer {
  z-index: 1000003 !important;
}

/* --- Compact gap between fixed shop bar and catalogue --- */
body.shop-page.fixed-shop-bars {
  /* keep safe space for the two fixed sections, but remove extra empty gap */
  padding-top: calc(var(--mivek-site-header-height) + var(--mivek-shop-header-height) - 2px) !important;
}

body.shop-page.fixed-shop-bars main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.shop-page.fixed-shop-bars .shop-featured {
  margin-top: 0 !important;
  padding-top: 14px !important;
}

body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars .catalogue,
body.shop-page.fixed-shop-bars .catalog-section,
body.shop-page.fixed-shop-bars .shop-catalogue,
body.shop-page.fixed-shop-bars .product-section {
  margin-top: 0 !important;
  padding-top: 14px !important;
}

body.shop-page.fixed-shop-bars .shop-featured + #catalogue,
body.shop-page.fixed-shop-bars .shop-featured + .catalogue,
body.shop-page.fixed-shop-bars .shop-featured + .catalog-section,
body.shop-page.fixed-shop-bars .shop-featured + .shop-catalogue,
body.shop-page.fixed-shop-bars .shop-featured + .product-section {
  margin-top: 8px !important;
  padding-top: 8px !important;
}

body.shop-page.fixed-shop-bars .section-header,
body.shop-page.fixed-shop-bars .catalog-header,
body.shop-page.fixed-shop-bars .shop-section-head {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

body.shop-page.fixed-shop-bars #productGrid,
body.shop-page.fixed-shop-bars .productGrid,
body.shop-page.fixed-shop-bars .product-grid-compact {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (max-width: 880px) {
  body.shop-page.fixed-shop-bars .shop-featured {
    padding-top: 10px !important;
  }

  body.shop-page.fixed-shop-bars #catalogue,
  body.shop-page.fixed-shop-bars .catalogue,
  body.shop-page.fixed-shop-bars .catalog-section,
  body.shop-page.fixed-shop-bars .shop-catalogue,
  body.shop-page.fixed-shop-bars .product-section {
    padding-top: 10px !important;
  }
}


/* --- FINAL FIX: keep Shop enquiry WhatsApp button clickable --- */
.shop-page .whatsapp-float[data-shop-whatsapp],
.shop-page .whatsapp-float {
  position: fixed !important;
  z-index: 900000 !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
  cursor: pointer !important;
}

/* Keep true overlays above the floating enquiry button. */
body.shop-page.fixed-shop-bars .cart-drawer,
body.shop-page.fixed-shop-bars .product-modal,
body.shop-page.fixed-shop-bars #productModal,
body.shop-page.fixed-shop-bars #cartDrawer {
  z-index: 1000003 !important;
}

/* The fixed shop bar's decorative pseudo-element extends beyond the bar.
   It must never intercept clicks on floating controls below it. */
body.shop-page.fixed-shop-bars #top.shop-pro-hero::before,
body.shop-page.fixed-shop-bars #top.shop-pro-hero::after {
  pointer-events: none !important;
}

/* --- FINAL SPACING TWEAK: tighter gap below second fixed shop bar --- */
body.shop-page.fixed-shop-bars .shop-featured,
body.shop-page.fixed-shop-bars #catalogue {
  margin-top: 0 !important;
  padding-top: 4px !important;
}

@media (max-width: 880px) {
  body.shop-page.fixed-shop-bars .shop-featured,
  body.shop-page.fixed-shop-bars #catalogue {
    padding-top: 4px !important;
  }
}

/* --- REAL GAP FIX: remove invisible flow space from the fixed-header wrapper --- */
body.shop-page.fixed-shop-bars > section:first-of-type {
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

/* Keep only a very small visual gap below the second fixed shop bar. */
body.shop-page.fixed-shop-bars #catalogue,
body.shop-page.fixed-shop-bars .shop-featured {
  margin-top: 0 !important;
  padding-top: 4px !important;
}

/* --- FINAL FIX: cart confirmation must stay above Shop Enquiry WhatsApp --- */
body.shop-page .cart-add-toast {
  z-index: 950000 !important;
}


/* --- Compact footer sections: remove oversized vertical gaps --- */
body.shop-page .site-footer {
  padding-top: 24px !important;
  padding-bottom: 16px !important;
}
body.shop-page .footer-top {
  padding-bottom: 16px !important;
  gap: 18px !important;
}
body.shop-page .footer-columns {
  padding: 18px 0 !important;
  row-gap: 14px !important;
  column-gap: 20px !important;
}
body.shop-page .footer-columns h2 { margin-bottom: 8px !important; }
body.shop-page .footer-columns a { margin-bottom: 5px !important; }
body.shop-page .footer-bottom {
  padding-top: 14px !important;
  gap: 8px 14px !important;
}

/* --- 7-page catalogue pagination, automatically follows light/dark theme --- */
body.shop-page .shop-pagination,
body.shop-page .catalog-pagination {
  width: fit-content !important;
  max-width: calc(100% - 24px) !important;
  padding: 7px 10px !important;
  margin: 14px auto 26px !important;
  gap: 7px !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--surface) 94%, var(--paper)) !important;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 8%, transparent) !important;
}
body.shop-page .shop-pagination button,
body.shop-page .shop-pagination .page-dots,
body.shop-page .catalog-pagination button,
body.shop-page .catalog-pagination .page-dots {
  color: var(--ink) !important;
  background: transparent !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
}
body.shop-page .shop-pagination .page-number.is-active,
body.shop-page .catalog-pagination .page-number.is-active {
  background: var(--ink) !important;
  color: var(--paper) !important;
  box-shadow: none !important;
}
body.shop-page .shop-pagination .page-number:not(.is-active):hover,
body.shop-page .shop-pagination .page-next:hover,
body.shop-page .catalog-pagination .page-number:not(.is-active):hover,
body.shop-page .catalog-pagination .page-next:hover {
  background: color-mix(in srgb, var(--ink) 9%, transparent) !important;
}
body.shop-page .shop-pagination .page-next[aria-disabled="true"] {
  opacity: .38 !important;
  cursor: default !important;
}
html[data-theme="dark"] body.shop-page .shop-pagination,
html[data-theme="dark"] body.shop-page .catalog-pagination {
  background: color-mix(in srgb, var(--surface) 96%, var(--paper)) !important;
  border-color: color-mix(in srgb, var(--ink) 16%, transparent) !important;
}
@media (max-width: 560px) {
  body.shop-page .shop-pagination,
  body.shop-page .catalog-pagination { gap: 3px !important; padding: 6px 7px !important; }
  body.shop-page .shop-pagination button,
  body.shop-page .shop-pagination .page-dots,
  body.shop-page .catalog-pagination button,
  body.shop-page .catalog-pagination .page-dots { min-width: 28px !important; height: 30px !important; padding: 0 5px !important; }
}


/* --- User requested final shop refinements --- */
/* Keep the floating enquiry control clear of the footer's location/opening-hours line. */
body.shop-page .whatsapp-float[data-shop-whatsapp],
body.shop-page .whatsapp-float {
  bottom: 92px !important;
}

/* Quote section: compact outside and inside spacing, no blank bands around it. */
body.shop-page #quote.quote-panel {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 14px 5vw !important;
  gap: 10px !important;
}
body.shop-page #quote .quote-card-large,
body.shop-page #quote .quote-side {
  border-radius: 20px !important;
  padding: 18px !important;
}
body.shop-page #quote .quote-card-large h2 {
  margin-top: 4px !important;
  margin-bottom: 8px !important;
}
body.shop-page #quote .quote-card-large p,
body.shop-page #quote .quote-side strong,
body.shop-page #quote .quote-side ul {
  margin-top: 0 !important;
}
body.shop-page #quote .quote-actions {
  margin-top: 12px !important;
  gap: 8px !important;
}
body.shop-page #quote .quote-side strong { margin-bottom: 8px !important; }
body.shop-page #quote .quote-side ul { gap: 6px !important; }
body.shop-page #quote .quote-side li { padding: 8px 10px !important; }

/* Search stays live while typing; the submit button is intentionally removed. */
body.shop-page .shop-search {
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) !important;
}

/* Previous/next pagination controls share the same automatic light/dark styling. */
body.shop-page .shop-pagination .page-prev,
body.shop-page .catalog-pagination .page-prev {
  color: var(--ink) !important;
  background: transparent !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 7px !important;
  border-radius: 999px !important;
}
body.shop-page .shop-pagination .page-prev:hover,
body.shop-page .catalog-pagination .page-prev:hover {
  background: color-mix(in srgb, var(--ink) 9%, transparent) !important;
}
body.shop-page .shop-pagination .page-prev[aria-disabled="true"] {
  opacity: .38 !important;
  cursor: default !important;
}

/* Real catalogue photography: fill the card frame cleanly while keeping product shots readable. */
body.shop-page .product-thumb {
  background: color-mix(in srgb, var(--surface) 96%, var(--paper)) !important;
  overflow: hidden !important;
}
body.shop-page .product-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

@media (max-width: 680px) {
  body.shop-page .whatsapp-float[data-shop-whatsapp],
  body.shop-page .whatsapp-float { bottom: 86px !important; }
  body.shop-page #quote.quote-panel { padding: 10px 12px !important; }
  body.shop-page #quote .quote-card-large,
  body.shop-page #quote .quote-side { padding: 14px !important; }
  body.shop-page .shop-search { grid-template-columns: 1fr !important; }
}


/* Catalogue image frame: display 640x480 source JPGs inside a 254x127px area without altering/cropping the source files. */
#productGrid .product-media,
.productGrid .product-media,
.product-grid-compact .product-media {
  width:254px!important;
  max-width:100%!important;
  height:127px!important;
  min-height:127px!important;
  padding:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:hidden!important;
}
#productGrid .product-media img,
.productGrid .product-media img,
.product-grid-compact .product-media img {
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:none!important;
  object-fit:contain!important;
  display:block!important;
}

/* FINAL CATALOGUE IMAGE DISPLAY SIZE FIX
   Source files remain 640x480. Only the visible catalogue frame is 254x127. */
@media (min-width: 681px) {
  body.shop-page #productGrid .product-thumb,
  body.shop-page .productGrid .product-thumb,
  body.shop-page .product-grid-compact .product-thumb {
    box-sizing: border-box !important;
    width: 254px !important;
    min-width: 254px !important;
    max-width: 254px !important;
    height: 127px !important;
    min-height: 127px !important;
    max-height: 127px !important;
    padding: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  body.shop-page #productGrid .product-thumb > img,
  body.shop-page .productGrid .product-thumb > img,
  body.shop-page .product-grid-compact .product-thumb > img {
    box-sizing: border-box !important;
    width: 254px !important;
    min-width: 254px !important;
    max-width: 254px !important;
    height: 127px !important;
    min-height: 127px !important;
    max-height: 127px !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
  }

  /* Ensure a catalogue card can physically contain a 254px image frame. */
  body.shop-page #productGrid .shop-product,
  body.shop-page .productGrid .shop-product,
  body.shop-page .product-grid-compact .shop-product {
    min-width: 254px !important;
  }
}

/* Small screens remain responsive instead of creating horizontal overflow. */
@media (max-width: 680px) {
  body.shop-page #productGrid .product-thumb,
  body.shop-page .productGrid .product-thumb,
  body.shop-page .product-grid-compact .product-thumb {
    width: min(254px, 100%) !important;
    height: 127px !important;
    min-height: 127px !important;
    max-height: 127px !important;
    padding: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden !important;
  }
  body.shop-page #productGrid .product-thumb > img,
  body.shop-page .productGrid .product-thumb > img,
  body.shop-page .product-grid-compact .product-thumb > img {
    width: 100% !important;
    height: 127px !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
  }
}


/* ABSOLUTE CATALOGUE DISPLAY SIZE — source JPG files remain 640x480.
   The visible catalogue box and image are always 254x127 CSS pixels. */
body.shop-page #productGrid .product-thumb,
body.shop-page #productGrid .shop-product > .product-thumb,
body.shop-page .productGrid .product-thumb,
body.shop-page .product-grid-compact .product-thumb {
  box-sizing:border-box !important;
  width:254px !important;
  min-width:254px !important;
  max-width:254px !important;
  height:127px !important;
  min-height:127px !important;
  max-height:127px !important;
  padding:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:block !important;
  overflow:hidden !important;
}
body.shop-page #productGrid .product-thumb > img,
body.shop-page #productGrid .shop-product > .product-thumb > img,
body.shop-page .productGrid .product-thumb > img,
body.shop-page .product-grid-compact .product-thumb > img {
  box-sizing:border-box !important;
  width:254px !important;
  min-width:254px !important;
  max-width:254px !important;
  height:127px !important;
  min-height:127px !important;
  max-height:127px !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center !important;
}
body.shop-page #productGrid .shop-product,
body.shop-page .productGrid .shop-product,
body.shop-page .product-grid-compact .shop-product {
  min-width:254px !important;
}


/* Final catalogue image fit: preserve full 640x480 source inside exact 254x127 display frame. */
body.shop-page #productGrid .product-thumb,
body.shop-page #productGrid .shop-product > .product-thumb,
body.shop-page .productGrid .product-thumb,
body.shop-page .product-grid-compact .product-thumb {
  width:254px !important;
  min-width:254px !important;
  max-width:254px !important;
  height:127px !important;
  min-height:127px !important;
  max-height:127px !important;
  overflow:hidden !important;
  background:#fff !important;
}
body.shop-page #productGrid .product-thumb > img,
body.shop-page #productGrid .shop-product > .product-thumb > img,
body.shop-page .productGrid .product-thumb > img,
body.shop-page .product-grid-compact .product-thumb > img {
  width:254px !important;
  min-width:254px !important;
  max-width:254px !important;
  height:127px !important;
  min-height:127px !important;
  max-height:127px !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#fff !important;
}

/* ============================================================
   SHOP INDEX COMPACT SPACING — 2026-10-14
   Removes inherited blank space without changing shop behavior.
   ============================================================ */
body.shop-page > section:first-of-type {
  margin:0 !important;
  padding:0 !important;
}

body.shop-page #top.shop-pro-hero {
  margin:0 calc(50% - 50vw) !important;
  padding-top:4px !important;
  padding-bottom:4px !important;
}

body.shop-page main {
  margin:0 !important;
  padding:0 !important;
}

body.shop-page #catalogue.section.shop-featured {
  margin:0 !important;
  padding:12px 5vw 6px !important;
}

body.shop-page #catalogue .section-intro {
  margin:0 0 10px !important;
  padding:0 !important;
}

body.shop-page #catalogue .section-intro .eyebrow {
  margin:0 0 4px !important;
}

body.shop-page #catalogue .section-intro h2 {
  margin:0 0 5px !important;
}

body.shop-page #catalogue .section-intro > p:last-child {
  margin:0 !important;
}

body.shop-page #productGrid.product-grid-compact {
  gap:10px !important;
  row-gap:12px !important;
  margin:0 !important;
  padding:0 !important;
}

body.shop-page #productGrid .shop-product {
  margin:0 !important;
}

body.shop-page #productGrid .product-content {
  padding:10px 11px 11px !important;
  gap:5px !important;
}

body.shop-page #productGrid .product-cat {
  margin:0 !important;
}

body.shop-page #productGrid h3 {
  margin:0 !important;
}

body.shop-page #productGrid .product-specs {
  margin:3px 0 !important;
  gap:2px !important;
}

body.shop-page #productGrid .product-price {
  margin:1px 0 0 !important;
}

body.shop-page #productGrid .product-buttons.mivek-actions-row {
  margin-top:5px !important;
  gap:6px !important;
}

body.shop-page .shop-pagination,
body.shop-page .catalog-pagination {
  margin:5px auto 8px !important;
  padding:6px 8px !important;
  gap:6px !important;
}

body.shop-page #quote.quote-panel {
  margin:0 !important;
  padding:8px 5vw !important;
  gap:8px !important;
}

body.shop-page #quote .quote-card-large,
body.shop-page #quote .quote-side {
  padding:13px 15px !important;
}

body.shop-page #quote .quote-card-large h2 {
  margin:2px 0 5px !important;
}

body.shop-page #quote .quote-card-large > p:not(.eyebrow) {
  margin:0 !important;
}

body.shop-page #quote .quote-actions {
  margin-top:8px !important;
  gap:6px !important;
}

body.shop-page #quote .quote-side strong {
  margin-bottom:5px !important;
}

body.shop-page #quote .quote-side ul {
  gap:4px !important;
}

body.shop-page #quote .quote-side li {
  padding:6px 8px !important;
}

body.shop-page .site-footer {
  margin:0 !important;
  padding:18px 5vw 10px !important;
}

body.shop-page .footer-top {
  padding-bottom:12px !important;
  gap:16px !important;
}

body.shop-page .footer-top .footer-brand {
  margin:0 !important;
}

body.shop-page .footer-columns {
  padding:14px 0 !important;
  gap:16px !important;
}

body.shop-page .footer-columns h2 {
  margin:0 0 6px !important;
}

body.shop-page .footer-columns a {
  margin-bottom:4px !important;
}

body.shop-page .footer-bottom {
  padding-top:9px !important;
  gap:5px 12px !important;
}

body.shop-page .footer-bottom p {
  margin:0 !important;
}

@media (max-width: 680px) {
  body.shop-page #catalogue.section.shop-featured {
    padding:8px 10px 5px !important;
  }
  body.shop-page #catalogue .section-intro {
    margin-bottom:7px !important;
  }
  body.shop-page #productGrid.product-grid-compact {
    gap:8px !important;
    row-gap:9px !important;
  }
  body.shop-page #productGrid .product-content {
    padding:8px 9px 9px !important;
  }
  body.shop-page .shop-pagination,
  body.shop-page .catalog-pagination {
    margin:4px auto 6px !important;
    padding:5px 6px !important;
    gap:3px !important;
  }
  body.shop-page #quote.quote-panel {
    padding:6px 10px !important;
  }
  body.shop-page #quote .quote-card-large,
  body.shop-page #quote .quote-side {
    padding:11px !important;
  }
  body.shop-page .site-footer {
    padding:14px 12px 8px !important;
  }
  body.shop-page .footer-top {
    padding-bottom:10px !important;
    gap:10px !important;
  }
  body.shop-page .footer-columns {
    padding:11px 0 !important;
    gap:10px !important;
  }
  body.shop-page .footer-bottom {
    padding-top:8px !important;
  }
}


/* === FINAL MOBILE SHOP SEARCH VISIBILITY FIX ===
   Keep All Categories and Search products visible inside the second fixed bar. */
@media (max-width: 680px) {
  body.shop-page.fixed-shop-bars {
    --mivek-site-header-height: 70px !important;
    --mivek-shop-header-height: 126px !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header-inner {
    overflow: visible !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-header-inner {
    grid-template-columns: 1fr !important;
    grid-template-rows: 44px 44px !important;
    align-content: center !important;
    gap: 8px !important;
    min-height: var(--mivek-shop-header-height) !important;
    height: var(--mivek-shop-header-height) !important;
    padding: 11px 12px !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    display: grid !important;
    grid-template-columns: minmax(116px, 38%) minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-actions-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .head-action,
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .cart-button {
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
  }
}

@media (max-width: 390px) {
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: 120px minmax(0, 1fr) !important;
  }
}

/* === FINAL MOBILE SHOP BAR / WHATSAPP / KEYBOARD UX === */
@media (max-width: 680px) {
  /* Give the native select enough width for the full “All Categories” label. */
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: minmax(148px, 46%) minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    width: 100% !important;
    min-width: 148px !important;
    padding-left: 10px !important;
    padding-right: 30px !important;
    font-size: 14px !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input {
    min-width: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 15px !important;
  }

  /* Keep Shop enquiry as a floating pill on the right, not a full-width/left control. */
  body.shop-page .whatsapp-float[data-shop-whatsapp],
  body.shop-page .whatsapp-float {
    left: auto !important;
    right: 14px !important;
    width: auto !important;
    max-width: calc(100vw - 28px) !important;
    justify-content: center !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

@media (max-width: 360px) {
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: 144px minmax(0, 1fr) !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    min-width: 144px !important;
    font-size: 13px !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input {
    font-size: 14px !important;
  }
}

/* === Mobile cart usability hardening === */
@media (max-width: 640px) {
  body.cart-open {
    overflow: hidden !important;
    touch-action: none;
  }

  .cart-drawer {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    z-index: 30000 !important;
  }

  .cart-drawer-backdrop {
    position: absolute !important;
    inset: 0 !important;
  }

  .cart-drawer-panel {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: min(100vw, 430px) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-left: 0 !important;
    border-radius: 0 !important;
  }

  .cart-drawer-header {
    flex: 0 0 auto !important;
    padding: 12px 14px !important;
    min-height: 62px !important;
  }

  .cart-drawer-eyebrow {
    margin: 0 0 2px !important;
    font-size: .68rem !important;
  }

  .cart-drawer-header h2 {
    margin: 0 !important;
    font-size: 1.15rem !important;
    line-height: 1.15 !important;
  }

  .cart-drawer-close {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    touch-action: manipulation !important;
  }

  .cart-items {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 8px 12px 12px !important;
    touch-action: pan-y !important;
  }

  .cart-item {
    grid-template-columns: 54px minmax(0, 1fr) 34px !important;
    gap: 8px !important;
    align-items: start !important;
    padding: 10px 0 !important;
  }

  .cart-item img,
  .cart-item-placeholder {
    width: 54px !important;
    height: 54px !important;
    border-radius: 9px !important;
  }

  .cart-item-main {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .cart-item strong {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    font-size: .82rem !important;
    line-height: 1.25 !important;
  }

  .cart-item small {
    margin-top: 2px !important;
    font-size: .68rem !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
  }

  .cart-line-price {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 6px !important;
    align-items: center !important;
    margin-top: 5px !important;
    padding: 5px 7px !important;
  }

  .cart-line-price span {
    min-width: 0 !important;
    font-size: .66rem !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .cart-line-price b {
    font-size: .72rem !important;
    white-space: nowrap !important;
  }

  .cart-qty-control {
    margin-top: 6px !important;
    gap: 5px !important;
    padding: 3px !important;
  }

  .cart-qty-control button {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    touch-action: manipulation !important;
  }

  .cart-qty-control span {
    min-width: 42px !important;
    font-size: .68rem !important;
  }

  .cart-remove {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    touch-action: manipulation !important;
  }

  .cart-drawer-footer {
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    padding: 10px 12px calc(12px + env(safe-area-inset-bottom)) !important;
    box-shadow: 0 -10px 24px rgba(0, 0, 0, .10) !important;
  }

  .cart-total-row {
    margin: 0 0 8px !important;
    padding: 8px 0 !important;
  }

  .cart-total-row strong,
  #cartTotal {
    font-size: 1rem !important;
  }

  .cart-clear-button,
  .cart-checkout-whatsapp {
    min-height: 46px !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: .84rem !important;
    line-height: 1.15 !important;
    touch-action: manipulation !important;
  }

  .cart-clear-button {
    margin-bottom: 8px !important;
  }

  .cart-checkout-whatsapp {
    padding: 10px 12px !important;
    text-align: center !important;
    white-space: normal !important;
  }

  .cart-empty {
    padding: 14px !important;
    font-size: .84rem !important;
  }
}

/* === FINAL MOBILE CATEGORY + RIGHT WHATSAPP FIX (2026-10-15) === */
@media (max-width: 680px) {
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: 168px minmax(0, 1fr) !important;
    gap: 8px !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    width: 168px !important;
    min-width: 168px !important;
    max-width: 168px !important;
    box-sizing: border-box !important;
    padding-left: 8px !important;
    padding-right: 22px !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.1px !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    overflow: visible !important;
  }
  body.shop-page a.whatsapp-float[data-shop-whatsapp] {
    left: auto !important;
    right: max(12px, env(safe-area-inset-right)) !important;
    inset-inline-start: auto !important;
    inset-inline-end: max(12px, env(safe-area-inset-right)) !important;
    margin: 0 !important;
    transform: none !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 24px) !important;
  }
}
@media (max-width: 360px) {
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: 160px minmax(0, 1fr) !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    width: 160px !important;
    min-width: 160px !important;
    max-width: 160px !important;
    font-size: 12.5px !important;
  }
}

/* === CARD ROW ALIGNMENT LOCK: keep every catalogue detail on the same horizontal lines === */
html body.shop-page #productGrid .shop-product,
html body.shop-page .productGrid .shop-product,
html body.shop-page .product-grid-compact .shop-product {
  height:100% !important;
  align-self:stretch !important;
}

html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  display:grid !important;
  grid-template-rows:24px 58px 104px 38px 40px !important;
  gap:8px !important;
  align-content:start !important;
  flex:1 1 auto !important;
  min-height:0 !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat {
  height:24px !important;
  min-height:24px !important;
  max-height:24px !important;
  margin:0 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  line-height:1.2 !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height:58px !important;
  min-height:58px !important;
  max-height:58px !important;
  margin:0 !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  line-clamp:3 !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  height:104px !important;
  min-height:104px !important;
  max-height:104px !important;
  margin:0 !important;
  overflow:hidden !important;
  align-content:start !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  height:38px !important;
  min-height:38px !important;
  max-height:38px !important;
  margin:0 !important;
  align-self:stretch !important;
  display:flex !important;
  align-items:center !important;
  align-content:center !important;
  overflow:hidden !important;
}

html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row {
  height:40px !important;
  min-height:40px !important;
  max-height:40px !important;
  margin:0 !important;
  align-self:end !important;
}

html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
  height:40px !important;
  min-height:40px !important;
  max-height:40px !important;
}

/* Preserve the same row alignment on the two-column phone catalogue. */
@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:22px 58px 112px 36px 38px !important;
    gap:6px !important;
  }

  html body.shop-page #productGrid .shop-product .product-cat,
  html body.shop-page .productGrid .shop-product .product-cat,
  html body.shop-page .product-grid-compact .shop-product .product-cat {
    height:22px !important;
    min-height:22px !important;
    max-height:22px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:112px !important;
    min-height:112px !important;
    max-height:112px !important;
  }

  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    height:36px !important;
    min-height:36px !important;
    max-height:36px !important;
  }

  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
  }
}

/* === COMPACT ALIGNED CARD CONTENT: remove oversized blank gaps while preserving row alignment === */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows:18px 52px 76px 30px 38px !important;
  gap:3px !important;
  padding:8px 10px 10px !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat {
  height:18px !important;
  min-height:18px !important;
  max-height:18px !important;
  line-height:18px !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height:52px !important;
  min-height:52px !important;
  max-height:52px !important;
  font-size:.92rem !important;
  line-height:1.18 !important;
  -webkit-line-clamp:3 !important;
  line-clamp:3 !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  height:76px !important;
  min-height:76px !important;
  max-height:76px !important;
  margin:0 !important;
  gap:1px !important;
}

html body.shop-page #productGrid .shop-product .product-specs li,
html body.shop-page .productGrid .shop-product .product-specs li,
html body.shop-page .product-grid-compact .shop-product .product-specs li {
  font-size:.74rem !important;
  line-height:1.22 !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  height:30px !important;
  min-height:30px !important;
  max-height:30px !important;
  margin:0 !important;
}

html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row,
html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
  height:38px !important;
  min-height:38px !important;
  max-height:38px !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 50px 82px 28px 36px !important;
    gap:2px !important;
    padding:7px 8px 9px !important;
  }

  html body.shop-page #productGrid .shop-product .product-cat,
  html body.shop-page .productGrid .shop-product .product-cat,
  html body.shop-page .product-grid-compact .shop-product .product-cat {
    height:18px !important;
    min-height:18px !important;
    max-height:18px !important;
    line-height:18px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;
    font-size:.84rem !important;
    line-height:1.18 !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;
    gap:1px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs li,
  html body.shop-page .productGrid .shop-product .product-specs li,
  html body.shop-page .product-grid-compact .shop-product .product-specs li {
    font-size:.70rem !important;
    line-height:1.2 !important;
  }

  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    height:28px !important;
    min-height:28px !important;
    max-height:28px !important;
  }

  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
    height:36px !important;
    min-height:36px !important;
    max-height:36px !important;
  }
}

/* === BALANCED ALIGNED CARD CONTENT: moderate spacing, same-line alignment === */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows:20px 58px 94px 34px 40px !important;
  gap:5px !important;
  padding:10px 11px 12px !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat {
  height:20px !important;
  min-height:20px !important;
  max-height:20px !important;
  line-height:20px !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height:58px !important;
  min-height:58px !important;
  max-height:58px !important;
  font-size:.94rem !important;
  line-height:1.24 !important;
  -webkit-line-clamp:3 !important;
  line-clamp:3 !important;
  margin:0 !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  height:94px !important;
  min-height:94px !important;
  max-height:94px !important;
  margin:0 !important;
  gap:2px !important;
}

html body.shop-page #productGrid .shop-product .product-specs li,
html body.shop-page .productGrid .shop-product .product-specs li,
html body.shop-page .product-grid-compact .shop-product .product-specs li {
  font-size:.76rem !important;
  line-height:1.28 !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  height:34px !important;
  min-height:34px !important;
  max-height:34px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
}

html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row,
html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
  height:40px !important;
  min-height:40px !important;
  max-height:40px !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 54px 90px 30px 38px !important;
    gap:4px !important;
    padding:8px 9px 10px !important;
  }

  html body.shop-page #productGrid .shop-product .product-cat,
  html body.shop-page .productGrid .shop-product .product-cat,
  html body.shop-page .product-grid-compact .shop-product .product-cat {
    height:18px !important;
    min-height:18px !important;
    max-height:18px !important;
    line-height:18px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:54px !important;
    min-height:54px !important;
    max-height:54px !important;
    font-size:.86rem !important;
    line-height:1.22 !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:90px !important;
    min-height:90px !important;
    max-height:90px !important;
    gap:2px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs li,
  html body.shop-page .productGrid .shop-product .product-specs li,
  html body.shop-page .product-grid-compact .shop-product .product-specs li {
    font-size:.72rem !important;
    line-height:1.24 !important;
  }

  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    height:30px !important;
    min-height:30px !important;
    max-height:30px !important;
  }

  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row,
  html body.shop-page #productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .productGrid .shop-product .product-buttons.mivek-actions-row > *,
  html body.shop-page .product-grid-compact .shop-product .product-buttons.mivek-actions-row > * {
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
  }
}

/* === PRODUCT SPECS READABILITY: more breathing room between detail lines === */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows:20px 58px 108px 34px 40px !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  height:108px !important;
  min-height:108px !important;
  max-height:108px !important;
  gap:5px !important;
  align-content:start !important;
}

html body.shop-page #productGrid .shop-product .product-specs li,
html body.shop-page .productGrid .shop-product .product-specs li,
html body.shop-page .product-grid-compact .shop-product .product-specs li {
  line-height:1.35 !important;
  margin:0 !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 54px 102px 30px 38px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:102px !important;
    min-height:102px !important;
    max-height:102px !important;
    gap:4px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs li,
  html body.shop-page .productGrid .shop-product .product-specs li,
  html body.shop-page .product-grid-compact .shop-product .product-specs li {
    line-height:1.32 !important;
  }
}

/* === TIGHTER TITLE → DETAILS → PRICE SPACING, KEEP SPEC LINE BREATHING ROOM === */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows:20px 52px 98px 32px 40px !important;
  gap:3px !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height:52px !important;
  min-height:52px !important;
  max-height:52px !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  height:98px !important;
  min-height:98px !important;
  max-height:98px !important;
  gap:5px !important;
  align-content:start !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  height:32px !important;
  min-height:32px !important;
  max-height:32px !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 49px 94px 28px 38px !important;
    gap:3px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:49px !important;
    min-height:49px !important;
    max-height:49px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:94px !important;
    min-height:94px !important;
    max-height:94px !important;
    gap:4px !important;
  }

  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    height:28px !important;
    min-height:28px !important;
    max-height:28px !important;
  }
}

/* === MOBILE: tighter title -> details spacing without breaking card alignment === */
@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 44px 94px 28px 38px !important;
    gap:2px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    font-size:.84rem !important;
    line-height:1.18 !important;
    -webkit-line-clamp:3 !important;
    line-clamp:3 !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    margin:0 !important;
  }
}

/* === MOBILE: make title -> details visual gap match details -> price === */
@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:18px 44px 94px 28px 38px !important;
    gap:2px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:44px !important;
    min-height:44px !important;
    max-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:flex-end !important;
    justify-content:flex-start !important;
    overflow:hidden !important;
    font-size:.80rem !important;
    line-height:1.15 !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs,
  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

/* === DESKTOP: visually equal title → details and details → price spacing === */
@media (min-width:561px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows:20px 52px 84px 32px 40px !important;
    gap:3px !important;
  }

  html body.shop-page #productGrid .shop-product h3,
  html body.shop-page .productGrid .shop-product h3,
  html body.shop-page .product-grid-compact .shop-product h3 {
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:flex-end !important;
    overflow:hidden !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    height:84px !important;
    min-height:84px !important;
    max-height:84px !important;
    margin:0 !important;
    display:grid !important;
    gap:5px !important;
    align-content:space-between !important;
    overflow:hidden !important;
  }

  html body.shop-page #productGrid .shop-product .product-price,
  html body.shop-page .productGrid .shop-product .product-price,
  html body.shop-page .product-grid-compact .shop-product .product-price {
    margin:0 !important;
  }
}

/* === FINAL UNIFORM CARD SPACING: category → title → details → price ===
   Keep the four content blocks evenly spaced while preserving aligned cards. */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  row-gap:4px !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat,
html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3,
html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs,
html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* Center the text within its aligned track so the visible whitespace above/below
   each block is balanced instead of collecting on one side. */
html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat,
html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3,
html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  align-self:center !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  align-items:center !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    row-gap:3px !important;
  }
}

/* === TRUE VISIBLE EQUAL GAPS: category → title → details → price ===
   Natural-height content blocks remove hidden reserved whitespace.
   Actions stay pinned to the bottom so cards in the same grid row still align. */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  grid-template-rows:none !important;
  gap:6px !important;
  row-gap:6px !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat,
html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3,
html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs,
html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  align-self:stretch !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  display:block !important;
  overflow:visible !important;
  align-items:initial !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  display:grid !important;
  gap:6px !important;
  align-content:start !important;
  overflow:visible !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  display:flex !important;
  align-items:baseline !important;
}

html body.shop-page #productGrid .shop-product .product-buttons,
html body.shop-page .productGrid .shop-product .product-buttons,
html body.shop-page .product-grid-compact .shop-product .product-buttons {
  margin-top:auto !important;
  padding-top:8px !important;
}

@media (max-width:560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    gap:5px !important;
    row-gap:5px !important;
  }

  html body.shop-page #productGrid .shop-product .product-specs,
  html body.shop-page .productGrid .shop-product .product-specs,
  html body.shop-page .product-grid-compact .shop-product .product-specs {
    gap:5px !important;
  }
}

/* ============================================================
   Shop index styles migrated from index.html
   All presentation rules now live in this stylesheet.
   ============================================================ */

/* Former internal <style> block(s) */
@media (max-width: 680px) {
  /* Keep the category label fully visible while preserving a usable search field. */
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    display: grid !important;
    grid-template-columns: 168px minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    display: block !important;
    width: 168px !important;
    min-width: 168px !important;
    max-width: 168px !important;
    box-sizing: border-box !important;
    padding-left: 8px !important;
    padding-right: 22px !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.1px !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    overflow: visible !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search input {
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
  }

  /* Pin Shop enquiry to the physical right edge on phones. */
  body.shop-page a.whatsapp-float[data-shop-whatsapp] {
    position: fixed !important;
    left: auto !important;
    right: max(12px, env(safe-area-inset-right)) !important;
    inset-inline-start: auto !important;
    inset-inline-end: max(12px, env(safe-area-inset-right)) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 24px) !important;
    display: inline-flex !important;
    justify-content: center !important;
  }
}
@media (max-width: 360px) {
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search {
    grid-template-columns: 160px minmax(0, 1fr) !important;
  }
  body.shop-page.fixed-shop-bars #top.shop-pro-hero .shop-search select {
    width: 160px !important;
    min-width: 160px !important;
    max-width: 160px !important;
    font-size: 12.5px !important;
    padding-right: 20px !important;
  }
}


/* Former repeated inline catalogue styles */
.shop-product-thumb-frame {
  width: 254px !important;
  min-width: 254px !important;
  max-width: 254px !important;
  height: 127px !important;
  min-height: 127px !important;
  max-height: 127px !important;
  padding: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.shop-product-thumb-image {
  width: 254px !important;
  min-width: 254px !important;
  max-width: 254px !important;
  height: 127px !important;
  min-height: 127px !important;
  max-height: 127px !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center !important;
  box-sizing: border-box !important;
}

.shop-actions-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: stretch !important;
}

.shop-action-control {
  grid-column: auto !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
  margin: 0 !important;
}



/* ============================================================
   2026-10-15 Catalogue card alignment normalization
   Keep every card row visually aligned and give the image the
   same outer breathing room as the space below the action row.
   ============================================================ */
html body.shop-page #productGrid,
html body.shop-page .productGrid.product-grid-compact {
  align-items: stretch !important;
}

html body.shop-page #productGrid .shop-product,
html body.shop-page .productGrid .shop-product,
html body.shop-page .product-grid-compact .shop-product {
  display: grid !important;
  grid-template-rows: 127px 1fr !important;
  align-self: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
  box-sizing: border-box !important;
}

html body.shop-page #productGrid .shop-product .shop-product-thumb-frame,
html body.shop-page .productGrid .shop-product .shop-product-thumb-frame,
html body.shop-page .product-grid-compact .shop-product .shop-product-thumb-frame {
  grid-row: 1 !important;
  width: calc(100% - 28px) !important;
  min-width: 0 !important;
  max-width: 254px !important;
  height: 127px !important;
  min-height: 127px !important;
  max-height: 127px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

html body.shop-page #productGrid .shop-product .shop-product-thumb-image,
html body.shop-page .productGrid .shop-product .shop-product-thumb-image,
html body.shop-page .product-grid-compact .shop-product .shop-product-thumb-image {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 254px !important;
  height: 127px !important;
  min-height: 127px !important;
  max-height: 127px !important;
  object-fit: contain !important;
  object-position: center !important;
}

html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-row: 2 !important;
  display: grid !important;
  grid-template-rows: 18px 54px 102px 30px 40px !important;
  row-gap: 8px !important;
  align-content: stretch !important;
  padding: 12px 14px 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  box-sizing: border-box !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat {
  grid-row: 1 !important;
  height: 18px !important;
  min-height: 18px !important;
  line-height: 18px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  grid-row: 2 !important;
  height: 54px !important;
  min-height: 54px !important;
  max-height: 54px !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  line-height: 18px !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs {
  grid-row: 3 !important;
  height: 102px !important;
  min-height: 102px !important;
  max-height: 102px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden !important;
  align-items: center !important;
}

html body.shop-page #productGrid .shop-product .product-specs li {
  margin: 0 !important;
  min-height: 0 !important;
  line-height: 1.28 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  grid-row: 4 !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: baseline !important;
  gap: 8px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

html body.shop-page #productGrid .shop-product .product-buttons,
html body.shop-page .productGrid .shop-product .product-buttons,
html body.shop-page .product-grid-compact .shop-product .product-buttons {
  grid-row: 5 !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: end !important;
}

html body.shop-page #productGrid .shop-product .shop-action-control,
html body.shop-page .productGrid .shop-product .shop-action-control,
html body.shop-page .product-grid-compact .shop-product .shop-action-control {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
}

@media (max-width: 680px) {
  html body.shop-page #productGrid .shop-product,
  html body.shop-page .productGrid .shop-product,
  html body.shop-page .product-grid-compact .shop-product {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    grid-template-rows: 18px 54px 102px 30px 40px !important;
    row-gap: 7px !important;
    padding: 11px 12px 0 !important;
  }
}

/* --- Final card rhythm: equal visible spacing below title, details and price --- */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  display: grid !important;
  grid-template-rows: 18px 54px 102px 30px 40px !important;
  row-gap: 8px !important;
}

/* Keep unused title-row space above the text, not below it. */
html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height: auto !important;
  min-height: 0 !important;
  max-height: 54px !important;
  align-self: end !important;
  margin: 0 !important;
}

/* Keep the final detail line sitting at the bottom of its allocated row. */
html body.shop-page #productGrid .shop-product .product-specs li,
html body.shop-page .productGrid .shop-product .product-specs li,
html body.shop-page .product-grid-compact .shop-product .product-specs li {
  align-self: end !important;
}

/* Keep price text at the bottom of its row so the following gap is exactly 8px. */
html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  align-items: flex-end !important;
}

@media (max-width: 680px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    row-gap: 8px !important;
  }
}

/* --- Final compact card cleanup: remove unwanted blank space while preserving alignment --- */
#productGrid .shop-product,
.productGrid .shop-product,
.product-grid-compact .shop-product {
  display:flex!important;
  flex-direction:column!important;
}

#productGrid .product-content,
.productGrid .product-content,
.product-grid-compact .product-content {
  display:grid!important;
  grid-template-rows:auto 2.56em auto auto auto!important;
  align-content:start!important;
  gap:5px!important;
  padding:10px 11px 10px!important;
  flex:1!important;
}

#productGrid .product-cat,
.productGrid .product-cat,
.product-grid-compact .product-cat {
  margin:0!important;
  padding:0!important;
  line-height:1.15!important;
}

#productGrid .shop-product h3,
.productGrid .shop-product h3,
.product-grid-compact .shop-product h3 {
  min-height:0!important;
  height:2.56em!important;
  margin:0!important;
  padding:0!important;
  line-height:1.28!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}

#productGrid .product-specs,
.productGrid .product-specs,
.product-grid-compact .product-specs {
  margin:0!important;
  padding:0!important;
  gap:2px!important;
  align-self:start!important;
}

#productGrid .product-specs li,
.productGrid .product-specs li,
.product-grid-compact .product-specs li {
  margin:0!important;
  line-height:1.28!important;
}

#productGrid .product-price,
.productGrid .product-price,
.product-grid-compact .product-price {
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  line-height:1.15!important;
  gap:6px!important;
}

#productGrid .product-price span,
#productGrid .product-price del,
.productGrid .product-price span,
.productGrid .product-price del,
.product-grid-compact .product-price span,
.product-grid-compact .product-price del {
  line-height:1.15!important;
}

#productGrid .product-buttons,
.productGrid .product-buttons,
.product-grid-compact .product-buttons {
  margin:0!important;
  padding:0!important;
  gap:6px!important;
  align-self:stretch!important;
}

#productGrid .product-buttons a,
#productGrid .product-buttons button,
.productGrid .product-buttons a,
.productGrid .product-buttons button,
.product-grid-compact .product-buttons a,
.product-grid-compact .product-buttons button {
  min-height:34px!important;
  margin:0!important;
  padding:7px 6px!important;
}

@media(max-width:560px) {
  #productGrid .product-content,
  .productGrid .product-content,
  .product-grid-compact .product-content {
    gap:4px!important;
    padding:8px 9px 8px!important;
  }
}

/* === FINAL TARGETED FIX: BRAND/CATEGORY -> TITLE SPACING ===
   This selector intentionally matches/exceeds the specificity of the older
   alignment rules so the rendered result actually changes without disturbing
   image, specs, price or action spacing. */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows: 18px 2.56em auto auto auto !important;
  row-gap: 4px !important;
}

html body.shop-page #productGrid .shop-product .product-cat,
html body.shop-page .productGrid .shop-product .product-cat,
html body.shop-page .product-grid-compact .shop-product .product-cat {
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  line-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: end !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height: 2.56em !important;
  min-height: 2.56em !important;
  max-height: 2.56em !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: start !important;
  line-height: 1.28 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

@media (max-width: 560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    row-gap: 3px !important;
  }
}

/* 2026-10-15 Product-card image corners only */
html body.shop-page #productGrid .shop-product > .shop-product-thumb-frame,
html body.shop-page .productGrid .shop-product > .shop-product-thumb-frame,
html body.shop-page .product-grid-compact .shop-product > .shop-product-thumb-frame {
  border-radius: 14px !important;
  overflow: hidden !important;
}

html body.shop-page #productGrid .shop-product > .shop-product-thumb-frame > .shop-product-thumb-image,
html body.shop-page .productGrid .shop-product > .shop-product-thumb-frame > .shop-product-thumb-image,
html body.shop-page .product-grid-compact .shop-product > .shop-product-thumb-frame > .shop-product-thumb-image {
  border-radius: 14px !important;
}

/* === FINAL FIX: equal visible TITLE -> DETAILS and DETAILS -> PRICE spacing === */
html body.shop-page #productGrid .shop-product > .product-content,
html body.shop-page .productGrid .shop-product > .product-content,
html body.shop-page .product-grid-compact .shop-product > .product-content {
  grid-template-rows: 18px auto auto auto auto !important;
  row-gap: 4px !important;
}

html body.shop-page #productGrid .shop-product h3,
html body.shop-page .productGrid .shop-product h3,
html body.shop-page .product-grid-compact .shop-product h3 {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: start !important;
}

html body.shop-page #productGrid .shop-product .product-specs,
html body.shop-page .productGrid .shop-product .product-specs,
html body.shop-page .product-grid-compact .shop-product .product-specs,
html body.shop-page #productGrid .shop-product .product-price,
html body.shop-page .productGrid .shop-product .product-price,
html body.shop-page .product-grid-compact .shop-product .product-price {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

@media (max-width: 560px) {
  html body.shop-page #productGrid .shop-product > .product-content,
  html body.shop-page .productGrid .shop-product > .product-content,
  html body.shop-page .product-grid-compact .shop-product > .product-content {
    row-gap: 4px !important;
  }
}


/* FIXED CATALOG CARD HEIGHT */
html body.shop-page .product-card,
html body.shop-page .shop-product-card,
html body.shop-page [class*="product-card"] {
  height: 408px !important;
  min-height: 408px !important;
  max-height: 408px !important;
  box-sizing: border-box !important;
}

