.btn:hover, .btn:focus, .btn:active {
  box-shadow: var(--btn-shadow) !important;
}


.btn-info, .btn-info:hover, .btn-info:focus, .btn-info:active {
  background-color: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  outline: none !important;
  color: hsl(var(--theme-brand-primary-hs), 26) !important;
}

.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background-color: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  outline: none !important;
  color: hsl(var(--theme-brand-primary-hs), 26) !important;
}

.btn-danger, .btn-danger:hover, .btn-danger:focus, .btn-danger:active {
  background-color: #e64a19 !important;
}


.btn-group-xs>.btn, .btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.badge-disabled {
  color: #fff;
  background-color: #9e9e9e;
  border-color: #6c757d;
}

/* -- slider -- */

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 3.2em;
  height: 1.2em;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  background-color:var(--secondary);
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 0.8em;
  width: 0.8em;
  left: 0.16em;
  bottom: 0.2em;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  /*background-color: hsl(231deg 68% 58%); */
  background: hsl(var(--theme-brand-primary-h), calc(var(--theme-brand-primary-s) + 36%),  calc(var(--theme-brand-primary-l) + 4%));
}

input:focus + .slider {
  box-shadow: 0 0 1px hsl(var(--theme-brand-primary-hs), calc(var(--theme-brand-primary-l) + 5));
}

input:checked + .slider:before {
  -webkit-transform: translateX(2.1em);
  -ms-transform: translateX(2.1em);
  transform: translateX(2.1em);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
  border-radius: 4px;
}

.slider.round:before {
  border-radius: 50%;
}

.slider .on, .slider .off {
  color: white;
  font-family: sans-serif;
  position: absolute;
  transform: translate(-50%,-50%);
  top: 46%;
  font-size: 14px;
  font-family: Verdana, sans-serif;
}

.slider .on {
  left: 30%;
  display: none;
}

.slider .off {
  left: 70%;
}

input:checked + .slider .off {
  display: none;
}
input:checked + .slider .on {
  display: block;
}