.bakong-payment { max-width: 390px; margin: 0 auto; text-align: center; color: #202a31; }
.bakong-payment .khqr-card { border: 1px solid #e2e4e6; border-radius: 16px; overflow: hidden; background: #fff; }
.bakong-payment .khqr-heading { padding: 14px 20px; background: #db2634; color: #fff; display: flex; justify-content: space-between; align-items: center; font-weight: 700; }
.bakong-payment .khqr-body { padding: 20px; }
.bakong-payment .khqr-merchant { margin: 0; font-size: 16px; }
.bakong-payment .khqr-amount { display: block; font-size: 30px; margin: 10px 0 4px; }
.bakong-payment .khqr-amount small { font-size: 16px; }
.bakong-payment .khqr-image { width: min(280px, 100%); margin: 12px auto; }
.bakong-payment .khqr-image svg { width: 100%; height: auto; display: block; }
.bakong-payment .khqr-image[hidden] { display: none; }
.bakong-payment .khqr-note, .bakong-payment .khqr-expiry { font-size: 13px; color: #64717a; line-height: 1.6; }
.bakong-payment .khqr-status { margin: 14px 0; padding: 12px; border-radius: 10px; background: #f0f5f3; font-size: 14px; line-height: 1.6; }
.bakong-payment .khqr-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.bakong-payment .khqr-button { padding: 10px 18px; border: 1px solid #d7dfda; border-radius: 8px; background: #fff; color: #204d38; cursor: pointer; font: inherit; }
.bakong-payment .khqr-button:disabled { opacity: .5; cursor: wait; }
.bakong-payment .khqr-success { font-size: 25px; padding: 30px 10px; color: #287b50; }
.bakong-payment .khqr-test { background: #fff0d0; color: #795408; padding: 8px; font-size: 13px; }

@media (max-height: 800px) {
  .bakong-payment { max-width: 340px; }
  .bakong-payment .khqr-heading { padding: 10px 14px; }
  .bakong-payment .khqr-body { padding: 12px; }
  .bakong-payment .khqr-merchant { font-size: 14px; }
  .bakong-payment .khqr-amount { font-size: 26px; margin: 6px 0 2px; }
  .bakong-payment .khqr-image { width: min(220px, 100%); margin: 8px auto; }
  .bakong-payment .khqr-note { margin: 6px 0; line-height: 1.4; }
  .bakong-payment .khqr-expiry { margin: 8px 0; }
  .bakong-payment .khqr-status { margin: 8px 0; padding: 8px; }
  .bakong-payment .khqr-test { margin: 8px 0; padding: 6px; }
}
