body {
    overflow-x: hidden;
    font-family: "IBM Plex Sans Thai", sans-serif;
}

#sidebar-wrapper {
    min-height: 100vh;
    margin-left: -15rem;
    width: 19rem;
    -webkit-transition: margin 0.25s ease-out;
    -moz-transition: margin 0.25s ease-out;
    -o-transition: margin 0.25s ease-out;
    transition: margin 0.25s ease-out;
}

#sidebar-wrapper .sidebar-heading {
    padding: 0.875rem 1.25rem;
    font-size: 1.2rem;
    width: 15rem;
}

#sidebar-wrapper .list-group {
    width: 15rem;
}

#page-content-wrapper {
    min-width: 100vw;
}

#wrapper.toggled #sidebar-wrapper {
    margin-left: 0;
}

.list-group-item.active {
    border-radius: 0 60px 60px 0;
    color: #34b6ee !important;
    border-left: 5px solid #34b6ee !important;
    background: #f2f7f8;
    opacity: 1;
    margin-left: 0 !important;
}

.submenu-group-item.active {
    color: #000000 !important;
    opacity: 1;
    margin-left: 0 !important;
}
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 50px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
[data-toggle="collapse"][aria-expanded="true"] .caret {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.submenu-group-item-action:hover {
    text-decoration: none;
    border-radius: 0 60px 60px 0;
    color: rgb(255, 255, 255);
    background: #0197ca;
    margin-left: 10%;
    opacity: 1;
    margin-left: 0 !important;
}
.submenu-group-item {
    width: 97%;
    color: rgb(221, 224, 255);
}

.submenu-group-item {
    position: relative;
    display: block;
    padding: 0.5rem 1rem;
    text-decoration: none;
    background-color: transparent;
    border: 0px solid rgba(0, 0, 0, 0.125);
}

.submenu-group-item-action {
    width: 95%;
    padding-left: 40px;
    text-align: inherit;
}

.list-group-item {
    /* border: 1px solid rgba(255, 255, 255, 0.125) !important; */
    width: 97%;
    color: white;
}

.navbar-expand-lg {
    box-shadow: 0 3px 6px 0 rgb(187 190 204 / 21%);
}

.list-group-item-action:hover {
    color: #000;
    margin-left: 3%;
    border-radius: 0 60px 60px 0;
    color: #34b6ee !important;
    border-left: 5px solid #34b6ee !important;
    background: #f2f7f8;
    /* box-shadow: 0 7px 12px 0 rgb(95 118 232 / 21%); */
    opacity: 1;
    margin-left: 0 !important;
}

.navbar-light .navbar-nav .nav-link {
    color: #0197ca !important;
}

.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    will-change: opacity, transform;
    -webkit-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}

.scroll-sidebar {
    overflow: scroll;
    height: 100%;
    position: fixed;
}

#navbar-small {
    position: relative;
    right: 0;
}

.list-group-item {
    position: relative;
    display: block;
    padding: 0.5rem 1rem;
    text-decoration: none;
    background-color: transparent;
    border: 0px solid rgba(0, 0, 0, 0.125);
}

.list-group-item-action {
    width: 95%;
    color: white;
    text-align: inherit;
}

.btn-primary {
    background-color: #34b6ee !important;
    border-color: #34b6ee !important;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:focus {
    background-color: #0197ca !important;
    border-color: #0197ca !important;
}

.btn-success {
    background-color: #00cc88 !important;
    border-color: #00cc88 !important;
}

.btn-success:hover,
.btn-success:active,
.btn-success:visited,
.btn-success:focus {
    background-color: #02ac73 !important;
    border-color: #02ac73 !important;
}

#form-select {
    display: inline-block;
}

#div_adjust {
    display: none;
}

.scroll-sidebar::-webkit-scrollbar {
    display: none;
}

/* #graph-dashboard {
    background: white;
    border-radius: 15px;
    box-shadow: 0 3px 6px 0 rgb(187 190 204 / 21%);
} */

@media (min-width: 768px) {
    #sidebar-wrapper {
        margin-left: 0;
    }
    #page-content-wrapper {
        min-width: 0;
        width: 100%;
    }
    #wrapper.toggled #sidebar-wrapper {
        margin-left: -19rem;
    }
    #navbar-small {
        position: fixed !important;
    }
    .sidebar-fixed1 {
        position: fixed;
    }
}