.fa-regular.fa-circle-user {
    color: #007bff;
    font-size: 1.5rem;
}
.custom-icon {
    font-size: 0.85rem;
}

.bootstrap-alert-warning {
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffe69c;
    text-align: center;
}
.user-panel .info {
    color: white;
}
.custom-file-label::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: block;
    height: 2.25rem;
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    color: white;
    content: "Browse";
    background-color: #007bff;
    border-left: inherit;
    border-radius: 0 0.25rem 0.25rem 0;
}
.bootstrap-alert-success {
    color: #0a3622;
    background-color: #d1e7dd;
    border-color: #a3cfbb;
    text-align: center;
}
.bootstrap-alert-danger {
    color: #58151c;
    background-color: #f8d7da;
    border-color: #f1aeb5;
    text-align: center;
}
.navbar {
    position: relative;
    display: block;

    -ms-flex-align: center;
    align-items: center;

    padding: 0.5rem 0.5rem;
}

.nav-sidebar .nav-item > .nav-link.active {
    position: relative;
    background-color: #007bff;
}

/* Custom CSS for badge */
.notification-badge {
    position: relative;
}

.notification-badge .badge {
    position: absolute;
    top: -7px;
    right: -10px;
}
.centered-image {
    max-width: 100%;
    max-height: 100%;
    border-radius: 5%;
    display: block;
    margin: 0 auto;
}

#notificationDropdown {
    right: 0;
    left: auto;
}

.notification-text {
    font-size: 15px;
}

#global-loader,
.loader {
    position: fixed;
    z-index: 50000;
    background: #fff;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.loader-img {
    position: absolute;
    right: 0;
    bottom: 0;
    top: 43%;
    left: 0;
    margin: 0 auto;
    text-align: center;
}

.loader-img,
.loader-text {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;
}

.loader-text {
    top: 60%;
}
.custom-rounded-edges {
    border-radius: 15px !important;
}
.input-box {
    position: relative;
}

.input-box i {
    position: absolute;
    right: 13px;
    top: 12px;
    color: #ced4da;
}

.rounded-small {
    border-radius: 0.1em !important;
}
.row-no-padding-left {
    [class*="col"] {
        padding-left: 0 !important;
    }
}

@font-face {
    font-family: "Source Sans Pro";
    font-style: normal;
    font-display: block;
    src: url(../fonts/SourceSans3.ttf) format("truetype");
}

@font-face {
    font-family: "poppins";
    font-style: normal;
    font-display: block;
    src: url(../webfonts/poppins/Poppins-Regular.ttf) format("truetype");
}

@font-face {
    font-family: "poppins";
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url(../webfonts/poppins/Poppins-Light.ttf) format("truetype");
}

@font-face {
    font-family: "roboto";
    font-style: normal;
    font-display: block;
    src: url(../webfonts/roboto/Roboto-Regular.ttf) format("truetype");
}

@font-face {
    font-family: "roboto";
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url(../webfonts/roboto/Roboto-Light.ttf) format("truetype");
}

@font-face {
    font-family: "luisa";
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url(../webfonts/luisa/luisa.ttf) format("truetype");
}

@font-face {
    font-family: "street_corner";
    font-style: oblique;
    font-weight: 100;
    font-display: block;
    src: url(../webfonts/street_corner/street_corner_oblique.ttf) format("truetype");
}

.dropdown-menu a {
    user-select: none;
    cursor: pointer;
}

/* component spinner */

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

@keyframes modal-spinner {
    to {
        transform: rotate(360deg);
    }
}

.spinner:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 5%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    border-radius: 50%;
    border: 1px solid #ccc;
    border-top-color: #07d;
    animation: spinner 0.6s linear infinite;
}

.modal-spinner:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    border-radius: 50%;
    border: 1px solid #ccc;
    border-top-color: #07d;
    animation: spinner 0.6s linear infinite;
}

@keyframes chart-spinner {
    to {
        transform: rotate(360deg);
    }
}
.chart-spinner:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 80%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    border-radius: 50%;
    border: 1px solid #ccc;
    border-top-color: #07d;
    animation: spinner 0.6s linear infinite;
}

.scrollable {
    height: 400px;
    overflow-y: auto;
}

.scrollable-pivot-table {
    height: 300px;
    overflow-y: auto;
}

.smaller-font {
    font-size: 80% !important;
}

.srm-button {
    border-radius: 50px;
    font-family: "roboto", "arial";
}

.quick-add-link {
    color: black;
    cursor: pointer;
    font-weight: bold;
}

.srm-code {
    color: black;
    user-select: all;
    display: block;
    white-space: normal;
    max-width: 100%;
    word-break: break-all;
    word-wrap: break-word;
}

.text-black {
    color: black;
}