/* === Cards === */
.card {
  border: none;
  border-radius: .5rem;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}

.filter-card {
  background-color: #f8f9fa;
}

/* Summary cards with coloured left border */
.summary-card { border-left: 4px solid transparent; }
.border-start-primary   { border-left-color: #0d6efd !important; }
.border-start-success   { border-left-color: #198754 !important; }
.border-start-info      { border-left-color: #0dcaf0 !important; }
.border-start-warning   { border-left-color: #ffc107 !important; }
.border-start-danger    { border-left-color: #dc3545 !important; }
.border-start-secondary { border-left-color: #6c757d !important; }

.summary-card .card-subtitle {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.summary-card .card-title {
  font-weight: 700;
}

/* === Tables === */
.table th {
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #495057;
}

.table td {
  font-size: .9rem;
}

.row-payment {
  background-color: rgba(25, 135, 84, .06);
}

.text-success {
  color: #198754 !important;
}

/* === Click-to-edit categories === */
.category-label {
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
  transition: background-color 0.15s;
}

.category-label:hover {
  background-color: #e9ecef;
}

.category-select {
  min-width: 160px;
}

/* === Charts === */
.chart-container {
  position: relative;
  height: 320px;
}

/* === Pagination === */
.pagination {
  margin-top: 1rem;
}

/* === Responsive === */
@media (max-width: 768px) {
  .chart-container {
    height: 240px;
  }

  .summary-card .card-title {
    font-size: 1.3rem;
  }
}