.expenses-header-tools {
  width: 100%;
}

.expenses-filter-project-picker {
  min-width: 11rem;
  max-width: 16rem;
}

.expenses-filter-project-picker .tracker-project-btn {
  width: auto;
  min-width: 11rem;
}

.expenses-list {
  overflow: visible;
}

.expenses-list-xscroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.expenses-list .tracker-entry.expenses-entry {
  display: grid;
  grid-template-columns:
    minmax(7rem, 1.2fr)
    minmax(8rem, 9rem)
    minmax(7rem, 8.5rem)
    6.5rem
    5.5rem
    8.5rem
    8.5rem
    auto;
  column-gap: 0.75rem;
  align-items: center;
  min-width: 58rem;
}

.expenses-list .tracker-entry.expenses-entry > .tracker-cell::before {
  display: none;
}

.expenses-list .tracker-entry.expenses-entry > .tracker-cell {
  margin-left: 0;
  padding-left: 0;
}

.expenses-list .tracker-entry.expenses-entry > .tracker-entry-title {
  flex: none;
  width: 100%;
  min-width: 0;
}

.expenses-list .tracker-entry.expenses-entry .tracker-entry-project,
.expenses-list .tracker-entry.expenses-entry .tracker-entry-project .tracker-project-picker,
.expenses-list .tracker-entry.expenses-entry .tracker-entry-project .tracker-project-btn {
  width: 100%;
  max-width: 9rem;
}

.expenses-compose-row {
  flex-wrap: wrap;
  row-gap: 0.5rem;
}

.expenses-compose-type {
  min-width: 8.5rem;
}

.expenses-compose-type .form-select {
  min-width: 8.5rem;
}

.expenses-compose-amount {
  min-width: 6.5rem;
}

.expenses-compose-amount .expenses-amount-input,
.expenses-entry-amount .expenses-amount-input {
  width: 6.5rem;
  text-align: right;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
  appearance: textfield;
}

.expenses-amount-input::-webkit-outer-spin-button,
.expenses-amount-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.expenses-compose-currency {
  min-width: 6.5rem;
}

.expenses-compose-currency .form-select {
  min-width: 6.5rem;
}

.expenses-compose-date,
.expenses-compose-month {
  min-width: 9rem;
}

.expenses-entry-amount {
  min-width: 6.5rem;
}

.expenses-entry-currency .form-select {
  min-width: 5.5rem;
}

.expenses-entry-date .form-control,
.expenses-entry-month .form-control {
  min-width: 8.5rem;
}

.expenses-entry-type .form-select,
.expenses-entry-type .expenses-type-label {
  min-width: 7.5rem;
}

.expenses-entry-type .expenses-type-label {
  display: inline-block;
  font-size: 0.875rem;
  color: var(--bs-secondary-color);
}

.expenses-entry-month-muted {
  color: var(--bs-secondary-color);
}

.expenses-entry:not(.expenses-entry-editing) [data-field="amount"],
.expenses-entry:not(.expenses-entry-editing) [data-field="currency"],
.expenses-entry:not(.expenses-entry-editing) [data-field="paidDate"],
.expenses-entry:not(.expenses-entry-editing) [data-field="month"],
.expenses-entry:not(.expenses-entry-editing) [data-field="type"] {
  opacity: 0.85;
  cursor: default;
}

.expenses-entry [data-edit-toggle].active {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), 0.1);
}

.expenses-month-totals {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.expenses-month-totals-values {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.1rem;
}

@media (min-width: 768px) {
  .expenses-month-totals-values {
    display: none;
  }
}

@media (max-width: 767.98px) {
  .tracker-day-header {
    align-items: flex-start;
  }

  .expenses-month-totals {
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
  }

  .expenses-month-totals-label {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .expenses-compose-row > .tracker-compose-cell::before {
    display: none;
  }

  .expenses-compose-row > .tracker-compose-cell {
    margin-left: 0;
    padding-left: 0;
  }

  .expenses-list .tracker-entry.expenses-entry {
    display: grid;
    flex-wrap: nowrap;
  }
}
