/* Custom CSS Overrides for HRatsch */

/* Globale Farb-Variablen */
:root {
  --primary: #336699;
  --primary-hover: #44407A;
  --primary-disabled: #C5C4DD;
  --primary-outline-disabled: #B0AED0;
  --primary-box-shadow: rgba(86, 83, 147, 0.5);

  /* Hintergrundfarbe für Auftraggeber */
  --requester-box-bg: #e4eceb;

  /* Hintergrundfarbe für Serviceanbieter */
  --provider-box-bg: #f2f2f2;

}

/* Button Primary Color Override */
.btn-primary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: var(--primary-hover) !important;
  border-color: var(--primary-hover) !important;
  color: #fff !important;
}

.btn-primary:focus,
.btn-primary.focus {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 0.25rem var(--primary-box-shadow) !important;
}

.btn-primary:active,
.btn-primary.active,
.btn-primary.dropdown-toggle.show {
  background-color: var(--primary-hover) !important;
  border-color: var(--primary-hover) !important;
  color: #fff !important;
}

.btn-primary:active:focus,
.btn-primary.active:focus,
.btn-primary.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem var(--primary-box-shadow) !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
  background-color: var(--primary-disabled) !important;  /* Hellere Variante */
  border-color: var(--primary-disabled) !important;
  color: #888 !important;
  opacity: 0.65 !important;
}

/* Button Outline Primary Color Override */
.btn-outline-primary {
  color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.btn-outline-primary:hover {
  color: #fff !important;
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
  box-shadow: 0 0 0 0.25rem var(--primary-box-shadow) !important;
}

.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show {
  color: #fff !important;
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.btn-outline-primary:active:focus,
.btn-outline-primary.active:focus,
.btn-outline-primary.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem var(--primary-box-shadow) !important;
}

.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
  color: var(--primary-outline-disabled) !important;  /* Gedimmt */
  border-color: var(--primary-outline-disabled) !important;
}