:root {
  --brand-background-color: black;
  --brand-text-color: white;
  --brand-highlight-color: #c80081;
  --brand-highlight-dark: #b40074;
  --brand-text-primary: #309E78;
  /* --brand-primary-hover: <?=BRAND_PRIMARY_HOVER_COLOR?>;
    --brand-primary-faded: <?=BRAND_PRIMARY_FADED_COLOR?>; */
  --brand-primary-color: #82c4ae;
  --brand-secondary-color: #59b193;
  /*  --brand-secondary-hover: <?=BRAND_SECONDARY_HOVER_COLOR?>;
    --brand-secondary-faded: <?=BRAND_SECONDARY_FADED_COLOR?>;
    --brand-tertiary-color: <?=BRAND_TERTIARY_COLOR?>; */
}

section {
  min-height: 100vh;
}

.banner-title {
  font-size: 4rem;
}

.banner-subtitle {
  font-size: 1.5rem;
}

.bg-brand {
  background-color: var(--brand-background-color);
}

.bg-brand-primary {
  background-color: var(--brand-primary-color);
}

.bg-brand-secondary {
  background-color: var(--brand-secondary-color) !important;
}

.bg-tertiary {
  background-color: var(--brand-tertiary-color);
}

.bg-brand-inverse {
  background-color: var(--brand-primary-color) !important;
  color: var(--brand-background-color) !important;
}

.text-brand-highlight {
  color: var(--brand-highlight-color) !important;
}

a.text-brand-highlight:hover {
  color: var(--brand-highlight-dark) !important;
}

.text-brand-highlight-hover:hover {
  color: var(--brand-highlight-color) !important;
}

a.bg-secondary:focus,
a.bg-secondary:hover,
button.bg-secondary:focus,
button.bg-secondary:hover,
.bg-secondary:hover,
.bg-secondary:focus {
  background-color: var(--brand-secondary-color) !important;
  border-color: var(--brand-highlight-color) !important;
}

.text-theme,
.color-theme {
  color: var(--brand-text-color) !important;
}

.theme-button:focus,
.color-theme:focus {
  box-shadow: none;
}

.color-theme:hover {
  color: var(--brand-highlight-color) !important;
}

.icon-button:focus {
  box-shadow: none;
}

.icon-button {
  cursor: pointer;
}

a.icon-button:hover {
  text-decoration: none;
}

.icon-button[disabled],
.icon-button.disabled {
  filter: contrast(0);
  cursor: default;
}

.strikethrough {
  text-decoration: line-through;
}

.color-highlight-action {
  color: var(--brand-primary-color) !important;
}

.color-highlight-action:hover {
  color: var(--brand-primary-hover) !important;
}

.border-theme {
  border: 1px solid var(--brand-highlight-color);
  border-radius: 5px;
}

.nav-tabs .nav-link {
  color: var(--brand-primary-color)
}

.nav-tabs .nav-link.active,
.nav-tabs .show>.nav-link {
  /* background-color: var(--brand-primary-color); */
  color: var(--brand-secondary-color);
}

.nav-right-align {
  right: 0;
}

.nav-right-align button {
  margin-right: 0;
  padding-right: 0;
}

.navbar-logo {
  height: auto;
  width: 100%;
}

.logo-area {
  width: 360px;
  max-width: 80%;
}

.invalid {
  border-color: red;
}

/* Style select2 when the related (hidden) select is invalid */
select.invalid+.select2-container .select2-selection--single {
  border-color: red;
}

.default-cursor {
  cursor: default;
}

.theme-button,
button.theme-button {
  color: var(--brand-text-color);
}

.theme-button:hover,
button.theme-button:hover {
  color: var(--brand-primary-hover);
}

.theme-button.disabled,
.theme-button.no-bt,
.theme-button.disabled:hover,
.theme-button.no-bt:hover {
  color: var(--brand-primary-faded) !important;
}

button.theme-button,
button.theme-button:hover,
button.theme-button:active,
button.theme-button:focus,
button.theme-button:active:not(.disabled),
button.theme-button:focus:not(.disabled),
button.theme-button:hover:not(.disabled),
button.theme-button:active:not(.disabled):hover:not(.disabled) {
  border: none;
  background: none;
  box-shadow: none;
}

button.theme-button-block {
  background-color: var(--brand-highlight-color);
  color: var(--brand-text-color);
  border-color: var(--brand-highlight-color);
}

button.theme-button-block:hover,
button.theme-button-block-empty:hover {
  color: var(--brand-text-color);
  background-color: var(--brand-highlight-dark);
}

button.theme-button-block-empty.no-hover:hover {
  color: var(--brand-primary-color) !important;
  background-color: initial !important;
}

button.theme-button-block-empty {
  color: var(--brand-primary-color);
  background-color: var(--brand-background-color);
  border: var(--brand-primary-color) solid 1px;
}

.fill-remaining-vertical {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.min-h-100 {
  min-height: 100%;
}

.pre-wrap {
  white-space: pre-wrap;
}

.fixed-footer {
  position: fixed;
  height: fit-content;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
}

.highlight {
  background-color: #FFFF88;
}

.w-fit {
  width: fit-content !important;
}

.minw-100 {
  min-width: 100% !important;
}

.cursor-pointer {
  cursor: pointer;
}

.form-group.required label:after {
  content: '*';
  color: red;
}

.text-brand-primary {
  color: var(--brand-text-primary);
}

/* A second label for the "off" position of a switch */
.custom-switch-label-off {
  position: relative;
  /* Same left as the switch */
  left: -2.25rem;
}

.h1-height {
  height: calc(1.375rem + 1.5vw);
}