@font-face {
  font-family: "quicksand";
  /* license: url("https://radii.page/fonts/Quicksand-Regular.txt"); */
  src: local("quicksand") url("./quicksand.ttf") format("tff");
}

$font-family-base: quicksand, roboto !default;

@import "./variables.module.scss";
@import "~bootstrap/scss/bootstrap";

:root {
  --custom-color: #666;
  --custom-darker-color: #555;
  --custom-super-light-color: #eee;
}

$CustomColor: var(--custom-color);
$CustomDarkerColor: var(--custom-darker-color);
$CustomSuperLightColor: var(--custom-super-light-color);

.form-check-input:checked {
  background-color: $CustomColor !important;
  color: white;
}

.custom-color {
  color: $CustomColor;
}

.custom-bg-color {
  background-color: $CustomColor;
  color: white;
}

.custom-el-color {
  background-color: $CustomColor;
  color: white;
  &:hover {
    background-color: $CustomDarkerColor;
    color: white;
  }
  &:focus {
    background-color: $CustomColor;
    color: white;
  }
  &:focus:hover {
    background-color: $CustomDarkerColor;
    color: white;
  }
}

.panel-bg-color {
  background-color: $CustomSuperLightColor;
  color: black;
  border: 1px solid $CustomColor;
}