#sidebar {
  width: 128px;
  height: 100vh;
}

#sidebar table {
  width: 100%;
}

#sidebar th {
  color: var(--dark-cyan); /* Text color */
  background-color: var(--af-purple); /* Button background color */
  padding: 16px 16px; /* Padding to give button-like space */
  text-align: center; /* Centering text */
}

#sidebar td {
  background-color: var(--af-dark-purple); /* Button background color */
  color: var(--dark-cyan); /* Text color */
  padding: 16px 16px; /* Padding to give button-like space */
  text-align: center; /* Centering text */
  cursor: pointer; /* Changing the cursor on hover to indicate clickability */
}

#sidebar td:hover {
  background-color: var(
    --af-purple
  ); /* Changing color on hover to give feedback */
}