.supplier-payouts{margin-block:18px;padding:16px;border:1px solid #d6dce5;border-radius:10px;background:var(--card-bg,#fff);min-width:0;overflow-wrap:anywhere;color:var(--text,#172538)}
.supplier-payouts header,.payout-input-row,.payout-summary,.payout-dates{display:flex;flex-wrap:wrap;gap:12px;align-items:end}
.supplier-payouts header{justify-content:space-between;align-items:center}.supplier-payouts h4{margin:0;font-size:1rem}.supplier-payouts p{margin-block:10px}.supplier-payouts label{display:flex;flex-direction:column;gap:5px;min-width:0;max-width:100%}.supplier-payouts input{max-width:100%;min-width:0;box-sizing:border-box;padding:8px;border:1px solid #adb9ca;border-radius:5px}.supplier-payouts input[data-field]{width:210px;direction:ltr;text-align:end}.supplier-payouts button{padding:8px 12px;max-width:100%;white-space:normal}.supplier-payouts :focus-visible{outline:3px solid #2778cb;outline-offset:2px}.supplier-payouts details{margin-block:12px}.supplier-payouts summary{cursor:pointer}.supplier-payouts small{display:block;color:#516175}.payout-summary{margin-block:14px;align-items:start}.payout-summary>span{flex:1 1 145px;font-size:.85rem}.payout-summary b{display:block;font-size:1rem;font-variant-numeric:tabular-nums;margin-block-start:5px;color:inherit}.payout-input-row{margin-block:12px}.payout-dates{margin-block:10px}.payout-dialog{max-width:min(520px,calc(100vw - 32px));border:1px solid #a7b5c8;border-radius:10px;padding:20px;box-sizing:border-box;overflow-wrap:anywhere}.payout-dialog::backdrop{background:#13203088}.payout-dialog button{margin:6px}.supplier-payouts [hidden]{display:none!important}@media(max-width:480px){.supplier-payouts{padding:12px}.supplier-payouts input[data-field]{width:100%}.payout-input-row>label{flex:1 1 100%}.payout-dates>label{flex:1 1 120px}}
#supplierPayoutManagement.supplier-payouts{margin-block:12px;max-width:1080px;background:var(--surface,#fff);border-color:var(--border,#d6dce5)}
#supplierPayoutManagement button,#supplierPayoutManagement summary{box-sizing:border-box;min-height:36px;border:1px solid var(--border,#d6dce5);border-radius:8px;padding:8px 12px;background:var(--surface-subtle,#f5f7fa);color:var(--text-primary,#172538);font:inherit;font-size:.875rem;line-height:1.4;cursor:pointer}
#supplierPayoutManagement summary{width:fit-content;max-width:100%}
#supplierPayoutManagement button[data-save="expected"],#supplierPayoutManagement button[data-save="actual"],#supplierPayoutManagement button[data-confirm]{background:var(--accent,#1767c7);border-color:var(--accent,#1767c7);color:#fff;font-weight:700}
#supplierPayoutManagement button:hover:not(:disabled),#supplierPayoutManagement summary:hover{box-shadow:0 0 0 1px var(--accent,#1767c7)}
#supplierPayoutManagement button:disabled{opacity:.55;cursor:wait}
#supplierPayoutManagement :focus-visible{outline:3px solid var(--focus-ring,#2778cb);outline-offset:2px}
#supplierPayoutManagement input{min-height:36px;border-radius:8px;font:inherit;font-variant-numeric:tabular-nums}
@media(max-width:480px){#supplierPayoutManagement .payout-input-row>button{width:100%}#supplierPayoutManagement .payout-dialog button{margin-inline:0;width:100%}}

/* One semantic table layout for the eight headers, values and full-width detail. */
.payout-monthly-summary{overflow-x:auto;max-width:100%;margin-block-start:18px}
.payout-monthly-summary table{width:100%;min-width:900px;table-layout:fixed;border-collapse:collapse}
.payout-monthly-summary .payout-col-month{width:10%}.payout-monthly-summary .payout-col-money{width:13%}.payout-monthly-summary .payout-col-ratio{width:9%}.payout-monthly-summary .payout-col-status{width:20%}.payout-monthly-summary .payout-col-action{width:9%}
.payout-monthly-summary th,.payout-monthly-summary td{padding:10px 8px;vertical-align:middle;border-block-end:1px solid var(--border,#d6dce5);font-size:.82rem;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.payout-monthly-summary thead th{background:var(--surface-subtle,#f5f7fa);font-weight:700}
.payout-monthly-summary .payout-cell-money{text-align:end;font-variant-numeric:tabular-nums}
.payout-monthly-summary .payout-cell-month,.payout-monthly-summary .payout-cell-ratio,.payout-monthly-summary .payout-cell-status,.payout-monthly-summary .payout-cell-action{text-align:center}
.payout-monthly-summary bdi{display:inline-block;font-variant-numeric:tabular-nums;white-space:nowrap}
.payout-monthly-summary .payout-cell-month{font-weight:700}
.payout-monthly-summary .payout-status-label{display:inline-block;max-width:100%;padding:3px 6px;border-radius:6px;background:var(--surface-subtle,#f5f7fa)}
.payout-monthly-summary button[data-payout-detail]{display:inline-flex;align-items:center;justify-content:center;padding:6px!important;min-height:34px!important;width:100%}
.payout-monthly-summary .payout-detail-row td{text-align:start;background:var(--surface-subtle,#f5f7fa)}
.payout-detail-content{display:flex;flex-wrap:wrap;align-items:start;gap:8px 24px}.payout-detail-content p{margin:0}.payout-detail-content ul{margin:0}.payout-detail-content small{flex-basis:100%}

/* Monthly payout editing stays in one company-cash owner table. */
#supplierPayoutManagement.supplier-payouts{max-width:100%}
.payout-monthly-summary .payout-col-month{width:9%}.payout-monthly-summary .payout-col-money{width:14%}.payout-monthly-summary .payout-col-ratio{width:8%}.payout-monthly-summary .payout-col-status{width:17%}.payout-monthly-summary .payout-col-action{width:24%}
.payout-row-actions{display:flex;flex-wrap:wrap;gap:5px;justify-content:center}.payout-row-actions button{font-size:.76rem!important;padding:5px 7px!important}.payout-row-actions details{margin:0}.payout-row-actions summary{font-size:.76rem!important;min-height:30px!important;padding:5px 7px!important}.payout-row-actions details[open]{flex-basis:100%}
.payout-editor{margin-block-start:15px;border:1px solid var(--border,#d6dce5);border-radius:10px;padding:14px}.payout-editor h5{margin:0 0 10px}.payout-cash-evidence{padding:10px;border-inline-start:3px solid var(--accent,#1767c7);background:var(--surface-subtle,#f5f7fa)}

.payout-editor form{max-width:620px}.payout-reference-note{font-size:.82rem;color:var(--text-secondary,#516175)}