/* ============================================================
   Eastcliff HALAMAN PRODUK — 8 widget, satu stylesheet

   Breadcrumb, Gallery, Title, Price, Buy Box, Description, Details,
   Highlights. Satu file karena kedelapannya hampir selalu dipasang
   bersama di satu template, dan satu request lebih murah dari delapan.

   ARAH DESAIN. Bersih ala Shopify: foto besar di atas latar abu sangat
   muda, judul semibold yang rapat, satu harga yang jelas, tombol setinggi
   jempol, dan detail dilipat dalam akordeon supaya kolom info tetap
   pendek. Warna, ukuran, dan jarak seluruhnya dari tokens.css.

   ATURAN SPESIFISITAS (baca sebelum menambah aturan).
   Kit Elementor menata h1/a/button/img lewat `.elementor-kit-N tag`
   (0-1-1). Karena itu:
     - aturan di sini minimal DUA kelas (0-2-0), supaya menang atas Kit;
     - kontrol Style di PHP memakai {{WRAPPER}} + DUA kelas (0-3-0),
       supaya pilihan di panel Elementor menang atas file ini.
   Kotak beli lebih berat lagi - lihat bagian BUY BOX.
   ============================================================ */

/* ------------------------------------------------------------
   BERSAMA
   ------------------------------------------------------------ */

.ecw-editor-note {
  margin: var(--ecw-sp-sm) 0 0;
  padding: var(--ecw-sp-sm);
  border: var(--ecw-border) dashed var(--ecw-warn-line);
  border-radius: var(--ecw-r-md);
  background: var(--ecw-warn-bg);
  color: var(--ecw-warn);
  font-family: var(--ecw-font);
  font-size: var(--ecw-text-caption);
  line-height: var(--ecw-lh-base);
}

/* Teks screen reader di dalam harga WooCommerce ("Original price
   was: ..."). Tema biasanya sudah menyembunyikannya; ditulis ulang di
   sini supaya harga tidak tiba-tiba memuat kalimat itu kalau tema
   diganti. */
.ecw-pprice .screen-reader-text,
.ecw-buy .screen-reader-text,
.ecw-sticky-buy .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

html.ecw-lock {
  overflow: hidden;
}

/* ------------------------------------------------------------
   BREADCRUMB
   ------------------------------------------------------------ */

.ecw-pbc {
  color: var(--ecw-muted);
  font-size: var(--ecw-text-caption);
  line-height: var(--ecw-lh-base);
}

.ecw-pbc .ecw-pbc__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ecw-sp-2xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ecw-pbc .ecw-pbc__item {
  display: inline-flex;
  align-items: center;
  gap: var(--ecw-sp-2xs);
  min-width: 0;
  margin: 0;
}

.ecw-pbc .ecw-pbc__link {
  color: var(--ecw-muted);
  font-size: inherit;
  text-decoration: none;
  transition: color var(--ecw-t-fast) var(--ecw-ease);
}

.ecw-pbc .ecw-pbc__link:hover {
  color: var(--ecw-ink);
}

/* Nama produk yang panjang dipotong, bukan membungkus jadi dua baris
   breadcrumb - breadcrumb yang lebih tinggi dari judulnya sendiri
   membalik hierarki halaman. */
.ecw-pbc .ecw-pbc__current {
  overflow: hidden;
  max-width: 40ch;
  color: var(--ecw-ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecw-pbc .ecw-pbc__sep {
  display: inline-flex;
  color: var(--ecw-muted);
}

.ecw-pbc .ecw-pbc__sep .ecw-icon {
  width: var(--ecw-sp-sm);
  height: var(--ecw-sp-sm);
}

/* ------------------------------------------------------------
   GALLERY
   ------------------------------------------------------------ */

.ecw-gal {
  --ecw-gal-ratio: 1 / 1;
  --ecw-gal-fit: cover;
  --ecw-gal-radius: var(--ecw-r-lg);
  --ecw-gal-gap: var(--ecw-sp-xs);
  --ecw-gal-bg: var(--ecw-surface-2);
  --ecw-gal-thumb: var(--ecw-thumb);
  --ecw-gal-active: var(--ecw-ink);

  display: flex;
  flex-direction: column;
  gap: var(--ecw-gal-gap);
  width: 100%;
  min-width: 0;
}

.ecw-gal .ecw-gal__stage {
  position: relative;
  min-width: 0;
}

/* Trek geser. position:relative wajib: product.js membaca offsetLeft
   tiap slide, dan offsetLeft dihitung dari offsetParent. */
.ecw-gal .ecw-gal__track {
  position: relative;
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: var(--ecw-gal-radius);
  background: var(--ecw-gal-bg);
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  outline: none;
}

.ecw-gal .ecw-gal__track::-webkit-scrollbar {
  display: none;
}

.ecw-gal .ecw-gal__track:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

.ecw-gal .ecw-gal__slide {
  flex: 0 0 100%;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  aspect-ratio: var(--ecw-gal-ratio);
  scroll-snap-align: start;
  line-height: 0;
}

.ecw-gal .ecw-gal__open {
  display: block;
  width: 100%;
  height: 100%;
  cursor: zoom-in;
}

.ecw-gal .ecw-gal__slide img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: var(--ecw-gal-fit);
}

/* Panah: muncul saat kursor di atas foto. Di layar sentuh dibuang -
   jari sudah menggeser, dan panah yang selalu terlihat menutupi foto. */
.ecw-gal .ecw-gal__arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ecw-trigger-h);
  height: var(--ecw-trigger-h);
  margin-top: calc(var(--ecw-trigger-h) / -2);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  box-shadow: 0 0 0 var(--ecw-border) var(--ecw-line);
  color: var(--ecw-ink);
  cursor: pointer;
  opacity: 0;
  transition:
    opacity var(--ecw-t-base) var(--ecw-ease),
    background-color var(--ecw-t-base) var(--ecw-ease),
    color var(--ecw-t-base) var(--ecw-ease);
}

.ecw-gal .ecw-gal__arrow--prev {
  left: var(--ecw-sp-sm);
}

.ecw-gal .ecw-gal__arrow--next {
  right: var(--ecw-sp-sm);
}

.ecw-gal .ecw-gal__stage:hover .ecw-gal__arrow,
.ecw-gal .ecw-gal__arrow:focus-visible {
  opacity: 1;
}

.ecw-gal .ecw-gal__arrow:hover {
  background: var(--ecw-ink);
  color: var(--ecw-on-ink);
}

.ecw-gal .ecw-gal__arrow:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

.ecw-gal .ecw-gal__arrow .ecw-icon {
  width: var(--ecw-icon);
  height: var(--ecw-icon);
}

@media (hover: none) {
  .ecw-gal .ecw-gal__arrow {
    display: none;
  }
}

.ecw-gal .ecw-gal__counter {
  position: absolute;
  bottom: var(--ecw-sp-sm);
  left: var(--ecw-sp-sm);
  z-index: 2;
  padding: var(--ecw-sp-2xs) var(--ecw-sp-xs);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  box-shadow: 0 0 0 var(--ecw-border) var(--ecw-line);
  color: var(--ecw-ink);
  font-size: var(--ecw-text-micro);
  font-weight: var(--ecw-w-semibold);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  pointer-events: none;
}

.ecw-gal .ecw-gal__zoom {
  position: absolute;
  top: var(--ecw-sp-sm);
  right: var(--ecw-sp-sm);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ecw-sp-xl);
  height: var(--ecw-sp-xl);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  box-shadow: 0 0 0 var(--ecw-border) var(--ecw-line);
  color: var(--ecw-ink);
  pointer-events: none;
}

.ecw-gal .ecw-gal__zoom .ecw-icon {
  width: var(--ecw-icon-sm);
  height: var(--ecw-icon-sm);
}

/* Titik: hanya di mobile (lihat media query di bawah). Titik aktif
   melebar jadi pil - posisi terbaca tanpa perlu menghitung titik. */
.ecw-gal .ecw-gal__dots {
  position: absolute;
  bottom: var(--ecw-sp-sm);
  left: 50%;
  z-index: 2;
  display: none;
  align-items: center;
  gap: var(--ecw-sp-2xs);
  padding: var(--ecw-sp-2xs) var(--ecw-sp-xs);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  transform: translateX(-50%);
  pointer-events: none;
}

.ecw-gal .ecw-gal__dot {
  display: block;
  width: calc(var(--ecw-sp-2xs) * 1.5);
  height: calc(var(--ecw-sp-2xs) * 1.5);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-line-strong);
  transition:
    width var(--ecw-t-slow) var(--ecw-ease-out),
    background-color var(--ecw-t-base) var(--ecw-ease);
}

.ecw-gal .ecw-gal__dot.is-active {
  width: var(--ecw-sp-md);
  background: var(--ecw-ink);
}

/* Thumbnail. Padding kecil + margin negatif memberi ruang cincin fokus
   tanpa menggeser deretnya dari garis tepi foto besar. */
.ecw-gal .ecw-gal__thumbs {
  position: relative;
  display: flex;
  gap: var(--ecw-sp-xs);
  margin: calc(var(--ecw-sp-3xs) * -1);
  padding: var(--ecw-sp-3xs);
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.ecw-gal .ecw-gal__thumbs::-webkit-scrollbar {
  display: none;
}

.ecw-gal .ecw-gal__thumb {
  position: relative;
  flex: 0 0 var(--ecw-gal-thumb);
  width: var(--ecw-gal-thumb);
  overflow: hidden;
  aspect-ratio: var(--ecw-gal-ratio);
  border-radius: var(--ecw-r-md);
  background: var(--ecw-gal-bg);
  cursor: pointer;
  line-height: 0;
}

/* Cincin digambar di ::after, di ATAS foto. Pada foto sendiri
   (border), cincin tertutup foto yang object-fit:cover. */
.ecw-gal .ecw-gal__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 var(--ecw-border) var(--ecw-line);
  transition: box-shadow var(--ecw-t-base) var(--ecw-ease);
  pointer-events: none;
}

.ecw-gal .ecw-gal__thumb:hover::after {
  box-shadow: inset 0 0 0 var(--ecw-border) var(--ecw-ink);
}

.ecw-gal .ecw-gal__thumb.is-active::after {
  box-shadow: inset 0 0 0 var(--ecw-sp-3xs) var(--ecw-gal-active);
}

.ecw-gal .ecw-gal__thumb:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

.ecw-gal .ecw-gal__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ------------------------------------------------------------
   LIGHTBOX

   Satu foto per layar di atas latar putih - foto produk dengan latar
   terang tenggelam di atas latar gelap, dan halaman ini hitam-putih.
   Tiga baris: bar atas (counter, nama, tutup), panggung foto, strip
   thumbnail. Foto digeser dengan scroll-snap seperti galeri utama.

   Zoom: kelas is-zoomed membuat slide bisa digulir dua arah dan foto
   tampil selebar ukuran aslinya (lebar diset product.js). Selama zoom,
   trek berhenti menggeser supaya jari/trackpad menggeser foto, bukan
   pindah foto.
   ------------------------------------------------------------ */

.ecw-gal .ecw-gal__lightbox {
  position: fixed;
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: var(--ecw-surface);
  color: var(--ecw-ink);
}

.ecw-gal .ecw-gal__lightbox:not([open]) {
  display: none;
}

.ecw-gal .ecw-gal__lightbox[open] {
  animation: ecw-lb-in var(--ecw-t-slow) var(--ecw-ease-out);
}

.ecw-gal .ecw-gal__lightbox::backdrop {
  background: var(--ecw-surface);
}

@keyframes ecw-lb-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* grid-template-columns WAJIB minmax(0, 1fr). Tanpa itu kolom grid
   selebar isi terlebarnya - dan foto yang di-zoom lebarnya ribuan
   piksel. Di mobile (1.8.1) seluruh lightbox ikut melebar melewati
   layar: tombol tutup terdorong keluar, strip thumbnail bergeser, dan
   titik zoom meleset karena dihitung dari lebar yang salah. */
.ecw-gal .ecw-lb {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  height: 100%;
}

.ecw-gal .ecw-lb__bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--ecw-sp-sm);
  padding: var(--ecw-sp-sm) var(--ecw-sp-md);
  border-bottom: var(--ecw-border) solid var(--ecw-line);
}

.ecw-gal .ecw-lb__count {
  color: var(--ecw-ink);
  font-size: var(--ecw-text-sm);
  font-weight: var(--ecw-w-semibold);
  font-variant-numeric: tabular-nums;
}

.ecw-gal .ecw-lb__name {
  overflow: hidden;
  max-width: 40ch;
  color: var(--ecw-muted);
  font-size: var(--ecw-text-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecw-gal .ecw-lb__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ecw-control-h);
  height: var(--ecw-control-h);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  box-shadow: 0 0 0 var(--ecw-border) var(--ecw-line);
  color: var(--ecw-ink);
  cursor: pointer;
  transition:
    background-color var(--ecw-t-base) var(--ecw-ease),
    color var(--ecw-t-base) var(--ecw-ease),
    opacity var(--ecw-t-base) var(--ecw-ease);
}

.ecw-gal .ecw-lb__btn:hover {
  background: var(--ecw-ink);
  color: var(--ecw-on-ink);
}

.ecw-gal .ecw-lb__btn:focus-visible,
.ecw-gal .ecw-lb__thumb:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

.ecw-gal .ecw-lb__btn .ecw-icon {
  width: var(--ecw-icon);
  height: var(--ecw-icon);
}

.ecw-gal .ecw-lb__close {
  justify-self: end;
}

.ecw-gal .ecw-lb__stage {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.ecw-gal .ecw-lb__track {
  display: flex;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior: contain;
  scrollbar-width: none;
}

.ecw-gal .ecw-lb__track::-webkit-scrollbar {
  display: none;
}

.ecw-gal .ecw-lb__slide {
  display: flex;
  flex: 0 0 100%;
  min-width: 0;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 100%;
  padding: var(--ecw-sp-md);
  overflow: hidden;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.ecw-gal .ecw-lb__img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  border-radius: 0;
  object-fit: contain;
  cursor: zoom-in;
  -webkit-user-select: none;
  user-select: none;
}

/* Zoom */
.ecw-gal .ecw-gal__lightbox.is-zoomed .ecw-lb__track {
  overflow: hidden;
}

/* safe center: foto yang lebih kecil dari layar tetap di tengah, foto
   yang lebih besar mulai dari tepi kiri-atas supaya seluruhnya bisa
   digulir (center biasa memotong sisi kiri dan atas tanpa bisa dicapai). */
.ecw-gal .ecw-lb__slide.is-zoomed {
  align-items: safe center;
  justify-content: safe center;
  padding: 0;
  overflow: auto;
  scrollbar-width: none;
}

.ecw-gal .ecw-lb__slide.is-zoomed .ecw-lb__img {
  flex: 0 0 auto;
  max-width: none;
  max-height: none;
  cursor: zoom-out;
}

.ecw-gal .ecw-lb__arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  margin-top: calc(var(--ecw-control-h) / -2);
}

.ecw-gal .ecw-lb__arrow--prev {
  left: var(--ecw-sp-md);
}

.ecw-gal .ecw-lb__arrow--next {
  right: var(--ecw-sp-md);
}

.ecw-gal .ecw-gal__lightbox.is-zoomed .ecw-lb__arrow,
.ecw-gal .ecw-gal__lightbox.is-zoomed .ecw-lb__hint {
  opacity: 0;
  pointer-events: none;
}

.ecw-gal .ecw-lb__hint {
  position: absolute;
  bottom: var(--ecw-sp-md);
  left: 50%;
  z-index: 2;
  padding: var(--ecw-sp-2xs) var(--ecw-sp-sm);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-surface);
  box-shadow: 0 0 0 var(--ecw-border) var(--ecw-line);
  color: var(--ecw-muted);
  font-size: var(--ecw-text-caption);
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;
  transition: opacity var(--ecw-t-base) var(--ecw-ease);
}

.ecw-gal .ecw-lb__thumbs {
  display: flex;
  justify-content: safe center;
  gap: var(--ecw-sp-xs);
  padding: var(--ecw-sp-sm) var(--ecw-sp-md);
  overflow-x: auto;
  border-top: var(--ecw-border) solid var(--ecw-line);
  scrollbar-width: none;
}

.ecw-gal .ecw-lb__thumbs::-webkit-scrollbar {
  display: none;
}

.ecw-gal .ecw-lb__thumb {
  position: relative;
  flex: 0 0 auto;
  width: calc(var(--ecw-control-h) + var(--ecw-sp-sm));
  height: calc(var(--ecw-control-h) + var(--ecw-sp-sm));
  overflow: hidden;
  border-radius: var(--ecw-r-md);
  background: var(--ecw-surface-2);
  cursor: pointer;
  opacity: 0.5;
  line-height: 0;
  transition: opacity var(--ecw-t-base) var(--ecw-ease);
}

.ecw-gal .ecw-lb__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 var(--ecw-border) var(--ecw-line);
  pointer-events: none;
}

.ecw-gal .ecw-lb__thumb:hover {
  opacity: 1;
}

.ecw-gal .ecw-lb__thumb.is-active {
  opacity: 1;
}

.ecw-gal .ecw-lb__thumb.is-active::after {
  box-shadow: inset 0 0 0 var(--ecw-sp-3xs) var(--ecw-ink);
}

.ecw-gal .ecw-lb__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767px) {
  /* Nama disembunyikan, jadi bar tinggal dua kolom - tanpa ini tombol
     tutup bergeser ke kolom tengah yang ditinggalkan nama. */
  .ecw-gal .ecw-lb__bar {
    grid-template-columns: 1fr auto;
  }

  .ecw-gal .ecw-lb__name,
  .ecw-gal .ecw-lb__arrow {
    display: none;
  }

  .ecw-gal .ecw-lb__slide {
    padding: 0;
  }
}

@media (hover: none) {
  .ecw-gal .ecw-lb__arrow {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ecw-gal .ecw-gal__lightbox[open] {
    animation: none;
  }
}

/* -------- Desktop: thumbnail kiri & grid -------- */

@media (min-width: 768px) {
  .ecw-gal.ecw-gal--thumbs-left {
    display: grid;
    grid-template-columns: var(--ecw-gal-thumb) minmax(0, 1fr);
    align-items: start;
  }

  .ecw-gal.ecw-gal--thumbs-left .ecw-gal__stage {
    grid-row: 1;
    grid-column: 2;
  }

  /* height:0 + min-height:100% = setinggi foto besar, tidak lebih.
     Tanpa ini, sepuluh thumbnail memanjangkan baris grid dan foto besar
     ikut melar. */
  .ecw-gal.ecw-gal--thumbs-left .ecw-gal__thumbs {
    flex-direction: column;
    grid-row: 1;
    grid-column: 1;
    align-self: stretch;
    height: 0;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .ecw-gal.ecw-gal--thumbs-none .ecw-gal__thumbs {
    display: none;
  }

  /* Grid: semua foto terbuka, foto pertama selebar dua kolom.
     overflow:visible di trek adalah penanda yang dibaca product.js
     untuk tahu galeri sedang tidak berperilaku sebagai slider. */
  .ecw-gal.ecw-gal--grid .ecw-gal__track {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ecw-gal-gap);
    overflow: visible;
    border-radius: 0;
    background: none;
    scroll-snap-type: none;
  }

  .ecw-gal.ecw-gal--grid .ecw-gal__slide {
    border-radius: var(--ecw-gal-radius);
    background: var(--ecw-gal-bg);
  }

  .ecw-gal.ecw-gal--grid .ecw-gal__slide:first-child {
    grid-column: 1 / -1;
  }

  .ecw-gal.ecw-gal--grid .ecw-gal__arrow,
  .ecw-gal.ecw-gal--grid .ecw-gal__counter,
  .ecw-gal.ecw-gal--grid .ecw-gal__thumbs {
    display: none;
  }
}

/* -------- Mobile -------- */

@media (max-width: 767px) {
  .ecw-gal .ecw-gal__arrow,
  .ecw-gal .ecw-gal__thumbs {
    display: none;
  }

  .ecw-gal.ecw-gal--mnav-thumbs .ecw-gal__thumbs {
    display: flex;
  }

  .ecw-gal.ecw-gal--mnav-dots .ecw-gal__dots {
    display: inline-flex;
  }

  /* Titik sudah memberi tahu posisi - counter di pojok jadi berulang. */
  .ecw-gal.ecw-gal--mnav-dots .ecw-gal__counter {
    display: none;
  }
}

/* ------------------------------------------------------------
   TITLE
   ------------------------------------------------------------ */

.ecw-ptitle {
  display: block;
  text-align: left;
}

.ecw-ptitle .ecw-ptitle__eyebrow {
  display: inline-block;
  margin: 0 0 var(--ecw-sp-xs);
  color: var(--ecw-muted);
  font-size: var(--ecw-text-micro);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-tight);
  letter-spacing: var(--ecw-track-label);
  text-decoration: none;
  text-transform: uppercase;
  transition: color var(--ecw-t-fast) var(--ecw-ease);
}

.ecw-ptitle a.ecw-ptitle__eyebrow:hover {
  color: var(--ecw-ink);
}

.ecw-ptitle .ecw-ptitle__name {
  display: block;
  margin: 0;
  padding: 0;
  color: var(--ecw-ink);
  font-family: var(--ecw-font);
  font-size: var(--ecw-text-h1);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-tight);
  letter-spacing: var(--ecw-track-h1);
  text-transform: none;
  overflow-wrap: break-word;
}

@media (max-width: 767px) {
  .ecw-ptitle .ecw-ptitle__name {
    font-size: var(--ecw-text-h2);
    letter-spacing: var(--ecw-track-tight);
  }
}

/* ------------------------------------------------------------
   PRICE

   Markup harganya milik WooCommerce: <del>harga lama</del> <ins>harga
   baru</ins>. Urutan tampil dibalik lewat `order` - harga yang dibayar
   dibaca lebih dulu, harga coret menyusul sebagai konteks.
   ------------------------------------------------------------ */

.ecw-pprice {
  display: flex;
  flex-direction: column;
  gap: var(--ecw-sp-2xs);
}

.ecw-pprice .ecw-pprice__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ecw-sp-xs) var(--ecw-sp-sm);
}

.ecw-pprice .ecw-pprice__amount,
.ecw-pprice .ecw-pprice__amount .price {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ecw-sp-xs);
  margin: 0;
  color: var(--ecw-ink);
  font-size: var(--ecw-text-h3);
  font-weight: var(--ecw-w-medium);
  line-height: var(--ecw-lh-tight);
  letter-spacing: var(--ecw-track-tight);
  font-variant-numeric: tabular-nums;
}

.ecw-pprice .ecw-pprice__amount .price {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}

.ecw-pprice .ecw-pprice__amount ins {
  order: 0;
  background: none;
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
}

.ecw-pprice .ecw-pprice__amount del {
  order: 1;
  color: var(--ecw-muted);
  font-size: var(--ecw-text-base);
  font-weight: var(--ecw-w-regular);
  opacity: 1;
}

.ecw-pprice .ecw-pprice__amount .woocommerce-Price-amount,
.ecw-pprice .ecw-pprice__amount bdi {
  color: inherit;
  font: inherit;
}

.ecw-pprice .ecw-pprice__amount .woocommerce-price-suffix {
  color: var(--ecw-muted);
  font-size: var(--ecw-text-caption);
}

.ecw-pprice .ecw-pprice__badge {
  display: inline-flex;
  align-items: center;
  height: var(--ecw-sp-lg);
  padding: 0 var(--ecw-sp-xs);
  border-radius: var(--ecw-r-pill);
  background: var(--ecw-ink);
  color: var(--ecw-on-ink);
  font-size: var(--ecw-text-micro);
  font-weight: var(--ecw-w-semibold);
  line-height: 1;
  letter-spacing: var(--ecw-track-label);
  text-transform: uppercase;
  white-space: nowrap;
}

.ecw-pprice .ecw-pprice__badge[hidden] {
  display: none;
}

.ecw-pprice .ecw-pprice__note {
  margin: 0;
  color: var(--ecw-muted);
  font-size: var(--ecw-text-caption);
  line-height: var(--ecw-lh-base);
}

/* ------------------------------------------------------------
   BUY BOX

   Form di sini dicetak WooCommerce, dan tiga pihak ikut menatanya:
   CSS WooCommerce (`.woocommerce div.product form.cart .button`, 0-3-1;
   `div.quantity`, 0-3-2), Kit Elementor (`button`), dan tema. Karena itu
   aturan kotak dan warna tombol memakai awalan panjang:

     .elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart
     (0-4-1)

   Tipografi tombol SENGAJA tidak di bawah awalan itu, melainkan di
   `.ecw-buy .ecw-buy__form .tombol` (0-3-0): cukup untuk menang atas
   WooCommerce (0-2-1) dan Kit, tapi tetap kalah dari kontrol Typography
   di panel Elementor (0-4-0). Warna diatur lewat custom property, jadi
   kontrol warnanya tidak perlu bersaing spesifisitas sama sekali.
   ------------------------------------------------------------ */

.ecw-buy {
  --ecw-buy-radius: var(--ecw-r-md);
  --ecw-buy-h: calc(var(--ecw-control-h) + var(--ecw-sp-2xs));
  --ecw-buy-primary-bg: var(--ecw-ink);
  --ecw-buy-primary-fg: var(--ecw-on-ink);
  --ecw-buy-primary-bg-h: var(--ecw-ink-2);
  --ecw-buy-secondary-fg: var(--ecw-ink);
  --ecw-buy-secondary-bg-h: var(--ecw-surface-2);

  width: 100%;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart {
  margin: 0;
  padding: 0;
  border: 0;
}

/* Deret [qty][Add to cart] / [Buy now]. Produk simple: form-nya
   sendiri. Produk variabel: pembungkus tombol di bawah swatch. */
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart:not(.variations_form),
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .woocommerce-variation-add-to-cart {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--ecw-sp-xs);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ct-cart-actions {
  display: contents;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .woocommerce-variation {
  margin: 0 0 var(--ecw-sp-sm);
}

.elementor-widget-ecw_product_buy .ecw-buy.ecw-buy--hide-var-price .ecw-buy__form form.cart .woocommerce-variation-price {
  display: none;
}

/* -------- Stok -------- */

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form .stock {
  display: inline-flex;
  align-items: center;
  gap: var(--ecw-sp-xs);
  margin: 0 0 var(--ecw-sp-sm);
  color: var(--ecw-success);
  font-size: var(--ecw-text-caption);
  font-weight: var(--ecw-w-medium);
  line-height: var(--ecw-lh-base);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form .stock::before {
  content: "";
  width: var(--ecw-sp-xs);
  height: var(--ecw-sp-xs);
  border-radius: var(--ecw-r-pill);
  background: currentColor;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form .stock.out-of-stock {
  color: var(--ecw-danger);
}

/* -------- Jumlah -------- */

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: stretch;
  box-sizing: border-box;
  float: none;
  width: auto;
  height: var(--ecw-buy-h);
  margin: 0;
  overflow: hidden;
  border: var(--ecw-border) solid var(--ecw-line-strong);
  border-radius: var(--ecw-buy-radius);
  background: var(--ecw-surface);
}

/* Produk "sold individually" mencetak input jumlah bertipe hidden di
   dalam div.quantity - kotaknya kosong, jadi tidak digambar. */
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity:has(input[type="hidden"]),
.elementor-widget-ecw_product_buy .ecw-buy.ecw-buy--no-qty .ecw-buy__form form.cart div.quantity {
  display: none;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity .qty {
  box-sizing: border-box;
  width: var(--ecw-control-h);
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--ecw-ink);
  font-family: var(--ecw-font);
  font-size: var(--ecw-text-base);
  font-weight: var(--ecw-w-semibold);
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity .qty::-webkit-inner-spin-button,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity .qty::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity .qty:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: calc(var(--ecw-sp-3xs) * -1);
}

/* Tombol − / + bawaan Blocksy disembunyikan hanya SETELAH product.js
   memasang tombolnya sendiri (kelas ecw-qty). JS gagal = tombol tema
   tetap ada. */
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity.ecw-qty .ct-increase,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart div.quantity.ecw-qty .ct-decrease {
  display: none;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-qty__btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: var(--ecw-trigger-h);
  color: var(--ecw-ink);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  transition: background-color var(--ecw-t-fast) var(--ecw-ease);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-qty__btn:hover {
  background: var(--ecw-surface-2);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-qty__btn[aria-disabled="true"] {
  background: none;
  color: var(--ecw-muted);
  cursor: not-allowed;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-qty__btn:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: calc(var(--ecw-sp-3xs) * -1);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-qty__btn .ecw-icon {
  width: var(--ecw-icon-sm);
  height: var(--ecw-icon-sm);
}

/* -------- Tombol -------- */

.ecw-buy .ecw-buy__form .single_add_to_cart_button,
.ecw-buy .ecw-buy__form .ecw-buy__now {
  font-family: var(--ecw-font);
  font-size: var(--ecw-text-base);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-tight);
  letter-spacing: var(--ecw-track-none);
  text-transform: none;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-buy__now {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ecw-sp-xs);
  box-sizing: border-box;
  float: none;
  width: auto;
  min-width: 0;
  height: var(--ecw-buy-h);
  min-height: 0;
  margin: 0;
  padding: 0 var(--ecw-sp-md);
  border: var(--ecw-border) solid var(--ecw-buy-primary-bg);
  border-radius: var(--ecw-buy-radius);
  background: var(--ecw-buy-primary-bg);
  background-image: none;
  box-shadow: none;
  color: var(--ecw-buy-primary-fg);
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  white-space: normal;
  text-wrap: balance;
  cursor: pointer;
  opacity: 1;
  transition:
    background-color var(--ecw-t-base) var(--ecw-ease),
    border-color var(--ecw-t-base) var(--ecw-ease),
    color var(--ecw-t-base) var(--ecw-ease),
    opacity var(--ecw-t-base) var(--ecw-ease);
}

/* Add to cart mengisi SISA baris di sebelah qty, berapa pun sisanya.
   Versi 1.8.0 memberinya lebar minimum 10rem: di layar 360px (Elementor
   mobile, banyak ponsel Android) qty + 10rem tidak muat, tombolnya
   melipat ke baris bawah dan qty tertinggal sendirian. Sekarang
   tombolnya yang menyempit - teksnya boleh dua baris. */
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button {
  flex: 1 1 0;
  padding: 0 var(--ecw-sp-sm);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-buy__now {
  flex: 1 1 100%;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button:hover,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-buy__now:hover {
  border-color: var(--ecw-buy-primary-bg-h);
  background: var(--ecw-buy-primary-bg-h);
  color: var(--ecw-buy-primary-fg);
}

/* Ada Buy now: Add to cart turun jadi tombol garis. Satu tombol
   hitam per layar - dua tombol hitam berdampingan membuat pembeli
   berhenti untuk memilih. */
.elementor-widget-ecw_product_buy .ecw-buy.ecw-buy--buynow .ecw-buy__form form.cart .single_add_to_cart_button {
  border-color: var(--ecw-buy-secondary-fg);
  background: var(--ecw-surface);
  color: var(--ecw-buy-secondary-fg);
}

.elementor-widget-ecw_product_buy .ecw-buy.ecw-buy--buynow .ecw-buy__form form.cart .single_add_to_cart_button:hover {
  border-color: var(--ecw-buy-secondary-fg);
  background: var(--ecw-buy-secondary-bg-h);
  color: var(--ecw-buy-secondary-fg);
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button:focus-visible,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-buy__now:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

/* Varian belum dipilih: WooCommerce memasang .disabled pada Add to
   cart. Buy now ikut terlihat mati, karena dia juga menunggu pilihan
   yang sama. Keduanya tetap bisa diklik - klik memunculkan pesan
   "pilih varian dulu" dari WooCommerce, bukan diam. */
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button.disabled,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart:has(.single_add_to_cart_button.disabled) .ecw-buy__now {
  cursor: not-allowed;
  opacity: 0.4;
}

.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .single_add_to_cart_button.loading,
.elementor-widget-ecw_product_buy .ecw-buy .ecw-buy__form form.cart .ecw-buy__now.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

/* ------------------------------------------------------------
   STICKY BAR (mobile)

   Dipindah product.js ke anak langsung <body>, supaya position:fixed
   tidak terkurung container Elementor yang punya transform.
   ------------------------------------------------------------ */

.ecw-sticky-buy {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9990;
  display: none;
  align-items: center;
  gap: var(--ecw-sp-sm);
  padding: var(--ecw-sp-sm) var(--ecw-sp-md);
  padding-bottom: calc(var(--ecw-sp-sm) + env(safe-area-inset-bottom));
  border-top: var(--ecw-border) solid var(--ecw-line);
  background: var(--ecw-surface);
  font-family: var(--ecw-font);
  transform: translateY(100%);
  transition: transform var(--ecw-t-panel) var(--ecw-ease-out);
}

.ecw-sticky-buy.is-visible {
  transform: translateY(0);
}

.ecw-sticky-buy .ecw-sticky-buy__media {
  flex: 0 0 auto;
  width: var(--ecw-control-h);
  height: var(--ecw-control-h);
  overflow: hidden;
  border-radius: var(--ecw-r-md);
  background: var(--ecw-surface-2);
  line-height: 0;
}

.ecw-sticky-buy .ecw-sticky-buy__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ecw-sticky-buy .ecw-sticky-buy__info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--ecw-sp-3xs);
  min-width: 0;
}

.ecw-sticky-buy .ecw-sticky-buy__title {
  overflow: hidden;
  color: var(--ecw-ink);
  font-size: var(--ecw-text-sm);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-tight);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ecw-sticky-buy .ecw-sticky-buy__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ecw-sp-2xs);
  color: var(--ecw-ink);
  font-size: var(--ecw-text-caption);
  font-weight: var(--ecw-w-medium);
  line-height: var(--ecw-lh-tight);
}

.ecw-sticky-buy .ecw-sticky-buy__price .price {
  display: inherit;
  flex-wrap: inherit;
  align-items: inherit;
  gap: inherit;
}

.ecw-sticky-buy .ecw-sticky-buy__price ins {
  order: 0;
  background: none;
  text-decoration: none;
}

.ecw-sticky-buy .ecw-sticky-buy__price del {
  order: 1;
  color: var(--ecw-muted);
}

.ecw-sticky-buy .ecw-sticky-buy__btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  height: var(--ecw-control-h);
  padding: 0 var(--ecw-sp-lg);
  border-radius: var(--ecw-r-md);
  background: var(--ecw-ink);
  color: var(--ecw-on-ink);
  font-size: var(--ecw-text-base);
  font-weight: var(--ecw-w-semibold);
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}

.ecw-sticky-buy .ecw-sticky-buy__btn:active {
  background: var(--ecw-ink-2);
}

.ecw-sticky-buy .ecw-sticky-buy__btn:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

@media (max-width: 767px) {
  .ecw-sticky-buy {
    display: flex;
  }

  /* Ruang di dasar halaman supaya footer tidak tertutup bar. Dipasang
     selama bar ADA, bukan hanya saat terlihat - kalau ikut muncul-
     hilang, halaman melompat setiap kali bar bergerak. */
  html.ecw-sticky-on body {
    padding-bottom: calc(var(--ecw-control-h) + var(--ecw-sp-lg) + env(safe-area-inset-bottom));
  }
}

/* ------------------------------------------------------------
   DESCRIPTION & isi DETAILS (teks panjang)
   ------------------------------------------------------------ */

.ecw-pdesc,
.ecw-acc .ecw-acc__body {
  color: var(--ecw-ink-2);
  font-size: var(--ecw-text-base);
  line-height: var(--ecw-lh-base);
  overflow-wrap: break-word;
}

.ecw-pdesc > :first-child,
.ecw-acc .ecw-acc__body > :first-child {
  margin-top: 0;
}

.ecw-pdesc > :last-child,
.ecw-acc .ecw-acc__body > :last-child {
  margin-bottom: 0;
}

.ecw-pdesc p,
.ecw-acc .ecw-acc__body p {
  margin: 0 0 var(--ecw-sp-sm);
}

.ecw-pdesc ul,
.ecw-pdesc ol,
.ecw-acc .ecw-acc__body ul,
.ecw-acc .ecw-acc__body ol {
  margin: 0 0 var(--ecw-sp-sm);
  padding-left: var(--ecw-sp-lg);
}

.ecw-pdesc li + li,
.ecw-acc .ecw-acc__body li + li {
  margin-top: var(--ecw-sp-2xs);
}

.ecw-pdesc strong,
.ecw-acc .ecw-acc__body strong {
  color: var(--ecw-ink);
  font-weight: var(--ecw-w-semibold);
}

.ecw-pdesc a,
.ecw-acc .ecw-acc__body a {
  color: var(--ecw-ink);
  text-decoration: underline;
  text-underline-offset: var(--ecw-sp-3xs);
}

.ecw-pdesc img,
.ecw-acc .ecw-acc__body img {
  max-width: 100%;
  height: auto;
  border-radius: var(--ecw-r-md);
}

/* ------------------------------------------------------------
   DETAILS (akordeon)
   ------------------------------------------------------------ */

.ecw-acc {
  --ecw-acc-line: var(--ecw-line);
  --ecw-acc-pad: var(--ecw-sp-md);

  border-top: var(--ecw-border) solid var(--ecw-acc-line);
}

.ecw-acc .ecw-acc__item {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: var(--ecw-border) solid var(--ecw-acc-line);
}

.ecw-acc .ecw-acc__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ecw-sp-md);
  padding: var(--ecw-acc-pad) 0;
  color: var(--ecw-ink);
  cursor: pointer;
  list-style: none;
  -webkit-user-select: none;
  user-select: none;
}

.ecw-acc .ecw-acc__head::-webkit-details-marker {
  display: none;
}

.ecw-acc .ecw-acc__head::marker {
  content: "";
}

.ecw-acc .ecw-acc__head:focus-visible {
  outline: var(--ecw-sp-3xs) solid var(--ecw-ink);
  outline-offset: var(--ecw-sp-3xs);
}

.ecw-acc .ecw-acc__title {
  font-size: var(--ecw-text-base);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-snug);
  letter-spacing: var(--ecw-track-none);
  text-transform: none;
}

/* Plus yang berputar jadi minus: dua garis, satu diputar 90°. */
.ecw-acc .ecw-acc__icon {
  position: relative;
  flex: 0 0 auto;
  width: var(--ecw-icon-sm);
  height: var(--ecw-icon-sm);
}

.ecw-acc .ecw-acc__icon::before,
.ecw-acc .ecw-acc__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: var(--ecw-border);
  border-radius: var(--ecw-r-pill);
  background: currentColor;
  transition: transform var(--ecw-t-slow) var(--ecw-ease-out);
}

.ecw-acc .ecw-acc__icon::after {
  transform: rotate(90deg);
}

.ecw-acc .ecw-acc__item[open] .ecw-acc__icon::after {
  transform: rotate(0deg);
}

.ecw-acc .ecw-acc__body {
  padding: 0 0 var(--ecw-acc-pad);
}

/* Tabel atribut WooCommerce jadi baris label/nilai. :nth-child(n)
   menambah bobot untuk mengalahkan belang baris genap WooCommerce
   (`tr:nth-child(even) td`, 0-3-3). */
.ecw-acc .ecw-acc__body .woocommerce-product-attributes {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: none;
}

.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:nth-child(n) th,
.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:nth-child(n) td {
  padding: var(--ecw-sp-xs) 0;
  border: 0;
  border-bottom: var(--ecw-border) solid var(--ecw-acc-line);
  background: none;
  font-size: var(--ecw-text-sm);
  font-style: normal;
  line-height: var(--ecw-lh-base);
  text-align: left;
  vertical-align: top;
}

.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:nth-child(n) th {
  width: 40%;
  padding-right: var(--ecw-sp-md);
  color: var(--ecw-muted);
  font-weight: var(--ecw-w-regular);
}

.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:nth-child(n) td {
  color: var(--ecw-ink);
}

.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:last-child th,
.ecw-acc .ecw-acc__body .woocommerce-product-attributes tr:last-child td {
  border-bottom: 0;
}

.ecw-acc .ecw-acc__body .woocommerce-product-attributes td p {
  margin: 0;
}

/* ------------------------------------------------------------
   HIGHLIGHTS
   ------------------------------------------------------------ */

.ecw-hl {
  --ecw-hl-bg: var(--ecw-surface-2);

  display: grid;
  gap: var(--ecw-sp-sm);
  margin: 0;
  padding: 0;
  list-style: none;
}

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

.ecw-hl.ecw-hl--boxed {
  padding: var(--ecw-sp-md);
  border-radius: var(--ecw-r-lg);
  background: var(--ecw-hl-bg);
}

.ecw-hl .ecw-hl__item {
  display: flex;
  align-items: flex-start;
  gap: var(--ecw-sp-sm);
  margin: 0;
  padding: 0;
}

.ecw-hl .ecw-hl__icon {
  display: inline-flex;
  flex: 0 0 auto;
  color: var(--ecw-ink);
  line-height: 0;
}

.ecw-hl .ecw-hl__icon .ecw-icon {
  width: var(--ecw-icon);
  height: var(--ecw-icon);
  stroke-width: 1.6;
}

.ecw-hl .ecw-hl__copy {
  display: flex;
  flex-direction: column;
  gap: var(--ecw-sp-3xs);
  min-width: 0;
}

.ecw-hl .ecw-hl__title {
  color: var(--ecw-ink);
  font-size: var(--ecw-text-sm);
  font-weight: var(--ecw-w-semibold);
  line-height: var(--ecw-lh-snug);
}

.ecw-hl .ecw-hl__text {
  color: var(--ecw-muted);
  font-size: var(--ecw-text-caption);
  line-height: var(--ecw-lh-base);
}

/* ------------------------------------------------------------
   GERAK
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .ecw-gal .ecw-gal__track,
  .ecw-gal .ecw-gal__thumbs {
    scroll-behavior: auto;
  }

  .ecw-gal .ecw-gal__dot,
  .ecw-gal .ecw-gal__arrow,
  .ecw-sticky-buy,
  .ecw-acc .ecw-acc__icon::before,
  .ecw-acc .ecw-acc__icon::after {
    transition: none;
  }
}