/* Small additions on top of stock Bootstrap 5. */

body {
  background-color: #f6f7f9;
}

.navbar-brand {
  font-weight: 600;
}

/* Charge cards in the request form */
.charge-card {
  background-color: #fbfcfd;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}

.charge-card.is-invalid-line {
  border-color: var(--bs-danger-border-subtle);
  background-color: var(--bs-danger-bg-subtle);
}

.charge-card .charge-index {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
}

/* Derived, read-only values such as computed mileage */
.calc-output {
  background-color: var(--bs-tertiary-bg);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

.tabular {
  font-variant-numeric: tabular-nums;
}

.receipt-chip {
  font-size: 0.8125rem;
}

.totals-row-grand {
  border-top: 2px solid var(--bs-border-color);
  font-weight: 600;
}

/* Keep long tables usable on phones */
@media (max-width: 575.98px) {
  .table-responsive-sm-stack td,
  .table-responsive-sm-stack th {
    white-space: nowrap;
  }
}

.empty-state {
  padding: 3rem 1rem;
  text-align: center;
  color: var(--bs-secondary-color);
}