/**
 * @file
 * Product page styles.
 */
.product {
  margin-top: 2.5rem;
  max-width: 100%;
  overflow-x: hidden;
}
.product img {
  max-width: 100% !important;
  height: auto !important;
}
.product > div:last-child {
  margin-bottom: 3rem;
}
.product > div:last-child:has(.block-inline-blockbanner),
.product > div:last-child:has(.block-content-banner) {
  margin-bottom: 0;
}
.product .field--name-title,
.product .field--name-price {
  font-family: var(--font-family-heading);
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.2;
  margin-bottom: 1.5rem;
}
.product .field--name-price,
.product .calculated-bundle-price em {
  font-size: 1.75rem;
  margin-bottom: 0;
}
.product .form-type-select,
.product .form-type-number {
  margin-block: 0.5rem 1.5rem;
}
.product .form-type-select label,
.product .form-type-number label {
  font-size: 1rem;
  font-weight: 700;
  color: var(--neutral-900);
  text-transform: none;
}
.product .form-type-select input,
.product .form-type-select select,
.product .form-type-number input,
.product .form-type-number select {
  width: auto;
}
.product .form-type-select:not([class*=form-item-bundle-items-]),
.product .form-type-number {
  margin-top: 1.5rem;
}
.product .form-type-select:not([class*=form-item-bundle-items-]) label,
.product .form-type-number label {
  min-width: 4.75rem;
}
.product .form-type-select:not([class*=form-item-bundle-items-]) input,
.product .form-type-select:not([class*=form-item-bundle-items-]) select,
.product .form-type-number input,
.product .form-type-number select {
  max-width: 8.5rem;
}
@media (min-width: 768px) {
  .product .form-type-select:not([class*=form-item-bundle-items-]),
  .product .form-type-number {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  .product .form-type-select:not([class*=form-item-bundle-items-]) label,
  .product .form-type-number label {
    margin-bottom: 0;
  }
}
.product .form-type-number input {
  max-width: 5.25rem;
}
.product .calculated-price {
  margin: 0.5rem 0 2.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 1rem;
  color: var(--neutral-600);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.product .calculated-price:hover {
  color: var(--neutral-900);
}
.product .calculated-bundle-price em {
  display: block;
  font-style: normal;
  text-decoration: none;
}
.product .suggested-price-options {
  margin-bottom: 2rem !important;
}
.product .suggested-price-options .fieldset-legend {
  border-bottom: 1px solid var(--neutral-100);
  display: block;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  font-size: 1rem;
  color: var(--neutral-900);
  text-transform: none;
}
.product .suggested-price-options .form-check {
  display: inline-block;
  padding-left: 0;
  margin-right: 0.25rem;
  margin-bottom: 0.75rem;
}
.product .suggested-price-options .form-check-input {
  display: none;
}
.product .suggested-price-options .form-check-input:checked + label {
  border-color: var(--primary-500);
  background-color: var(--primary-500);
  color: white;
}
.product .suggested-price-options label {
  display: block;
  padding: 0.5rem 1rem;
  border: 1px solid var(--neutral-100);
  background-color: var(--neutral-50);
  font-size: 1rem;
  color: var(--neutral-900);
  cursor: pointer;
}
.product .suggested-price-options label:hover {
  border-color: var(--primary-500);
  background-color: var(--primary-50);
}
.product .button--add-to-cart {
  min-width: 15.625rem;
  margin-top: 3rem;
}
.product .field--name-field-tags,
.product .field--name-field-categories {
  margin-bottom: 1.5rem;
}
.product .field--name-field-tags .field__items,
.product .field--name-field-categories .field__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.875rem;
  margin-bottom: 0;
}
.product .field--name-field-tags a,
.product .field--name-field-categories a {
  font-weight: 700;
  font-size: 0.875rem;
  padding: 0.25rem 0.5rem;
  background-color: var(--neutral-50);
}

/* Image */
.block--commerce-product--field-image {
  max-width: 100%;
}
.block--commerce-product--field-image .field__item {
  max-width: 100%;
}
.block--commerce-product--field-image img {
  display: block;
  margin-inline: auto;
  max-width: 100% !important;
  width: 100% !important;
  height: auto !important;
}
@media (min-width: 768px) {
  .block--commerce-product--field-image img {
    margin-bottom: 2.5rem;
    width: auto !important;
  }
}

/* Description */
.block--commerce-product--body {
  margin-block: 2.125rem;
  color: var(--neutral-800);
}
.block--commerce-product--body h2 {
  font-size: 20px;
  font-weight: 700;
  font-family: var(--font-family-heading);
  margin-bottom: 1rem;
}
.block--commerce-product--body img {
  display: block;
  margin-inline: auto;
  margin-block: 0.5rem 1rem;
  max-width: 100%;
  height: auto;
}

/* Images */
.block--commerce-product--field-images {
  margin-bottom: 2.125rem;
}
.block--commerce-product--field-images .field--name-field-images {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
}
@media (min-width: 768px) {
  .block--commerce-product--field-images img {
    width: auto;
    height: 12.5rem;
  }
}