/* Pronto Flux / Contas a Pagar 2026-10-14 — hierarquia de Encomendas, compacto e responsivo */
.payable-workspace{gap:12px}
.payable-workspace .page-head-actions .btn{min-height:38px;font-size:11px;border-radius:10px}
.payable-workspace-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border:1px solid var(--border);border-radius:13px;background:var(--panel)}
.payable-workspace-tabs button{display:flex;align-items:center;gap:8px;min-height:35px;padding:8px 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--muted);font-weight:760;font-size:11px;cursor:pointer;transition:color .15s,background .15s,border-color .15s}
.payable-workspace-tabs button b{min-width:22px;text-align:center;border:1px solid var(--border);padding:3px 5px;border-radius:7px;font-size:10px;background:var(--panel2);color:var(--text)}
.payable-workspace-tabs button:hover{color:var(--text);border-color:var(--border);background:var(--panel2)}
.payable-workspace-tabs button.active{border-color:rgba(215,25,32,.38);background:rgba(215,25,32,.10);color:var(--red)}
.payable-workspace-tabs button.active b{background:#D71920;border-color:#D71920;color:white}
.payable-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.payable-metric{border:1px solid var(--border);border-radius:13px;background:var(--panel);padding:14px 13px;display:grid;gap:8px;min-width:0}
.payable-metric::before{content:"";height:3px;width:27px;border-radius:3px;background:var(--border)}
.payable-metric.paid::before{background:#20a56a}.payable-metric.open::before{background:#d71920}.payable-metric.upcoming::before{background:#3291e8}.payable-metric.overdue::before{background:#df5058}.payable-metric.installments::before{background:#e39f2d}
.payable-metric small{color:var(--muted);font-size:10px;font-weight:750}
.payable-metric strong{font-size:clamp(17px,1.55vw,23px);line-height:1.15;letter-spacing:-.45px;color:var(--text);overflow-wrap:anywhere}
.payable-metric.paid strong{color:#1ea66d}.payable-metric.overdue strong{color:#f04b57}
.payable-metric span{font-size:9px;line-height:1.4;color:var(--muted)}
.payable-metrics-note{grid-column:1/-1;margin:0;color:var(--muted);font-size:10px}
.payable-workspace-filters{display:grid;grid-template-columns:minmax(220px,1.3fr) minmax(230px,1fr);align-items:end;gap:12px;border:1px solid var(--border);padding:15px;border-radius:13px;background:var(--panel)}
.payable-workspace-search,.payable-workspace-dates label{display:grid;gap:6px;min-width:0;color:var(--muted);font-size:10px;font-weight:750}
.payable-workspace-dates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.payable-workspace-filters .input{height:40px;font-size:12px;border-radius:9px}
.payable-workspace-quick{display:grid;gap:6px}
.payable-workspace-quick>span{font-size:10px;color:var(--muted);font-weight:750}
.payable-workspace .payable-quick-pills button{min-height:31px;font-size:10px}
.payable-workspace-group{font-size:11px;display:flex;align-items:center;gap:7px;color:var(--muted);cursor:pointer}
.payable-workspace-group input{accent-color:#d71920}
.payable-workspace-filters .btn{justify-self:end;min-height:36px;font-size:10px}
.payable-workspace-results{display:flex;align-items:center;justify-content:space-between;gap:14px}
.payable-workspace-results>div{display:grid;gap:3px}
.payable-workspace-results b{font-size:14px}
.payable-workspace-results small,.payable-workspace-results>span{font-size:10px;color:var(--muted)}
.payable-workspace .payable-card-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.payable-workspace-card{gap:12px;padding:14px;border-radius:13px;background:var(--panel);align-content:start}
.payable-workspace-card:focus-visible{outline:3px solid rgba(215,25,32,.3);outline-offset:3px}
.payable-workspace-card .payable-card-top{grid-template-columns:35px minmax(0,1fr) auto;gap:9px}
.payable-workspace-card .payable-card-icon{width:35px;height:35px;border-radius:10px}
.payable-workspace-card .payable-card-top h3{font-size:12px;line-height:1.3;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.payable-workspace-card .payable-card-top small{font-size:9px}
.payable-workspace-supplier{min-height:16px;color:var(--muted);font-size:10px}
.payable-workspace-amounts{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px;border-radius:10px;background:var(--panel2);border:1px solid var(--border)}
.payable-workspace-amounts>div{display:grid;gap:5px;min-width:0}
.payable-workspace-amounts span{font-size:9px;color:var(--muted)}
.payable-workspace-amounts strong{font-size:14px;color:var(--text);overflow-wrap:anywhere}
.payable-workspace-amounts strong.is-pending{color:#ef525e}
.payable-workspace-progress{display:grid;gap:7px}
.payable-workspace-progress>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:9px}
.payable-workspace-progress span,.payable-workspace-progress b{color:var(--muted);font-size:9px;font-weight:650}
.payable-workspace-track{height:6px;background:var(--panel2);border-radius:99px;overflow:hidden}
.payable-workspace-track i{display:block;height:100%;background:#22a96e;border-radius:99px}
.payable-workspace-due{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;padding-top:9px;border-top:1px solid var(--border)}
.payable-workspace-due span{color:var(--muted)}
.payable-workspace-due b{color:var(--text)}
.payable-workspace-card>.btn{margin-top:auto;min-height:35px;font-size:10px;border-radius:9px}
.payable-workspace .payable-empty{grid-column:1/-1;padding:35px}
.payables-page .payable-payment-title{padding:15px;border-radius:12px;border-color:rgba(215,25,32,.22)}
.payables-page .payable-payment-grid .field>label{font-size:10px}
@media(max-width:1250px){.payable-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.payable-workspace .payable-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:960px){.payable-workspace .payable-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payable-workspace-filters{grid-template-columns:1fr}}
@media(max-width:650px){.payable-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.payable-workspace .payable-card-grid{grid-template-columns:1fr}.payable-workspace-results{align-items:flex-start;flex-direction:column}.payable-workspace-filters{padding:12px}.payable-workspace-tabs button{font-size:10px;padding:7px}.payable-workspace-amounts strong{font-size:15px}}
@media(prefers-reduced-motion:reduce){.payable-workspace-card,.payable-workspace-tabs button{transition:none;transform:none!important}}

/* Modal de quitação: hierarquia visual clara sem alterações no processamento financeiro. */
.payable-payment-spotlight{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 0 15px}
.payable-payment-spotlight>div{display:grid;gap:5px;min-width:0;padding:12px;border:1px solid var(--border);border-radius:11px;background:var(--panel2)}
.payable-payment-spotlight span{font-size:10px;color:var(--muted);font-weight:720}
.payable-payment-spotlight b{font-size:15px;line-height:1.3;color:var(--text);overflow-wrap:anywhere}
.payable-payment-spotlight>div:first-child b{color:var(--red)}
.payable-payment-grid{gap:12px}
.payable-payment-grid .field>label{font-size:10px;font-weight:760}
.payable-payment-grid .input,.payable-payment-grid .select{min-height:39px;border-radius:9px}
.payable-partial-box{border-radius:12px;gap:10px;padding:14px}
.payable-partial-warning,.payable-partial-choice{font-size:11px;line-height:1.5}
.payable-payment-title{border-color:color-mix(in srgb,var(--red) 23%,var(--border));padding:13px;border-radius:12px}
.payable-payment-title b{font-size:13px}
.payable-payment-title small{font-size:10px}
@media(max-width:560px){.payable-payment-spotlight{grid-template-columns:1fr 1fr}.payable-payment-spotlight>div:first-child{grid-column:1/-1}}