#cash-obligations-workspace {
  --cash-obligations-ink: #263f35;
  --cash-obligations-fill: #edf1eb;
  --cash-obligations-edge: #b5c4b8;
  margin-top: 14px;
  overflow-wrap: anywhere;
}

#cash-obligations-workspace [hidden] { display: none !important; }
#cash-obligations-workspace button { min-height: 42px; width: fit-content; font-weight: 620; }
#cash-obligations-workspace button.cash-obligations-primary { color: #fff; background: var(--cash-obligations-ink); border-color: var(--cash-obligations-ink); }
#cash-obligations-workspace button.cash-obligations-primary:hover { background: #34564a; }
#cash-obligations-workspace summary { cursor: pointer; scroll-margin-top: 4rem; }
#cash-obligations-workspace summary:hover { color: var(--cash-obligations-ink); }

.cash-obligations-panel { min-width: 0; padding: 14px 17px; border: 1px solid var(--line); border-inline-start: 4px solid var(--cash-obligations-ink); background: var(--panel); }
.cash-obligations-panel > summary { color: var(--cash-obligations-ink); font-weight: 650; }
.cash-obligations-body { margin-top: 10px; }
.cash-obligations-payroll { margin-top: 14px; padding-top: 11px; border-top: 1px solid var(--line); }
.cash-obligations-note { margin: 6px 0; color: var(--muted); font-size: .84rem; }
.cash-obligations-empty { margin: 7px 0 0; padding: 8px 0; color: var(--muted); border-top: 1px solid var(--line); }
.cash-obligations-message, .cash-obligations-warning { margin: 6px 0 0; padding: 7px 9px; font-size: .87rem; }
.cash-obligations-message:empty { position: absolute; width: 1px; height: 1px; padding: 0; margin: 0; overflow: hidden; clip-path: inset(50%); }
.cash-obligations-message[data-tone="error"], .cash-obligations-warning { border-inline-start: 2px solid var(--warning); color: var(--warning); background: #fbede6; }
.cash-obligations-message[data-tone="success"] { border-inline-start: 2px solid var(--cash-obligations-ink); color: var(--cash-obligations-ink); background: var(--cash-obligations-fill); }

.cash-obligations-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
#cash-obligations-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 860px; margin: 8px 0; }
.cash-obligations-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.cash-obligations-field { display: grid; align-content: start; gap: 4px; min-width: 0; color: var(--muted); font-size: .84rem; }
.cash-obligations-field input, .cash-obligations-field select, .cash-obligations-field textarea { min-height: 39px; text-align: left; }
.cash-obligations-field textarea { width: 100%; padding: 6px 8px; resize: vertical; border: 1px solid var(--rule); border-radius: 2px; background: #fffdfa; color: var(--text); font: inherit; }
.cash-obligations-wide { grid-column: 1 / -1; }
.cash-obligations-editor { min-width: 0; margin-top: 8px; padding-top: 7px; border-top: 1px solid var(--line); }
.cash-obligations-editor > summary { color: var(--cash-obligations-ink); font-weight: 620; }
.cash-obligations-editor form { margin-top: 8px; }
.cash-obligations-actions { display: flex; flex-wrap: wrap; gap: 7px; }

.cash-obligations-record { padding: 7px 0; border-top: 1px solid var(--line); }
.cash-obligations-record:last-child { border-bottom: 1px solid var(--line); }
.cash-obligations-record > summary { display: grid; grid-template-columns: 10px minmax(0, 1.3fr) minmax(0, 1fr); align-items: baseline; gap: 6px 9px; min-height: 31px; font-size: .91rem; }
.cash-obligations-record > summary::before { content: ""; width: 7px; height: 7px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(-45deg); }
.cash-obligations-record[open] > summary::before { transform: translateY(-2px) rotate(45deg); }
.cash-obligations-record > summary > span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.cash-obligations-record small, .cash-obligations-list small { display: block; color: var(--muted); font-size: .78rem; font-weight: 400; }
.cash-obligations-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 145px), 1fr)); gap: 7px 10px; margin: 7px 0; padding: 8px 10px; background: var(--cash-obligations-fill); font-size: .86rem; }
.cash-obligations-facts dt { color: var(--muted); font-size: .78rem; }
.cash-obligations-facts dd { margin: 0; white-space: pre-wrap; }
.cash-obligations-amounts { grid-template-columns: repeat(4, minmax(0, 1fr)); font-variant-numeric: tabular-nums; }
.cash-obligations-amounts dd { font-weight: 650; }
.cash-obligations-evidence > summary { min-height: 28px; padding: 4px 0; font-size: .86rem; }
.cash-obligations-list { margin: 5px 0 7px; padding: 0; list-style: none; font-size: .85rem; }
.cash-obligations-list li { padding: 5px 0; border-bottom: 1px solid var(--line); }

@media (max-width: 520px) {
  .cash-obligations-panel { padding: 11px; }
  #cash-obligations-filter, .cash-obligations-editor .cash-obligations-fields { grid-template-columns: minmax(0, 1fr); }
  .cash-obligations-record > summary { grid-template-columns: 10px minmax(0, 1fr) minmax(85px, 28%); gap: 5px 7px; }
  .cash-obligations-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
