/* SPORT SHOP BIH V1.1 — čitljivost, prodajni detalji i završni polish */

body {
  text-rendering: optimizeLegibility;
}

.button {
  font-size: .82rem;
  letter-spacing: .005em;
}

.text-link,
.primary-nav a,
.cart-trigger {
  font-size: .86rem;
}

.product-meta {
  font-size: .63rem;
}

.product-card-footer > span,
.breadcrumb,
.detail-brand,
.option-label {
  font-size: .7rem;
}

.product-actions .button {
  font-size: .7rem;
}

.benefit p,
.catalog-intro-note p,
.detail-description,
.footer-intro > p {
  font-size: .82rem;
}

.field label,
.choice-card span strong,
.faq-list summary {
  font-size: .76rem;
}

.field-error,
.form-hint,
.summary-demo-note,
.cart-footer > p {
  font-size: .68rem;
}

.product-card-media:focus-visible,
.gallery-thumb:focus-visible,
.color-choice:focus-visible {
  outline: 3px solid #62a2ff;
  outline-offset: -3px;
}

.gallery-thumb:hover,
.color-choice:hover {
  border-color: #8ca4ba;
}

.gallery-main > img {
  cursor: zoom-in;
  transition: opacity 150ms var(--ease), transform 320ms var(--ease);
}

.gallery-main:hover > img {
  transform: scale(1.025);
}

.gallery-main > img.is-changing {
  opacity: .2;
}

.gallery-zoom-trigger {
  position: absolute;
  right: 20px;
  bottom: 18px;
  z-index: 8;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 13px;
  color: #fff;
  background: rgba(8, 10, 13, .9);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: var(--radius-xs);
  box-shadow: 0 12px 28px rgba(8, 14, 22, .2);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background-color 180ms var(--ease), border-color 180ms var(--ease), transform 180ms var(--ease);
}

.gallery-zoom-trigger:hover {
  background: var(--blue);
  border-color: var(--blue);
  transform: translateY(-2px);
}

.gallery-zoom-trigger svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.detail-commerce-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.detail-availability {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  color: #08764f;
  font-size: .7rem;
  font-weight: 900;
}

.detail-availability > span {
  width: 8px;
  height: 8px;
  background: #12a26e;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(18, 162, 110, .13);
}

.detail-sku {
  margin: 9px 0 0;
  color: #7a8590;
  font-size: .64rem;
  font-weight: 750;
  letter-spacing: .04em;
}

.detail-delivery strong {
  font-size: .76rem;
}

.detail-delivery small {
  font-size: .68rem;
  line-height: 1.45;
}

.spec-card small {
  font-size: .62rem;
}

.spec-card strong {
  font-size: .86rem;
}

@media (max-width: 640px) {
  .button {
    font-size: .78rem;
  }

  .product-actions .button-primary {
    font-size: 0;
  }

  .product-meta {
    font-size: .56rem;
  }

  .gallery-zoom-trigger {
    right: 10px;
    bottom: 10px;
    width: 44px;
    min-height: 44px;
    justify-content: center;
    padding: 0;
  }

  .gallery-zoom-trigger span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .detail-commerce-row {
    align-items: end;
  }

  .detail-availability {
    padding-bottom: 4px;
  }

  .detail-description,
  .benefit p {
    font-size: .875rem;
  }

  .field label,
  .faq-list summary {
    font-size: .8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-main > img,
  .gallery-zoom-trigger {
    transition: none;
  }

  .gallery-main:hover > img,
  .gallery-zoom-trigger:hover {
    transform: none;
  }
}