.sqb-pay-box { margin: 1.5em 0; }
.sqb-pay-box .sqb-cancel { margin-left: 1em; font-size: .9em; }
body.sqb-modal-open { overflow: hidden; }
.sqb-modal {
  position: fixed; inset: 0; z-index: 999999;
  background: rgba(15, 18, 22, .6);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
.sqb-modal__dialog {
  position: relative;
  width: 100%; max-width: 480px;
  height: min(680px, calc(100vh - 32px));
  background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
.sqb-modal__frame { width: 100%; height: 100%; border: 0; display: block; opacity: 0; transition: opacity .2s; }
.sqb-modal.is-loaded .sqb-modal__frame { opacity: 1; }
.sqb-modal.is-loaded .sqb-modal__loading { display: none; }
.sqb-modal__loading {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #6b7280; font-size: 15px;
}
.sqb-modal__close {
  position: absolute; top: 6px; right: 8px; z-index: 2;
  width: 36px; height: 36px; border: 0; border-radius: 50%;
  background: rgba(0,0,0,.05); color: #333; font-size: 24px; line-height: 1; cursor: pointer; padding: 0;
}
.sqb-modal__close:hover { background: rgba(0,0,0,.1); }
@media (max-width: 520px) {
  .sqb-modal { padding: 0; }
  .sqb-modal__dialog { max-width: none; height: 100%; border-radius: 0; }
}

/* Embedded card fields in checkout */
.sqb-embed { position: relative; margin-top: .5em; pointer-events: auto; }
.sqb-embed__frame { display: block; width: 100%; height: 120px; border: 0; background: transparent; transition: height .15s; }