.mskb-commerce-flow {
    --mskb-commerce-red: #a6250d;
    --mskb-commerce-red-dark: #7f1b08;
    --mskb-commerce-brown: #4b1f01;
    overflow-x: hidden;
}

.mskb-commerce-flow main,
.mskb-commerce-flow .site-main,
.mskb-commerce-flow .entry-content {
    box-sizing: border-box;
    margin-right: auto !important;
    margin-left: auto !important;
    max-width: 1240px !important;
    width: calc(100% - 32px) !important;
}

.mskb-commerce-flow .wp-block-woocommerce-cart.alignwide,
.mskb-commerce-flow .wp-block-woocommerce-checkout.alignwide,
.mskb-commerce-flow .wc-block-cart,
.mskb-commerce-flow .wc-block-checkout {
    box-sizing: border-box;
    margin-right: 0 !important;
    margin-left: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.mskb-commerce-flow .wc-block-components-sidebar-layout {
    align-items: start !important;
    box-sizing: border-box;
    column-gap: clamp(24px, 4vw, 56px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, .85fr) !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
}

.mskb-commerce-flow .wc-block-components-main,
.mskb-commerce-flow .wc-block-components-sidebar {
    box-sizing: border-box;
    flex: none !important;
    margin: 0 !important;
    max-width: none !important;
    min-width: 0;
    padding-right: 0 !important;
    padding-left: 0 !important;
    position: static !important;
    width: 100% !important;
}

.mskb-commerce-flow .wc-block-cart__main,
.mskb-commerce-flow .wc-block-checkout__main {
    grid-column: 1;
}

.mskb-commerce-flow .wc-block-cart__sidebar,
.mskb-commerce-flow .wc-block-checkout__sidebar {
    grid-column: 2;
    grid-row: 1;
}

.mskb-commerce-flow .wc-block-cart-items,
.mskb-commerce-flow .wc-block-cart__sidebar,
.mskb-commerce-flow .wc-block-checkout__sidebar,
.mskb-commerce-flow .wc-block-components-checkout-step {
    background: #fffaf6 !important;
    border: 1px solid #e3d4ca !important;
    border-radius: 10px !important;
    box-shadow: 0 7px 20px rgba(75, 31, 1, .055);
    box-sizing: border-box;
}

.mskb-commerce-flow .wc-block-cart__sidebar,
.mskb-commerce-flow .wc-block-checkout__sidebar {
    padding: clamp(18px, 2.2vw, 28px) !important;
}

.mskb-commerce-flow .wc-block-components-checkout-step {
    margin-bottom: 18px !important;
    padding: clamp(18px, 2vw, 26px) !important;
}

.mskb-commerce-flow .wc-block-components-checkout-step__heading {
    margin-bottom: 14px !important;
}

.mskb-commerce-flow .wc-block-cart-items {
    overflow: hidden;
}

.mskb-commerce-flow .wc-block-cart-items td,
.mskb-commerce-flow .wc-block-components-order-summary-item {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.mskb-commerce-flow .wc-block-components-product-name {
    color: var(--mskb-commerce-brown) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.mskb-commerce-flow .wc-block-components-product-metadata,
.mskb-commerce-flow .wc-block-components-product-details {
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.mskb-commerce-flow .wc-block-components-totals-wrapper {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.mskb-commerce-flow .wc-block-components-order-summary {
    max-height: none !important;
    overflow: visible !important;
}

.mskb-commerce-flow .wc-block-components-checkout-place-order-button,
.mskb-commerce-flow .wc-block-cart__submit-button {
    text-decoration: none !important;
}

.mskb-commerce-flow .wc-block-cart__submit-button {
    background: var(--mskb-commerce-red) !important;
    border-radius: 5px !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    min-height: 56px;
}

.mskb-commerce-flow .wc-block-cart__submit-button:hover,
.mskb-commerce-flow .wc-block-cart__submit-button:focus-visible {
    background: var(--mskb-commerce-red-dark) !important;
}

.mskb-commerce-flow .wc-block-checkout__terms,
.mskb-commerce-flow .wc-block-components-checkbox {
    text-align: left !important;
}

.mskb-commerce-flow .wc-block-components-text-input input,
.mskb-commerce-flow .wc-block-components-combobox-control input,
.mskb-commerce-flow .wc-block-components-textarea {
    background: #fff !important;
    border-radius: 5px !important;
    min-height: 48px;
}

.mskb-commerce-flow .wc-block-components-checkout-step__description,
.mskb-commerce-flow .wc-block-checkout__terms,
.mskb-commerce-flow .wc-block-components-checkbox__label,
.mskb-commerce-flow .woocommerce-terms-and-conditions-wrapper,
.mskb-commerce-flow .woocommerce-privacy-policy-text {
    color: var(--mskb-commerce-brown) !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    overflow-wrap: anywhere;
    white-space: normal !important;
}

.mskb-commerce-flow .wc-block-components-checkout-place-order-button,
.mskb-commerce-flow #place_order {
    align-items: center;
    background: var(--mskb-commerce-red) !important;
    border: 1px solid var(--mskb-commerce-red) !important;
    border-radius: 5px !important;
    box-sizing: border-box;
    color: #fff !important;
    display: flex !important;
    font-size: clamp(16px, 2vw, 19px) !important;
    font-weight: 700 !important;
    height: auto !important;
    justify-content: center;
    line-height: 1.35 !important;
    min-height: 56px;
    padding: 14px 18px !important;
    text-align: center;
    white-space: normal !important;
    width: 100% !important;
}

.mskb-commerce-flow .wc-block-components-checkout-place-order-button:hover,
.mskb-commerce-flow .wc-block-components-checkout-place-order-button:focus-visible,
.mskb-commerce-flow #place_order:hover,
.mskb-commerce-flow #place_order:focus-visible {
    background: var(--mskb-commerce-red-dark) !important;
    border-color: var(--mskb-commerce-red-dark) !important;
}

.mskb-commerce-flow .wc-block-cart-items,
.mskb-commerce-flow .wc-block-components-order-summary {
    max-width: 100%;
}

@media (max-width: 900px) {
    .mskb-commerce-flow main,
    .mskb-commerce-flow .site-main,
    .mskb-commerce-flow .entry-content {
        width: calc(100% - 24px) !important;
    }

    .mskb-commerce-flow .wc-block-components-sidebar-layout {
        display: block !important;
    }

    .mskb-commerce-flow .wc-block-components-main,
    .mskb-commerce-flow .wc-block-components-sidebar {
        float: none !important;
        margin: 0 0 24px !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        width: 100% !important;
    }

    .mskb-commerce-flow .wc-block-cart__sidebar,
    .mskb-commerce-flow .wc-block-checkout__sidebar {
        padding: 18px !important;
    }

    .mskb-commerce-flow .wc-block-components-checkout-step {
        padding: 18px !important;
    }
}

/* Keep the legal consent sentence readable and directly associated with the
 * final order button in both Checkout Blocks and classic checkout. */
.mskb-commerce-flow .wc-block-checkout__terms,
.mskb-commerce-flow .woocommerce-terms-and-conditions-wrapper,
.mskb-commerce-flow .woocommerce-privacy-policy-text {
    box-sizing: border-box !important;
    display: block !important;
    line-height: 1.55 !important;
    margin: 18px 0 14px !important;
    max-width: none !important;
    padding: 0 !important;
    position: static !important;
    text-align: left !important;
    width: 100% !important;
}

.mskb-commerce-flow .wc-block-checkout__terms *,
.mskb-commerce-flow .woocommerce-terms-and-conditions-wrapper *,
.mskb-commerce-flow .woocommerce-privacy-policy-text * {
    line-height: 1.55 !important;
    text-align: left !important;
    white-space: normal !important;
}

.mskb-commerce-flow .wc-block-checkout__actions_row,
.mskb-commerce-flow .wc-block-checkout__actions {
    align-items: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}
.mskb-commerce-flow form.checkout label .required,
.mskb-commerce-flow .wc-block-checkout label .required,
.mskb-commerce-flow .mskb-required-marker {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #a5230b !important;
    font-size: inherit !important;
    text-decoration: none !important;
}

.mskb-commerce-flow .mskb-checkout-privacy {
    display: block !important;
    margin: 12px 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #4b1f01 !important;
    text-align: left !important;
}
.mskb-commerce-flow .mskb-checkout-privacy a {
    color: #a6250d !important;
    text-decoration: underline !important;
}

/* Keep legal copy in normal document flow despite theme paragraph sizing. */
.mskb-commerce-flow .wc-block-checkout__terms,
.mskb-commerce-flow .wc-block-checkout__terms p,
.mskb-commerce-flow .wc-block-checkout__actions,
.mskb-commerce-flow .wc-block-checkout__actions_row {
    height: auto !important;
    min-height: 0 !important;
}
.mskb-commerce-flow .wc-block-checkout__terms p {
    margin: 0 !important;
    padding: 0 !important;
}
.mskb-commerce-flow .wc-block-checkout__terms a {
    display: inline !important;
    position: static !important;
    font-size: inherit !important;
    color: var(--mskb-commerce-red) !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-decoration: underline !important;
}
.mskb-commerce-flow .wc-block-checkout__actions {
    margin-top: 0 !important;
    padding-top: 0 !important;
    gap: 0 !important;
}
.mskb-commerce-flow .mskb-checkout-privacy {
    margin: 0 0 12px !important;
}

/* The theme sets a 1.6px mobile line-height on classic WooCommerce pages.
 * Limit the correction to the existing order-pay / change-payment view. */
.mskb-commerce-flow.woocommerce-order-pay .woocommerce,
.mskb-commerce-flow.woocommerce-order-pay #order_review,
.mskb-commerce-flow.woocommerce-order-pay .woocommerce-info,
.mskb-commerce-flow.woocommerce-order-pay #order_review label,
.mskb-commerce-flow.woocommerce-order-pay #order_review p {
    line-height: 1.5 !important;
}
.mskb-commerce-flow.woocommerce-order-pay .woocommerce-info {
    box-sizing: border-box;
    height: auto !important;
    min-height: 0 !important;
    padding: 16px 18px 16px 48px !important;
    margin: 18px 0 24px !important;
    font-size: 16px !important;
    white-space: normal;
    overflow-wrap: anywhere;
}
.mskb-commerce-flow.woocommerce-order-pay .woocommerce-info::before {
    top: 18px;
    left: 18px;
    line-height: 1;
}
.mskb-commerce-flow.woocommerce-order-pay .page-header,
.mskb-commerce-flow.woocommerce-order-pay .entry-title {
    padding: 0 !important;
    margin: 0 0 20px !important;
}
.mskb-commerce-flow.woocommerce-order-pay .entry-title {
    font-size: clamp(28px, 4vw, 46px) !important;
    line-height: 1.2 !important;
    overflow-wrap: break-word;
}
.mskb-commerce-flow.woocommerce-order-pay #order_review .shop_table {
    width: 100%;
    font-size: 16px;
    line-height: 1.5 !important;
}
.mskb-commerce-flow.woocommerce-order-pay #order_review th,
.mskb-commerce-flow.woocommerce-order-pay #order_review td {
    padding: 12px 10px;
    vertical-align: top;
    line-height: 1.5 !important;
    white-space: normal;
    overflow-wrap: anywhere;
}
@media (max-width: 600px) {
    .mskb-commerce-flow.woocommerce-order-pay #order_review .shop_table {
        table-layout: fixed;
        font-size: 14px;
    }
    .mskb-commerce-flow.woocommerce-order-pay #order_review th,
    .mskb-commerce-flow.woocommerce-order-pay #order_review td { padding: 10px 6px; }
    .mskb-commerce-flow.woocommerce-order-pay #order_review thead th { font-size: 13px; }
    .mskb-commerce-flow.woocommerce-order-pay #order_review .product-name { width: 44%; }
    .mskb-commerce-flow.woocommerce-order-pay #order_review .product-quantity { width: 20%; }
    .mskb-commerce-flow.woocommerce-order-pay #order_review .product-total { width: 36%; }
}
