/* Scoped checkout preview. No payment provider or data persistence. */
.checkout-dock[hidden], .checkout [hidden] { display: none !important; }
.checkout-dock {
  position: fixed;
  z-index: 55;
  inset: auto auto max(1.25rem, env(safe-area-inset-bottom)) 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: max-content;
  max-width: calc(100% - 2rem);
  min-height: 3.5rem;
  padding: .375rem .375rem .375rem 1.35rem;
  gap: 1.7rem;
  border: 1px solid #ffffff40;
  border-radius: 999px;
  background: #0066d6;
  color: #fff;
  box-shadow: 0 8px 36px #0066d638, 0 4px 16px #0004;
}
.checkout-dock-copy { display: grid; gap: .25rem; min-width: 0; padding-block: .15rem; }
.checkout-dock-product { font-family: "AiDeep", sans-serif; font-size: 1.2rem; }
.checkout-dock-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem; font-size: .875rem; line-height: 1.4; }
.checkout-dock-price > span, .checkout-dock-price s { white-space: nowrap; }
.checkout-dock-price strong { font-size: 1rem; font-weight: 600; }
.checkout-dock-price s { color: #e1edff; }
.checkout-dock button {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 1rem;
  min-height: 2.75rem;
  padding: .7rem 1.15rem;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: #0055b5;
  font-family: inherit;
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
}
.checkout-dock button:hover { background: #eaf3ff; }
.product-page:has(.checkout-dock) .site-footer { padding-bottom: calc(6rem + env(safe-area-inset-bottom)); }
.checkout-no-script { padding: 1.5rem; text-align: center; }
html.checkout-is-open { overflow: hidden; }
.checkout {
  width: min(62rem, calc(100% - 2rem));
  max-width: none;
  max-height: calc(100vh - 2rem);
  max-height: calc(100dvh - 2rem);
  padding: 0;
  border: 1px solid #ffffff70;
  border-radius: 1.75rem;
  color: #1d1d1f;
  color-scheme: light;
  background: #fff;
  box-shadow: 0 30px 110px #0005;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "PingFang SC", sans-serif;
  overscroll-behavior: contain;
}
.checkout::backdrop { background: #0009; backdrop-filter: blur(7px); }
.checkout[open] { animation: checkout-appear 180ms ease-out; }
.checkout-topbar {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 4.5rem;
  padding: .75rem 1.75rem;
  border-bottom: 1px solid #e8e8ed;
  background: #fff;
}
.checkout-topbar .xcoria-word { font-size: 1.15rem; }
.checkout-preview-badge { color: #6e6e73; font-size: .8125rem; }
.checkout-close {
  margin-left: auto;
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  border: 0;
  border-radius: 50%;
  background: #f0f0f3;
  color: #454549;
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
}
.checkout-layout { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); }
.checkout-summary {
  min-width: 0;
  padding: 1.75rem;
  background: #f5f5f7;
  border-right: 1px solid #e8e8ed;
}
.checkout-product-image {
  display: grid;
  place-items: center;
  height: 15rem;
  overflow: hidden;
  border-radius: 1rem;
  background: #343434;
}
.checkout-product-image img { width: 100%; height: 100%; object-fit: contain; }
.checkout-product-name { margin: 1.4rem 0 .4rem; font: 700 2rem / 1.15 "AiDeep", sans-serif; }
.checkout-product-version { margin: 0 0 1.75rem; color: #6e6e73; font-size: .9375rem; }
.checkout-version { min-width: 0; margin: 0 0 1.5rem; padding: 0; border: 0; }
.checkout-version legend { margin-bottom: .6rem; color: #6e6e73; font-size: .875rem; }
.checkout-version label { display: flex; align-items: center; gap: .65rem; padding: .8rem; border: 1px solid #c2c2c8; border-radius: .75rem; background: #fff; font-size: .9375rem; line-height: 1.6; cursor: pointer; }
.checkout-version label + label { margin-top: .6rem; }
.checkout-version label:has(input:checked) { border-color: #0066d6; background: #eff6ff; }
.checkout-version input { flex-shrink: 0; width: 1.1rem; height: 1.1rem; margin: 0; accent-color: #0066d6; }
.checkout-version span { min-width: 0; overflow-wrap: anywhere; }
.checkout-version strong { display: block; font-weight: 600; }
.checkout-version small { display: block; margin-top: .25rem; color: #616167; font-size: .875rem; }
.checkout-pay-box { margin-top: 1.5rem; padding: 1rem; border: 1px solid #dce8f7; border-radius: 1rem; background: #f7faff; text-align: center; }
.checkout-pay-amount { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: .5rem; margin: 0 0 1rem; font-size: .9375rem; }
.checkout-pay-amount strong { font-size: 1.8rem; color: #005bbf; }
.checkout-pay-amount span { color: #6e6e73; font-size: .875rem; }
.checkout-payment-qr { display: block; width: min(100%, 300px); height: auto; margin: 0 auto; border-radius: .75rem; }
.checkout-test-warning { margin: 0 0 1rem; padding: .8rem; border-radius: .65rem; background: #fff1ce; color: #704d00; font-size: .875rem; line-height: 1.6; }
.checkout-upload { display: grid; gap: 1rem; margin-top: 1.5rem; }
.checkout-proof-preview { display: block; max-width: 100%; max-height: 20rem; margin: auto; object-fit: contain; }
.checkout-consent { display: flex; align-items: flex-start; gap: .6rem; font-size: .875rem; line-height: 1.65; color: #515156; }
.checkout-consent input { flex-shrink: 0; margin-top: .25rem; width: 1.1rem; height: 1.1rem; accent-color: #0066d6; }
.checkout-receipt { display: grid; gap: 1rem; padding: 1.2rem; border-radius: .8rem; background: #f5f5f7; }
.checkout-receipt dt { color: #6e6e73; font-size: .875rem; margin-bottom: .5rem; }
.checkout-receipt dd { margin: 0; font-family: ui-monospace, monospace; font-size: 1rem; overflow-wrap: anywhere; user-select: all; }
.checkout button:disabled { cursor: default; opacity: .65; }
.checkout-version label:has(input:disabled) { cursor: not-allowed; background: #ededf1; border-color: #d8d8df; color: #6e6e73; }
.checkout-totals { margin: 0; }
.checkout-totals > div, .checkout-review-specs > div { display: flex; justify-content: space-between; gap: 1rem; margin: .9rem 0; font-size: .9375rem; }
.checkout-totals dt, .checkout-review-specs dt { flex-shrink: 0; color: #6e6e73; }
.checkout-totals dd, .checkout-review-specs dd { margin: 0; text-align: right; }
.checkout-totals .checkout-total { margin-top: 1.4rem; padding-top: 1.25rem; border-top: 1px solid #dcdce1; font-weight: 600; }
.checkout-total dt { color: #1d1d1f; }
.checkout-early-price { color: #005bbf; }
.checkout-summary > .checkout-help { grid-column: 1 / -1; }
.checkout-note { padding: .85rem 1rem; border-radius: .75rem; background: #eaf2ff; color: #365575; font-size: .875rem; line-height: 1.65; }
.checkout-summary .checkout-note { margin: 1.5rem 0 0; background: #e9e9ee; color: #616167; }
.checkout-content { min-width: 0; padding: 1.75rem 2rem 2rem; }
.checkout-steps { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin: 0 0 1.75rem; padding: 0; list-style: none; }
.checkout-steps li { display: flex; align-items: center; gap: .4rem; font-size: .875rem; color: #717176; }
.checkout-steps li span { display: grid; place-items: center; width: 1.65rem; height: 1.65rem; border: 1px solid #d2d2d7; border-radius: 50%; font-size: .8125rem; }
.checkout-steps [aria-current="step"] { color: #005bbf; font-weight: 600; }
.checkout-steps [aria-current="step"] span { color: #fff; border-color: #0066d6; background: #0066d6; }
.checkout-steps .is-complete span { color: #005bbf; border-color: #cee3ff; background: #eaf3ff; }
.checkout-title { margin: 0 0 .65rem; font-size: clamp(1.65rem, 3vw, 2.1rem); font-weight: 650; line-height: 1.2; letter-spacing: -.035em; }
.checkout-title:focus { outline: none; }
.checkout-intro { margin: 0 0 1.6rem; color: #6e6e73; font-size: 1rem; line-height: 1.6; }
.checkout-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem 1rem; }
.checkout-field { display: flex; position: relative; min-width: 0; flex-direction: column; gap: .45rem; font-size: .875rem; font-weight: 500; }
.checkout-field-wide { grid-column: 1 / -1; }
.checkout-optional { position: absolute; right: 0; top: 0; font-weight: 400; color: #717176; }
.checkout-field input, .checkout-field textarea {
  scroll-margin-top: 5.5rem;
  width: 100%;
  min-height: 3rem;
  margin: 0;
  padding: .7rem .85rem;
  border: 1px solid #c2c2c8;
  border-radius: .65rem;
  background: #fff;
  color: #1d1d1f;
  font: inherit;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.45;
}
.checkout-field textarea { resize: vertical; }
.checkout-field input::placeholder, .checkout-field textarea::placeholder { color: #7d7d83; opacity: 1; }
.checkout-field [aria-invalid="true"] { border-color: #bc2424; background: #fff9f9; }
.checkout-field-error, .checkout-form-error { color: #ab2020; font-size: .875rem; font-weight: 400; line-height: 1.5; }
.checkout-primary, .checkout-secondary {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 100%;
  min-height: 3.1rem;
  margin-top: 1.2rem;
  padding: .8rem 1rem;
  border: 1px solid #0066d6;
  border-radius: .7rem;
  background: #0066d6;
  color: #fff;
  font: inherit;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.4;
  cursor: pointer;
}
.checkout-primary:hover:not(:disabled) { background: #0057b7; }
.checkout-primary:disabled { border-color: #e9e9ee; background: #e9e9ee; color: #6e6e73; cursor: not-allowed; }
.checkout-help { margin: .8rem 0 0; color: #6e6e73; font-size: .875rem; line-height: 1.6; overflow-wrap: anywhere; }
.checkout-help a { color: #005bbf; text-underline-offset: 3px; }
.checkout-review-block { padding: 1.2rem 0; border-bottom: 1px solid #e5e5ea; }
.checkout-review-block:first-child { padding-top: 0; }
.checkout-review-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.checkout-review-block h3 { margin: 0 0 .75rem; font-size: 1rem; font-weight: 600; }
.checkout-review-heading h3 { margin-bottom: 0; }
.checkout-review-block p { margin: .6rem 0 0; color: #515156; font-size: 1rem; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.checkout-review-block .checkout-review-name { font-weight: 600; color: #1d1d1f; }
.checkout-review-specs { margin: 0; }
.checkout-review-specs dd { overflow-wrap: anywhere; }
.checkout-text-button { padding: .6rem 0; min-height: 2.75rem; border: 0; background: none; color: #005bbf; font: inherit; font-size: .9375rem; cursor: pointer; }
.checkout-text-button:hover { text-decoration: underline; text-underline-offset: 3px; }
.checkout-payment-method { margin: 1.5rem 0; padding: 0; border: 0; }
.checkout-payment-method legend { margin-bottom: .85rem; font-size: 1rem; font-weight: 600; }
.checkout-payment-method label { display: flex; align-items: center; gap: .75rem; padding: 1rem; border: 1px solid #0066d6; border-radius: .75rem; font-size: 1rem; }
.checkout-payment-method input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: #0066d6; }
.checkout-payment-method small { margin-left: auto; color: #6e6e73; font-size: .875rem; }
.checkout-actions { display: flex; gap: .75rem; }
.checkout-secondary { width: auto; flex-shrink: 0; border-color: #d2d2d7; color: #454549; background: #fff; }
.checkout-secondary:hover { background: #f5f5f7; }
.checkout-actions-last { justify-content: space-between; flex-wrap: wrap; margin-top: .7rem; }
.checkout-payment-pending { padding: 2rem 0; text-align: center; }
.checkout-pending-icon { display: grid; place-items: center; width: 4rem; height: 4rem; margin: 0 auto 1.2rem; border: 1px solid #cbdfff; border-radius: 50%; background: #eff5ff; color: #0066d6; font-size: 2rem; line-height: 1; }
.checkout-payment-pending h3 { font-size: 1.4rem; margin: 0 0 .8rem; font-weight: 600; }
.checkout-payment-pending p { margin: 0; color: #6e6e73; font-size: 1rem; line-height: 1.75; }
.checkout-pending-status { display: inline-block; margin-top: 1.25rem; color: #616167; font-size: .875rem; }
.checkout :is(button, input, textarea, a):focus-visible, .checkout-dock button:focus-visible { outline: 3px solid #78b6ff; outline-offset: 3px; }
@keyframes checkout-appear { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) {
  .checkout { width: calc(100% - 1rem); max-height: calc(100vh - 1rem); max-height: calc(100dvh - 1rem); border-radius: 1.2rem; }
  .checkout-topbar { padding: .65rem 1rem; gap: .65rem; min-height: 3.9rem; }
  .checkout-topbar .xcoria-word { font-size: 1rem; }
  .checkout-preview-badge { font-size: .75rem; }
  .checkout-layout { display: block; }
  .checkout-summary { display: grid; grid-template-columns: 4rem 1fr; column-gap: 1rem; padding: 1.1rem; border-right: 0; border-bottom: 1px solid #e8e8ed; }
  .checkout-product-image { grid-row: 1 / 3; height: 5.4rem; border-radius: .5rem; }
  .checkout-product-name { align-self: end; margin: 0 0 .35rem; font-size: 1.6rem; }
  .checkout-product-version { margin: 0; font-size: .875rem; }
  .checkout-version { grid-column: 2; margin: 0; }
  .checkout-version label { padding: .6rem; font-size: .875rem; }
  .checkout-totals { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; margin-top: 1rem; }
  .checkout-totals > div { margin: .35rem 0; font-size: .875rem; gap: .5rem; }
  .checkout-totals .checkout-total { grid-column: 1 / -1; margin-top: .5rem; padding-top: .8rem; }
  .checkout-summary .checkout-note { grid-column: 1 / -1; margin-top: .75rem; }
  .checkout-content { padding: 1.4rem 1.1rem; }
  .checkout-steps { margin-bottom: 1.4rem; }
}
@media (max-width: 380px) {
  .checkout-fields, .checkout-totals { grid-template-columns: 1fr; }
  .checkout-dock { gap: 1rem; padding-left: 1rem; }
  .checkout-steps li { gap: .25rem; font-size: .8125rem; }
}
@media (prefers-reduced-motion: reduce) { .checkout[open] { animation: none; } }
.checkout-quantity { display: flex; align-items: center; justify-content: space-between; gap: .75rem; font-size: .875rem; grid-column: 1 / -1; }
.checkout-quantity input { width: 5rem; min-height: 2.5rem; padding: .4rem .6rem; border: 1px solid #c9c9cf; border-radius: .6rem; font: inherit; color: #1d1d1f; background: #fff; }
.checkout-quantity input[aria-invalid="true"] { border-color: #c6372c; }
.checkout-summary [data-quantity-info] { grid-column: 1 / -1; }