/* A guest-checkout study. Information stays in memory; there is no payment UI. */
.dialog--checkout { width: min(1120px,calc(100vw - 48px)); }
.dialog--checkout .dialog-header h2 { font-size: 30px; }
.checkout-workspace { padding: 30px 36px 36px; }
.checkout-heading > .eyebrow { color: var(--purchase-ink); font-size: 10px; letter-spacing: .1em; margin-bottom: 22px; }
.checkout-progress { padding-bottom: 24px; border-bottom: 1px solid var(--purchase-rule); margin-bottom: 28px; }
.checkout-progress ol { display: flex; gap: 32px; }
.checkout-progress button { min-height: 44px; display: flex; align-items: center; gap: 10px; color: #67705e; font-size: 12px; white-space: normal; text-align: start; }
.checkout-progress button > span { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--purchase-rule); border-radius: 50%; font-size: 10px; flex-shrink: 0; }
.checkout-progress button[aria-current=step] { color: var(--purchase-ink); }
.checkout-progress button[aria-current=step] > span { background: var(--purchase-ink); border-color: var(--purchase-ink); color: #fffef6; }
.checkout-progress button:disabled { opacity: 1; color: #7c8275; cursor: default; }
.checkout-layout { display: grid; grid-template-columns: minmax(0,1.18fr) minmax(0,.82fr); align-items: start; gap: 36px; }
.checkout-main { min-width: 0; }
.checkout-step-heading h2 { font-size: 43px; line-height: 1.05; letter-spacing: -.025em; margin-bottom: 15px; }
.checkout-step-heading h2:focus { outline: none; }
.checkout-step-heading > p { font-size: 13px; color: #626859; line-height: 1.85; max-width: 52ch; }
.checkout-privacy { font-size: 12px; line-height: 1.85; color: #626859; padding: 14px 0; margin-block: 12px 6px; border-bottom: 1px solid var(--purchase-rule); }
.checkout-sample { font-size: 12px; margin-bottom: 22px; gap: 12px; white-space: normal; }
.checkout-sample .icon { width: 16px; height: 16px; }
.checkout-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 16px; }
.checkout-field { min-width: 0; }
.checkout-field--name, .checkout-field--email, .checkout-field--address, .checkout-field--unit, .checkout-country { grid-column: 1 / -1; }
.checkout-field label { display: block; font-size: 12px; margin-bottom: 8px; color: #3f4939; line-height: 1.6; }
.checkout-field input, .checkout-field select { width: 100%; min-width: 0; min-height: 50px; padding: 11px 13px; border: 1px solid #c5cebb; border-radius: 3px; background: #fffefb; color: var(--color-ink); font: 400 15px/1.5 var(--font-body); }
.checkout-field input::placeholder { color: #767c6f; }
.checkout-field input:focus-visible, .checkout-field select:focus-visible { outline: 2px solid var(--purchase-ink); outline-offset: 2px; }
.checkout-field [aria-invalid=true] { border-color: #93452e; }
.checkout-field-error { color: #853c28; font-size: 12px; line-height: 1.8; margin-top: 7px; }
.checkout-country { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; min-height: 50px; padding: 12px 14px; background: var(--purchase-paper); border: 1px solid var(--purchase-rule); font-size: 12px; border-radius: 3px; }
.checkout-country > span { color: #626859; }
.checkout-errors { padding: 17px; margin-bottom: 24px; background: #fbf1e9; border-inline-start: 2px solid #93452e; }
.checkout-errors h3 { font: 500 14px/1.8 var(--font-body); color: #733623; margin-bottom: 8px; }
.checkout-errors ul { display: grid; gap: 4px; }
.checkout-errors button { min-height: 44px; font-size: 12px; line-height: 1.7; text-decoration: underline; text-underline-offset: 3px; text-align: start; white-space: normal; color: #733623; }
.checkout-primary { width: 100%; margin-top: 24px; min-height: 54px; white-space: normal; font-size: 13px; text-align: start; gap: 18px; }
.checkout-back { font-size: 12px; margin-top: 12px; white-space: normal; }
.checkout-selection { position: sticky; top: 100px; background: var(--purchase-paper); border: 1px solid var(--purchase-rule); padding: 21px; border-radius: 4px; min-width: 0; }
.checkout-selection > summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; list-style: none; cursor: pointer; min-height: 44px; font: 400 25px/1.2 var(--font-display); }
.checkout-selection > summary::-webkit-details-marker { display: none; }
.checkout-selection > summary small { display: block; font: 400 10px/1.8 var(--font-body); color: #626859; margin-top: 8px; }
.checkout-selection > summary > bdi { font: 400 17px/1.6 var(--font-body); color: var(--purchase-ink); white-space: nowrap; }
.checkout-selection > summary > .icon { width: 16px; height: 16px; }
.checkout-selection[open] > summary > .icon { rotate: 180deg; }
.checkout-selected-items { margin-top: 22px; }
.checkout-selected-items > article { display: grid; grid-template-columns: 54px minmax(0,1fr) auto; align-items: start; gap: 12px; padding-block: 16px; border-top: 1px solid #d1d9c6; }
.checkout-item-image { height: 70px; overflow: hidden; background: #e8e5dc; }
.checkout-item-image img { width: 100%; height: 100%; object-fit: cover; }
.checkout-selected-items h3 { font: 400 19px/1.2 var(--font-display); margin-bottom: 8px; }
.checkout-selected-items article > bdi { color: var(--purchase-ink); font-size: 12px; line-height: 1.8; white-space: nowrap; }
.checkout-selected-items p { font-size: 11px; color: #626859; line-height: 1.8; }
.checkout-totals { margin: 16px 0 0; padding-top: 18px; border-top: 1px solid #cbd4c0; font-size: 12px; }
.checkout-totals > div { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.checkout-totals dd { margin: 0; text-align: end; color: #626859; }
.checkout-totals > div:first-child { font-size: 14px; color: var(--purchase-ink); }
.checkout-totals > div:first-child dd { color: inherit; }
.checkout-total-note { font-size: 11px; line-height: 1.9; color: #626859; margin-top: 18px; }
.checkout-edit-bag { margin-top: 12px; font-size: 12px; white-space: normal; }
.checkout-review-details { margin-top: 22px; }
.checkout-review-details section { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--purchase-rule); }
.checkout-review-details header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 10px; }
.checkout-review-details h3, .checkout-pending-panel h3, .checkout-payment-preview h3 { font: 500 14px/1.7 var(--font-body); color: var(--purchase-ink); }
.checkout-review-details header button { min-height: 44px; text-decoration: underline; text-underline-offset: 4px; font-size: 12px; }
.checkout-review-details p, .checkout-review-details address { font: 400 13px/1.9 var(--font-body); overflow-wrap: anywhere; }
.checkout-pending-panel { padding: 17px; background: var(--purchase-paper); border: 1px solid var(--purchase-rule); border-radius: 3px; margin-block: 18px; }
.checkout-pending-panel p, .checkout-payment-preview p { font-size: 12px; line-height: 1.85; color: #626859; margin-top: 9px; }
.checkout-payment-preview ul { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.checkout-payment-preview li { font-size: 10px; min-height: 32px; display: grid; place-items: center; padding: 7px 10px; border: 1px solid var(--purchase-rule); border-radius: 3px; color: #626859; }
.checkout-finished { padding: 48px 36px 56px; text-align: center; max-width: 660px; margin-inline: auto; }
.checkout-finished > .eyebrow { color: var(--purchase-ink); font-size: 11px; }
.checkout-finish-mark { display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: var(--purchase-paper); color: var(--purchase-ink); margin: 25px auto; }
.checkout-finish-mark .icon { width: 32px; height: 32px; }
.checkout-finished h2 { font-size: 49px; line-height: 1.05; margin-bottom: 20px; }
.checkout-finished h2:focus { outline: none; }
.checkout-finished > p:not(.eyebrow) { max-width: 45ch; font-size: 14px; line-height: 1.9; color: #626859; margin-inline: auto; }
.checkout-finished > .button { display: flex; width: 100%; margin-top: 30px; white-space: normal; text-align: start; }
.checkout-finished > .text-link { margin-top: 12px; font-size: 12px; }
[dir=rtl] .checkout-step-heading h2, [dir=rtl] .checkout-finished h2 { font-family: var(--font-body); font-size: 32px; line-height: 1.5; }
[dir=rtl] .checkout-selection > summary { font-family: var(--font-body); font-size: 18px; line-height: 1.6; }
[dir=rtl] .checkout-selected-items h3 { font-family: var(--font-body); font-size: 14px; line-height: 1.7; }
.checkout-scenarios { margin-top: 28px; border-top: 1px solid var(--purchase-rule); padding-top: 12px; }
.checkout-scenarios > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; list-style: none; cursor: pointer; font-size: 12px; color: var(--purchase-ink); }
.checkout-scenarios > summary::-webkit-details-marker { display: none; }
.checkout-scenarios > summary .icon { width: 16px; height: 16px; flex-shrink: 0; }
.checkout-scenarios[open] > summary .icon { rotate: 45deg; }
.checkout-scenarios > p, .checkout-issue-note { font-size: 12px; line-height: 1.85; color: #626859; }
.checkout-scenarios > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 14px; }
.checkout-scenarios button { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 12px; border: 1px solid var(--purchase-rule); text-align: start; font-size: 12px; line-height: 1.6; color: var(--purchase-ink); }
.checkout-scenarios button .icon { width: 15px; height: 15px; flex-shrink: 0; }
.checkout-scenarios button:hover { background: var(--purchase-paper); }
.checkout-scenario-tag { display: inline-block; padding: 7px 10px; margin-bottom: 20px; background: #f6eadf; color: #78442e; font-size: 10px; letter-spacing: .08em; line-height: 1.7; text-transform: uppercase; border-inline-start: 2px solid #9a6248; }
.checkout-affected { padding-block: 24px; margin-block: 22px; border-block: 1px solid var(--purchase-rule); }
.checkout-affected > .eyebrow { font-size: 10px; color: #626859; margin-bottom: 16px; }
.checkout-affected-item { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 20px; align-items: center; }
.checkout-affected-item > div:first-child { height: 100px; overflow: hidden; background: var(--purchase-paper); }
.checkout-affected-item img { width: 100%; height: 100%; object-fit: cover; }
.checkout-affected-item h3 { font: 400 29px/1.15 var(--font-display); margin-bottom: 9px; }
.checkout-affected-item p { font-size: 12px; color: #626859; line-height: 1.8; }
.checkout-unavailable { display: block; margin-top: 9px; font-size: 12px; color: #853c28; line-height: 1.7; }
.checkout-price-change { margin-top: 24px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border: 1px solid var(--purchase-rule); }
.checkout-price-change > div { padding: 15px; min-width: 0; }
.checkout-price-change > div + div { border-inline-start: 1px solid var(--purchase-rule); background: var(--purchase-paper); }
.checkout-price-change dt { font-size: 11px; color: #626859; line-height: 1.7; margin-bottom: 8px; }
.checkout-price-change dd { margin: 0; font-size: 19px; line-height: 1.5; color: var(--purchase-ink); }
.checkout-price-change + p { margin-top: 16px; }
.checkout-issue > .checkout-issue-note { margin-top: 20px; }
.checkout-issue > .text-link { display: flex; width: 100%; justify-content: flex-start; overflow-wrap: anywhere; }
.checkout-issue .icon { flex-shrink: 0; }
.checkout-recovered { padding: 14px 16px; margin-top: 18px; border-inline-start: 2px solid var(--purchase-ink); background: var(--purchase-paper); font-size: 12px; line-height: 1.85; color: var(--purchase-ink); }
.checkout-confirmation .checkout-layout { gap: 44px; }
.checkout-confirmation-mark { display: grid; place-items: center; width: 64px; height: 64px; background: var(--purchase-paper); color: var(--purchase-ink); border-radius: 50%; margin-bottom: 24px; }
.checkout-confirmation-mark .icon { width: 28px; height: 28px; }
.checkout-reference { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-block: 20px; border-block: 1px solid var(--purchase-rule); font-size: 12px; margin-block: 24px; }
.checkout-reference bdi { color: var(--purchase-ink); letter-spacing: .05em; }
.checkout-next h3 { font: 500 14px/1.7 var(--font-body); margin-bottom: 18px; }
.checkout-next ol { display: grid; gap: 20px; margin-bottom: 24px; }
.checkout-next li { display: flex; gap: 16px; }
.checkout-next li > span { font-size: 10px; color: #626859; padding-top: 5px; }
.checkout-next h4 { font: 500 13px/1.8 var(--font-body); margin-bottom: 5px; }
.checkout-next p { font-size: 12px; line-height: 1.85; color: #626859; }
[dir=rtl] .checkout-affected-item h3 { font: 400 18px/1.7 var(--font-body); }
@media (max-width:900px) {
  .checkout-layout { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .checkout-selection { grid-row: 1; position: static; }
  .checkout-selected-items > article { grid-template-columns: 54px minmax(0,1fr) auto; }
  .checkout-confirmation .checkout-layout { gap: 28px; }
}
@media (max-width:760px) {
  .dialog--checkout { width: calc(100vw - 20px); max-height: calc(100svh - 20px); }
  .dialog--checkout .dialog-header { padding: 12px 20px; gap: 15px; }
  .dialog--checkout .dialog-header h2 { font-size: 27px; }
  .checkout-workspace { padding: 22px 20px 28px; }
  .checkout-heading > .eyebrow { margin-bottom: 12px; }
  .checkout-progress { margin-bottom: 18px; padding-bottom: 12px; }
  .checkout-layout { gap: 22px; }
  .checkout-progress ol { gap: 12px; justify-content: space-between; }
  .checkout-progress button { gap: 7px; font-size: 11px; }
  .checkout-progress button > span { width: 25px; height: 25px; font-size: 10px; }
  .checkout-selection { padding: 16px; }
  .checkout-selection > summary { font-size: 23px; gap: 12px; }
  .checkout-selection > summary > bdi { font-size: 14px; }
  .checkout-selected-items article > bdi { font-size: 11px; }
  .checkout-step-heading h2 { font-size: 38px; }
  .checkout-privacy { line-height: 1.7; padding-block: 12px; margin-top: 8px; }
  .checkout-field input, .checkout-field select { font-size: 16px; }
  .checkout-fields { grid-template-columns: minmax(0,1fr); }
  .checkout-selection > summary small { max-width: 23ch; }
  .checkout-finished { padding: 32px 20px; }
  .checkout-finished h2 { font-size: 40px; }
  .checkout-scenarios > div { grid-template-columns: minmax(0,1fr); }
  .checkout-affected-item { grid-template-columns: 64px minmax(0,1fr); gap: 15px; }
  .checkout-affected-item > div:first-child { height: 86px; }
  .checkout-affected-item h3 { font-size: 25px; }
  .checkout-price-change > div { padding: 12px; }
  .checkout-price-change dd { font-size: 16px; }
}
@media (max-width:375px) {
  .checkout-progress ol { gap: 9px; }
  .checkout-progress button { flex-direction: column; align-items: flex-start; gap: 7px; }
  .checkout-selected-items > article { grid-template-columns: 46px minmax(0,1fr); }
  .checkout-selected-items article > bdi { grid-column: 2; }
  .checkout-item-image { height: 60px; }
}
