body {
    font-family: 'IBM Plex Sans Thai', sans-serif;
}
.badge-orange {
    color: var(--bs-danger-inverse);
    background-color: var(--bs-orange);
}
.badge-orange.badge-outline {
    border: 1px solid var(--bs-orange);
    color: var(--bs-orange);
    background-color: transparent;
}
.badge-light-orange {
    color: var(--bs-orange);
    background-color: var(--bs-danger-light);
}

.btn-orange {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--bs-orange);
    --bs-btn-border-color: var(--bs-orange);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #e16612;
    --bs-btn-hover-border-color: var(--bs-orange);
    --bs-btn-focus-shadow-rgb: 205, 55, 92;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: var(--bs-orange);
    --bs-btn-active-border-color: var(--bs-orange);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000000;
    --bs-btn-disabled-bg: var(--bs-orange);
    --bs-btn-disabled-border-color: var(--bs-orange);
}

[data-kt-app-layout=dark-sidebar] .app-sidebar {
    background-color: #244481;
    border-right: 0;
}

element.style {
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu > .menu-item .menu-link .menu-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu > .menu-item .menu-link .menu-icon .svg-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu > .menu-item .menu-link .menu-icon i {
    color: #fff;
}

.symbol.symbol-light-success .symbol-label {
    background-color: #C9F7F5;
    color: #1BC5BD;
}

.success-custom {
    color: var(--bs-success) !important;
    background-color: var(--bs-success-light) !important;
}

.bg-success-custom {
    background-color: var(--bs-success) !important;
}

.warning-custom {
    color: var(--bs-warning);
    background-color: var(--bs-warning-light);
}

.bg-warning-custom {
    background-color: var(--bs-warning);
}

.orange-custom {
    color: var(--bs-info);
    background-color: var(--bs-info-light);
}

.bg-orange-custom {
    background-color: var(--bs-info);
}

.primary-100-custom {
    color: var(--bs-primary);
    background-color: var(--bs-primary-light);
}

.bg-primary-100-custom {
    background-color: var(--bs-primary);
}

.danger-custom {
    color: var(--bs-danger);
    background-color: var(--bs-danger-light);
}

.bg-danger-custom {
    background-color: var(--bs-danger);
}

.dark-custom {
    color: var(--bs-dark);
    background-color: var(--bs-dark-light);
}

.bg-dark-custom {
    background-color: var(--bs-dark);
}