/*
    Description : Used for the main styles
    --------------------------------------
    Deskripsi : Digunakan untuk gaya utama
*/

/* Import Poppins font from fonts.google.com */
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

.text-slate {
    color: #4e4b66;
}

.text-gray {
    color: #808080;
}

.icon-xs {
    width: 0.25rem !important;
    height: 0.25rem !important;
}

.icon-sm {
    width: 1rem !important;
    height: 1rem !important;
}

.icon {
    width: 1.25rem !important;
    height: 1.25rem !important;
}

.icon-md {
    width: 1.5rem;
    height: 1.5rem;
}

.icon-lg {
    width: 1.75rem;
    height: 1.75rem;
}

.icon-xl {
    width: 2rem;
    height: 2rem;
}

.icon-2xl {
    width: 2.25rem;
    height: 2.25rem;
}

.icon-slate {
    stroke: #4e4b66;
}

a {
    text-decoration: none;
    color: #4e4b66;
}

.badge-primary {
    background-color: #f9ffed;
    border: solid 0.15rem #def1b7;
    color: #649208;
}

.badge-secondary {
    background-color: #f8f8f8;
    border: solid 0.15rem #eaecf0;
    color: #344054;
}

.badge-success {
    background-color: #ecfdf3;
    border: solid 0.15rem #abefc6;
    color: #067647;
}

.badge-pink {
    background-color: #fdf2fa;
    border: solid 0.15rem #fcceee;
    color: #c11574;
}

.badge-blue {
    background-color: #f0f9ff;
    border: solid 0.15rem #b9e6fe;
    color: #026aa2;
}

.badge-orange {
    background-color: #fef6ee;
    border: solid 0.15rem #f9dbaf;
    color: #b93815;
}

.badge-red {
    background-color: #fef3f2;
    border: solid 0.15rem #fecdca;
    color: #b42318;
}

.badge-indigo {
    background-color: #eef4ff;
    border: solid 0.15rem #c7d7fe;
    color: #3538cd;
}

.badge.more:hover .more-badges {
    display: block;
}

.more-badges {
    position: absolute;
    top: -110%;
    left: -50%;
    display: none;
    transition: all 0.3s;
}

/* Loader 6 */
.loader-6 {
    height: 32px;
    width: 32px;
}
.loader-6 span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 32px;
    width: 32px;
}
.loader-6 span::before,
.loader-6 span::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 32px;
    width: 32px;
    border: 2px solid #649208;
    border-radius: 50%;
    opacity: 10;
    -webkit-animation: loader-6-1 1.5s cubic-bezier(0.075, 0.82, 0.165, 1)
        infinite;
    animation: loader-6-1 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) infinite;
}
@-webkit-keyframes loader-6-1 {
    0% {
        -webkit-transform: translate3d(0, 0, 0) scale(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) scale(1.5);
        opacity: 0;
    }
}
@keyframes loader-6-1 {
    0% {
        transform: translate3d(0, 0, 0) scale(0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0) scale(1.5);
        opacity: 0;
    }
}
.loader-6 span::after {
    -webkit-animation: loader-6-2 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s
        infinite;
    animation: loader-6-2 1.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s
        infinite;
}
@-webkit-keyframes loader-6-2 {
    0% {
        -webkit-transform: translate3d(0, 0, 0) scale(0);
        opacity: 1;
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0) scale(1);
        opacity: 0;
    }
}
@keyframes loader-6-2 {
    0% {
        transform: translate3d(0, 0, 0) scale(0);
        opacity: 1;
    }
    100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0;
    }
}
.chat-scroll {
    overflow-y: auto;
    padding-right: 8px;
}

.chat-scroll::-webkit-scrollbar {
    width: 5px;
}

.chat-scroll::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.159);
    border-radius: 2.5px;
}

.fc .fc-button {
    margin: 0 0.25rem;
}
.fc .fc-scrollgrid-section-header th {
    padding: 0 !important;
}