/* ============================================================
   ALIVENI — PERMANENT product card, price block, colour swatch, grids
   (ported from 10.3b components/product/Product.module.css)
   ============================================================ */
.alv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
@media (min-width: 768px) { .alv-grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-5); } }
@media (min-width: 1024px) { .alv-grid { grid-template-columns: repeat(4, 1fr); gap: var(--space-6); } }

/* Swipe rail on phones, grid from tablet up */
@media (max-width: 767px) {
  .alv-grid--rail {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 68%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-inline: calc(var(--space-gutter) * -1);
    padding-inline: var(--space-gutter);
    scroll-padding-inline: var(--space-gutter);
    padding-bottom: var(--space-2);
  }
  .alv-grid--rail::-webkit-scrollbar { display: none; }
  .alv-grid--rail > * { scroll-snap-align: start; }
}

.alv-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--c-bg-raised);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-xs);
  transition: box-shadow var(--motion-base) var(--motion-ease), border-color var(--motion-base);
}
.alv-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-gold200); }
.alv-card__link { display: flex; flex-direction: column; height: 100%; border-radius: inherit; }
.alv-card__link:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }
.alv-card__media { position: relative; padding: var(--space-2) var(--space-2) 0; }
.alv-card.is-out .alv-card__media { opacity: 0.6; }

.alv-media {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--c-bg-sunken);
  border-radius: var(--radius-xs);
}
.alv-media__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--motion-slow) var(--motion-ease);
}
.alv-card:hover .alv-media__img { transform: scale(1.03); }

/* Woven-colour swatch — ported 1:1 from 10.3b Product.module.css (.swatch, .sw*). Shown only when there is no real photo. */
.alv-swatch {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(90% 70% at 50% 45%, var(--color-ivory50), var(--color-ivory200) 100%);
}
.alv-swatch::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='58' viewBox='0 0 72 88'%3E%3Cpath d='M36 14c-4 4.6-5.4 11.2-4.2 17.8 1.4 3.4 2.6 5.4 4.2 7 1.6-1.6 2.8-3.6 4.2-7 1.2-6.6-.2-13.2-4.2-17.8Z' fill='none' stroke='%23C8A962' stroke-width='1.2'/%3E%3C/svg%3E");
  background-size: 48px 58px;
}
.alv-sw-fold, .alv-sw-body, .alv-sw-border, .alv-sw-pallu, .alv-sw-sheen { position: absolute; pointer-events: none; }
.alv-sw-fold { left: 20%; right: 16%; top: 25%; bottom: 23%; background: var(--body); filter: brightness(0.72); transform: translate(4%, 4%); border-radius: 2px; box-shadow: 0 18px 30px -18px rgba(43, 27, 29, 0.55); }
.alv-sw-body {
  left: 16%; right: 20%; top: 21%; bottom: 27%; border-radius: 2px;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 3px), repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.05) 0 1px, transparent 1px 3px), var(--body);
  box-shadow: 0 14px 28px -16px rgba(43, 27, 29, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.alv-sw-border { left: 16%; right: 20%; bottom: 27%; height: 16%; background: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.05) 0 1px, transparent 1px 3px), var(--border); box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12); }
.alv-sw-pallu { right: 20%; top: 21%; width: 26%; aspect-ratio: 1; background: var(--border); clip-path: polygon(100% 0, 100% 100%, 0 0); filter: brightness(1.04); }
.alv-sw-border.is-zari {
  background:
    linear-gradient(180deg, transparent 12%, var(--color-gold500) 12% 17%, transparent 17% 80%, var(--color-gold500) 80% 85%, transparent 85%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='14'%3E%3Cpath d='M8 3c-1.3 1.5-1.7 3.4-1.3 5.3.4 1 .7 1.5 1.3 2 .6-.5.9-1 1.3-2 .4-1.9 0-3.8-1.3-5.3Z' fill='none' stroke='%23C8A962' stroke-width='.8'/%3E%3C/svg%3E") center / 16px 14px,
    var(--border);
}
.alv-sw-pallu.is-zari { background: linear-gradient(225deg, transparent 22%, var(--color-gold500) 22% 25%, transparent 25%), var(--border); }
.alv-sw-sheen { left: 16%; right: 20%; top: 21%; bottom: 27%; background: linear-gradient(115deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.18) 46%, rgba(255, 255, 255, 0) 60%); mix-blend-mode: soft-light; }
.alv-swatch--v1 .alv-sw-fold, .alv-swatch--v1 .alv-sw-pallu, .alv-swatch--v2 .alv-sw-fold, .alv-swatch--v2 .alv-sw-border, .alv-swatch--v3 .alv-sw-fold, .alv-swatch--v3 .alv-sw-border, .alv-swatch--v3 .alv-sw-pallu { display: none; }
.alv-swatch--v1 .alv-sw-body, .alv-swatch--v1 .alv-sw-sheen, .alv-swatch--v2 .alv-sw-body, .alv-swatch--v2 .alv-sw-sheen, .alv-swatch--v3 .alv-sw-body, .alv-swatch--v3 .alv-sw-sheen { left: 10%; right: 10%; top: 12%; bottom: 12%; }
.alv-swatch--v1 .alv-sw-border { left: 10%; right: 10%; bottom: 12%; height: 34%; }
.alv-swatch--v2 .alv-sw-pallu { right: 10%; top: 12%; width: 80%; }
.alv-catart { position: absolute; inset: 0; display: grid; place-items: center; color: var(--color-gold600); }
.alv-swlabel {
  position: absolute; left: 6%; right: 6%; bottom: 4%; text-align: center; text-wrap: balance; line-height: 1.5;
  color: var(--color-gold700); font-family: var(--font-sans); font-size: 9px; font-weight: 600; letter-spacing: var(--tracking-wider); text-transform: uppercase;
}

.alv-stock {
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);
  padding: 3px 8px;
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  border-radius: var(--radius-xs);
}
.alv-stock--low { background: var(--color-gold100); color: var(--color-gold700); }
.alv-stock--out { background: var(--color-ivory50); color: var(--color-maroon700); border: 1px solid var(--c-border); }
.alv-stock--pick { background: rgba(247, 235, 221, 0.92); color: var(--color-maroon700); border: 1px solid var(--color-gold200); }

.alv-card__body { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-4) var(--space-4); flex: 1; }
.alv-card__sku { font-family: var(--font-sans); font-size: 10px; letter-spacing: var(--tracking-wider); color: var(--c-text-muted); }
.alv-card__title {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  line-height: var(--leading-snug);
  color: var(--color-maroon800);
  overflow-wrap: break-word;
}
.alv-card__sub { font-size: var(--text-sm); line-height: var(--leading-snug); color: var(--c-text-muted); }
.alv-card__foot {
  display: grid;
  gap: var(--space-2);
  margin-top: auto;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-ivory200);
}
.alv-card__body > :nth-last-child(2) { margin-bottom: var(--space-3); }
.alv-card__colours {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  line-height: 1.3;
  color: var(--c-text-muted);
}
.alv-dots { display: inline-flex; flex-shrink: 0; }
.alv-dots span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 2px var(--color-gold200);
}
.alv-dots span + span { margin-left: -3px; }

/* Price block */
.alv-price { display: grid; gap: 2px; font-family: var(--font-sans); }
.alv-price__line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--space-2); }
.alv-price__now { font-size: var(--text-md); font-weight: 600; color: var(--color-maroon800); font-variant-numeric: tabular-nums; white-space: nowrap; }
.alv-price__mrp { font-size: var(--text-xs); color: var(--c-text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.alv-price__off { min-height: 1.35em; font-size: var(--text-xs); line-height: 1.35; font-weight: 600; letter-spacing: 0.02em; color: var(--color-sage700); justify-self: start; }
.alv-price .woocommerce-Price-amount { font: inherit; color: inherit; }

/* Wishlist heart on cards (outside the card link, so there are no nested buttons in links) */
.alv-wish {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
  z-index: 2;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(252, 247, 241, 0.92);
  color: var(--color-maroon700);
  box-shadow: var(--shadow-sm);
  transition: transform var(--motion-fast), background var(--motion-fast);
}
.alv-wish:hover { transform: scale(1.06); background: var(--color-ivory50); }
.alv-wish[aria-pressed='true'] .alv-icon path { fill: currentColor; }
.alv-wish.is-pop { animation: alv-pop 320ms var(--motion-ease); }
@keyframes alv-pop { 50% { transform: scale(1.18); } }
.alv-wishpage .alv-grid--wish { margin-top: var(--space-2); }

/* ---------- Look card + looks grid — ported from 10.3b Looks.module.css / Pages.module.css ---------- */
.alv-looksgrid { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fill, minmax(min(100%, 440px), 1fr)); }
.alv-look { display: grid; grid-template-columns: 42% 1fr; background: var(--c-bg-raised); border: 1px solid var(--c-border); border-radius: var(--radius-xs); overflow: hidden; }
.alv-look__media { position: relative; display: block; }
.alv-look__media .alv-media { height: 100%; aspect-ratio: auto; min-height: 260px; border-radius: 0; }
.alv-look__occ { position: absolute; left: var(--space-3); top: var(--space-3); padding: 3px 8px; background: rgba(247, 235, 221, 0.92); color: var(--color-maroon700); font-family: var(--font-sans); font-size: 10px; font-weight: 600; letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.alv-look__body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-5); }
.alv-look__title { font-family: var(--font-serif); font-weight: 400; font-size: var(--text-lg); color: var(--color-maroon800); }
.alv-look__sub { font-size: var(--text-sm); color: var(--c-text-muted); }
.alv-look__list { display: grid; gap: var(--space-2); margin: var(--space-2) 0 var(--space-4); }
.alv-look__list li { display: grid; grid-template-columns: 20px 1fr; gap: var(--space-2); font-size: var(--text-sm); color: var(--c-text); }
.alv-look__list .alv-icon { color: var(--color-gold600); }
.alv-look__body .link-arrow { margin-top: auto; }
@media (max-width: 479px) { .alv-look { grid-template-columns: 1fr; } .alv-look__media .alv-media { aspect-ratio: 4 / 3; min-height: 0; } }