.app-sidebar[data-background-color='black'],
.off-canvas-sidebar[data-background-color='black'] {
    background-color: #1a1c1e;
}

.app-sidebar[data-background-color='black'] .navigation li a,
.off-canvas-sidebar[data-background-color='black'] .navigation li a {
    color: #f2f2f2;
}

.app-sidebar .navigation>li.active>a,
.off-canvas-sidebar .navigation>li.active>a{
    background: #fcfbfc;
    color: #181818 !important;
}

.app-sidebar .navigation li.active a,
.off-canvas-sidebar .navigation li.active a{
    background: #fcfbfc;
    color: #181818 !important;
}

.app-sidebar .navigation>li.active>a i,
.off-canvas-sidebar .navigation>li.active>a i{
    color: #181818 !important;
}

.wrapper.menu-collapsed .app-sidebar:not(:hover) .navigation li.nav-collapsed-open>a i,
.wrapper.menu-collapsed .off-canvas-sidebar:not(:hover) .navigation li.nav-collapsed-open>a i{
    color: #181818 !important;
}

.app-sidebar .navigation li.active a:before,
.off-canvas-sidebar .navigation li.active a:before{
    background-color: #181818;
    border-color: #181818;
}

.wrapper
    .app-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.active
    a,
.wrapper
    .off-canvas-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.active
    a {
    background: rgba(200, 200, 200, 0.2);
    color: #777 !important;
}

.wrapper
    .app-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.active
    i,
.wrapper
    .off-canvas-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.active
    i {
    color: #777 !important;
}

.wrapper.menu-collapsed
    .app-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.nav-collapsed-open
    a,
.wrapper.menu-collapsed
    .off-canvas-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.nav-collapsed-open
    a {
    background: rgba(200, 200, 200, 0.2);
    color: #777 !important;
}

.wrapper.menu-collapsed
    .app-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.nav-collapsed-open
    a
    i,
.wrapper.menu-collapsed
    .off-canvas-sidebar:not(:hover)[data-background-color="white"]
    .navigation
    li.nav-collapsed-open
    a
    i {
    color: #777 !important;
}

.app-sidebar[data-background-color="white"] .navigation li.active i,
.off-canvas-sidebar[data-background-color="white"] .navigation li.active i {
    color: #000 !important;
}

.app-sidebar[data-background-color="white"] .navigation li.active a,
.off-canvas-sidebar[data-background-color="white"] .navigation li.active a {
    background: rgba(200, 200, 200, 0.2);
    color: #000 !important;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: -70%;
    left: -50%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

.dropdown-submenu > a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 10px;
    margin-right: -10px;
}

.dropdown-submenu:hover > a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-item a {
    color: #212529;
    display: block;
}

.nav-tabs .nav-link {
    background-color: transparent;
    color: #454545;
}

.nav-tabs .nav-link.active {
    background-color: transparent;
    color: #616161;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #ffffff;
    background-color: #28d094;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    border-color: #28d094 #28d094 #f4f5fa;
}

.select2-container {
    width: 100% !important;
    padding: 0;
}

ul.ui-autocomplete {
    z-index: 1100;
}

.modal {
    overflow-y: auto;
}

@media (min-width: 992px) {
    .modal-xl {
        max-width: 95%;
    }
    .modal-lg {
        max-width: 75%;
    }
}

@media (min-width: 600px) {
    .modal-xl {
        max-width: 99%;
    }
}

@media only screen and (max-width: 768px) {
    .col-1,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-10,
    .col-11,
    .col-12,
    .col,
    .col-auto,
    .col-sm-1,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-sm,
    .col-sm-auto,
    .col-md-1,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md,
    .col-md-auto,
    .col-lg-1,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-lg,
    .col-lg-auto,
    .col-xl-1,
    .col-xl-2,
    .col-xl-3,
    .col-xl-4,
    .col-xl-5,
    .col-xl-6,
    .col-xl-7,
    .col-xl-8,
    .col-xl-9,
    .col-xl-10,
    .col-xl-11,
    .col-xl-12,
    .col-xl,
    .col-xl-auto {
        padding-left: 10px;
        padding-right: 10px;
    }

    .content-wrapper {
        padding: 0 0;
    }

    .app-sidebar .logo-img,
    .off-canvas-sidebar .logo-img {
        margin-right: 0;
    }
}
.btn-xs {
    padding: 3px 4px;
    font-size: 12px;
    line-height: 12px;
    border-radius: 0.2rem;
}
.bootstrap-select button {
    border: 1px solid #CED4DA !important;
    margin-bottom: 0px !important;
}
.badge-xs {
    color: white !important;
    padding: 3px 4px !important;
    font-size: 10px !important;
    font-weight: normal !important;
}
.accordion button {
    text-decoration: none !important;
}
.item-asesmen {
    padding: 4px 8px !important;
    border: 1px solid #888 !important;
    border-radius: 8px !important;
}
.tab-asesmen.active {
    color: #fff;
    background-color: #28D094;
    margin: 0 4px;
}
.tab-asesmen {
    color: #fff;
    background-color: #868E96;
    margin: 0 4px;
}
.tab-asesmen:hover {
    color: #fff;
}
.icon-tab-asesmen {
    padding: 3px 7px !important;
}
.dataTables_processing {
    width: auto !important;
    padding: 0 !important;
    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    border-radius: 12px !important;
}
.img-loading-datatable {
    max-width: 140px;
    max-height: 140px;
    background-position: center;
    background-size: contain;
}
table.dataTable {
    margin-top: 0 !important;
}
.cursor-pointer {
    cursor: pointer !important;
}
.dokumen-klaim-item:hover {
    cursor: pointer;
    background-color: #0A9E67;
}
.dokumen-klaim-item-success:hover {
    cursor: pointer;
    background-color: #0A9E67;
}
.dokumen-klaim-item-warning:hover {
    cursor: pointer;
    background-color: #C14E02;
}
input.form-check-lg {
    width: 20px !important;
    height: 20px !important;
}
.table-keranjang .dataTables_length,
.table-keranjang .dataTables_filter,
.table-keranjang .dataTables_paginate
{
    display: none !important;
}
.badge-orange {
    background-color: #FD7E14 !important;
}
.badge-yellow {
    background-color: #FFC107 !important;
}
.table-text-small {
    font-size: 9pt !important;
}
.alert-ews-green { color: #000; background-color: #D8E4BC; }
.alert-ews-yellow { color: #000; background-color: #FFFF99; }
.alert-ews-orange { color: #000; background-color: #FABF8F; }
.alert-ews-red { color: #000; background-color: #FF7C80; }

.alert-pews-green { color: #000; background-color: #D8E4BC; }
.alert-pews-yellow { color: #000; background-color: #FFFF99; }
.alert-pews-orange { color: #000; background-color: #FABF8F; }
.alert-pews-red { color: #000; background-color: #FF7C80; }

.card-link {cursor:pointer; !important;}

.card h4.card-title-sm {
    font-weight: 600;
    letter-spacing: 0.05rem;
    font-size: 1rem;
    margin-bottom: 0;
}
.info-pasien {
    font-size: 12px !important;
    line-height: 20px !important;
}
@keyframes movingGradient {
    0% { background-position: 0 50%; }
    100% { background-position: 100% 50%; }
}
.btn-blink-alergi {
    background: linear-gradient(270deg, red, orange);
    background-size: 400% 400%;
    animation: movingGradient 1s infinite alternate ease-in-out;
}
.modal-dialog-scrollable .modal-content {
    height: 90vh !important;
}
.modal-dialog-scrollable .modal-body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
.vertical-title {
    width: 1% !important;
    vertical-align: middle !important;
    padding: 10px !important;
    font-size: 16px !important;
    background-color: #888 !important;
    color: #fff !important;
}