/* Çiftet me video — dy karta që ndajnë një video. */
.egkc .egkc-rresht {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 24px);
  max-width: 920px;
  margin: 0 auto;
}
.egkc .p-frame { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; }
.egkc .p-frame .p-foto { width: 100%; height: 100%; object-fit: cover; transition: opacity .5s ease; }
.egkc .egkc-pjesa {
  position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1;
  opacity: 0; transition: opacity .5s ease; pointer-events: none;
}
.egkc .egkc-gati .egkc-pjesa, .egkc.egkc-gati .egkc-pjesa { opacity: 1; }
.egkc .egkc-video { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.egkc .egkc-lead { margin: 6px 0 0; color: #6b5f57; }
/* Homepage s'e pozicionon etiketën e uljes; marrim stilin e kategorive. */
.egkc .p-frame .p-discount {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  font-size: 10.5px; color: var(--sale, #a23b2a); background: var(--paper, #fff);
  border: 1px solid var(--sale, #a23b2a); padding: 3px 8px;
}
.egkc .egkc-preorder { font-size: 14px; letter-spacing: .02em; }
.egkc a.egkc-cart-link {
  display: flex !important; align-items: center; justify-content: center; text-align: center;
  text-decoration: none !important; color: inherit !important; border: 1px solid currentColor !important;
  padding: 10px 6px !important; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; line-height: 1.3;
}

/* Tre kolona vertikale: dy karta normale (foto, pastaj emri/çmimi/butonat) njëra mbi
   tjetrën; videoja ndahet mes dy fotove, rrjedha kalon "mbi" tekstin e kartës së sipërme. */
.egkv .egkv-kolonat {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.4vw, 32px);
  max-width: 1000px;
  margin: 0 auto;
}
.egkv .egkv-kolona { position: relative; display: flex; flex-direction: column; min-width: 0; }
.egkv .egkv-etiketa {
  margin: 0 0 10px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: #8a7d73;
}
.egkv .egkv-kolona > .egkv-karta { margin: 0 !important; }
.egkv .egkv-kolona > .egkv-karta > .p-frame { aspect-ratio: 4 / 5 !important; height: auto !important; width: 100% !important; }
/* Karta e sipërme: meta merr lartësinë e më të gjatës (JS), që fotot e poshtme të rreshtohen. */
.egkv .egkv-kolona > .egkv-karta:first-of-type > .p-meta { min-height: var(--egkv-meta-lart, 0px); }
.egkv .egkv-kolona > .egkv-karta + .egkv-karta { margin-top: 14px !important; }

@media (max-width: 640px) {
  .egkc .egkc-rresht { gap: 10px; }
  /* Përzgjedhësi me tre ID (:is(#egzN, .egkv)) mund rregullat e enghome-dizajn.css me dy ID.
     Telefon: çdo çift është një bllok kompakt: dy fotot ngjitur majtas (rrjedha vazhdon),
     emri/çmimi/butoni djathtas pranë fotos së vet. Blloqet rrëshqiten anash. */
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolonat {
    display: flex !important; gap: 12px; max-width: none;
    overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    margin: 0 -16px !important; padding: 0 16px 6px !important; scroll-padding: 0 16px;
    scrollbar-width: none;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolonat::-webkit-scrollbar { display: none; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona {
    flex: 0 0 88%; scroll-snap-align: start;
    display: grid !important;
    grid-template-columns: 44% minmax(0, 1fr);
    grid-template-areas: "etiketa etiketa" "f1 m1" "f2 m2";
    column-gap: 14px; row-gap: 0;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-etiketa { grid-area: etiketa; margin: 0 0 8px; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta { display: contents !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta:first-of-type > .p-frame { grid-area: f1; align-self: end; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta:last-of-type > .p-frame { grid-area: f2; align-self: start; margin-top: 4px !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta:first-of-type > .p-meta { grid-area: m1; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta:last-of-type > .p-meta { grid-area: m2; margin-top: 4px !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona > .egkv-karta > .p-meta {
    min-height: 0 !important; align-self: center;
    display: flex !important; flex-direction: column !important; gap: 4px; padding: 0 !important;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .p-brand { font-size: 10px !important; letter-spacing: .12em; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .p-name { font-size: 14px !important; line-height: 1.3 !important; margin: 0 !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .price-row { margin: 2px 0 0 !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .p-actions {
    display: flex !important; flex-wrap: nowrap !important; gap: 6px; margin-top: 8px !important; align-items: stretch;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .p-cart, html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona a.egkc-cart-link {
    flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; min-height: 36px; padding: 6px 6px !important; font-size: 10.5px !important; letter-spacing: .06em;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-kolona .p-wishlist {
    position: static !important; flex: 0 0 36px; width: 36px !important; height: auto !important; min-height: 36px;
    border-radius: 0 !important; box-shadow: none !important; background: transparent !important;
    border: 1px solid rgba(43, 36, 31, .25) !important; inset: auto !important; margin: 0 !important;
  }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkc-preorder { font-size: 13px !important; }
  html body.enghome-body :is(#egz1, .egkv):is(#egz2, .egkv):is(#egz3, .egkv) .egkv-gjate { display: none; }
}