:is(.cg-preview-cart, .cg-preview-checkout) main {
  --cg-panel: var(--cg-evening-highlight);
  --cg-border: var(--cg-evening-line);
  color: var(--cg-evening-ivory);
}

:is(.cg-preview-cart, .cg-preview-checkout) main {
  overflow-wrap: anywhere;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(
  .woocommerce-cart-form, .cart_totals, .wc-block-cart-items,
  .wc-block-cart__sidebar, .woocommerce-billing-fields,
  .woocommerce-shipping-fields, .woocommerce-additional-fields,
  #order_review, .cart-empty
) {
  box-sizing: border-box;
  min-inline-size: 0;
  border: 1px solid var(--cg-border);
  border-radius: .65rem;
  background: var(--cg-evening-panel);
  padding: clamp(.85rem, 2.5vw, 1.5rem);
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(.cart_totals, .wc-block-cart__sidebar, #order_review) {
  background: var(--cg-panel);
}

.cg-preview-checkout main :is(.woocommerce-shipping-fields, .woocommerce-additional-fields) {
  margin-block-end: 1rem;
}

.cg-preview-checkout main .cg-checkout-title {
  margin-block: 0 .65em;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.25;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(h2, h3) {
  margin-block-start: 0;
  line-height: 1.3;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(
  .woocommerce a.button, .woocommerce button.button,
  .wc-block-cart__submit-button, .wc-block-components-button:not(.is-link)
) {
  box-sizing: border-box;
  min-block-size: 2.75rem;
  padding: .65rem 1rem;
  border: 1px solid var(--cg-evening-gold);
  border-radius: .4rem;
  background: var(--cg-evening-gold);
  color: var(--cg-evening-black);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(
  .woocommerce a.button, .woocommerce button.button,
  .wc-block-cart__submit-button, .wc-block-components-button:not(.is-link)
):hover {
  background: var(--cg-evening-ivory);
  color: var(--cg-evening-black);
}

.cg-preview-checkout main :is(input.input-text, textarea, select, .select2-selection) {
  box-sizing: border-box;
  max-inline-size: 100%;
  min-block-size: 2.75rem;
  font-size: 1rem;
}

.cg-preview-checkout main :is(input[type="tel"], input[type="email"], input[autocomplete="postal-code"]) {
  direction: ltr;
  text-align: start;
}

.cg-preview-checkout #cultural-gifts-delivery-picker:not(:empty) {
  margin-block: 1rem;
  padding: clamp(.9rem, 2.5vw, 1.4rem);
  background: var(--cg-evening-highlight);
  border: 1px solid var(--cg-evening-gold);
  border-inline-start-width: .35rem;
  border-radius: .5rem;
  color: var(--cg-evening-ivory);
}

.cg-preview-checkout #cultural-gifts-delivery-picker p {
  margin-block: 0;
}

.cg-preview-checkout #cultural-gifts-delivery-picker label {
  display: block;
  font-weight: 650;
  margin-block-end: .35rem;
}

.cg-preview-checkout #cultural-gifts-delivery-slot {
  inline-size: 100%;
  min-block-size: 3rem;
  direction: inherit;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(h1, h2, h3) {
  color: var(--cg-evening-ivory);
  font-family: var(--cg-evening-serif);
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(a:not(.button, .wc-block-cart__submit-button), .wc-block-cart-item__remove-link) {
  color: var(--cg-evening-gold);
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(.woocommerce form, .wp-block-woocommerce-cart) :is(input:not([type="checkbox"], [type="radio"], [type="hidden"]), select, textarea, .select2-selection),
.cg-preview-checkout .select2-container .select2-dropdown {
  color-scheme: dark;
  background: #140e0c;
  border-color: #806343;
  color: #fff2dc;
}

.cg-preview-checkout main .select2-selection .select2-selection__rendered {
  color: inherit;
}

.cg-preview-checkout .select2-results__option:is([aria-selected="true"], .select2-results__option--highlighted) {
  background: #e6c188;
  color: #140e0c;
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--cg-evening-gold);
  outline-offset: 2px;
}

:is(.cg-preview-cart, .cg-preview-checkout) main .woocommerce table.shop_table :is(td, th) {
  border-color: var(--cg-evening-line);
}

.cg-preview-checkout main .woocommerce #payment,
.cg-preview-checkout main .woocommerce #payment .payment_box {
  background: var(--cg-evening-panel);
  color: var(--cg-evening-ivory);
}

.cg-preview-checkout main .woocommerce #payment .payment_box::before {
  border-bottom-color: var(--cg-evening-panel);
}

:is(.cg-preview-cart, .cg-preview-checkout) main :is(.woocommerce-info, .woocommerce-message, .woocommerce-error, .wc-block-components-notice-banner) {
  background: var(--cg-evening-highlight);
  color: var(--cg-evening-ivory);
}

.cg-preview-confirmation {
  --cg-panel: #fcf8f4;
  --cg-red: var(--wp--preset--color--warm-red);
}

.cg-preview-confirmation main {
  overflow-wrap: anywhere;
}

.cg-preview-confirmation main :is(
  .woocommerce-thankyou-order-received, .woocommerce-order-details, .woocommerce-customer-details,
  .wc-block-order-confirmation-status, .wc-block-order-confirmation-totals-wrapper,
  .wc-block-order-confirmation-shipping-wrapper, .wc-block-order-confirmation-billing-wrapper
) {
  box-sizing: border-box;
  border: 1px solid var(--cg-border);
  border-radius: .65rem;
  background: var(--wp--preset--color--white-canvas);
  padding: clamp(.85rem, 2.5vw, 1.5rem);
  margin-block-end: 1rem;
}

.cg-preview-confirmation main :is(.woocommerce-thankyou-order-received, .wc-block-order-confirmation-status) {
  border-block-start: .3rem solid var(--cg-red);
  color: var(--cg-red);
  font-size: clamp(1.2rem, 4vw, 1.65rem);
  font-weight: 700;
}

.cg-preview-confirmation main .wc-block-order-confirmation-status p {
  margin: 0;
  font-size: clamp(1.2rem, 4vw, 1.65rem);
}

.cg-preview-confirmation main ul:is(.woocommerce-order-overview, .wc-block-order-confirmation-summary-list) {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  padding: 0;
  margin-block: 1rem;
}

.cg-preview-confirmation main ul:is(.woocommerce-order-overview, .wc-block-order-confirmation-summary-list) li {
  box-sizing: border-box;
  float: none;
  flex: 1 1 9rem;
  min-inline-size: 0;
  margin: 0;
  padding: .7rem;
  border: 1px solid var(--cg-border);
  border-radius: .4rem;
  background: var(--cg-panel);
}

.cg-preview-confirmation main .cg-delivery-summary {
  border: 1px solid var(--wp--preset--color--golden-yellow);
  border-inline-start-width: .35rem;
  border-radius: .5rem;
  background: var(--wp--preset--color--pale-yellow);
  padding: .9rem 1rem;
  line-height: 1.65;
}

.cg-preview-confirmation main .cg-delivery-summary strong {
  color: var(--cg-red);
}

@media (min-width: 960px) {
  .cg-preview-checkout main form.checkout:has(> #customer_details):has(> #order_review) {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    grid-template-rows: auto auto 1fr;
    grid-template-areas:
      "address heading"
      "address delivery"
      "address review";
    align-items: start;
    gap: .75rem clamp(1.25rem, 3vw, 2.5rem);
  }

  .cg-preview-checkout form.checkout > #customer_details { grid-area: address; }
  .cg-preview-checkout form.checkout > #order_review_heading { grid-area: heading; margin: 0; }
  .cg-preview-checkout form.checkout > #cultural-gifts-delivery-picker { grid-area: delivery; margin: 0; }
  .cg-preview-checkout form.checkout > #order_review { grid-area: review; }

  .cg-preview-checkout .woocommerce #customer_details > :is(.col-1, .col-2) {
    float: none;
    inline-size: 100%;
  }

  .cg-preview-checkout #customer_details > .col-1 { margin-block-end: 1rem; }
}

@media (max-width: 760px) {
  .cg-preview-checkout .woocommerce #customer_details > :is(.col-1, .col-2),
  .cg-preview-cart .woocommerce .cart-collaterals .cart_totals {
    float: none;
    inline-size: 100%;
  }

  .cg-preview-checkout #customer_details > .col-1 {
    margin-block-end: 1rem;
  }

  .cg-preview-checkout .woocommerce #place_order {
    float: none;
    inline-size: 100%;
    margin-inline: 0;
  }
}

@media (max-width: 480px) {
  .cg-preview-checkout .woocommerce form :is(.form-row-first, .form-row-last) {
    float: none;
    inline-size: 100%;
  }

  .cg-preview-cart .woocommerce table.cart td.actions .coupon {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
  }

  .cg-preview-cart .woocommerce table.cart td.actions .coupon > :is(input.input-text, button.button) {
    float: none;
    flex: 1 1 8rem;
    inline-size: auto;
    margin: 0;
  }
}
