/* CUEVA Credit Accounts v701 — Catalog-matched account, payment and edit sheets. */
@media(max-width:820px){
  #creditAccountModal .credit-modal-card:before,
  #creditDetailModal .credit-modal-card:before{display:none!important}

  #creditAccountModal .credit-modal-head,
  #creditDetailModal .credit-modal-head{
    position:relative!important;top:auto!important;margin:0 -16px 15px!important;padding:18px 16px 16px!important;
    background:#fff!important
  }
  #creditAccountModal .credit-modal-head h3,
  #creditDetailModal .credit-modal-head h3{font-size:23px!important;line-height:1.05!important}
  #creditDetailModal .credit-modal-head p{font-size:10px!important;font-weight:650!important}

  #creditAccountModal .credit-form-grid{padding:0 1px!important}
  #creditAccountModal .credit-form-grid label{font-size:10px!important;line-height:1.15!important}
  #creditAccountModal .credit-form-grid input,
  #creditAccountModal .credit-form-grid select,
  #creditAccountModal .credit-form-grid textarea{
    border-color:#dfe1e5!important;background:#fff!important;box-shadow:0 3px 10px rgba(20,21,24,.018)!important
  }
  #creditAccountModal .credit-input-suffix{display:grid!important;grid-template-columns:minmax(0,1fr) 58px!important}
  #creditAccountModal .credit-input-suffix span{
    display:flex!important;align-items:center!important;justify-content:center!important;padding:0 8px!important;
    white-space:nowrap!important;word-break:normal!important;line-height:1!important
  }
  #creditAccountModal #creditApprovedBy{background:#f6f7f8!important}
  #creditAccountModal .credit-warning-box{display:flex!important;align-items:center!important;min-height:45px!important}

  #creditDetailModal.payment-mode .credit-detail-card{background:#fff!important}
  #creditDetailModal.payment-mode #creditDetailSummary{margin-bottom:11px!important}
  .credit-payment-summary-card{
    overflow:hidden;border:1px solid #efd4cf;border-radius:19px;background:linear-gradient(120deg,#fdf2f0,#fff9f8);
    box-shadow:0 7px 18px rgba(151,58,46,.04)
  }
  .credit-payment-summary-card>div:first-child{padding:15px 16px 14px}
  .credit-payment-summary-card>div:first-child>span{display:block;color:#95655d;font-size:9px;font-weight:800}
  .credit-payment-summary-card>div:first-child>strong{display:block;margin-top:7px;color:#a33f34;font-size:27px;line-height:1;font-weight:900;letter-spacing:-.04em}
  .credit-payment-summary-meta{
    display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:8px;padding:11px 13px;
    border-top:1px solid #f0dedb;background:rgba(255,255,255,.64)
  }
  .credit-payment-summary-meta>span:not(.credit-status){display:grid;gap:3px;color:#8b8e95;font-size:8px;font-weight:700}
  .credit-payment-summary-meta>span>strong{color:#33353a;font-size:11px;font-weight:850}
  .credit-payment-summary-meta .credit-status{margin:0!important;white-space:nowrap!important}

  #creditDetailModal.payment-mode .credit-payment-panel{
    margin:0!important;padding:15px!important;border:1px solid #e1e3e6!important;border-radius:19px!important;
    background:#fbfbfc!important;box-shadow:none!important
  }
  #creditDetailModal.payment-mode .credit-section-title{padding-bottom:11px;border-bottom:1px solid #eceef0}
  #creditDetailModal.payment-mode .credit-section-title h4{font-size:16px!important}
  #creditDetailModal.payment-mode .credit-payment-form{margin-top:12px!important}
  #creditDetailModal.payment-mode #receiveCreditPaymentBtn{background:#17181c!important;color:#fff!important}

  #creditDetailModal.account-mode .credit-detail-summary{margin-top:0!important}
  #creditDetailModal.account-mode .credit-ledger-panel{border-color:#e1e3e6!important;background:#fbfbfc!important}
  #creditDetailModal.account-mode .credit-ledger-row{background:#fff!important}
}

@media(max-width:390px){
  #creditAccountModal .credit-modal-head,
  #creditDetailModal .credit-modal-head{margin-inline:-13px!important;padding-inline:13px!important}
  .credit-payment-summary-meta{grid-template-columns:1fr 1fr!important}
  .credit-payment-summary-meta .credit-status{grid-column:1/-1;width:max-content}
}