body {
    background: #f8f9fa;
}
.card {
    border-radius: 10px;
}
#monthlyOverview .col {
    min-width: 120px;
    margin-bottom: 10px;
}
/* Depreciations page tweaks (keep it tiny) */
.filter-section { background-color: #f8f9fa; border-radius: .25rem; padding: 1rem; }
.status-col { width: 90px; text-align: center; }
.transaction-details { background:#f8f9fa; border-radius:.25rem; padding:1rem; margin-top:.5rem; }

/* TagPicker (shared) */
.tags-wrapper { position: relative; }
.tags-wrapper .dropdown-menu { width: 100%; z-index: 1060; }
.tags-control {
  display: flex; flex-wrap: wrap; gap: .5rem;
  min-height: calc(1.5em + .75rem + 2px);
  padding: .375rem .75rem;
}
.tags-input {
  border: 0; outline: 0; flex: 1 1 120px; min-width: 120px;
  padding: 0; margin: 0; background: transparent;
}
.tag-token { display: inline-flex; align-items: center; gap: .25rem; }
.tag-token .btn-close { float: none; margin-left: .25rem; }
/* Make the dropdown span the control width and stack above the modal content */

/* Sortable headers */
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable .sort-indicator { display: inline-block; width: 0.9em; text-align: center; opacity: .55; }
th.sortable.sorted-asc  .sort-indicator::after  { content: "▲"; }
th.sortable.sorted-desc .sort-indicator::after  { content: "▼"; }
th.sortable:not(.sorted-asc):not(.sorted-desc) .sort-indicator::after { content: ""; }