html{
    scrollbar-width: 10px;
    scrollbar-color: #888 rgba(255,255,255,0.1);
    touch-action: none;
}
/* width */
::-webkit-scrollbar {
    width: 10px !important;
}
/* Track */
::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.1) !important;
    border-radius: 10px !important;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888 !important;
    border-radius: 10px !important;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555 !important; 
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-top:0 !important;
}
body {
    background: rgb(200,200,200);
    background: linear-gradient(215deg, rgba(200,200,200,1) 0%, rgba(255,255,255,1) 30%, rgba(228,225,255,1) 60%, rgba(210,210,210,1) 100%) !important;
}
.navbar {
    background: rgb(190,189,208);
    background: linear-gradient(circle, rgba(223,222,233,0.9) 0%, rgba(255, 233, 233, 0.9) 50%, rgba(222, 222, 255, 0.9) 100%) !important;
}
.dark-mode .navbar {
    background: rgb(24,23,47);
    background: radial-gradient(circle, rgba(13, 10, 21, 0.9) 0%, rgba(15, 14, 21, 0.9) 50%, rgba(18,0,0,0.9) 100%) !important;
}
body.dark-mode {
    background: rgb(56,56,56);
    background: linear-gradient(215deg, rgba(41,41,41,1) 0%, rgba(45,34,34,1) 30%, rgba(34,30,79,1) 60%, rgba(27,28,61,1) 100%) !important;
} 
.sidebar {
    background: rgb(200,200,200);
    background: radial-gradient(circle, rgba(244, 241, 241, 0.9) 9%, rgba(239, 233, 233, 0.9) 69%, rgba(217, 222, 223, 0.9) 100%) !important;
}
.dark-mode .sidebar{
    background: rgb(71,71,71);
    background: radial-gradient(circle, rgba(37, 36, 40, 0.9) 30%, rgba(28, 27, 32,0.9) 69%, rgba(32, 30, 34,0.9) 100%) !important;
}
.card {
    border-radius: 1.2rem !important;
    margin: 10px !important;
    background: rgb(249,252,255);
    background: linear-gradient(45deg, rgba(249,252,255,0.9) 0%, rgba(255, 250, 250, 0.9) 100%) !important;
}
.dark-mode .card {
    background-color: rgb(25,28,32);
    background: linear-gradient(45deg, rgba(25,25,32,0.9) 0%, rgba(25,31,32,0.9) 100%) !important;
}
.dark-mode .sidebar-link-with-icon .sidebar-icon {
    border-radius: 1.2rem;
}
.sidebar-link-with-icon .sidebar-icon {
    border-radius: 1.2rem;
}
.oak_pointer {
    cursor: pointer !important;
}
.dark-mode .oak_pointer:hover {
    background-color: rgba(255, 255, 255, 0.4) !important;
}
.oak_pointer:hover {
    background-color: rgba( 0, 0, 0, 0.4) !important;
}

.dark-mode .select2-container--default .select2-selection--multiple {
    background-color: rgba(255, 255, 255, 0.05);
    height: 34px;
}
.dark-mode .select2-dropdown {
    background-color: rgb(60, 60, 60);
}
.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color:rgba(255, 255, 255, 0.25);
}
.dark-mode .select2-container--default .select2-search--inline .select2-search__field {
    color:white;
    height: 38px;
}
.dark-mode .select2-container--default .select2-results__option--selected {
    background-color:rgba(255, 255, 255, 0.45) ;
}


.form-check {
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    line-height: 1.6rem;
}
.form-group .form-check {
    margin: 0.8rem 0 0 0;
}
.form-check input[type="radio"] {
    /* Hide the default */
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
}
.form-check label {
    display: inline-block;
    margin-bottom: 0;
    padding-left: 2.5rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.form-check label.blank {
    padding-left: 1.6rem;
}
.form-check label:before {
    content: "";
    display: inline-block;
    position: absolute;
    height: 1.6rem;
    width: 1.6rem;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 50%;
}
.form-check input[type="radio"]:hover~label:before {
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.4);
}
.form-check input[type="radio"]:focus~label:before {
    border-color: rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.6);
    -webkit-box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.6);
    box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.6);
}
.form-check input[type="radio"]:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.form-check input[type="radio"]:checked:focus~label:before {
    border-color: #1890ff;
    -moz-box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
    -webkit-box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
    box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
}
.dark-mode .form-check label:before {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.15);
}
.dark-mode .form-check input[type="radio"]:hover~label:before {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.3);
}
.dark-mode .form-check input[type="radio"]:focus~label:before {
    border-color: rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.3);
    -webkit-box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.3);
    box-shadow: 0 0 0 0.2rem rgba(24, 144, 255, 0.3);
}
.dark-mode .form-check input[type="radio"]:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.dark-mode .form-check input[type="radio"]:checked:focus~label:before {
    border-color: #1890ff;
    -moz-box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
    -webkit-box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
    box-shadow: 0 0 0 0.3rem rgba(24, 144, 255, 0.3);
}
.form-check label:after{
    content: "";
    position: absolute;
    display: none;
    top: 0.5rem;
    left: 0.5rem;
    width: 0.6rem;
    height: 0.6rem;
    background-color: #ffffff;
    border-radius: 50%;
}
.dark-mode .form-check label:after {
    border-color: #ffffff;
}
.form-check input[type="radio"]:checked~label:after {
    display: block;
}
.form-check input[type="radio"]:disabled~label {
    opacity: 0.6;
    cursor: not-allowed;
}
.form-check input[type="radio"]:disabled~label:before {
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.3);
}
.form-check input[type="radio"]:hover:disabled~label:before {
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.3);
}
.form-check input[type="radio"]:disabled:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.form-check input[type="radio"]:hover:disabled:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.dark-mode .form-check input[type="radio"]:disabled~label:before {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.15);
}
.dark-mode .form-check input[type="radio"]:hover:disabled~label:before {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.15);
}
.dark-mode .form-check input[type="radio"]:disabled:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.dark-mode .form-check input[type="radio"]:hover:disabled:checked~label:before {
    background-color: #1890ff;
    border-color: #1890ff;
}
.share-users {
    background-color: #111417;
}
select2 select2-container select2-container--default select2-container--below select2-container--focus {
    width: full;
}
.select2-container--default .select2-selection--single {
    background-color: rgba(0, 0, 0, 0.4) !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: rgba( 0, 0, 0, 0.4) !important;
    color:#fff !important;
}

.card .bg-very-dark {
    background-color: rgb(25,28,32);
    background: linear-gradient(45deg, rgba(20, 20, 28, 0.9) 0%, rgba(10, 21, 24, 0.9) 100%) !important;
}