/* Tables */
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--space-5);
  transition: background-color 0.3s ease;
}

table th,
table td {
  padding: var(--space-3);
  text-align: left;
  border-bottom: 1px solid var(--color-gray-300);
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

table th {
  background: var(--color-gray-100);
  font-weight: 600;
  color: var(--color-gray-900);
  border-bottom: 2px solid var(--color-gray-300);
}

table tr:hover {
  background: var(--color-gray-100);
}

/* Dark mode overrides */
.dark table {
  background: var(--dark-bg-secondary);
}

.dark table th {
  background: var(--dark-bg-elevated);
  color: var(--dark-text);
  border-bottom-color: var(--dark-border);
}

.dark table td {
  color: var(--dark-text);
  border-bottom-color: var(--dark-border);
}

.dark table tr:hover {
  background: var(--dark-bg-elevated);
}