/* ============================================
   SHIKÚ — Page Sections (Banner / Collection)
   Builds on hero-slider.css and product-card.css
   ============================================ */

/* ── Banner slides (cross-fade) ── */
.shiku-banner .hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease, visibility .5s;
}
.shiku-banner .hero__slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}
.shiku-banner picture { position: absolute; inset: 0; }
.shiku-banner .hero__controls { z-index: 2; }

.hero--medium { height: 560px; }

.hero__slide-link {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.hero__text { z-index: 2; }

.hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 1px;
  color: #fff;
  text-transform: lowercase;
  transition: opacity .2s;
}
.hero__cta:hover { opacity: .7; }
.hero__cta svg { width: 48px; height: 11px; }

/* Banner without slider controls: move text down a little */
.shiku-banner[data-count="1"] .hero__text { bottom: 80px; }

/* ── Collection ── */
.shiku-collection + .shiku-collection { padding-top: 0; }
.shiku-banner + .shiku-collection { padding-top: 64px; }
.shiku-collection + .shiku-banner { margin-top: 64px; }

.sale-section__header { gap: 16px; }
.shiku-collection__title {
  flex: 1;
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 1px;
  text-transform: lowercase;
}

.shiku-collection__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 40px 20px;
}

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

@media (max-width: 768px) {
  .hero--medium { height: 480px; }
  .shiku-banner[data-count="1"] .hero__text { bottom: 48px; }
  .shiku-collection__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 15px; }
  .shiku-banner + .shiku-collection { padding-top: 16px; }
  .shiku-collection + .shiku-banner { margin-top: 32px; }
}

/* Visually hidden page heading (parent theme styles are dequeued) */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Sale prices in section cards: ~~IDR 399.000~~ IDR 279.000 ── */
.product-card__price-row del,
.product-card__price-row del .amount { color: var(--color-muted); text-decoration: line-through; }
.product-card__price-row ins { text-decoration: none; }

/* ── Collection tabs (Sale page) ── */
.shiku-tabs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 32px;
}
.shiku-tab {
  padding: 10px 24px;
  border: 0;
  border-radius: 999px;
  background: #f4ede1;
  color: var(--color-dark);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  opacity: .7;
  transition: opacity .2s, background-color .2s;
}
.shiku-tab:hover { opacity: 1; }
.shiku-tab.is-active { background: #f0dcdc; opacity: 1; }
.shiku-tab:focus-visible { outline: 1px solid var(--color-dark); outline-offset: 2px; }

.shiku-tabs__empty {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 14px;
  color: var(--color-dark);
  padding: 48px 0;
}

.sale-page .shiku-banner + .shiku-sale-tabs { padding-top: 48px; }

@media (max-width: 768px) {
  .shiku-tabs__list { gap: 8px; margin-bottom: 24px; }
  .shiku-tab { padding: 8px 16px; font-size: 10px; }
}