/**
 * revisao-pagamentocard.html — ID Check em viewports estreitas.
 * (max-width aqui; revisao-pagamentocard-desktop.css não usa max-width por regra do projeto.)
 */
@media only screen and (max-width: 991px) {
  .rp-desktop-bank-card.rp-desktop-bank-card--idcheck {
    width: min(360px, calc(100vw - 24px));
    max-width: min(360px, calc(100vw - 24px));
    padding: 14px 14px 14px;
    border-radius: 0;
    max-height: min(92vh, calc(100dvh - 32px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rp-bank-idcheck-header {
    flex-wrap: wrap;
    gap: 8px;
  }

  .rp-bank-idcheck-header-ml-img {
    height: 22px;
    max-width: min(120px, 55vw);
  }

  .rp-bank-idcheck-mc.rp-bank-idcheck-mc--verified-by-visa {
    max-height: 44px;
    max-width: min(200px, 62vw);
  }

  .rp-bank-idcheck-logo-text {
    font-size: 14px;
  }

  .rp-bank-idcheck-intro {
    font-size: 13px;
    line-height: 1.35;
    margin: 8px 0 12px;
  }

  .rp-bank-idcheck-details {
    margin: 0 0 12px;
  }

  .rp-bank-idcheck-row {
    grid-template-columns: 1fr;
    gap: 4px 0;
    margin-bottom: 8px;
    font-size: 12px;
  }

  .rp-bank-idcheck-dt {
    text-align: left;
  }

  .rp-bank-idcheck-field {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    margin-bottom: 14px;
  }

  .rp-bank-idcheck-field .rp-bank-idcheck-input-wrap {
    width: 100%;
  }

  .rp-bank-idcheck-input {
    width: 100%;
    height: 36px;
  }

  .rp-bank-idcheck-btn {
    min-width: 0;
    width: 100%;
    padding: 12px 16px;
  }
}
