/* A.A.M Cobranças v21.0 — interface básica e funcional */
.basic-dashboard{max-width:1050px;margin:0 auto;padding-bottom:110px}
.basic-title{margin-bottom:22px}
.basic-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.basic-kpi{background:#0d0d0c;border:1px solid rgba(213,165,53,.32);border-radius:18px;padding:22px;min-height:150px;display:flex;flex-direction:column;justify-content:center}
.basic-kpi span{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:#c8b98e}
.basic-kpi strong{display:block;margin:12px 0 8px;font-size:clamp(1.65rem,5vw,2.55rem);line-height:1;color:#f6f2e8;white-space:nowrap}
.basic-kpi em{font-style:normal;color:#8f8a7d;font-size:.86rem}
.basic-actions{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.basic-actions p{margin:5px 0 0;color:#8f8a7d}
.basic-actions .actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.basic-compat{display:none!important}
.basic-nav-shell{left:50%;transform:translateX(-50%);max-width:680px;width:calc(100% - 24px);padding:7px;bottom:max(10px,env(safe-area-inset-bottom));border:1px solid rgba(213,165,53,.22);background:rgba(8,8,7,.97);border-radius:20px}
.basic-nav{display:grid!important;grid-template-columns:repeat(4,1fr);overflow:visible!important;gap:4px;width:100%}
.basic-nav button{min-width:0!important;padding:9px 4px!important;border-radius:14px!important}
.basic-nav .nav-icon{width:22px!important;height:22px!important}
.basic-nav .nav-label{font-size:.68rem!important;white-space:nowrap}
.basic-nav button.active{background:linear-gradient(180deg,rgba(213,165,53,.28),rgba(213,165,53,.12))!important;color:#e8bc52!important}
#alerts,#operations,#productivity,#cash{display:none!important}
@media(max-width:620px){
 .wrap{padding-left:12px!important;padding-right:12px!important}
 .basic-dashboard{padding-top:14px}
 .basic-kpis{grid-template-columns:1fr;gap:12px}
 .basic-kpi{min-height:122px;padding:18px}
 .basic-kpi strong{font-size:1.85rem}
 .basic-actions{align-items:stretch;flex-direction:column}
 .basic-actions .actions{display:grid;grid-template-columns:1fr;justify-content:stretch}
 .basic-actions .btn{width:100%}
 .topbar .brand span{display:none}
 .basic-nav-shell{width:calc(100% - 16px);padding:5px;border-radius:17px}
 .basic-nav button{padding:7px 2px!important}
 .basic-nav .nav-label{font-size:.6rem!important}
}

/* Pagamento simples v21.4.0 */
.payment-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 18px}
.payment-option{display:flex;gap:10px;align-items:flex-start;padding:14px;border:1px solid rgba(213,165,53,.22);border-radius:15px;background:#0b0b0a;cursor:pointer}
.payment-option.active{border-color:#d5a535;background:rgba(213,165,53,.10)}
.payment-option input{margin-top:3px;accent-color:#d5a535}
.payment-option span{display:grid;gap:4px}
.payment-option strong{color:#f6f2e8}
.payment-option small{color:#9a9383;line-height:1.35}
.payment-breakdown{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:2px 0 4px}
.payment-breakdown>div{padding:13px;border:1px solid rgba(213,165,53,.18);border-radius:13px;background:#0b0b0a}
.payment-breakdown span{display:block;color:#9a9383;font-size:.78rem;margin-bottom:6px}
.payment-breakdown strong{display:block;color:#f4cf72;font-size:1rem;white-space:nowrap}
#pAmount[readonly]{background:rgba(213,165,53,.08);color:#f4cf72;font-weight:700}
@media(max-width:620px){
 .payment-choice{grid-template-columns:1fr}
 .payment-breakdown{grid-template-columns:1fr}
 .payment-breakdown>div{display:flex;justify-content:space-between;gap:10px;align-items:center}
 .payment-breakdown span{margin:0}
}

/* Novo empréstimo após quitação — v21.1.2 */
.new-loan-modal{width:min(720px,calc(100vw - 24px));max-width:720px}
.new-loan-modal::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(5px)}
.new-loan-client-summary,.new-loan-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}
.new-loan-client-summary>div,.new-loan-preview>div{padding:14px;border:1px solid rgba(214,166,58,.28);border-radius:14px;background:rgba(255,255,255,.025)}
.new-loan-client-summary span,.new-loan-preview span{display:block;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#a89f8c);margin-bottom:5px}
.new-loan-preview{grid-template-columns:repeat(3,minmax(0,1fr))}
.new-loan-preview strong{font-size:1.05rem;color:#f4c653;white-space:nowrap}
.new-loan-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.new-loan-note{margin:4px 0 0;color:var(--muted,#a89f8c);font-size:.84rem;line-height:1.5}
.loan-history-list{display:grid;gap:9px;margin-top:10px}
.loan-history-item{display:grid;grid-template-columns:1.2fr repeat(3,minmax(0,1fr));gap:8px;align-items:center;padding:11px;border:1px solid rgba(214,166,58,.2);border-radius:12px;background:rgba(255,255,255,.02)}
.loan-history-item span{font-size:.74rem;color:var(--muted,#a89f8c)}
.loan-history-item strong{display:block;margin-top:3px;font-size:.88rem}
@media(max-width:640px){.new-loan-form-grid,.new-loan-client-summary,.new-loan-preview{grid-template-columns:1fr}.loan-history-item{grid-template-columns:1fr 1fr}.new-loan-modal{margin:auto 10px;width:calc(100vw - 20px)}}


/* Acesso rápido a pagamentos v21.1.3 */
.topbar-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
#quickPayment{border-color:rgba(213,165,53,.45);color:#f4cf72;background:#11100d}
#quickPaymentClient{width:100%}
@media(max-width:620px){
  .topbar{align-items:center}
  .topbar-actions{gap:6px}
  #quickPayment{padding:9px 10px;font-size:.75rem;white-space:nowrap}
  #new{padding:9px 10px;font-size:.75rem}
}

/* v21.1.9 — seletor interno de cliente e menu mobile */
@media (max-width: 760px) {
  .nav-shell.basic-nav-shell {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    transform: translateX(-50%) !important;
    width: calc(100% - 16px) !important;
    max-width: 680px !important;
    display: block !important;
    padding: 5px !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    z-index: 200 !important;
  }
  .nav-shell.basic-nav-shell .basic-nav,
  .nav-shell.basic-nav-shell #mainNav {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    gap: 3px !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
    transform: none !important;
  }
  .nav-shell.basic-nav-shell .basic-nav > button,
  .nav-shell.basic-nav-shell #mainNav > button {
    position: relative !important;
    inset: auto !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 6px 2px !important;
    gap: 4px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    transform: none !important;
  }
  .nav-shell.basic-nav-shell .nav-icon {
    position: static !important;
    display: grid !important;
    place-items: center !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    margin: 0 auto !important;
    transform: none !important;
  }
  .nav-shell.basic-nav-shell .nav-icon svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
  }
  .nav-shell.basic-nav-shell .nav-label {
    position: static !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    font-size: clamp(7px, 2.15vw, 9px) !important;
    line-height: 1.05 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transform: none !important;
  }
  .nav-shell.basic-nav-shell .basic-nav > button.active {
    border-radius: 13px !important;
  }
  body { padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important; }
}

@media (max-width: 360px) {
  .nav-shell.basic-nav-shell { width: calc(100% - 10px) !important; padding: 4px !important; }
  .nav-shell.basic-nav-shell .basic-nav > button { min-height: 54px !important; padding: 5px 1px !important; }
  .nav-shell.basic-nav-shell .nav-icon,
  .nav-shell.basic-nav-shell .nav-icon svg { width: 20px !important; height: 20px !important; min-width: 20px !important; }
  .nav-shell.basic-nav-shell .nav-label { font-size: 7px !important; }
}


/* v21.1.9 — seletor de cliente interno no modal de pagamento */
#quickPaymentModal{overflow:visible}
#quickPaymentModal form{overflow:visible}
.quick-client-field{position:relative;display:grid;gap:7px;min-width:0}
.quick-client-label{font-size:.95rem;color:#f3eee4}
.quick-client-button{width:100%;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid rgba(213,165,53,.35);border-radius:15px;background:#0b0b0a;color:#f6f2e8;font:inherit;text-align:left;cursor:pointer}
.quick-client-button:focus-visible{outline:2px solid #d5a535;outline-offset:2px}
.quick-client-button #quickPaymentClientText{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick-client-chevron{color:#f4cf72;font-size:1.25rem;line-height:1;transition:transform .18s ease}
.quick-client-button[aria-expanded="true"] .quick-client-chevron{transform:rotate(180deg)}
.quick-client-list{position:absolute;z-index:50;left:0;right:0;top:calc(100% + 7px);max-height:min(300px,42vh);overflow-y:auto;overscroll-behavior:contain;padding:7px;border:1px solid rgba(213,165,53,.34);border-radius:16px;background:#090908;box-shadow:0 18px 50px rgba(0,0,0,.72)}
.quick-client-list[hidden]{display:none!important}
.quick-client-list button{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 13px;border:0;border-bottom:1px solid rgba(213,165,53,.12);background:transparent;color:#f6f2e8;font:inherit;text-align:left;cursor:pointer}
.quick-client-list button:last-child{border-bottom:0}
.quick-client-list button:hover,.quick-client-list button:focus-visible,.quick-client-list button.selected{background:rgba(213,165,53,.12);outline:none;border-radius:10px}
.quick-client-list button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick-client-list button strong{color:#f4cf72;font-weight:700;white-space:nowrap}
@media(max-width:620px){
 #quickPaymentModal{width:calc(100vw - 24px);max-width:none;margin:auto 12px;overflow:visible}
 #quickPaymentModal form{padding:18px 16px;overflow:visible}
 #quickPaymentModal .mhead h2{font-size:1.45rem}
 #quickPaymentModal .mactions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 #quickPaymentModal .mactions .btn{width:100%;min-width:0}
 .quick-client-list{position:static;margin-top:2px;max-height:34vh;box-shadow:none}
 .quick-client-list button{padding:13px 11px}
 .quick-client-list button span{white-space:normal;line-height:1.25}
}