:root {
  --checkout-primary: #174b6e;
  --checkout-accent: #e6a23c;
  --checkout-surface: #fff;
  --checkout-text: #17212b;
}
#payBtn { border: 0; border-radius: 5px; padding: 12px 22px; background: var(--checkout-primary); color: #fff; cursor: pointer; font: inherit; }
#payBtn:hover { filter: brightness(1.08); }
#checkoutModal[hidden] { display: none !important; }
#checkoutModal { position: fixed; inset: 0; z-index: 10020; display: flex; overflow-y: auto; padding: 20px; background: rgba(12, 24, 40, .82); }
.checkout-dialog { position: relative; width: min(100%, 460px); margin: auto; padding: 32px; border-radius: 8px; background: var(--checkout-surface); color: var(--checkout-text); box-shadow: 0 16px 45px rgba(0,0,0,.3); }
.checkout-dialog h2 { margin: 0 36px 8px 0; color: var(--checkout-primary); }
.checkout-intro { margin: 0 0 24px; }
.checkout-close { position: absolute; top: 10px; right: 16px; border: 0; background: none; color: var(--checkout-text); font-size: 2rem; cursor: pointer; }
.checkout-group { margin: 0 0 16px; }
.checkout-group label { display: block; margin-bottom: 7px; }
.checkout-group input { box-sizing: border-box; width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid #b5c0ca; border-radius: 5px; font: inherit; }
.checkout-card-field { min-height: 48px; border: 1px solid #b5c0ca; border-radius: 5px; background: var(--checkout-surface); }
.checkout-card-field:focus-within { border-color: var(--checkout-primary); }
.checkout-card-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
#payBtn { width: 100%; }
#payBtn:disabled { opacity: .55; cursor: not-allowed; }
#checkoutStatus { min-height: 24px; margin: 14px 0 0; }
#checkoutStatus[data-kind="error"] { color: #b42318; }
#checkoutStatus[data-kind="success"] { color: #217346; }
@media (max-width: 480px) { .checkout-dialog { padding: 22px; } }

:root { --checkout-primary:#702d37; --checkout-surface:#faf7ef; --checkout-text:#382c28; }
#checkoutModal { background:rgba(44,29,24,.72); }
.checkout-dialog { border-radius:0; border:1px solid #d8d0c0; }
.checkout-dialog h2 { font:48px/1.1 var(--serif); margin-top:12px; }
.checkout-dialog .eyebrow { font-size:9px; }
.checkout-intro { font-size:12px; margin-top:10px; color:#746b60; }
.checkout-group label,.field-label { font-size:11px; margin-bottom:7px; display:block; }
.checkout-group input,.checkout-card-field { border-color:#bfb5a2; border-radius:0; background:#fffdf8; }
.checkout-card-field { height:50px; }
#payBtn { min-height:50px; font-size:13px; border-radius:0; }
.checkout-note { font-size:10px; color:#746b60; text-align:center; margin-top:14px; }
#checkoutStatus { font-size:12px; }
.checkout-close { min-height:44px; min-width:44px; top:8px; right:8px; }