.selectize-control.loading::before {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 900;
    content: "\f1ce"; /* von fa-circle-notch */
    z-index: 2;
    position: absolute;
    display: block;
    top: calc(50% - 15px);
    right: 34px;
    opacity: 1;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
}

.selectize-input a.remove {
    border-left: 1px solid black;
    color: inherit;
    text-decoration: none;
    padding-left: 0.25rem;
    margin-left: 0.25rem;
}

.input-group .selectize-control:not(:last-child) .selectize-input {
    border-radius: .25rem 0 0 .25rem !important;
}
.input-group .selectize-control:last-child .selectize-input {
    border-radius: .25rem !important;
}
.card-header-vertical {
    border-bottom: none !important;
    border-right: 1px solid rgba(0,0,0,.125) !important;
    padding-bottom: 1rem;
}
.card-header-tabs-vertical {
    margin-right: -1.1rem !important;
}
.card-header.card-header-vertical {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.card-header-vertical > .nav-tabs > .nav-item > .nav-link.active {
    border-color: #dee2e6 #fff #dee2e6 #dee2e6 !important;
}

.card-header-vertical > .nav-tabs > .nav-item > .nav-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: var(--bs-nav-tabs-border-radius, 0.375rem);
}

.pm-ui-loading-opacity-animation {
    pointer-events: none;
    animation: pm-ui-loading-opacity-breath 1s ease-in-out infinite;
}

.pm-datepicker-container {
    z-index: 10;
}

@keyframes pm-ui-loading-opacity-breath {
    0% { opacity: 0.5; }
    50% { opacity: 0.2; }
    100% { opacity: 0.5; }
}

/*
 * Browser-Autofill-Fix für Blazor-Bindings.
 *
 * Problem: Firefox (und teilweise andere Browser) feuern beim Autofill ein input-Event,
 * aber kein change-Event. PMTextbox propagiert die Property-Änderung jedoch nur im
 * change-Pfad. Folge: das Modell sieht den Autofill-Wert nie, der Submit nutzt leere Werte.
 *
 * Lösung: Eine no-op CSS-Animation, die der Browser anstößt, sobald ein Input zur
 * :autofill-Pseudoklasse passt. Ein global registrierter animationstart-Listener in
 * pmInterop.js dispatcht daraufhin synthetisch ein change-Event.
 */
@keyframes pm-ui-on-autofill-start { from { } to { } }
input:autofill,
input:-webkit-autofill {
    animation-name: pm-ui-on-autofill-start;
    animation-duration: 1ms;
}