/* Shared field widths include labels, padding, controls and formatted values. */
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid{display:flex;flex-wrap:wrap;align-items:flex-start;gap:20px 16px}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field{flex:0 1 var(--field-width,28ch);width:var(--field-width,28ch);min-width:0;max-width:100%;grid-column:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.full,:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-full{flex:1 0 100%;width:100%}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-uf{--field-width:11ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-cep{--field-width:23ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-number{--field-width:20ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-code{--field-width:25ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-document{--field-width:27ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-phone{--field-width:24ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-medium{--field-width:32ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-measure{--field-width:26ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field-date{--field-width:28ch}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-name{flex:1 1 36ch;width:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-email{flex:1 1 38ch;width:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-address{flex:1 1 calc(100% - 20ch - 16px);width:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-locality{flex:1 1 28ch;width:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-password{flex:1 1 28ch;width:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>:is(.cep-note,#cep-status,#Profissional_cep-status,#work-cep-status,#supplier-cep-status){flex:1 1 calc(100% - 23ch - 16px);width:auto;min-width:0;align-self:center;margin:0;font-size:11px;grid-column:auto}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .field>label{overflow-wrap:anywhere}
:is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .input-action input{min-width:0}
#client-form .surface-card{padding:26px}#client-form .surface-card+.surface-card{margin-top:24px}
#client-form .field-uf input{text-transform:uppercase}
@media(max-width:600px){
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid{gap:18px 12px}
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-address{flex:1 0 100%;width:100%}
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-locality{flex:1 1 25ch}
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>:is(.cep-note,#cep-status,#Profissional_cep-status,#work-cep-status,#supplier-cep-status){flex:1 1 100%;width:100%}
 #client-form .surface-card{padding:22px 18px}
}
@media(max-width:380px){
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field{flex-basis:100%;width:100%}
 :is(#register-form,#client-form,#work-form,#supplier-form,#receivable-form,#payable-form) .grid>.field-uf{flex:0 1 11ch;width:11ch}
}

#supplier-form .surface-card h2{margin-bottom:20px}#supplier-form .surface-card>.hint{margin-bottom:20px}#supplier-form .field-uf input{text-transform:uppercase}
#supplier-form .field-document:has(#CNPJ){--field-width:34ch}

#receivable-form .surface-card h2{margin-bottom:20px}.receivable-selection{margin-top:22px}.receivable-values{min-width:0}.receivable-values legend{padding:0 8px;font-size:16px;font-weight:600}.receivable-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}#receivable-form #Valor_Total{font-weight:700;background:var(--soft);color:var(--accent)}#receivable-status{color:var(--muted);font-size:13px}#receivable-form input[type=text]{font-variant-numeric:tabular-nums}

.receivable-options{margin-top:6px;max-height:230px;overflow-y:auto;border:1px solid var(--border);border-radius:7px;background:var(--surface)}.receivable-option{display:flex;justify-content:space-between;align-items:center;gap:15px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--border);background:var(--surface);color:var(--text);text-align:left;font:inherit;cursor:pointer}.receivable-option:hover,.receivable-option:focus{background:var(--soft)}.receivable-option small{font-size:10px;white-space:nowrap;color:var(--muted)}#receivable-form .field-code:has(#Codigo){--field-width:19ch}#receivable-form .field-number:has(#Parcela){--field-width:13ch}

#payable-form .surface-card h2{margin-bottom:20px}#payable-form #Valor_Total{font-weight:700;background:var(--soft);color:var(--accent)}#payable-form .field-code:has(#Codigo){--field-width:23ch}#payable-form .field-number:has(#Parcela){--field-width:13ch}#payable-status{color:var(--muted);font-size:13px}

#payable-form .surface-card h2{margin-bottom:20px}.payable-selection{margin-top:22px}.payable-values{min-width:0}.payable-values legend{padding:0 8px;font-size:16px;font-weight:600}.payable-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}#payable-form #Valor_Total{font-weight:700;background:var(--soft);color:var(--accent)}#payable-status{color:var(--muted);font-size:13px}#payable-form input[type=text]{font-variant-numeric:tabular-nums}
.payable-options{margin-top:6px;max-height:230px;overflow-y:auto;border:1px solid var(--border);border-radius:7px;background:var(--surface)}.payable-option{display:flex;justify-content:space-between;align-items:center;gap:15px;width:100%;padding:10px 12px;border:0;border-bottom:1px solid var(--border);background:var(--surface);color:var(--text);text-align:left;font:inherit;cursor:pointer}.payable-option:hover,.payable-option:focus{background:var(--soft)}.payable-option small{font-size:10px;white-space:nowrap;color:var(--muted)}#payable-form .field-code:has(#Codigo){--field-width:19ch}#payable-form .field-number:has(#Parcela){--field-width:13ch}
#payable-form .field-code:has(#Codigo){--field-width:23ch}
