.p-widget-woocommerce-product-gallery {
  --border-radius__thumbs: var(--v-border-radius__sm);
  --border-color__thumbs: var(--v-color__1);

  display: flex;
  gap: 0.5rem;
  align-items: stretch;
}

.p-widget-woocommerce-product-gallery__picture {
  height: 20rem;
  flex: 1 1 0%;
  order: 2;
  cursor: zoom-in;
}

.p-widget-woocommerce-product-gallery__thumbs {
  flex: 0 0 4rem;
  order: 1;
  position: relative;
}

.p-widget-woocommerce-product-gallery__thumbs--single {
  display: none;
}

.p-widget-woocommerce-product-gallery__thumbs-inner {
  position: absolute;
  z-index: 10;
  inset: 0;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-content: flex-start;
}

.p-widget-woocommerce-product-gallery__thumb {
  flex: 0 0 100%;
  aspect-ratio: 100 / 100;
  padding: 5px;
  border-radius: var(--border-radius__thumbs);
  border: 1px solid transparent;
  cursor: pointer;
}

.p-widget-woocommerce-product-gallery__thumb:hover,
.p-widget-woocommerce-product-gallery__thumb.is-active {
  border: 1px solid var(--border-color__thumbs);
}

.p-widget-woocommerce-product-gallery__picture-img,
.p-widget-woocommerce-product-gallery__thumb-image {
  display: block;
  object-fit: contain;
  object-position: center center;
  width: 100%;
  height: 100%;
}

@media (min-width: 900px) {
  .p-widget-woocommerce-product-gallery__picture {
    height: auto;
    aspect-ratio: 100 / 120;
  }
}

@media (min-width: 1200px) {
  .p-widget-woocommerce-product-gallery {
    gap: 1rem;
  }

  .p-widget-woocommerce-product-gallery__thumbs {
    flex: 0 0 5rem;
  }
}

@media (min-width: 1500px) {
  .p-widget-woocommerce-product-gallery__picture {
    aspect-ratio: 100 / 100;
  }
}
