html, body {
    font-family: 'Euclid Circular B', sans-serif;
    background: #FAFAFA;
}

.sticky-top {
    position: sticky;
    top: 89px;
    z-index: 1020;
}

.tooltip {
    font-size: 10px;
}

.input-validation-error {
    border-color: var(--bs-form-invalid-border-color);
    padding-right: calc(1.5em + 1.55rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23F8285A'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23F8285A' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.3875rem) center;
    background-size: calc(0.75em + 0.775rem) calc(0.75em + 0.775rem);
}

.mb-10rem {
    margin-bottom: 10rem !important;
}

.table {
    margin-bottom: 0 !important;
}

.title-icon {
    font-size: 36px;
}

.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-select ~ label::after {
    background-color: transparent !important;
}

button > .material-icons, a.btn > .material-icons, button > div > .material-icons {
    font-size: 22px;
}

.alert ul {
    margin-bottom: 0;
    padding: 0;
}

.alert ul li {
    list-style-type: none;
}

#toast {
    position: fixed;
    top: 0;
    width: 100%;
    height: 60px;
    text-align: center;
    background: var(--bs-success);
    animation: slide 2s ease-in-out 0s 1 normal forwards;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px !important;
    font-weight: 500;
    color: #FFF;
    opacity: .9;
    z-index: 9999;
}

@keyframes slide {
    0% {
        margin-top: -60px;
    }
    25% {
        margin-top: 0;
    }
    75% {
        margin-top: 0;
    }
    100% {
        margin-top: -60px;
    }
}