body:has(.wpa-checkout) { max-width: 100%; overflow-x: hidden; background: #f7f8fa; }
.wpa-checkout { width: 100%; max-width: 1120px; box-sizing: border-box; overflow: clip; }
.checkout-head { min-height: 64px; padding: 0 2px; border-bottom-color: #e4e7ec; }
.checkout-head img { width: 184px; }
.checkout-head span { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; color: #344054; white-space: nowrap; }
.checkout-head svg,.checkout-summary button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.checkout-intro { margin: 30px auto 8px; text-align: center; }
.checkout-intro h1 { margin: 0; color: #101828; font-size: clamp(26px,3vw,34px); letter-spacing: -.025em; }
.checkout-intro p { max-width: 100%; margin: 8px 0 0; color: #667085; font-size: 14px; white-space: normal; overflow-wrap: anywhere; }
.checkout-progress { margin: 24px auto 8px; }
.checkout-progress ol { width: min(620px,100%); margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4,1fr); list-style: none; }
.checkout-progress li { position: relative; display: grid; justify-items: center; gap: 7px; color: #667085; font-size: 12px; font-weight: 700; }
.checkout-progress li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; top: 13px; left: calc(50% + 18px); width: calc(100% - 36px); height: 2px; background: #d0d5dd; }
.checkout-progress b { position: relative; z-index: 1; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #d0d5dd; border-radius: 50%; background: #fff; }
.checkout-progress .active { color: #175cd3; }
.checkout-progress .active b { color: #fff; border-color: #175cd3; background: #175cd3; box-shadow: 0 0 0 4px #eff8ff; }
.checkout-progress .complete b { color: #fff; border-color: #039855; background: #039855; }
.checkout-progress .complete:not(:last-child)::after { background: #039855; }
.checkout-grid { margin-top: 28px; gap: 28px; }
.checkout-grid > section { gap: 18px; }
.checkout-card,.checkout-summary { border-color: #e4e7ec; border-radius: 12px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.checkout-section-title { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.checkout-section-title > span { flex: 0 0 30px; height: 30px; display: grid; place-items: center; color: #175cd3; border-radius: 50%; background: #eff8ff; font-size: 12px; font-weight: 800; }
.checkout-section-title h1,.checkout-section-title h2 { margin: 2px 0 3px; color: #101828; }
.checkout-section-title p { margin: 0; color: #667085; font-size: 12px; }
.checkout-fields label { color: #344054; font-size: 12px; }
.checkout-fields label > small { color: #667085; font-size: 10px; font-weight: 400; }
.checkout-fields input,.checkout-fields select { width: 100%; min-height: 46px; box-sizing: border-box; padding: 11px; border: 1px solid #d0d5dd; border-radius: 6px; color: #101828; background: #fff; font: inherit; font-size: 16px; }
.checkout-fields input::placeholder { color: #98a2b3; }
.checkout-fields input:focus,.checkout-fields select:focus { outline: 3px solid #d1e9ff; outline-offset: 0; border-color: #2e90fa; }
.checkout-fields input:user-invalid { border-color: #f04438; box-shadow: 0 0 0 3px #fee4e2; }
.checkout-phone { min-width: 0; margin: 0; padding: 0; border: 0; }
.checkout-phone legend { margin: 0 0 5px; color: #344054; font-size: 12px; font-weight: 700; }
.checkout-phone legend span { color: #667085; font-weight: 400; }
.checkout-phone-row { display: grid; grid-template-columns: minmax(170px,.8fr) minmax(0,1.2fr); gap: 10px; }
.checkout-phone > small { display: block; margin-top: 5px; color: #667085; font-size: 10px; }
.checkout-optional { margin-top: -2px; }
.checkout-optional summary { width: fit-content; color: #175cd3; font-size: 12px; font-weight: 700; cursor: pointer; }
.checkout-optional summary span { color: #667085; font-weight: 400; }
.checkout-optional label { margin-top: 12px; }
.shipping-option { min-height: 66px; box-sizing: border-box; cursor: pointer; }
.shipping-option:has(input:checked) { border-color: #2e90fa; background: #f5faff; box-shadow: 0 0 0 1px #2e90fa; }
.payment-placeholder { display: grid; gap: 4px; }
.payment-placeholder strong { color: #344054; }
.checkout-summary { top: 24px; }
.checkout-summary-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.checkout-summary-head h2 { margin: 0; }
.checkout-summary-head span { color: #667085; font-size: 11px; }
.checkout-grand-total { margin-top: 8px; padding-top: 12px!important; border-top: 1px solid #d0d5dd; font-size: 16px!important; font-weight: 800; }
.checkout-summary button { min-height: 52px; display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 14px; }
.checkout-summary button:not(:disabled) { cursor: pointer; box-shadow: 0 2px 4px rgba(16,24,40,.15); }
.checkout-summary button:not(:disabled):hover { background: #1849a9; }
.checkout-summary button:focus-visible { outline: 3px solid #84adff; outline-offset: 2px; }
.checkout-assurances { display: grid; gap: 7px; margin: 15px 0; color: #475467; font-size: 11px; }
.checkout-summary > p a { color: inherit; }
.checkout-errors { margin: 22px auto 0; max-width: 760px; }
.checkout-errors strong { color: #b42318; }
.checkout-errors ul { margin: 8px 0 0; padding-left: 20px; color: #912018; font-size: 12px; }
@media (max-width: 900px) {
  .wpa-checkout,.checkout-head,.checkout-intro,.checkout-progress,.checkout-progress ol,.checkout-grid,.checkout-grid > section,.checkout-card,.checkout-summary { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
  .checkout-progress ol { width: 100%!important; }
  .wpa-checkout { padding: 12px 12px 44px; }
  .checkout-head { min-height: 54px; padding-bottom: 0; }
  .checkout-head img { width: 156px; }
  .checkout-intro { margin-top: 24px; }
  .checkout-intro h1 { font-size: 27px; }
  .checkout-progress { margin-top: 20px; }
  .checkout-progress li { font-size: 11px; }
  .checkout-progress li:not(:last-child)::after { left: calc(50% + 16px); width: calc(100% - 32px); }
  .checkout-grid { margin-top: 22px; }
  .checkout-card,.checkout-summary { padding: 18px; }
  .checkout-summary { position: static; }
}
@media (max-width: 430px) {
  .checkout-head { gap: 10px; }
  .checkout-head span { font-size: 11px; }
  .checkout-progress li span { font-size: 10px; }
  .checkout-progress b { width: 26px; height: 26px; }
  .checkout-progress li:not(:last-child)::after { top: 12px; }
  .checkout-fields { gap: 15px; }
  .checkout-phone-row { grid-template-columns: minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .checkout-progress * { transition: none!important; }
}
