.button {
  @apply w-40 min-w-max p-3 rounded text-lg cursor-pointer transition disabled:opacity-60 disabled:cursor-default border-2;
}

/* A mono-color button */
.button.primary {
  @apply border-transparent;
  color: var(--fg-color);
  background-color: var(--bg-color);
}

/* A duo-color button that changes when you hover over it. */
.button.secondary {
  color: var(--fg-color);
  background-color: var(--bg-color);
  border-color: var(--fg-color);
}

.button.secondary:hover {
  color: var(--bg-color);
  background-color: var(--fg-color);
  border-color: var(--bg-color);
}

select {
  color: var(--fg-color);
  background-color: var(--bg-color);
}