table {
  width: 100%;
  border-collapse: collapse;
  box-shadow: var(--elevation-1);
  transition: var(--transition);
}

table:hover {
  box-shadow: var(--elevation-2);
  transition: var(--transition);
}

th {
  text-align: left;
  background-color: var(--bg-2);
  padding: var(--space-md) var(--space-sm);
}

td {
  padding: var(--space-md) var(--space-sm);
  transition: var(--transition);
}

td:hover {
  box-shadow: inset var(--elevation-1);
  transition: var(--transition);
}

td,
th {
  border: var(--thickness) solid var(--bg-2);
  border-radius: var(--radius);
}