/* ==========================================================================
   WooPlainly – WooCommerce – Product
   ========================================================================= */

.wooplainly-product-page,
.wooplainly-product-lightbox__content {
  --container-max: 1250px !important;
  --gap-xl: 2.5rem !important; /* 40px */
  --gap-lg: 1.5rem !important; /* 24px */
  --gap-md: 1rem !important; /* 16px */
  --gap-sm: 0.625rem !important; /* 10px */

  --bg: var(--wooplainly-color-surface) !important;
  --surface: var(--wooplainly-color-surface-alt) !important;
  --surface-2: color-mix(
    in srgb,
    var(--wooplainly-color-surface) 75%,
    var(--wooplainly-color-surface-contrast) 25%
  ) !important;
  --stroke: var(--wooplainly-color-surface-contrast) !important;
  --text: var(--wooplainly-color-text) !important;
  --muted: var(--wooplainly-color-text-muted) !important;
  --muted-2: var(--wooplainly-color-text-muted-strong) !important;

  --primary: var(--wooplainly-color-primary) !important;
  --primary-600: var(--wooplainly-color-primary-alt) !important;
  --primary-700: var(--wooplainly-color-primary-strong) !important;

  --success: var(--wooplainly-color-success) !important;
  --warning: var(--wooplainly-color-warning) !important;

  --radius-lg: var(--wooplainly-radius-lg) !important;
  --radius-md: var(--wooplainly-radius-md) !important;
  --radius-sm: var(--wooplainly-radius-sm) !important;

  --shadow: var(--wooplainly-shadow-lg) !important;

  color: var(--text) !important;
}

.wooplainly-product-page__inner {
  max-width: var(--container-max) !important;
  margin: 0 auto !important;
  padding: 1.5rem 1.25rem 3.5rem !important; /* 24px 20px 56px */
}

/* ============= LAYOUT ============= */
.wooplainly-product-page__layout {
  display: grid !important;
  grid-template-columns: 1.1fr 1fr !important;
  gap: var(--gap-xl) !important;
  align-items: start !important;
}

@media (max-width: 61.25rem) and (min-width: 40rem) {
  /* 980px  -  640px */
  .wooplainly-product-page__layout {
    grid-template-columns: 1fr !important;
  }
  .wooplainly-product-page__layout .wooplainly-product-gallery {
    display: flex !important;
    flex-direction: row-reverse;
  }
  .wooplainly-product-page__layout .wooplainly-product-gallery__thumbs {
    flex-direction: column;
    overflow-x: visible !important;
  }
  .wooplainly-variant-badge {
    display: none !important;
  }
  .wooplainly-product-gallery__thumb.is-active {
    transform: translateX(0.1rem) !important;
  }
}

@media (max-width: 40rem) {
  /* 640px */
  .wooplainly-product-page__layout {
    grid-template-columns: 1fr !important;
  }
  .wooplainly-product-gallery__stage {
    aspect-ratio: 1 !important;
    min-height: 20rem !important; /* 320px */
  }

  .wooplainly-product-gallery__thumbs {
    justify-content: flex-start !important;
    gap: clamp(0.5rem, 4vw, 0.75rem) !important;
    padding-block: 0.35rem !important;
    padding-inline: 0.25rem !important;
    scroll-snap-type: x mandatory !important;
    height: 8.5em;
  }
  .wooplainly-product-gallery__thumbs .wooplainly-product-gallery__thumb {
    inline-size: clamp(4.25rem, 22vw, 5.25rem) !important;
    flex: 0 0 clamp(4.25rem, 22vw, 5.25rem) !important;
  }

  .wooplainly-product-gallery__nav {
    inline-size: 2.25rem !important;
    block-size: 2.25rem !important;
  }

  .wooplainly-product-gallery__nav span {
    font-size: 1.25rem !important;
  }

  .wooplainly-variant-badge {
    display: none !important;
  }
}
/* ============= GALERIA ============= */
.wooplainly-product-gallery {
  display: grid !important;
  gap: var(--gap-md) !important;
}

.wooplainly-product-gallery__stage {
  position: relative !important;
  border-radius: var(--radius-lg) !important;
  padding: clamp(0.75rem, 1vw + 0.25rem, 1rem) !important;
  display: block !important;
  aspect-ratio: 4 / 5 !important;
  min-height: clamp(
    20rem,
    48vw,
    35rem
  ) !important; /* 320px → 20rem, 560px → 35rem */
  overflow: hidden !important;
  touch-action: pan-y !important;
}

.wooplainly-product-gallery__stage-track {
  display: flex !important;
  gap: 0 !important;
  inline-size: 100% !important;
  block-size: 100% !important;
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
  will-change: transform !important;
}

.wooplainly-product-gallery__stage-track.is-reduced-motion {
  transition-duration: 0ms !important;
}

.wooplainly-product-gallery__stage-item {
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: calc(
    var(--radius-lg) - clamp(0.5rem, 1vw, 0.75rem)
  ) !important;
  position: relative !important;
  inline-size: 100% !important;
  block-size: 100% !important;
  flex: 0 0 100% !important;
  display: grid !important;
  place-items: center !important;
  transition:
    opacity 0.56s cubic-bezier(0.19, 1, 0.22, 1),
    transform 0.6s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.6s ease,
    box-shadow 0.4s ease !important;
  opacity: 0 !important;
  transform: scale(0.96) !important;
  filter: blur(1rem) saturate(0.85) !important; /* 16px → 1rem */
  pointer-events: none !important;
  will-change: opacity, transform, filter !important;
}

.wooplainly-product-gallery__stage-item.is-active {
  opacity: 1 !important;
  transform: scale(1) !important;
  pointer-events: auto !important;
  z-index: 2 !important;
  filter: none !important;
}

.wooplainly-product-gallery__stage-item.is-entering {
  z-index: 3 !important;
  animation: wooplainly-gallery-glow 0.75s ease-out !important;
}

.wooplainly-product-gallery__stage-item.is-leaving {
  z-index: 1 !important;
  opacity: 0 !important;
  transform: scale(0.96) !important;
  filter: blur(0.75rem) saturate(0.85) !important; /* 12px → 0.75rem */
}

@keyframes wooplainly-gallery-glow {
  0% {
    box-shadow: inset 0 0 0 1px
      color-mix(in srgb, var(--primary) 45%, transparent) !important;
    filter: blur(1.125rem) saturate(0.8) !important; /* 18px → 1.125rem */
    opacity: 0.25 !important;
  }
  35% {
    box-shadow:
      inset 0 0 0 1px color-mix(in srgb, var(--primary) 25%, transparent),
      0 1.5rem 3.75rem color-mix(in srgb, var(--primary) 12%, transparent) !important;
  }
  100% {
    box-shadow: inset 0 0 0 1px
      color-mix(in srgb, var(--stroke) 22%, transparent) !important;
    filter: none !important;
    opacity: 1 !important;
  }
}

.wooplainly-product-gallery__image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transition:
    transform 0.6s ease,
    filter 0.4s ease !important;
  transform-origin: var(--wooplainly-gallery-zoom-x, 50%)
    var(--wooplainly-gallery-zoom-y, 50%) !important;
}

.wooplainly-product-gallery__stage-item.is-zooming
  .wooplainly-product-gallery__image {
  transform: scale(1.35) !important;
}

.wooplainly-product-gallery__nav {
  position: absolute !important;
  top: 50% !important;
  inline-size: clamp(2.5rem, 3vw, 3rem) !important;
  block-size: clamp(2.5rem, 3vw, 3rem) !important;
  padding: 0 !important;
  border: 1px solid color-mix(in srgb, var(--stroke) 60%, transparent) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--surface) 80%, transparent) !important;
  color: var(--text) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translateY(-50%) !important;
  cursor: pointer !important;
  box-shadow: 0 0.75rem 1.5rem color-mix(in srgb, var(--stroke) 12%, transparent) !important;
  transition:
    background 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease,
    opacity 0.25s ease !important;
  z-index: 10 !important;
}

.wooplainly-product-gallery__nav span {
  font-size: 1.5rem !important;
  line-height: 1 !important;
}

.wooplainly-product-gallery__nav--prev {
  left: clamp(0.5rem, 1vw + 0.25rem, 1.25rem) !important;
}

.wooplainly-product-gallery__nav--next {
  right: clamp(0.5rem, 1vw + 0.25rem, 1.25rem) !important;
}

.wooplainly-product-gallery__nav:is(:hover, :focus-visible) {
  background: color-mix(in srgb, var(--primary) 25%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, transparent) !important;
  outline: none !important;
}

.wooplainly-product-gallery__nav.is-disabled {
  opacity: 0.4 !important;
  pointer-events: none !important;
}

@media (hover: hover) {
  .wooplainly-product-gallery__nav {
    opacity: 0 !important;
  }

  .wooplainly-product-gallery__stage:hover .wooplainly-product-gallery__nav,
  .wooplainly-product-gallery__stage:focus-within .wooplainly-product-gallery__nav {
    opacity: 1 !important;
  }
}

/* ============= MINIATURY (THUMBNAILS) ============= */
.wooplainly-product-gallery__thumbs {
  display: flex !important;
  gap: clamp(0.5rem, 1vw, 0.85rem) !important;
  padding: 0.25rem !important;
  background: var(--surface) !important;
  border-radius: calc(
    var(--radius-lg) - 0.375rem
  ) !important; /* -6px = -0.375rem */
  box-shadow: var(--shadow) !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: thin !important;
  scrollbar-color: color-mix(in srgb, var(--stroke) 60%, transparent)
    transparent !important;
}

.wooplainly-product-gallery__thumbs::-webkit-scrollbar {
  height: 0.375rem !important; /* 6px */
}

.wooplainly-product-gallery__thumbs::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--stroke) 60%, transparent) !important;
  border-radius: 999px !important;
}

.wooplainly-product-gallery__thumb {
  position: relative !important;
  overflow: visible !important;
  inline-size: clamp(4.75rem, 9vw, 6.25rem) !important;
  aspect-ratio: 1 !important;
  border: 1px solid color-mix(in srgb, var(--stroke) 65%, transparent) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--surface-2) !important;
  padding: 0.25rem !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease !important;
  scroll-snap-align: center !important;
}

.wooplainly-product-gallery__thumb img {
  display: block !important;
  inline-size: 100% !important;
  block-size: 100% !important;
  object-fit: cover !important;
  border-radius: calc(var(--radius-sm) - 0.25rem) !important; /* -4px */
}

.wooplainly-product-gallery__thumb.is-active {
  border-color: color-mix(in srgb, var(--primary) 70%, transparent) !important;
  transform: translateY(-0.25rem) !important; /* -4px */
}

.wooplainly-product-gallery__thumb:focus-visible {
  box-shadow: none !important;
}

.wooplainly-product-gallery__thumb:not(.is-active):is(
    :hover,
    :focus-visible,
    :active
  ) {
  transform: translateY(-0.125rem) !important; /* 2px */
  border-color: color-mix(
    in srgb,
    var(--primary) 50%,
    var(--stroke) 50%
  ) !important;
}

/* Variant labels on thumbnails */
.wooplainly-variant-badge {
  position: absolute !important;
  top: 0.1875rem !important; /* 3px */
  font-size: 0.5rem !important; /* 8px */
  width: 100% !important;
  text-align: center !important;
  padding: 0.125rem 0.375rem !important; /* 2px 6px */
  color: var(--text) !important;
  font-weight: 600 !important;
  pointer-events: none !important;
  z-index: 5 !important;
  user-select: none !important;
  line-height: 1.2 !important;
}
/* ============= LIGHTBOX ============= */
.wooplainly-product-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(1rem, 4vw, 4rem) !important;
  background: color-mix(
    in srgb,
    rgba(7, 13, 24, 0.86) 85%,
    transparent
  ) !important;
  backdrop-filter: blur(0.75rem) saturate(1.4) !important; /* 12px → 0.75rem */
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.35s ease !important;
}

.wooplainly-product-lightbox.is-active {
  opacity: 1 !important;
  pointer-events: auto !important;
}

.wooplainly-product-lightbox__backdrop {
  position: absolute !important;
  inset: 0 !important;
}

.wooplainly-product-lightbox__content {
  position: relative !important;
  max-inline-size: min(100%, 60rem) !important; /* 960px → 60rem */
  inline-size: min(92vw, 60rem) !important;
  display: grid !important;
  gap: clamp(0.5rem, 1.5vw, 1rem) !important;
  border-radius: clamp(0.75rem, 2vw, 1.5rem) !important;
  background: color-mix(
    in srgb,
    var(--surface) 12%,
    rgba(12, 18, 26, 0.12) 88%
  ) !important;
  padding: clamp(1.25rem, 3vw, 2rem) !important;
  box-shadow: 0 2rem 5.625rem rgba(8, 12, 20, 0.45) !important; /* 32px 90px */
  overflow: hidden !important;
}

.wooplainly-product-lightbox__stage {
  position: relative !important;
  inline-size: 100% !important;
  aspect-ratio: 4 / 5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: clamp(0.5rem, 1.25vw, 1rem) !important;
  overflow: hidden !important;
}

.wooplainly-product-lightbox__image {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: inherit !important;
}

.wooplainly-product-lightbox__caption {
  font-size: clamp(0.85rem, 1.4vw, 1rem) !important;
  color: color-mix(in srgb, var(--muted-2) 90%, transparent) !important;
  min-height: 1.25em !important;
  opacity: 0 !important;
  transition: opacity 0.25s ease !important;
}

.wooplainly-product-lightbox__caption.is-visible {
  opacity: 1 !important;
}
/* === Lightbox - Close button === */

.wooplainly-product-lightbox__close {
  width: 2.375rem !important; /* 38px */
  height: 2.375rem !important; /* 38px */
  padding: 0 !important;
  border-radius: var(--radius-sm) !important;
  background: color-mix(
    in srgb,
    var(--surface) 12%,
    rgba(12, 18, 26, 0.12) 88%
  ) !important;
  border: 1.5px solid var(--stroke) !important; /* zachowujemy px */
  color: var(--surface) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: 0.25s ease !important;
  margin-left: auto;
}

.wooplainly-product-lightbox__close:is(:hover, :focus-visible, :active) {
  color: var(--primary-700) !important;
  background: color-mix(
    in srgb,
    var(--primary) 40%,
    var(--surface) 60%
  ) !important;
  outline: none !important;
}
/*
.wooplainly-product-lightbox__close {
  position: absolute !important;
  top: clamp(0.75rem, 2vw, 1.5rem) !important;
  right: clamp(0.75rem, 2vw, 1.5rem) !important;
  inline-size: 2.5rem !important;
  block-size: 2.5rem !important;
  border-radius: 50% !important;
  background: color-mix(in srgb, var(--surface) 90%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--stroke) 45%, transparent) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 1.5rem !important;
  cursor: pointer !important;
  transition: transform .25s ease, background .25s ease, border-color .25s ease !important;
}

.wooplainly-product-lightbox__close:is(:hover, :focus-visible, :active) {
  transform: scale(1.05) !important;
  background: color-mix(in srgb, var(--primary) 30%, var(--surface) 70%) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, transparent) !important;
}

.wooplainly-product-lightbox__close span {
  line-height: 1 !important;
  font-weight: 300 !important;
}*/

[data-theme="dark"] .wooplainly-product-lightbox__close {
  color: color-mix(in srgb, var(--text) 90%, transparent) !important;
}

[data-theme="dark"] .wooplainly-product-lightbox__nav {
  color: color-mix(in srgb, var(--text) 90%, transparent) !important;
}

/* === Lightbox - Navigation arrows === */
.wooplainly-product-lightbox__nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  inline-size: 3rem !important;
  block-size: 3rem !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--stroke) !important; /* zachowujemy px */
  background: color-mix(
    in srgb,
    var(--surface) 12%,
    rgba(12, 18, 26, 0.12) 88%
  ) !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  font-size: 1.75rem !important;
  cursor: pointer !important;
  transition:
    transform 0.25s ease,
    background 0.25s ease,
    border-color 0.25s ease,
    opacity 0.25s ease !important;
}

[data-theme="dark"] .wooplainly-product-lightbox__nav {
  color: color-mix(in srgb, var(--text) 90%, transparent) !important;
}

.wooplainly-product-lightbox__nav:is(:hover, :focus-visible, :active) {
  transform: translateY(-50%) scale(1.08) !important;
  background: color-mix(
    in srgb,
    var(--primary) 35%,
    rgba(15, 21, 31, 0.95) 65%
  ) !important;
  border-color: color-mix(in srgb, var(--primary) 55%, transparent) !important;
}

.wooplainly-product-lightbox__nav:disabled,
.wooplainly-product-lightbox__nav.is-hidden {
  opacity: 0 !important;
  pointer-events: none !important;
}

.wooplainly-product-lightbox__nav--prev {
  left: clamp(0.75rem, 3vw, 1.5rem) !important;
}

.wooplainly-product-lightbox__nav--next {
  right: clamp(0.75rem, 3vw, 1.5rem) !important;
}

.wooplainly-product-lightbox__nav span {
  line-height: 1 !important;
  font-weight: 200 !important;
}

/* === Scroll Lock === */
body.wooplainly-lightbox-open {
  overflow: hidden !important;
}

/* === Responsive === */
@media (max-width: 42.5rem) {
  /* 680px */
  .wooplainly-product-lightbox__content {
    inline-size: 100% !important;
    padding: clamp(1rem, 4vw, 1.5rem) !important;
    border-radius: clamp(0.5rem, 4vw, 0.75rem) !important;
  }
  .wooplainly-product-lightbox__stage {
    aspect-ratio: 1 !important;
  }
  .wooplainly-product-lightbox__nav {
    inline-size: 2.5rem !important;
    block-size: 2.5rem !important;
    font-size: 1.5rem !important;
  }
}

/* === Reduced motion === */
@media (prefers-reduced-motion: reduce) {
  .wooplainly-product-lightbox,
  .wooplainly-product-lightbox__nav,
  .wooplainly-product-lightbox__close {
    transition: none !important;
  }
}
/* ============= PODSUMOWANIE ============= */
.wooplainly-product-summary__header {
  margin-bottom: 0.625rem !important; /* 10px */
}

.wooplainly-product-summary__title {
  font-size: 2rem !important; /* 32px */
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
  font-weight: 700 !important;
  margin: 0 0 0.5rem !important; /* 8px */
}

.wooplainly-product-summary__rating {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important; /* 12px */
  margin: 0 0 0.875rem !important; /* 14px */
}

.wooplainly-product-summary__rating .wooplainly-product-rating {
  --wooplainly-rating-size: 1.125rem !important; /* 18px */
}

.wooplainly-product-summary__rating-button {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 0.375rem !important; /* 6px */
  padding: 0.5rem 0.75rem !important; /* 8px 12px */
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  background: transparent !important;
  color: var(--text) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important; /* 14px */
  cursor: pointer !important;
  transition:
    color 0.2s ease,
    background 0.2s ease,
    transform 0.2s ease !important;
}

.wooplainly-product-summary__rating-button:is(:hover, :focus-visible, :active) {
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 8%, transparent) !important;
  transform: translateY(-0.0625rem) !important; /* -1px */
}

.wooplainly-product-summary__rating-value {
  font-weight: 700 !important;
  font-size: 0.9375rem !important; /* 15px */
}

.wooplainly-product-summary__rating-count {
  color: var(--muted) !important;
  font-weight: 500 !important;
  font-size: 0.8125rem !important; /* 13px */
}

.wooplainly-product-summary__price {
  display: flex !important;
  align-items: baseline !important;
  gap: 0.75rem !important; /* 12px */
  margin: 0.5rem 0 1.125rem !important; /* 8px 0 18px */
}

.wooplainly-product-rating {
  position: relative !important;
  display: inline-block !important;
  width: calc(var(--wooplainly-rating-size, 18px) * 5) !important;
  height: var(--wooplainly-rating-size, 18px) !important;
  pointer-events: none !important;
}

.wooplainly-product-rating__stars,
.wooplainly-product-rating__fill {
  position: absolute !important;
  inset: 0 !important;
  background-repeat: repeat-x !important;
  background-size: var(--wooplainly-rating-size, 18px)
    var(--wooplainly-rating-size, 18px) !important;
  transition: width 0.2s ease !important;
}

.wooplainly-product-rating__stars {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjZDRkNmRjJyBzdHJva2Utd2lkdGg9JzEuNicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cG9seWdvbiBwb2ludHM9JzEyIDIgMTUuMDkgOC4yNiAyMiA5LjI3IDE3IDE0LjE0IDE4LjE4IDIxLjAyIDEyIDE3Ljc3IDUuODIgMjEuMDIgNyAxNC4xNCAyIDkuMjcgOC45MSA4LjI2IDEyIDInLz48L3N2Zz4=") !important;
}

.wooplainly-product-rating__fill {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nI2Y0YjYzZicgc3Ryb2tlPScjZjRiNjNmJyBzdHJva2Utd2lkdGg9JzEnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCc+PHBvbHlnb24gcG9pbnRzPScxMiAyIDE1LjA5IDguMjYgMjIgOS4yNyAxNyAxNC4xNCAxOC4xOCAyMS4wMiAxMiAxNy43NyA1LjgyIDIxLjAyIDcgMTQuMTQgMiA5LjI3IDguOTEgOC4yNiAxMiAyJy8+PC9zdmc+") !important;
  overflow: hidden !important;
}

.wooplainly-product-price {
  font-size: 2rem !important;
  font-weight: 800 !important;
}

.wooplainly-product-price del,
.wooplainly-product-price .was {
  color: var(--muted) !important;
  font-weight: 700 !important;
  text-decoration: line-through !important;
  margin-left: 0.375rem !important; /* 6px */
}

/* ============= STOCK ============= */
.wooplainly-product-summary__stock {
  font-size: 0.875rem !important; /* 14px */
  color: var(--success) !important;
  font-weight: 700 !important;
  margin: 0.25rem 0 0.5rem !important; /* 4px 0 8px */
}
/* ============= ATRUBUTY (kolor, rozmiar) ============= */

.wooplainly-product-summary__attributes {
  display: grid !important;
  gap: 1.125rem !important; /* 18px */
  margin-bottom: 1.125rem !important; /* 18px */
}

.wooplainly-product-attribute__label {
  font-size: 0.75rem !important; /* 12px */
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--muted) !important;
  margin-bottom: 0.625rem !important; /* 10px */
  font-weight: 700 !important;
}

.wooplainly-product-attribute__options {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.625rem !important; /* 10px */
}

/* wspólna baza "pigułek" */
.wooplainly-product-option {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important; /* 8px */
  height: 2.375rem !important; /* 38px */
  padding: 0 0.875rem !important; /* 14px */
  border: 0.09375rem solid var(--stroke) !important; /* 1.5px */
  background: var(--bg) !important;
  color: var(--text) !important;
  font-weight: 400 !important;
  font-size: 0.875rem !important; /* 14px */
  line-height: 1 !important;
  cursor: pointer !important;
  transition: 0.2s ease !important;
}

/* Kolor hover/active */
.wooplainly-product-attribute[data-attribute-key="attribute_pa_rozmiar"]
  .wooplainly-product-option:is(:hover, :focus-visible, :active) {
  border-color: var(--stroke) !important;
  background: var(--surface-2) !important;
}

.wooplainly-product-attribute[data-attribute-key="attribute_pa_rozmiar"]
  .wooplainly-product-option.is-active {
  border-color: var(--primary) !important;
  color: var(--wooplainly-color-on-primary) !important;
  background-color: var(--primary) !important;
}

.wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
  .wooplainly-product-option.is-active,
[data-theme="dark"]
  .wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
  .wooplainly-product-option.is-active {
  border: 0.11875rem solid var(--primary) !important; /* 1.9px */
  transform: scale(1.1) !important;
}

/* === KÓŁKA KOLORÓW === */
.wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
  .wooplainly-product-option {
  border: 0.11875rem solid var(--stroke) !important; /* 1.9px */
  width: 2.125rem !important; /* 34px */
  height: 2.125rem !important; /* 34px */
  padding: 0 !important;
  border-radius: 50% !important;
}

.wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
  .wooplainly-product-option__label {
  position: absolute !important;
  width: 0.0625rem !important; /* 1px */
  height: 0.0625rem !important;
  overflow: hidden !important;
  clip: rect(0.0625rem, 0.0625rem, 0.0625rem, 0.0625rem) !important;
}

/* mapowanie kolorów */
.wooplainly-product-option[data-option-value="bialy"] {
  background: #ffffff !important;
}
.wooplainly-product-option[data-option-value="bezowy"] {
  background: #c2b280 !important;
}
.wooplainly-product-option[data-option-value="bordowy"] {
  background: #800000 !important;
}
.wooplainly-product-option[data-option-value="granatowy"] {
  background: #0000cc !important;
}
.wooplainly-product-option[data-option-value="niebieski"] {
  background: #00CCFF !important;
}
.wooplainly-product-option[data-option-value="rozowy"] {
  background: #a91b60 !important;
}
.wooplainly-product-option[data-option-value="czarny"] {
  background: #111111 !important;
}
.wooplainly-product-option[data-option-value="szary"] {
  background: #acb2b4 !important;
}
.wooplainly-product-option[data-option-value="sage-green"] {
  background: #B2AC88 !important;
}
.wooplainly-product-option[data-option-value="olive-green"] {
  background: #bab86c !important;
}
.wooplainly-product-option[data-option-value="przezroczysty"] {
  background: #ffffff !important;
}

/* === Rozmiar — pigułki === */
.wooplainly-product-attribute[data-attribute-key="attribute_pa_rozmiar"]
  .wooplainly-product-option {
  min-width: 3rem !important; /* 48px */
  justify-content: center !important;
}

/* obramowanie dla jasnych kolorów */
.wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
  .wooplainly-product-option {
  border-color: color-mix(in srgb, var(--text) 25%, transparent);
}
/* ============= AKCJE: ilość + przycisk + wishlist ============= */

/* Cała sekcja akcji */
.wooplainly-product-summary__actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.875rem !important; /* 14px */
  align-items: flex-start !important;
  width: 100% !important;
}

/* Ilość (– 1 +) */
.wooplainly-product-quantity {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.25rem !important; /* 4px */
  border: none !important;
  padding: 0 !important;
  background: transparent !important;
}

.wooplainly-product-quantity input::-webkit-outer-spin-button,
.wooplainly-product-quantity input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.wooplainly-product-quantity input[type="number"] {
  -moz-appearance: textfield;
}

/* Przyciski +/- */
.wooplainly-product-quantity__control {
  border-radius: 0.5rem !important; /* 8px */
  height: 2.375rem !important; /* 38px */
  padding: 0 0.875rem !important; /* 14px */
  border: 1.5px solid var(--stroke) !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  font-size: 1.125rem !important; /* 18px */
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: 0.2s !important;
}
.wooplainly-product-quantity__control:is(:hover, :focus-visible, :active) {
  background: var(--surface-2) !important;
}

/* Pole quantity */
.wooplainly-product-quantity__input {
  text-align: center !important;
  border: none !important;
  font-size: 1rem !important; /* 16px */
  color: var(--text) !important;
  font-weight: 700 !important;
  width: 3.4rem !important;
  background: transparent !important;
}

/* Dolny rząd */
.wooplainly-product-summary__actions-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.625rem !important; /* 10px */
  width: 100% !important;
}

/* Przycisk ADD TO CART */
.wooplainly-product-add {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.625rem !important; /* 10px */
  border: none !important;
  padding: 0.94em 1.875em !important;
  border-radius: 0.5rem !important; /* 8px */
  background: var(--primary) !important;
  color: var(--wooplainly-color-on-primary) !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  font-size: 0.8rem !important;
  transition:
    background 0.2s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease !important;
}

.wooplainly-product-add__icon svg {
  width: 1.25rem !important; /* 20px */
  height: 1.25rem !important;
  stroke: currentColor !important;
}

.wooplainly-product-add:is(:hover, :focus-visible, :active) {
  background: var(--primary-600) !important;
  transform: translateY(-0.125rem) !important; /* -2px */
  box-shadow: 0 0.25rem 0.9375rem
    color-mix(in srgb, var(--primary) 18%, transparent) !important;
  outline: none !important;
}

/* Wishlist (przycisk serduszka) */
.wooplainly-product-wishlist .wooplainly-wishlist-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important; /* 8px */
  min-width: 2.75rem !important; /* 44px */
  padding: 0.94em 1.875em !important;
  border-radius: 0.5rem !important; /* 8px */
  background: var(--bg) !important;
  color: var(--text) !important;
  border: 1.5px solid var(--stroke) !important;
  cursor: pointer !important;
  font-size: 0.8rem !important;
  transition: 0.3s ease !important;
}

.wooplainly-product-wishlist .wooplainly-wishlist-button svg {
  width: 1.25rem !important; /* 20px */
  height: 1.25rem !important;
}

.wooplainly-product-wishlist
  .wooplainly-wishlist-button:is(:hover, :focus-visible, :active) {
  border-color: var(--stroke) !important;
  background: var(--primary) !important;
  color: var(--bg) !important;
  transform: translateY(-0.125rem) !important;
  box-shadow: 0 0.25rem 0.9375rem
    color-mix(in srgb, var(--primary) 18%, transparent) !important;
  outline: none !important;
}

[data-theme="dark"]
  .wooplainly-product-wishlist
  .wooplainly-wishlist-button:is(:hover, :focus-visible, :active) {
  color: var(--text) !important;
}

/* Mobile responsywność */
@media (max-width: 37.5rem) {
  /* 600px */
  .wooplainly-product-summary__actions-row {
    flex-direction: column !important;
  }
  .wooplainly-product-wishlist .wooplainly-wishlist-button {
    width: 100% !important;
  }
}

/* ============= USP (3 kafelki) ============= */
.wooplainly-product-usp {
  margin-top: 3rem !important;
}
.wooplainly-product-usp__grid {
  display: grid !important;
  gap: 1rem !important;
  grid-template-columns: repeat(3, 1fr) !important;
}
@media (max-width: 900px) {
  .wooplainly-product-usp__grid {
    grid-template-columns: 1fr !important;
  }
}

.wooplainly-product-usp__item {
  background: var(--surface) !important;
  border-radius: var(--radius-md) !important;
  padding: 1rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-direction: column;
  text-align: center;
}

.wooplainly-product-usp__icon {
  display: block;
  margin: 0 auto;
}

.wooplainly-product-usp__icon svg {
  width: 1.375rem !important;
  height: 1.375rem !important;
  display: inline-block;
}

.wooplainly-product-usp__title {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--muted) !important;
}

.wooplainly-product-usp__title {
  margin: 0 0 2px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}
.wooplainly-product-usp__text {
  margin: 0 !important;
  font-size: 13px !important;
  color: var(--muted) !important;
}

/* ============= ZAKŁADKI ============= */
.wooplainly-product-tabs {
  margin-top: 2.25rem !important; /* 36px */
}
.wooplainly-product-tabs__nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.375rem !important; /* 6px */
  background: var(--surface) !important;
  padding: 0.375rem !important; /* 6px */
  border-radius: var(--radius-lg) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--stroke) 65%, transparent) !important; /* 1px border -> px zostaje */
  justify-content: space-around;
}
.wooplainly-product-tab {
  position: relative !important;
  padding: 0.75rem 1.25rem !important; /* 12px 20px */
  border-radius: calc(
    var(--radius-md) - 2px
  ) !important; /* różnica px zostaje */
  background: transparent !important;
  border: 0 !important;
  color: var(--muted) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important; /* 14px */
  cursor: pointer !important;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease !important;
  flex: 1;
}
.wooplainly-product-tab:is(:hover, :focus-visible, :active) {
  color: var(--text) !important;
}
.wooplainly-product-tab.is-active {
  color: var(--text) !important;
  background: var(--bg) !important;
}

.wooplainly-product-tabs__panels {
  margin-top: 1.25rem !important; /* 20px */
}
.wooplainly-product-tabpanel {
  display: none !important;
  background: var(--bg) !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid color-mix(in srgb, var(--stroke) 90%, transparent) !important; /* 1px */
  padding: 1.75rem 2rem !important; /* 28px 32px */
}
.wooplainly-product-tabpanel.is-active {
  display: block !important;
}

@media (max-width: 768px) {
  .wooplainly-product-tabs__nav {
    justify-content: center !important;
  }
  .wooplainly-product-tab {
    flex: 1 1 calc(50% - 0.375rem) !important;
    text-align: center !important;
  } /* 6px */
}

@media (max-width: 520px) {
  .wooplainly-product-tab {
    flex: 1 1 100% !important;
  }
  .wooplainly-product-tabpanel {
    padding: 1.375rem 1.25rem !important;
  } /* 22px 20px */
}

/* ============= TEKST OPISU ============= */
.wooplainly-product-tabpanel p {
  color: var(--text) !important;
  font-size: 0.9375rem !important; /* 15px */
  line-height: 1.7 !important;
  margin: 0 0 1.125rem !important; /* 18px */
}

.wooplainly-product-tabpanel ul {
  margin: 0 0 1.125rem 1.25rem !important; /* 18px 20px */
  padding: 0 !important;
  display: grid !important;
  gap: 0.5rem !important; /* 8px */
}

.wooplainly-product-tabpanel li {
  font-size: 0.9375rem !important; /* 15px */
  color: var(--text) !important;
  line-height: 1.6 !important;
}

.wooplainly-product-tabpanel table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 0.25rem 0 1.25rem !important; /* 4px 0 20px */
  background: var(--bg) !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--stroke) 80%, transparent) !important; /* 1px */
}

.wooplainly-product-tabpanel table th,
.wooplainly-product-tabpanel table td {
  padding: 0.75rem 1rem !important; /* 12px 16px */
  border-bottom: 1px solid color-mix(in srgb, var(--stroke) 90%, transparent) !important; /* 1px */
  text-align: left !important;
  font-size: 0.875rem !important; /* 14px */
  color: var(--text) !important;
}

.wooplainly-product-tabpanel table thead th {
  font-weight: 700 !important;
  background: var(--surface) !important;
}

.wooplainly-product-tabpanel table tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--surface) 60%, transparent) !important;
}

.wooplainly-product-tabpanel table tr:last-child td {
  border-bottom: 0 !important;
}

/* ============= OPINIE PRODUKTU ============= */
.wooplainly-product-reviews {
  display: grid !important;
  gap: 1.75rem !important; /* 28px */
}

.wooplainly-product-reviews__summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1.5rem !important; /* 24px */
  padding: 1.625rem 1.875rem !important; /* 26px 30px */
}

.wooplainly-product-reviews__summary-score {
  display: flex !important;
  align-items: center !important;
  gap: 1.125rem !important; /* 18px */
}

.wooplainly-product-reviews__summary-score .wooplainly-product-rating {
  --wooplainly-rating-size: 1.25rem !important; /* 20px */
}

.wooplainly-product-reviews__summary-meta {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25rem !important; /* 4px */
}

.wooplainly-product-reviews__summary-value {
  font-size: 2rem !important; /* 32px */
  line-height: 1 !important;
  font-weight: 700 !important;
}

.wooplainly-product-reviews__summary-count {
  font-size: 0.875rem !important; /* 14px */
  color: var(--muted) !important;
  font-weight: 500 !important;
}

.wooplainly-product-reviews__list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 1.125rem !important; /* 18px */
}

.wooplainly-product-reviews__item {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 1.125rem !important; /* 18px */
  background: var(--bg) !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid color-mix(in srgb, var(--stroke) 90%, transparent) !important; /* 1px */
  padding: 1.375rem 1.625rem !important; /* 22px 26px */
  box-shadow: 0 1rem 2.25rem color-mix(in srgb, var(--text) 12%, transparent) !important; /* 16px 36px */
}

[data-theme="dark"] .wooplainly-product-reviews__item {
  box-shadow: 0 1rem 2.25rem color-mix(in srgb, var(--primary) 12%, transparent) !important; /* 16px 36px */
}

.wooplainly-product-reviews__avatar {
  width: 3rem !important; /* 48px */
  height: 3rem !important; /* 48px */
  border-radius: 50% !important;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--primary) 12%, transparent),
    color-mix(in srgb, var(--primary) 24%, transparent)
  ) !important;
  color: var(--primary) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 1rem !important; /* 16px */
  text-transform: uppercase !important;
}

.wooplainly-product-reviews__body {
  display: grid !important;
  gap: 0.75rem !important; /* 12px */
}

.wooplainly-product-reviews__header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 0.75rem !important; /* 12px */
}

.wooplainly-product-reviews__author-group {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important; /* 12px */
  flex-wrap: wrap !important;
}

.wooplainly-product-reviews__author {
  font-size: 0.9375rem !important; /* 15px */
  font-weight: 700 !important;
}

.wooplainly-product-reviews__date {
  font-size: 0.8125rem !important; /* 13px */
  color: var(--muted) !important;
}

.wooplainly-product-reviews__rating {
  display: flex !important;
  align-items: center !important;
  gap: 0.625rem !important; /* 10px */
  color: var(--primary) !important;
}

.wooplainly-product-reviews__rating .wooplainly-product-rating {
  --wooplainly-rating-size: 1.125rem !important; /* 18px */
}

.wooplainly-product-reviews__content {
  font-size: 0.9375rem !important; /* 15px */
  line-height: 1.6 !important;
  color: var(--text) !important;
}

.wooplainly-product-reviews__content p {
  margin: 0 0 0.75rem !important; /* 12px */
}

.wooplainly-product-reviews__content p:last-child {
  margin-bottom: 0 !important;
}

.wooplainly-product-reviews__empty {
  padding: 1.75rem !important; /* 28px */
  border-radius: var(--radius-lg) !important;
  border: 1px dashed color-mix(in srgb, var(--primary) 40%, transparent) !important; /* 1px dashed */
  background: color-mix(in srgb, var(--primary) 6%, transparent) !important;
  text-align: center !important;
  font-weight: 600 !important;
  color: var(--primary-700) !important;
}

.wooplainly-product-reviews__empty p {
  margin: 0 !important;
}

.wooplainly-product-reviews__closed {
  margin: 0 !important;
  padding: 1.5rem !important; /* 24px */
  border-radius: var(--radius-md) !important;
  background: color-mix(
    in srgb,
    var(--wooplainly-color-danger) 8%,
    transparent
  ) !important;
  color: var(--wooplainly-color-danger) !important;
  font-weight: 600 !important;
}

@media (max-width: 768px) {
  .wooplainly-product-reviews__summary {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .wooplainly-product-attribute[data-attribute-key="attribute_pa_rozmiar"]
    .wooplainly-product-option {
    height: 2.75rem !important;
    padding: 0 1.25rem !important;
  }
  .wooplainly-product-attribute[data-attribute-key="attribute_pa_kolor"]
    .wooplainly-product-option {
    width: 2.75rem !important;
    height: 2.75rem !important;
  }
  .wooplainly-product-quantity__control {
    height: 2.75rem !important;
    padding: 0 1.25rem !important;
  }
  .wooplainly-product-usp__icon svg {
    width: 1.9rem !important;
    height: 1.8rem !important;
  }
  .wooplainly-product-usp__icon {
    margin: 0 auto;
  }
  .wooplainly-product-tab {
    padding: 1.25rem 1.25rem !important;
    flex: 1 1 calc(50%) !important;
  }
  .wooplainly-product-add,
  .wooplainly-product-wishlist .wooplainly-wishlist-button,
  .wooplainly-product-reviews .wooplainly-product-review-form__submit {
    font-size: 1rem !important;
  }
  .wooplainly-product-add {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .wooplainly-product-reviews__item {
    grid-template-columns: 1fr !important;
    padding: 1.25rem !important; /* 20px */
  }

  .wooplainly-product-reviews__header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

/* ============= FORMULARZ OPINII ============= */
.wooplainly-product-review-form {
  margin: 0 !important;
  padding: 2rem !important; /* 32px */
  display: grid !important;
  gap: 1.5rem !important; /* 24px */
}

.wooplainly-product-review-form__title {
  margin: 0 !important;
  font-size: 1.25rem !important; /* 20px */
  font-weight: 700 !important;
  color: var(--text) !important;
}

.wooplainly-product-review-form__comment-group {
  display: grid !important;
  gap: 1.125rem !important; /* 18px */
}

.wooplainly-product-review-form__details {
  display: grid !important;
  gap: 1rem !important; /* 16px */
  grid-template-columns: repeat(
    auto-fit,
    minmax(13.75rem, 1fr)
  ) !important; /* 220px */
}

.wooplainly-product-review-form__field {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important; /* 8px */
}

.wooplainly-product-review-form__field label {
  font-weight: 600 !important;
  font-size: 0.875rem !important; /* 14px */
  color: var(--text) !important;
}

.wooplainly-product-review-form__field input,
.wooplainly-product-review-form__field textarea {
  width: 100% !important;
  border: 1px solid var(--stroke) !important; /* 1px */
  border-radius: var(--radius-md) !important;
  padding: 0.75rem 0.875rem !important; /* 12px 14px */
  font-size: 0.9375rem !important; /* 15px */
  color: var(--text) !important;
  background: var(--bg) !important;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease !important;
}

.wooplainly-product-review-form__field textarea {
  min-height: 9.375rem !important; /* 150px */
  resize: vertical !important;
}

.wooplainly-product-review-form__field input:focus,
.wooplainly-product-review-form__field textarea:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent) !important; /* 3px outline-shadow => px zgodnie z zasadą obrysów */
}

.wooplainly-product-review-form__rating {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.625rem !important; /* 10px */
}

.wooplainly-product-review-form__rating-legend {
  font-size: 0.875rem !important; /* 14px */
  font-weight: 600 !important;
  color: var(--text) !important;
}

.wooplainly-product-review-form__stars {
  position: relative !important;
  display: inline-flex !important;
  flex-direction: row-reverse !important;
  gap: 0.375rem !important; /* 6px */
}

.wooplainly-product-review-form__stars input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.wooplainly-product-review-form__star {
  width: 2rem !important; /* 32px */
  height: 2rem !important; /* 32px */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjZDRkNmRjJyBzdHJva2Utd2lkdGg9JzEuNicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cG9seWdvbiBwb2ludHM9JzEyIDIgMTUuMDkgOC4yNiAyMiA5LjI3IDE3IDE0LjE0IDE4LjE4IDIxLjAyIDEyIDE3Ljc3IDUuODIgMjEuMDIgNyAxNC4xNCAyIDkuMjcgOC45MSA4LjI2IDEyIDInLz48L3N2Zz4=") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 1.625rem 1.625rem !important; /* 26px */
  transition: transform 0.2s ease !important;
}

.wooplainly-product-review-form__star:is(:hover, :focus-visible, :active) {
  transform: scale(1.08) !important;
}

.wooplainly-product-review-form__stars
  label:is(:hover, :focus-visible, :active),
.wooplainly-product-review-form__stars
  label:is(:hover, :focus-visible, :active)
  ~ label,
.wooplainly-product-review-form__stars input:checked ~ label {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nI2Y0YjYzZicgc3Ryb2tlPScjZjRiNjNmJyBzdHJva2Utd2lkdGg9JzEnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCc+PHBvbHlnb24gcG9pbnRzPScxMiAyIDE1LjA5IDguMjYgMjIgOS4yNyAxNyAxNC4xNCAxOC4xOCAyMS4wMiAxMiAxNy43NyA1LjgyIDIxLjAyIDcgMTQuMTQgMiA5LjI3IDguOTEgOC4yNiAxMiAyJy8+PC9zdmc+") !important;
}

.wooplainly-product-review-form__stars
  input:focus-visible
  + .wooplainly-product-review-form__star {
  outline: 3px solid color-mix(in srgb, var(--primary) 30%, transparent) !important; /* outline 3px -> px */
  outline-offset: 0.25rem !important; /* 4px */
  border-radius: 50% !important;
}

.wooplainly-product-review-form .form-submit {
  margin: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
}

.wooplainly-product-review-form__submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important; /* 8px */
  padding: 0.75rem 1.75rem !important; /* 12px 28px */
  border-radius: var(--radius-sm) !important;
  border: 0 !important;
  background: var(--primary) !important;
  color: var(--wooplainly-color-on-primary) !important;
  font-weight: 500 !important;
  font-size: 0.9375rem !important; /* 15px */
  cursor: pointer !important;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease !important;
  font-size: 0.8rem !important;
}

.wooplainly-product-review-form__submit:is(:hover, :focus-visible, :active) {
  transform: translateY(-0.0625rem) !important; /* -1px */
  box-shadow: 0 0.875rem 1.75rem
    color-mix(in srgb, var(--primary) 35%, transparent) !important; /* 14px 28px */
}

.wooplainly-product-review-form .must-log-in {
  margin: 0 !important;
  font-size: 0.875rem !important; /* 14px */
  color: var(--muted) !important;
}

.wooplainly-product-review-form .must-log-in a {
  color: var(--primary) !important;
  font-weight: 600 !important;
}

@media (max-width: 600px) {
  .wooplainly-product-review-form {
    padding: 1.625rem !important; /* 26px */
  }
  .wooplainly-product-wishlist {
    width: 100%;
  }
}

/* ============= Drobne ARIA focus ============= */
.wooplainly-product-page *:focus-visible {
  outline: 1px solid color-mix(in srgb, var(--primary) 70%, transparent) !important; /* outline 3px -> px */
  outline-offset: 0rem !important; /* 3px */
  border-radius: 0.625rem !important; /* 10px */
}