/* Buttons */

button {
  background: var(--Secondary);
  color: var(--Light);
  border-radius: 0.625rem !important;
  border: none;
  text-align: center;
  transition: all 0.3s;
}

button.outline {
  background: var(--Light);
  color: var(--Secondary);
  border: 1px solid var(--Secondary);
}

button.outline:hover {
  background: var(--Secondary);
  color: var(--Light);
  border-color: var(--Secondary);
}

button.outline:active {
  background: var(--Primary);
  color: var(--Light);
  border-color: var(--Primary);
}

button:hover {
  background: var(--Secondary-600);
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.25);
}

button:active,
button.selected {
  background: var(--Primary);
}

button:disabled,
button:disabled:hover,
button:disabled:active {
  cursor: not-allowed;
  background: var(--Gray-500);
  color: var(--Gray-300);
  border: 1px solid var(--Dark);
}

/* Link Button */

button.link-button {
  border-radius: 2.8125rem !important;
}

button.link-button iconify-icon {
  display: none;
}

button.link-button:hover iconify-icon {
  display: inline-block;
}

/* Medium Button */

button.medium-button {
  padding: 0.9375rem 1.5625rem;
}

/* Small Button */

button.small-button {
  padding: 0.46875rem 0.78125rem;
}

/* Google Sign In Button */

button.google-sign-in {
  background: var(--Light);
  color: var(--Dark);
  padding: 0.9375rem 1.5625rem;
  border-radius: 2.8125rem !important;
  border: 1px solid var(--Dark);
}

button.google-sign-in:hover {
  background: var(--Dark);
  color: var(--Light);
}

button.google-sign-in:disabled {
  background: var(--Dark);
  color: var(--Light);
}

button.google-sign-in.box-shadow {
  box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.25);
}