/* Payment method dialog: quiet rows, clear consent and a centered close icon. */
#storePayModal { padding: 20px; }
#storePayModal .store-pay-box {
  display: flex; flex-direction: column; width: min(440px, 100%);
  max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px);
  overflow: hidden; border: 1px solid #e5e9ef; border-radius: 18px;
  background: #fff; box-shadow: 0 20px 64px rgba(15, 23, 42, .18);
}
#storePayModal .store-modal-head {
  flex: 0 0 auto; gap: 16px; padding: 16px 20px;
  border-bottom: 1px solid #edf0f4; color: #162b46;
}
#storePayHeading { margin: 0; font-size: 18px; font-weight: 750; line-height: 1.4; letter-spacing: -.025em; }
#storePayModal #storePayClose {
  display: grid; place-items: center; flex: 0 0 40px;
  width: 40px; min-width: 40px; height: 40px; min-height: 40px;
  padding: 0; margin: 0; border: 1px solid #e2e7ed; border-radius: 50%;
  line-height: 0; color: #66758a; background: #fff;
  box-shadow: none; transform: none; filter: none;
}
#storePayModal #storePayClose svg { display: block; width: 18px; height: 18px; }
#storePayModal #storePayClose:hover { color: #162b46; background: #f5f7fa; border-color: #bfc9d5; }
#storePayModal .store-modal-body { flex: 1 1 auto; min-height: 0; padding: 22px 24px 8px; overflow-y: auto; overscroll-behavior: contain; }
#storePayModal .store-pay-info { padding: 0 0 20px; margin-bottom: 18px; text-align: left; border-bottom: 1px solid #edf0f4; }
#storePayModal .store-pay-title { margin-bottom: 8px; color: #526176; font-size: 14px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
#storePayModal .store-pay-price { color: #162b46; font-size: 28px; font-weight: 800; line-height: 1.25; letter-spacing: -.045em; }
#storePayModal .store-pdf-info { margin-bottom: 16px; color: #647184; font-size: 12px; font-weight: 400; line-height: 1.8; }
#storePayModal .store-copyright-consent {
  position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: start; gap: 10px;
  margin: 30px 0 18px; padding: 14px; border: 1px solid #e2e7ed; border-radius: 10px;
  background: #f7f9fb; color: #536176; font-size: 12px; font-weight: 400; line-height: 1.7;
}
#storePayModal #storeCopyrightConsent { display: block; width: 18px; min-width: 18px; height: 18px; margin: 2px 0 0; padding: 0; accent-color: #173858; cursor: pointer; }
#storePayModal .store-copyright-consent b { margin-bottom: 4px; color: #243850; font-size: 12px; font-weight: 700; }
#storePayModal .store-copyright-consent > .store-consent-cue {
  position: absolute; z-index: 1; top: -23px; left: 14px;
  display: flex; align-items: flex-start; gap: 7px; width: fit-content; margin: 0;
  color: #c53832; font-family: 'Yeon Sung', cursive; text-shadow: 0 1px 0 #fff;
  font-size: 21px; font-weight: 400; line-height: 1.3; cursor: pointer;
  transform-origin: 9px 100%; transform: rotate(-5deg);
  animation: store-consent-nudge 1.8s ease-in-out infinite;
}
#storePayModal .store-consent-cue svg { display: block; flex: 0 0 24px; width: 24px; height: 46px; }
#storePayModal .store-copyright-consent:has(#storeCopyrightConsent:checked) > .store-consent-cue { visibility: hidden; animation: none; }
@keyframes store-consent-nudge {
  0%, 70%, 100% { opacity: 1; transform: translate(0, 0) rotate(-5deg); }
  35%, 45% { opacity: .15; transform: translate(2px, 3px) rotate(-3deg); }
}
@media (prefers-reduced-motion: reduce) {
  #storePayModal .store-copyright-consent > .store-consent-cue { animation: none; transform: none; opacity: 1; }
}
#storePayModal .store-pay-help { margin: 0 0 10px; color: #718095; font-size: 11px; line-height: 1.6; }
#storePayModal .store-pay-methods { display: flex; flex-direction: column; gap: 0; overflow: hidden; border: 1px solid #dfe5ec; border-radius: 12px; }
#storePayModal .store-pay-method {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 61px;
  padding: 12px 16px; margin: 0; border: 0; border-bottom: 1px solid #e9edf2; border-radius: 0;
  color: #29394d; background: #fff; text-align: left; font-size: 14px; font-weight: 650; line-height: 1.4;
  box-shadow: none; transform: none; filter: none; transition: background .15s, color .15s;
}
#storePayModal .store-pay-method:last-child { border-bottom: 0; }
#storePayModal .store-pay-method::after { content: ''; flex: 0 0 6px; width: 6px; height: 6px; margin-left: auto; border: solid #a3afbe; border-width: 0 1.5px 1.5px 0; transform: rotate(-45deg); }
#storePayModal .store-pay-method:not(:disabled):hover { background: #f5f8fc; color: #173858; }
#storePayModal .store-pay-method:disabled { opacity: 1; color: #8893a2; background: #fafbfd; cursor: not-allowed; }
#storePayModal .store-pay-method:disabled .store-pay-ic { opacity: .6; }
#storePayModal .store-pay-ic { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 0; color: #5d6e82; background: transparent; }
#storePayModal .store-pay-ic svg { display: block; width: 23px; height: 23px; }
#storePayModal .store-pay-naver .store-pay-ic { color: #03a94d; background: transparent; }
#storePayModal .store-pay-kakao .store-pay-ic { color: #4d4541; background: transparent; }
#storePayModal .store-pay-label { min-width: 0; }
#storePayModal .store-pay-cash small { margin-top: 3px; color: #7c899a; font-family: inherit; font-size: 11px; font-weight: 400; }
#storePayModal .store-modal-foot { flex: 0 0 auto; padding: 14px 24px 20px; }
#storePayModal #storePayCancel { width: 100%; min-height: 42px; padding: 10px 16px; border: 1px solid #e2e7ed; border-radius: 10px; color: #68768a; background: #fff; box-shadow: none; font-size: 13px; font-weight: 600; line-height: 1.4; transform: none; filter: none; }
#storePayModal #storePayCancel:hover { background: #f7f9fb; color: #243850; }
#storePayModal button:focus-visible, #storePayModal input:focus-visible { outline: 2px solid #173858; outline-offset: -3px; }
@media (max-width: 640px) {
  #storePayModal { padding: max(12px, env(safe-area-inset-top, 0px)) 12px max(12px, env(safe-area-inset-bottom, 0px)); }
  #storePayModal .store-pay-box { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); border-radius: 16px; }
  #storePayModal .store-modal-head { padding: 14px 16px; }
  #storePayModal #storePayClose { flex-basis: 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  #storePayModal .store-modal-body { padding: 20px 18px 6px; }
  #storePayModal .store-modal-foot { padding: 12px 18px 16px; }
}

/* Availability is explained before consent; upcoming methods open an inline notice. */
#storePayModal .store-pay-notice { margin: 0 0 18px; padding: 18px; border: 1px solid #dce5f0; border-radius: 12px; background: #f3f7fc; }
#storePayModal .store-pay-notice-kicker { display: block; margin-bottom: 8px; color: #49698c; font-size: 11px; font-weight: 700; letter-spacing: .04em; }
#storePayModal .store-pay-notice h3 { margin: 0 0 10px; color: #162b46; font-size: 19px; font-weight: 750; line-height: 1.5; letter-spacing: -.035em; word-break: keep-all; }
#storePayModal .store-pay-notice p { margin: 0; color: #5b6e84; font-size: 12px; line-height: 1.8; word-break: keep-all; }
#storePayModal .store-pay-status { margin: 0 0 16px; padding: 12px 14px; border-left: 3px solid #49698c; border-radius: 4px; background: #f3f7fc; color: #243850; font-size: 13px; line-height: 1.7; }
#storePayModal .store-pay-status[hidden] { display: none; }
#storePayModal .store-pay-badge { flex: 0 0 auto; margin-left: auto; padding: 4px 8px; border: 1px solid #e2e7ed; border-radius: 6px; background: #f4f6f9; color: #647184; font-size: 11px; font-weight: 600; white-space: nowrap; }
#storePayModal .store-pay-badge-available { border-color: #f1c9c5; background: #fff3f2; color: #c53832; }
#storePayModal [data-method="card"]:not(:disabled) { background: #f0f5fc; color: #173858; }
#storePayModal [data-method="card"]::after,
#storePayModal [data-method="naverpay"]::after,
#storePayModal [data-method="kakaopay"]::after,
#storePayModal [data-method="mobile"]::after { display: none; }