:root {
  --wns-orders--panel-border: 1px solid color-mix(
    in srgb,
    var(--wp--preset--color--secondary) 55%,
    transparent
  );
  --wns-orders--panel-radius: 12px;
  --wns-orders--panel-padding: 20px;
  --wns-orders--panel-bg: color-mix(
    in srgb,
    var(--wp--preset--color--secondary) 5%,
    var(--wp--preset--color--black)
  );
  --wns-orders--section-gap: 32px;
}

.woocommerce-order-received main {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--wns--page--max-width);
  margin-inline: auto;
  padding-inline: var(--wns--page--padding);
}

.woocommerce-order-received main *,
.woocommerce-order-received main *::before,
.woocommerce-order-received main *::after {
  box-sizing: border-box;
  min-width: 0;
}

.woocommerce-order-received main .alignwide {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
}

.woocommerce-order-received .wc-block-order-confirmation-status {
  white-space: normal !important;
}

.woocommerce-order-received .wc-block-order-confirmation-status h1,
.woocommerce-order-received .wc-block-order-confirmation-status p {
  margin-top: 0;
  color: var(--wp--preset--color--secondary);
  font-family: var(--wp--preset--font-family--playfair-display);
  font-style: italic;
  line-height: 1.15;
}

.woocommerce-order-received .wc-block-order-confirmation-status-description {
  margin-bottom: var(--wns-orders--section-gap);
  padding: var(--wns-orders--panel-padding);
  border: var(--wns-orders--panel-border);
  border-radius: var(--wns-orders--panel-radius);
  background: var(--wns-orders--panel-bg);
}

.woocommerce-order-received .wc-block-order-confirmation-status-description p {
  margin: 0;
  line-height: 1.6;
}

.woocommerce-order-received .wc-block-order-confirmation-status-description .button {
  display: inline;
  padding: 0 !important;
  background: transparent !important;
  color: var(--wp--preset--color--secondary) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.woocommerce-order-received .wc-block-order-confirmation-summary-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 20px;
  margin: 0 0 var(--wns-orders--section-gap);
  padding: var(--wns-orders--panel-padding);
  border: var(--wns-orders--panel-border);
  border-radius: var(--wns-orders--panel-radius);
  background: var(--wns-orders--panel-bg);
  list-style: none;
}

.woocommerce-order-received .wc-block-order-confirmation-summary-list-item {
  display: grid;
  align-content: start;
  gap: 6px;
  margin: 0;
  padding: 0;
  border: 0;
}

.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__key {
  color: var(--wp--preset--color--secondary);
  font-weight: 700;
}

.woocommerce-order-received .wc-block-order-confirmation-summary-list-item__value {
  overflow-wrap: anywhere;
}

.woocommerce-order-received .wc-block-order-confirmation-totals-wrapper,
.woocommerce-order-received .wc-block-order-confirmation-address-wrapper {
  margin-bottom: var(--wns-orders--section-gap);
}

.woocommerce-order-received .wc-block-order-confirmation-totals h2,
.woocommerce-order-received .wc-block-order-confirmation-billing-wrapper h2,
.woocommerce-order-received .wc-block-order-confirmation-shipping-wrapper h2 {
  color: var(--wp--preset--color--secondary);
}

.woocommerce-order-received .wc-block-order-confirmation-totals__table {
  width: 100%;
  table-layout: fixed;
  border: var(--wns-orders--panel-border) !important;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--wns-orders--panel-radius);
  overflow: hidden;
}

.woocommerce-order-received .wc-block-order-confirmation-totals__table th,
.woocommerce-order-received .wc-block-order-confirmation-totals__table td {
  width: auto !important;
  padding: 16px !important;
  overflow-wrap: anywhere;
  white-space: normal;
}

.woocommerce-order-received .wc-block-order-confirmation-totals__product {
  width: 70% !important;
}

.woocommerce-order-received .wc-block-order-confirmation-totals__total {
  width: 30% !important;
  text-align: right;
}

.woocommerce-order-received .wc-block-order-confirmation-address-wrapper {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.woocommerce-order-received .wc-block-order-confirmation-address-wrapper > .wp-block-column:empty {
  display: none;
}

.woocommerce-order-received .wc-block-order-confirmation-address-wrapper > .wp-block-column {
  width: 100%;
}

.woocommerce-order-received .wc-block-order-confirmation-address-wrapper address {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 1.5;
}

.woocommerce-account .woocommerce-MyAccount-content > p:first-child,
.woocommerce-account .woocommerce-order-details,
.woocommerce-account .woocommerce-customer-details {
  min-width: 0;
  max-width: 100%;
}

.woocommerce-account .woocommerce-table--order-details {
  width: 100%;
  table-layout: fixed;
}

.woocommerce-account .woocommerce-table--order-details th,
.woocommerce-account .woocommerce-table--order-details td {
  width: auto !important;
  overflow-wrap: anywhere;
  white-space: normal;
}

.woocommerce-account .woocommerce-table--order-details .woocommerce-table__product-name {
  width: 65% !important;
}

.woocommerce-account .woocommerce-table--order-details .woocommerce-table__product-total {
  width: 35% !important;
}

.woocommerce-account .woocommerce-table--order-details .woocommerce-orders-table__cell-order-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.woocommerce-order-pay > .wp-site-blocks > header .wp-block-group.alignwide,
.woocommerce-order-pay main {
  box-sizing: border-box;
  width: calc(100% - 40px);
  max-width: 1000px;
  margin-inline: auto;
  padding-inline: 0 !important;
}

.woocommerce-order-pay > .wp-site-blocks > header .wp-block-site-title a {
  color: var(--wp--preset--color--secondary);
  font-family: var(--wp--preset--font-family--playfair-display);
  font-size: 28px;
  font-style: italic;
}

.woocommerce-order-pay main *,
.woocommerce-order-pay main *::before,
.woocommerce-order-pay main *::after {
  box-sizing: border-box;
  min-width: 0;
}

.woocommerce-order-pay .wns-order-pay-title {
  margin: 32px 0;
  color: var(--wp--preset--color--secondary);
}

.woocommerce-order-pay #order_review {
  width: 100%;
}

.woocommerce-order-pay #order_review .shop_table {
  width: 100%;
  table-layout: fixed;
  margin-bottom: 28px;
  border: var(--wns-orders--panel-border) !important;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--wns-orders--panel-radius);
  overflow: hidden;
}

.woocommerce-order-pay #order_review .shop_table th,
.woocommerce-order-pay #order_review .shop_table td {
  width: auto !important;
  padding: 14px 16px !important;
  border-color: color-mix(in srgb, var(--wp--preset--color--secondary) 25%, transparent) !important;
  overflow-wrap: anywhere;
  white-space: normal;
}

.woocommerce-order-pay #payment {
  padding: 0;
  border: var(--wns-orders--panel-border);
  border-radius: var(--wns-orders--panel-radius);
  background: var(--wns-orders--panel-bg);
  overflow: hidden;
}

.woocommerce-order-pay #payment .wc_payment_methods {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}

.woocommerce-order-pay #payment .wc_payment_method {
  margin: 0;
  padding: var(--wns-orders--panel-padding);
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--secondary) 25%, transparent);
}

.woocommerce-order-pay #payment .wc_payment_method label {
  margin-left: 10px;
  font-weight: 700;
}

.woocommerce-order-pay #payment .payment_box {
  margin: 18px 0 0 !important;
  padding: 18px !important;
  border: var(--wns-orders--panel-border);
  border-radius: 8px;
  background: var(--wp--preset--color--black) !important;
  color: var(--wp--preset--color--white) !important;
  line-height: 1.5;
}

.woocommerce-order-pay #payment .payment_box::before {
  border-bottom-color: var(--wp--preset--color--secondary) !important;
}

.woocommerce-order-pay #payment .payment_box p {
  margin: 0;
}

.woocommerce-order-pay #payment > .form-row {
  margin: 0;
  padding: var(--wns-orders--panel-padding);
}

.woocommerce-order-pay #payment #place_order {
  width: 100%;
  margin-bottom: 16px;
}

.woocommerce-order-pay #payment .ppc-button-wrapper {
  width: 100%;
  max-width: 520px;
  margin-inline: auto;
}

@media (max-width: 900px) {
  .woocommerce-order-received main {
    width: calc(100vw - 40px);
    max-width: calc(100vw - 40px);
    margin-inline: 20px;
    padding-inline: 0;
    overflow-x: clip;
  }

  .woocommerce-order-received .wc-block-order-confirmation-status h1,
  .woocommerce-order-received .wc-block-order-confirmation-status p {
    max-width: 100%;
    font-size: clamp(28px, 8vw, 38px) !important;
    overflow-wrap: anywhere;
    white-space: normal !important;
  }

  .woocommerce-order-received .wc-block-order-confirmation-status p {
    max-width: 19ch;
  }

  .woocommerce-order-received .wc-block-order-confirmation-summary-list,
  .woocommerce-order-received .wc-block-order-confirmation-address-wrapper {
    grid-template-columns: minmax(0, 1fr);
  }

  .woocommerce-order-received .wc-block-order-confirmation-totals__table th,
  .woocommerce-order-received .wc-block-order-confirmation-totals__table td {
    display: block;
    width: auto !important;
    padding: 14px 10px !important;
  }

  .woocommerce-order-received .wc-block-order-confirmation-totals__table,
  .woocommerce-order-received .wc-block-order-confirmation-totals__table thead,
  .woocommerce-order-received .wc-block-order-confirmation-totals__table tbody,
  .woocommerce-order-received .wc-block-order-confirmation-totals__table tfoot {
    display: block;
    width: 100%;
  }

  .woocommerce-order-received .wc-block-order-confirmation-totals__table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(90px, 38%);
    width: 100%;
  }

  .woocommerce-order-received .wc-block-order-confirmation-totals__product {
    width: auto !important;
  }

  .woocommerce-order-received .wc-block-order-confirmation-totals__total {
    width: auto !important;
    text-align: left;
  }

  .woocommerce-account .woocommerce-MyAccount-content > p:first-child {
    overflow-wrap: anywhere;
  }

  .woocommerce-account .woocommerce-table--order-details th,
  .woocommerce-account .woocommerce-table--order-details td {
    display: block;
    width: auto !important;
    padding: 14px 10px !important;
    font-size: 15px;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }

  .woocommerce-account .woocommerce-table--order-details,
  .woocommerce-account .woocommerce-table--order-details thead,
  .woocommerce-account .woocommerce-table--order-details tbody,
  .woocommerce-account .woocommerce-table--order-details tfoot {
    display: block;
    width: 100%;
  }

  .woocommerce-account .woocommerce-table--order-details tr {
    display: grid;
    grid-template-columns: minmax(0, 58%) minmax(0, 42%);
    width: 100%;
  }

  .woocommerce-account .woocommerce-table--order-details .woocommerce-table__product-name,
  .woocommerce-account .woocommerce-table--order-details .woocommerce-table__product-total,
  .woocommerce-account .woocommerce-table--order-details tfoot th,
  .woocommerce-account .woocommerce-table--order-details tfoot td {
    width: auto !important;
  }

  .woocommerce-account .woocommerce-table--order-details tfoot th {
    text-align: left !important;
  }

  .woocommerce-account .woocommerce-table--order-details tfoot td {
    text-align: left !important;
  }

  .woocommerce-account .woocommerce-table--order-details .order-actions--heading + td {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
  }

  .woocommerce-order-pay > .wp-site-blocks > header .wp-block-group.alignwide,
  .woocommerce-order-pay main {
    width: calc(100vw - 80px);
    max-width: calc(100vw - 80px);
    margin-inline: 40px;
    overflow-x: clip;
  }

  .woocommerce-order-pay .wns-order-pay-title {
    max-width: 100%;
    font-size: clamp(32px, 9vw, 42px);
    overflow-wrap: anywhere;
  }

  .woocommerce-order-pay #order_review .shop_table,
  .woocommerce-order-pay #order_review .shop_table thead,
  .woocommerce-order-pay #order_review .shop_table tbody,
  .woocommerce-order-pay #order_review .shop_table tfoot {
    display: block;
    width: 100%;
  }

  .woocommerce-order-pay #order_review .shop_table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(48px, 20%) minmax(82px, 32%);
    width: 100%;
  }

  .woocommerce-order-pay #order_review .shop_table th,
  .woocommerce-order-pay #order_review .shop_table td {
    display: block;
    width: auto !important;
    padding: 12px 8px !important;
    font-size: 14px;
  }

  .woocommerce-order-pay #order_review .shop_table tfoot th {
    grid-column: 1 / 3;
  }

  .woocommerce-order-pay #order_review .shop_table tfoot td {
    grid-column: 3;
  }

  .woocommerce-order-pay #payment .wc_payment_method,
  .woocommerce-order-pay #payment > .form-row {
    padding: 18px;
  }
}