.checkout-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr); gap:30px; align-items:start; }
.checkout-main { min-width:0; }
.checkout-steps { display:flex; align-items:center; gap:18px; padding:0; list-style:none; margin:0 0 18px; font-size:13px; color:var(--muted); }
.checkout-steps li { padding:8px 0; }
.checkout-steps [aria-current] { color:var(--primary); font-weight:700; border-bottom:2px solid var(--primary); }
.checkout-form { padding:30px; }
.checkout-form-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.checkout-form-heading>span { font-size:12px; color:var(--muted); }
.checkout-hint { font-size:12px; color:var(--muted); margin-block:8px 20px; }
.checkout-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field-wide { grid-column:1/-1; }
.delivery-options { margin:25px 0; padding:0; border:0; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.delivery-options legend { padding:0; margin-bottom:12px; font-size:14px; font-weight:600; }
.delivery-options label { display:flex; align-items:flex-start; gap:9px; padding:14px; border:1px solid var(--line); border-radius:11px; cursor:pointer; background:#fff7; }
.delivery-options label:has(:checked) { border-color:#468d63; background:#e8f4ed; }
.delivery-options input { accent-color:var(--primary); margin:7px 0 0; width:17px; height:17px; }
.delivery-options strong { font-size:13px; }
.delivery-options small { display:block; font-size:11px; color:var(--muted); }
.save-address { display:flex; align-items:center; gap:8px; font-size:12px; align-self:center; }
.save-address input { width:18px; height:18px; accent-color:var(--primary); }
.order-note { margin-top:22px; }
.order-note small { color:var(--muted); font-weight:400; }
.checkout-form-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:24px; }
.checkout-summary { position:sticky; top:110px; padding:25px; }
.checkout-summary h2 { margin-bottom:12px; font-size:21px; }
.checkout-item { display:flex; align-items:center; gap:14px; padding-block:18px; border-bottom:1px solid var(--line); }
.checkout-item>a { width:68px; flex:none; }
.checkout-item img { border-radius:10px; }
.checkout-item h3 { font-size:14px; }
.checkout-item p { font-size:12px; color:var(--muted); margin-block:4px; }
.checkout-quantity { display:flex; align-items:center; gap:5px; font-size:12px; }
.checkout-quantity button { width:36px; min-height:40px; border-radius:6px; border:1px solid var(--line); font-size:18px; background:#fff6; }
.checkout-quantity [data-remove-item] { width:auto; border:0; font-size:11px; text-decoration:underline; margin-inline-start:8px; }
.checkout-quantity span { min-width:22px; text-align:center; }
.checkout-totals { margin:19px 0 0; font-size:13px; }
.checkout-totals>div { display:flex; justify-content:space-between; gap:18px; padding:8px 0; }
.checkout-totals dd { margin:0; white-space:nowrap; }
.checkout-totals>div:last-child { border-top:1px solid var(--line); padding-top:16px; margin-top:8px; font-size:16px; font-weight:650; }
#checkout-review>h2 { margin-bottom:25px; }
#review-customer { padding:18px; border:1px solid var(--line); border-radius:12px; font-size:14px; line-height:2; background:#fff7; }
#review-customer p[dir=ltr] { text-align:right; }
#review-customer h3 { font-size:17px; }
.review-price { display:flex; justify-content:space-between; gap:15px; margin-block:25px; font-size:18px; }
.payment-demo-options { margin-top:24px; font-size:12px; color:var(--muted); }
.payment-demo-options summary { min-height:44px; cursor:pointer; }
.payment-demo-options p { margin-bottom:12px; }
#checkout-error { margin-top:14px; }
#checkout-failure { text-align:center; padding-block:20px; }
#checkout-failure p { margin:15px 0 24px; color:var(--muted); }
.payment-result-icon { width:62px; height:62px; margin:0 auto 18px; display:grid; place-items:center; border:1px solid #98c4a9; border-radius:50%; background:linear-gradient(150deg,#fff9,#bfe0cb); box-shadow:0 0 0 8px #d7eddf70,inset 0 1px 0 white; color:#1c6a42; font-size:30px; }
.failure-icon { color:#a64731; background:#f7e4dc; border-color:#e2b6a7; }
.receipt-heading { text-align:center; margin:35px auto; max-width:600px; }
.receipt-heading h1 { margin-block:13px 8px; }
.receipt-heading p { color:var(--muted); margin-bottom:8px; }
.receipt-heading small { color:var(--muted); }
.receipt-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.75fr); gap:24px; }
.receipt-main,.receipt-aside { padding:30px; }
.receipt-main>h2 { font-size:20px; margin-top:24px; }
.receipt-meta { display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; border-bottom:1px solid var(--line); padding-bottom:22px; font-size:12px; }
.receipt-meta span { display:block; color:var(--muted); margin-bottom:5px; }
.receipt-meta strong { font-size:13px; }
.receipt-items>div { display:flex; align-items:center; gap:14px; padding-block:18px; font-size:13px; }
.receipt-items img { width:64px; height:64px; border-radius:10px; }
.receipt-items small { display:block; margin-top:5px; color:var(--muted); }
.receipt-items strong { font-size:13px; margin-inline-start:auto; white-space:nowrap; }
.receipt-aside h2 { font-size:21px; }
.order-progress { list-style:none; padding:0 5px 0 0; margin:24px 0; }
.order-progress li { position:relative; padding:0 25px 24px 0; border-right:1px solid #c8dcd0; color:#637c6c; font-size:13px; }
.order-progress li::before { content:''; position:absolute; right:-5px; top:7px; width:9px; height:9px; border:1px solid #95b5a2; border-radius:50%; background:#edf5f0; }
.order-progress li.done::before { background:var(--primary); border-color:var(--primary); }
.order-progress li.done { color:var(--primary); }
.order-progress li:last-child { padding-bottom:4px; border-color:transparent; }
.order-progress small { display:block; font-size:11px; font-weight:400; margin-top:4px; }
.receipt-aside h3 { font-size:16px; margin-top:25px; }
.receipt-aside p { font-size:13px; margin-top:8px; }
.receipt-address { color:var(--muted); }
.receipt-support { display:inline-block; margin-top:14px; font-size:12px; color:var(--primary); }
.receipt-actions { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:28px; }
@media(max-width:900px) { .checkout-layout { grid-template-columns:1fr; } .checkout-summary { position:static; } .checkout-form { padding:23px; } .receipt-layout { grid-template-columns:1fr; } }
@media(max-width:550px) { .checkout-fields { grid-template-columns:1fr; gap:14px; } .field-wide { grid-column:auto; } .delivery-options { grid-template-columns:1fr; gap:8px; } .checkout-form,.checkout-summary,.receipt-main,.receipt-aside { padding:20px; } .checkout-form-actions>* { width:100%; } .receipt-items>div { flex-wrap:wrap; } .receipt-items strong { width:100%; text-align:left; } .checkout-steps { gap:14px; font-size:12px; } .receipt-meta { flex-direction:column; } }
