button {
  * {
    color: var(--bs-btn-color);
  }
}

.btn {
  margin: 3px 0px;
}

button.control-btn {
  cursor: pointer;
  min-width: 120px;
  --bs-btn-font-size: 14px;
}

.btn-outline-primary,
.btn-fill-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary-bg);
  --bs-btn-hover-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary-bg);
  --bs-btn-hover-border-color: var(--bs-primary-bg);
  --bs-btn-focus-shadow-rgb: 69, 80, 168;
  --bs-btn-active-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary-bg-active);
  --bs-btn-active-border-color: var(--bs-primary-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-bg: var(--bs-primary-bg);
  --bs-btn-disabled-border-color: var(--bs-primary-bg);
}

.btn-fill-primary {
  --bs-btn-bg: var(--bs-primary-bg);
}

.btn-text-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-primary);
  --bs-btn-active-color: var(--bs-primary);
  --bs-btn-border-color: transparent;
  --bs-btn-active-bg: unset;
  --bs-btn-active-border-color: unset;
  --bs-btn-active-shadow: unset;
  --bs-btn-disabled-bg: unset;
  --bs-btn-disabled-border-color: unset;
  --bs-btn-disabled-shadow: unset;
  --bs-btn-disabled-border-color: unset;
  --bs-btn-disabled-shadow: unset;
}

.btn-outline-secondary,
.btn-fill-secondary {
  --bs-btn-color: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary-bg);
  --bs-btn-hover-color: var(--bs-secondary);
  --bs-btn-hover-bg: var(--bs-secondary-bg);
  --bs-btn-hover-border-color: var(--bs-secondary-bg);
  --bs-btn-focus-shadow-rgb: 42, 161, 220;
  --bs-btn-active-color: var(--bs-secondary);
  --bs-btn-active-bg: var(--bs-secondary-bg-active);
  --bs-btn-active-border-color: var(--bs-secondary-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-secondary);
  --bs-btn-disabled-bg: var(--bs-secondary-bg);
  --bs-btn-disabled-border-color: var(--bs-secondary-bg);
}

.btn-fill-secondary {
  --bs-btn-bg: var(--bs-secondary-bg);
}

.btn-outline-warning,
.btn-fill-warning {
  --bs-btn-color: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning-bg);
  --bs-btn-hover-color: var(--bs-warning);
  --bs-btn-hover-bg: var(--bs-warning-bg);
  --bs-btn-hover-border-color: var(--bs-warning-bg);
  --bs-btn-focus-shadow-rgb: 255, 168, 0;
  --bs-btn-active-color: var(--bs-warning);
  --bs-btn-active-bg: var(--bs-warning-bg-active);
  --bs-btn-active-border-color: var(--bs-warning-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-warning);
  --bs-btn-disabled-bg: var(--bs-warning-bg);
  --bs-btn-disabled-border-color: var(--bs-warning-bg);
}

.btn-fill-warning {
  --bs-btn-bg: var(--bs-warning-bg);
}

.btn-outline-success,
.btn-fill-success {
  --bs-btn-color: var(--bs-success);
  --bs-btn-border-color: var(--bs-success-bg);
  --bs-btn-hover-color: var(--bs-success);
  --bs-btn-hover-bg: var(--bs-success-bg);
  --bs-btn-hover-border-color: var(--bs-success-bg);
  --bs-btn-focus-shadow-rgb: 7, 149, 7;
  --bs-btn-active-color: var(--bs-success);
  --bs-btn-active-bg: var(--bs-success-bg-active);
  --bs-btn-active-border-color: var(--bs-success-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-success);
  --bs-btn-disabled-bg: var(--bs-success-bg);
  --bs-btn-disabled-border-color: var(--bs-success-bg);
}

.btn-fill-success {
  --bs-btn-bg: var(--bs-success-bg);
}

.btn-outline-danger,
.btn-fill-danger {
  --bs-btn-color: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger-bg);
  --bs-btn-hover-color: var(--bs-danger);
  --bs-btn-hover-bg: var(--bs-danger-bg);
  --bs-btn-hover-border-color: var(--bs-danger-bg);
  --bs-btn-focus-shadow-rgb: 215, 18, 18;
  --bs-btn-active-color: var(--bs-danger);
  --bs-btn-active-bg: var(--bs-danger-bg-active);
  --bs-btn-active-border-color: var(--bs-danger-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-danger);
  --bs-btn-disabled-bg: var(--bs-danger-bg);
  --bs-btn-disabled-border-color: var(--bs-danger-bg);
}

.btn-fill-danger {
  --bs-btn-bg: var(--bs-danger-bg);
}

.btn-danger-icon-only {
  --bs-btn-bg: unset;
  --bs-btn-color: var(--bs-danger);
  --bs-btn-border-color: unset;
  --bs-btn-hover-color: unset;
  --bs-btn-hover-bg: unset;
  --bs-btn-hover-border-color: unset;
  --bs-btn-focus-shadow-rgb: unset;
  --bs-btn-active-color: unset;
  --bs-btn-active-bg: unset;
  --bs-btn-active-border-color: unset;
  --bs-btn-active-shadow: unset;
  --bs-btn-disabled-color: unset;
  --bs-btn-disabled-bg: unset;
  --bs-btn-disabled-border-color: unset;
}

.btn-outline-info,
.btn-fill-info {
  --bs-btn-color: var(--bs-info);
  --bs-btn-border-color: var(--bs-info-bg);
  --bs-btn-hover-color: var(--bs-info);
  --bs-btn-hover-bg: var(--bs-info-bg);
  --bs-btn-hover-border-color: var(--bs-info-bg);
  --bs-btn-focus-shadow-rgb: 139, 162, 211;
  --bs-btn-active-color: var(--bs-info);
  --bs-btn-active-bg: var(--bs-info-bg-active);
  --bs-btn-active-border-color: var(--bs-info-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-info);
  --bs-btn-disabled-bg: var(--bs-info-bg);
  --bs-btn-disabled-border-color: var(--bs-info-bg);
}

.btn-fill-info {
  --bs-btn-bg: var(--bs-info-bg);
}

.btn-outline-light,
.btn-fill-light {
  --bs-btn-color: var(--bs-light);
  --bs-btn-border-color: var(--bs-light-bg);
  --bs-btn-hover-color: var(--bs-light);
  --bs-btn-hover-bg: var(--bs-light-bg);
  --bs-btn-hover-border-color: var(--bs-light-bg);
  --bs-btn-focus-shadow-rgb: 109, 109, 109;
  --bs-btn-active-color: var(--bs-light);
  --bs-btn-active-bg: var(--bs-light-bg-active);
  --bs-btn-active-border-color: var(--bs-light-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-light);
  --bs-btn-disabled-bg: var(--bs-light-bg);
  --bs-btn-disabled-border-color: var(--bs-light-bg);
}

.btn-fill-light {
  --bs-btn-bg: var(--bs-light-bg);
}

.btn-outline-dark,
.btn-fill-dark {
  --bs-btn-color: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark-bg);
  --bs-btn-hover-color: var(--bs-dark);
  --bs-btn-hover-bg: var(--bs-dark-bg);
  --bs-btn-hover-border-color: var(--bs-dark-bg);
  --bs-btn-focus-shadow-rgb: 43, 43, 43;
  --bs-btn-active-color: var(--bs-dark);
  --bs-btn-active-bg: var(--bs-dark-bg-active);
  --bs-btn-active-border-color: var(--bs-dark-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-dark);
  --bs-btn-disabled-bg: var(--bs-dark-bg);
  --bs-btn-disabled-border-color: var(--bs-dark-bg);
}

.btn-fill-dark {
  --bs-btn-bg: var(--bs-dark-bg);
}

.btn-outline-black,
.btn-fill-black {
  --bs-btn-color: var(--bs-black);
  --bs-btn-border-color: var(--bs-black-bg);
  --bs-btn-hover-color: var(--bs-black);
  --bs-btn-hover-bg: var(--bs-black-bg);
  --bs-btn-hover-border-color: var(--bs-black-bg);
  --bs-btn-focus-shadow-rgb: 0, 0, 0;
  --bs-btn-active-color: var(--bs-black);
  --bs-btn-active-bg: var(--bs-black-bg-active);
  --bs-btn-active-border-color: var(--bs-black-bg-active);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bs-black);
  --bs-btn-disabled-bg: var(--bs-black-bg);
  --bs-btn-disabled-border-color: var(--bs-black-bg);
}

.btn-fill-black {
  --bs-btn-bg: var(--bs-black-bg);
}

.round-btn {
  --bs-btn-border-radius: 1.25rem;
}

.btn-sm {
  --bs-btn-font-size: 0.8em;
  font-size: var(--bs-btn-font-size) !important;
}
