/* Storefront additions on top of the Dawn theme CSS.
   The scrape had no product page, so product styles below approximate Dawn's
   section-main-product.css. */

.flash-message {
  margin: 2rem 0 0;
  padding: 1.2rem 1.6rem;
  border-radius: var(--inputs-radius, 6px);
  background: rgba(var(--color-base-accent-1), 0.08);
  border: 1px solid rgba(var(--color-base-accent-1), 0.35);
  color: rgb(var(--color-base-text));
}
.flash-message--alert {
  background: rgba(var(--color-base-text), 0.06);
  border-color: rgb(var(--color-base-text));
}

/* Padding for templates that aren't sections */
.section-main-page-padding { padding-top: 27px; padding-bottom: 27px; }
.collection-grid-padding { padding-top: 0; padding-bottom: 36px; }
@media screen and (min-width: 750px) {
  .section-main-page-padding { padding-top: 36px; padding-bottom: 36px; }
}

/* ---- Product page --------------------------------------------------------- */
.product-section-padding { padding-top: 27px; padding-bottom: 9px; }
@media screen and (min-width: 750px) {
  .product-section-padding { padding-top: 36px; padding-bottom: 12px; }
}
.product { margin: 0; }
.product.grid { gap: 0; }
.product__media-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.product__media-item { width: 100%; }
.product__media { position: relative; }
.product__media-placeholder { aspect-ratio: 1; }
.product__info-wrapper { padding: 2rem 0 0; }
@media screen and (min-width: 750px) {
  .product--medium .product__media-wrapper { max-width: 55%; width: calc(55% - var(--grid-desktop-horizontal-spacing) / 2); }
  .product--medium .product__info-wrapper { max-width: 45%; width: calc(45% - var(--grid-desktop-horizontal-spacing) / 2); padding: 0 0 0 5rem; }
  .product__info-container { position: sticky; top: 3rem; }
}
.product__info-container > * + * { margin: 1.5rem 0; }
.product__text { margin-bottom: 1rem; }
.product__title h1 { margin: 0; word-break: break-word; }
.product__tax { margin-top: -1rem; }
.product-form__input { flex: 0 0 100%; padding: 0; margin: 0 0 1.2rem; max-width: 44rem; min-width: fit-content; border: none; }
.product-form__input .form__label { display: block; margin-bottom: 0.6rem; }
.product-form__input .select { max-width: 25rem; }
.product-form__buttons { max-width: 44rem; margin-top: 1.5rem; }
.product-form__submit[disabled] { cursor: not-allowed; opacity: 0.6; }
.product__description { margin: 2.5rem 0; }

/* ---- Cart ----------------------------------------------------------------- */
.cart-remove-button { min-width: 4.5rem; min-height: 4.5rem; padding: 0; margin: 0 0.1rem 0.1rem 1rem; box-shadow: none; }
.cart-remove-button::after, .cart-remove-button::before { display: none; }
.cart-remove-button .icon-remove { width: 1.5rem; height: 1.5rem; }
.cart__zone { margin: 0 0 2rem auto; max-width: 30rem; }
.cart__zone-label { display: block; margin-bottom: 0.5rem; }
@media screen and (max-width: 749px) { .cart__zone { margin-left: 0; max-width: none; } }

/* ---- Order confirmation --------------------------------------------------- */
.order-confirmation__items { width: 100%; border-collapse: collapse; margin: 3rem 0; }
.order-confirmation__items td, .order-confirmation__items th { padding: 1rem 0; border-bottom: 1px solid rgba(var(--color-base-text), 0.1); text-align: left; font-weight: normal; }
.order-confirmation__items .right { text-align: right; }

.template-search__header { margin-bottom: 3rem; }
.template-search__header .search { max-width: 47.8rem; margin: 2rem auto; }
