.theme-button {
  background-color: var(--button-bg, transparent);
  border: none;
  border-radius: 8px;
  padding: 4px;

  cursor: pointer;

  &:hover {
    background-color: var(--button-bg-hover, #ccc);
  }

  &:active {
    background-color: var(--button-bg-active, #e6e6e6);
  }

  &--full-rounded {
    border-radius: 50%;
  }

  body[data-theme="dark"] & {
    --button-bg-hover: #3f3f3f;
    --button-bg-active: #595959;
  }
}