/* Checkout layout and surfaces share the storefront theme tokens. */
.page.cart-page, .page.checkout-receiving, .page.payment-page {
    width: 100%;
    margin-inline: auto;
    padding: 40px clamp(16px, 4vw, 48px) 56px;
}
.page.cart-page { max-width: 1400px; }
.page.checkout-receiving { max-width: 900px; gap: 12px; }
.checkout-receiving > .kicker { margin: 0; }
.checkout-receiving .checkout-hint { order: 2; margin: 0; color: var(--theme-muted); }
.checkout-receiving .checkout-test-note { order: 2; margin: 0; }
.page.payment-page { max-width: 1280px; }
.page.cart-page > h1, .page.checkout-receiving > h1, .page.payment-page > h1 {
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.08;
    margin: 8px 0 28px;
    overflow-wrap: anywhere;
}
.cart-page .cart-layout { grid-template-columns: minmax(0, 1fr) minmax(320px, 380px); gap: 32px; align-items: start; }
.cart-page .cart-row { grid-template-columns: 110px minmax(0, 1fr) auto; gap: 20px; padding: 20px 0; }
.cart-page .cart-row img { width: 110px; height: 140px; border-radius: 6px; background: var(--theme-soft); }
.cart-page .cart-row h2 { font-size: 1.05rem; line-height: 1.4; overflow-wrap: anywhere; }
.cart-page .cart-row p { margin: 8px 0 12px; }
.cart-page .cart-row div > form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cart-page .cart-row button { min-height: 44px; height: auto; padding: 8px 12px; border-radius: 5px; }
.cart-page .cart-row small { display: block; margin-top: 8px; color: var(--theme-muted); }
.cart-page .summary { padding: 24px; border-radius: 10px; }
.cart-page .summary h2 { margin: 0 0 16px; }
.cart-page .summary p { gap: 12px; font-size: .95rem; }
.cart-page .summary p b { text-align: right; }
.cart-page .summary .total { font-size: 1.1rem; }
.cart-page .summary .btn { min-height: 52px; white-space: normal; text-align: center; letter-spacing: .04em; }
.cart-page .cart-promotions { background: transparent; border-color: var(--theme-border); }
.cart-page .cart-promotion { border-color: var(--theme-border); }
.cart-page .cart-promotion summary { letter-spacing: .02em; }
.cart-page .coupon-applied { flex-wrap: wrap; }
.cart-page .summary .coupon-error { color: var(--theme-danger); }
.cart-page .notice, .checkout-receiving .notice, .payment-page .payment-banner {
    padding: 14px 16px;
    margin: 0 0 16px;
    border: 1px solid var(--theme-border);
    border-radius: 8px;
    background: var(--theme-note);
    color: var(--theme-ink);
    font-size: .875rem;
    line-height: 1.6;
}
.checkout-receiving .receiving-choice { gap: 20px; }
.checkout-receiving .receiving-card { padding: 24px; border-radius: 10px; background: var(--theme-surface); border-color: var(--theme-border); }
.checkout-receiving .receiving-card h2 { font-size: 1.15rem; line-height: 1.4; margin: 0; }
.checkout-receiving .receiving-card > .btn { margin-top: 4px; min-height: 52px; letter-spacing: .04em; }
.checkout-receiving .receiving-card > small { margin: 0; }
.checkout-receiving .receiving-choice__header { padding: 0; border: 0; background: transparent; }
.checkout-receiving .receiving-choice__header h2 { margin: 8px 0; }
.checkout-receiving .receiving-tag { display: inline-block; border-radius: 4px; }
.checkout-receiving .receiving-method { min-height: 88px; border-radius: 8px; background: var(--theme-surface); border-color: var(--theme-border); }
.checkout-receiving .receiving-method:hover, .checkout-receiving .receiving-method.is-selected { background: var(--theme-note); border-color: var(--blue); }
.checkout-receiving .receiving-method__copy { min-width: 0; }
.checkout-receiving .receiving-method__copy strong { font-size: 1rem; line-height: 1.4; }
.checkout-receiving .receiving-method__copy small { font-size: .875rem; color: var(--theme-muted); }
.checkout-receiving .receiving-card fieldset { margin: 0; padding: 16px; border-radius: 8px; border-color: var(--theme-border); }
.checkout-receiving .receiving-card fieldset legend { padding-inline: 6px; font-weight: 700; }
.checkout-receiving .receiving-card fieldset > label { border-color: var(--theme-border); font-size: .875rem; line-height: 1.7; }
.checkout-receiving .receiving-card .checkout-coupon { color: var(--theme-success); }
.checkout-receiving .receiving-card .checkout-total { color: var(--theme-ink); padding-top: 16px; }
.payment-page .payment-grid { gap: 24px; margin-top: 24px; }
.payment-page .payment-panel { padding: 24px; background: var(--theme-surface); color: var(--theme-ink); border-color: var(--theme-border); }
.payment-page .payment-panel h2 { line-height: 1.4; overflow-wrap: anywhere; }
.payment-page .payment-note { color: var(--theme-muted); }
.payment-page #payment-message { color: var(--theme-ink); }
.payment-page .payment-summary dl { margin: 20px 0; }
.payment-page .payment-summary dl > div { border-color: var(--theme-border); flex-wrap: wrap; gap: 8px 16px; }
.payment-page .payment-summary dd { margin-left: auto; }
.payment-page .payment-summary .payment-total { font-size: 1.2rem; }
.payment-page #pix-code { background: var(--theme-input); color: var(--theme-ink); border-color: var(--theme-border); }
.success-page .pickup-details { max-width: 620px; border-radius: 8px; background: var(--theme-note); border-color: var(--theme-border); color: var(--theme-ink); }
.success-page .pickup-details p { color: var(--theme-muted); }
@media (max-width: 900px) {
    .cart-page .cart-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}
@media (max-width: 600px) {
    .page.cart-page, .page.checkout-receiving, .page.payment-page { padding: 28px 16px 40px; }
    .cart-page .cart-row { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; }
    .cart-page .cart-row img { width: 76px; height: 108px; }
    .cart-page .cart-row > strong, .cart-page .cart-row > form { grid-column: 2; }
    .cart-page .cart-row > form { position: static; }
    .cart-page .summary, .checkout-receiving .receiving-card, .payment-page .payment-panel { padding: 20px; }
    .checkout-receiving .receiving-method { padding: 16px 12px; gap: 10px; }
    .checkout-receiving .receiving-method__number { flex-basis: 28px; width: 28px; height: 28px; }
    .checkout-receiving .fields { gap: 16px; }
    .checkout-receiving .receiving-card label { letter-spacing: .035em; }
    .payment-page .payment-summary { grid-row: auto; }
}
@media (max-width: 400px) {
    /* Preserve room for the secure payment form on narrow phones. */
    .page.payment-page { padding-inline: 8px; }
    .payment-page .payment-grid { grid-template-columns: minmax(0, 1fr); }
    .payment-page .payment-panel { padding: 8px; }
    .payment-page #mj-payment { margin-inline: -8px; padding: 0; }
    .payment-page #mj-payment > h2,
    .payment-page #mj-payment > p { margin-inline: 8px; }
}