.checkout-page {
    margin: 0 auto;
    padding-bottom: 56px;
}

.checkout-progress a {
    color: #64748b;
    text-decoration: none;
}

.checkout-heading {
    align-items: flex-end;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.checkout-heading h1 {
    color: inherit;
    font-size: 32px;
    line-height: 1.1;
    margin: 0;
}

.checkout-heading__prefix {
    color: #64748b;
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.checkout-alert {
    align-items: center;
    background: #fff8e6;
    border: 1px solid #f4d27c;
    color: #5d4300;
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
    padding: 12px 14px;
}

.checkout-alert strong {
    color: #3f2d00;
    white-space: nowrap;
}

.checkout-layout {
    align-items: start;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
}

.checkout-main {
    display: grid;
    gap: 16px;
}

.checkout-panel,
.checkout-summary {
    background: #fff;
    border: 1px solid #e2e8f0;
}

.checkout-panel {
    padding: 20px;
}

.checkout-panel--compact {
    padding-bottom: 12px;
}

.checkout-panel__heading {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.checkout-panel__heading > span {
    align-items: center;
    background: #003a5d;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-weight: 800;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.checkout-panel__heading h2 {
    color: inherit;
    font-size: 20px;
    margin: 0;
}

.checkout-address-grid {
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr);
}

.checkout-address {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.checkout-panel--addresses { padding: 30px; }

.checkout-address h3,
.checkout-payment h3 {
    color: inherit;
    font-size: 16px;
    margin: 0;
}

.checkout-address h3 { font-size: 18px; }

.checkout-address p,
.checkout-payment p,
.checkout-muted {
    color: #64748b;
    margin: 0;
}

.checkout-address address {
    color: #334155;
    display: grid;
    font-style: normal;
    gap: 2px;
    margin: 0;
}

.checkout-address button {
    justify-self: start;
}

.checkout-address__selector {
    display: grid;
    gap: 8px;
}

.checkout-address__selector label {
    color: #475569;
    font-size: 13px;
    font-weight: 800;
}

.checkout-address__selector select {
    border: 1px solid #cbd5e1;
    color: inherit;
    min-height: 42px;
    padding: 8px 10px;
    width: 100%;
}

.checkout-address-editor {
    border-top: 1px solid #e2e8f0;
    padding-top: 4px;
}

.checkout-address-editor summary {
    color: #003a5d;
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
    padding: 8px 0;
}

.checkout-address-form {
    display: grid;
    gap: 10px;
}

.checkout-address-form__grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.checkout-address-form label {
    display: grid;
    gap: 5px;
}

.checkout-address-form label span {
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}

.checkout-address-form input {
    border: 1px solid #cbd5e1;
    color: inherit;
    min-height: 38px;
    min-width: 0;
    padding: 7px 9px;
    width: 100%;
}

.checkout-address-form__wide {
    grid-column: 1 / -1;
}

.checkout-address-delete {
    margin-top: 8px;
}

.checkout-option-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.checkout-option {
    align-items: center;
    border: 1px solid #e2e8f0;
    display: grid;
    gap: 14px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 14px;
}

.checkout-option strong {
    color: inherit;
    display: block;
}

.checkout-option em {
    color: #64748b;
    display: block;
    font-style: normal;
    margin-top: 2px;
}

.checkout-option b {
    color: inherit;
}

.checkout-shipping__submit {
    justify-self: start;
}

.checkout-details-form,
.checkout-details-form__grid {
    display: grid;
    gap: 12px;
}

.checkout-details-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.checkout-details-form label {
    color: #475569;
    display: grid;
    font-size: 13px;
    font-weight: 800;
    gap: 6px;
}

.checkout-details-form input,
.checkout-details-form select,
.checkout-details-form textarea {
    border: 1px solid #cbd5e1;
    color: inherit;
    min-height: 40px;
    min-width: 0;
    padding: 8px 10px;
    width: 100%;
}

.checkout-details-form textarea {
    min-height: 86px;
    resize: vertical;
}

.checkout-details-form__wide {
    grid-column: 1 / -1;
}

.checkout-details-form__check {
    align-items: center;
    display: flex !important;
    gap: 8px !important;
}

.checkout-details-form__check input {
    accent-color: #00606b;
    min-height: auto;
    width: auto;
}

.checkout-payment-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr);
}

.checkout-payment {
    align-items: center;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: row;
    gap: 10px;
    justify-content: space-between;
    min-height: 64px;
    padding: 14px;
}

.checkout-payment > input {
    accent-color: #00606b;
}

.checkout-payment > div { flex: 1; min-width: 0; }
.checkout-payment-grid > button { justify-self: start; }
.checkout-panel--confirmation .checkout-summary__place-order { width: auto; justify-self: end; min-width: 220px; }
.checkout-shipping-selector { display: grid; gap: 8px; }
.checkout-shipping-selector select { width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid #ccc; background: #fff; color: inherit; }
.checkout-shipping-information { margin: 8px 0; }
.checkout-shipping-information dl { margin-top: 12px; }
.checkout-shipping-information dd { margin-bottom: 12px; }

.checkout-payment:has(input:checked) {
    background: #f0fbfc;
    border-color: #00aebe;
    box-shadow: 0 0 0 1px #00aebe inset;
}

.checkout-payment span,
.checkout-status {
    align-self: flex-start;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
    padding: 3px 8px;
    text-transform: uppercase;
}

.checkout-option.is-disabled,
.checkout-payment.is-disabled {
    background: #f8fafc;
}

.checkout-place-order {
    display: grid;
    gap: 12px;
}

.checkout-place-order label {
    align-items: flex-start;
    color: #475569;
    display: flex;
    font-size: 13px;
    gap: 8px;
}

.checkout-place-order input {
    accent-color: #00606b;
    margin-top: 2px;
}

.checkout-capabilities {
    display: grid;
}

.checkout-capabilities article {
    align-items: start;
    border-top: 1px solid #e2e8f0;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 12px 0;
}

.checkout-capabilities strong {
    color: inherit;
}

.checkout-capabilities p {
    color: #64748b;
    margin: 4px 0 0;
}

.checkout-status--ready {
    background: #edf7ee;
    border-color: #aed7b3;
    color: #22642d;
}

.checkout-status--requiresport {
    background: #fff8e6;
    border-color: #f4d27c;
    color: #755200;
}

.checkout-status--blocked {
    background: #fdeeee;
    border-color: #efb4b4;
    color: #8a1f1f;
}

.checkout-summary {
    padding: 20px;
    position: sticky;
    top: 16px;
}

.checkout-summary h2 {
    color: inherit;
    font-size: 20px;
    margin: 0 0 16px;
    text-align: center;
}

.checkout-summary__lines {
    border-bottom: 1px solid #e2e8f0;
    display: grid;
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
}

.checkout-summary__lines li {
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #e2e8f0;
}

.checkout-summary__lines li:last-child { border-bottom: 0; }
.checkout-summary__product { min-width: 0; overflow-wrap: anywhere; }
.checkout-summary__product a { display: block; font-weight: 600; }
.checkout-summary__product > span { display: block; margin-top: 3px; }
.checkout-summary__quantity { white-space: nowrap; }
.checkout-summary__prices { text-align: right; white-space: nowrap; }
.checkout-summary__prices > span,
.checkout-summary__prices small { display: block; }
.checkout-summary__prices > span + span { margin-top: 4px; }
.checkout-summary__edit { display: block; margin-bottom: 16px; text-align: right; }

.checkout-summary__lines span {
    color: #334155;
    min-width: 0;
}

.checkout-summary__lines strong {
    color: inherit;
}

.checkout-summary dl {
    display: grid;
    gap: 10px;
    margin: 0 0 20px;
}

.checkout-summary dl div {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.checkout-summary dt {
    color: #64748b;
    font-weight: 600;
}

.checkout-summary dd {
    color: inherit;
    font-weight: 800;
    margin: 0;
}

.checkout-summary__total {
    border-top: 1px solid #e2e8f0;
    padding-top: 12px;
}

.checkout-summary__place-order {
    width: 100%;
}

@media (max-width: 1100px) {
    .checkout-layout {
        grid-template-columns: 1fr;
    }

    .checkout-summary {
        position: static;
    }
}

@media (max-width: 820px) {
    .checkout-heading,
    .checkout-alert {
        align-items: flex-start;
        flex-direction: column;
    }

    .checkout-address-grid,
    .checkout-details-form__grid,
    .checkout-payment-grid {
        grid-template-columns: 1fr;
    }

    .checkout-capabilities article {
        grid-template-columns: 1fr;
    }
}

.checkout-saved-addresses {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 320px;
    overflow-y: auto;
}

.checkout-saved-address {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    border-radius: 3px;
}

.checkout-saved-address > div { min-width: 0; }
.checkout-saved-address address { margin: 0; overflow-wrap: anywhere; }
.checkout-saved-address.is-selected { background: var(--checkout-selected-address-background, #e6f2e6); }
.checkout-saved-address.is-selected .btn:disabled { opacity: 1; }
.checkout-saved-address__validation {
    color: #a12622;
    font-size: 13px;
    margin: 6px 0 0;
}
.checkout-saved-address form { flex: 0 0 auto; }