/* start import font  */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
/* end import font  */

.ck-editor__editable,
textarea {
    min-height: 150px;
}

.datatable {
    width: 100% !important;
}

table.dataTable tbody td.select-checkbox::before,
table.dataTable tbody td.select-checkbox::after,
table.dataTable tbody th.select-checkbox::before,
table.dataTable tbody th.select-checkbox::after {
    top: 50%;
}

.dataTables_length,
.dataTables_filter,
.dt-buttons {
    margin-bottom: 0.333em;
}

.dt-buttons .btn {
    margin-left: 0.333em;
    border-radius: 0;
}

.table.datatable {
    box-sizing: border-box;
    border-collapse: collapse;
}

table.dataTable thead th {
    border-bottom: 2px solid #dee2e6;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #dee2e6;
}

.select2 {
    max-width: 100%;
    width: 100%;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    background-image: none;
}

.btn-group-xs > .btn,
.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.searchable-title {
    font-weight: bold;
}
.select2-container--open {
    z-index: 9999;
}
.searchable-fields {
    padding-left:5px;
}
.searchable-link {
    padding:0 5px 0 5px;
}
.searchable-link:hover   {
    cursor: pointer;
    background: #eaeaea;
}
.select2-results__option {
    padding-left: 0px;
    padding-right: 0px;
}

.form-group .required::after {
    content: " *";
    color: red;
}

.form-check.is-invalid ~ .invalid-feedback {
    display: block;
}

.dataTables_length label select {
    width: 65px!important;
}

div.dt-button-collection {
    padding: 0;
}

.buttons-columnVisibility {
    display: block;
}

.buttons-columnVisibility.active {
    background-color: rgba(128, 128, 128, 0.1);
    font-weight: bolder;
}

/* start figma styles  */
.body-background{
    background: url('/images/login.png') no-repeat center center !important;
    background-size: cover !important;
}
.login-parent-container, .login-header{
    color: #fff !important;
}
body {
    font-family: "Source Sans 3", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 0.875rem;
}
.invalid-feedback{
    font-family: "Source Sans 3", sans-serif;
    font-size: 0.875rem;
    font-size: 14px;
    font-weight: bold;
}
label, a{
    font-family: "Source Sans 3", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    font-style: normal;
}
header.login-header{
    font-family: "Source Sans 3", sans-serif;
    padding: 1.25rem 0 0 1.875rem;
    font-size: 2rem;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: italic;
}
.login-parent-container .form-control{
    border: 0.3px solid #85CE36;
    background: #455461 !important;
    color: #fff !important;
}
.login-parent-container .form-control::placeholder {
    color: #ddd !important;
}
.form-control:focus {
    border-color: #85CE36;
    box-shadow: inset 0 0 0 transparent, 0 0 0 .2rem #85CE3625;
}
a{
    color: #85CE36;
}
a:hover{
    color: #85CE3699;
}
.login-parent-container label{
    color: #fff;
}
.btn-primary{
    background: linear-gradient(90deg, #38620A 0%, #85CE36 62%, #89D338 62.01%) !important;
    border-radius: 6.25rem !important;
    border: 0 !important;
}
.login-parent-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin-top: -4.375em !important;
}
.login-parent-container .icheck-primary>input:first-child:checked+input[type=hidden]+label::before, .icheck-primary>input:first-child:checked+label::before {
    background-color: #85CE36 !important;
    border-color: #85CE36 !important;
}
.login-parent-container [class*=icheck-]>input:first-child+input[type=hidden]+label::before, [class*=icheck-]>input:first-child+label::before {
    border-radius: 0.313rem !important
}
.login-parent-container .icheck-primary>input:first-child:not(:checked):not(:disabled):hover+input[type=hidden]+label::before, .icheck-primary>input:first-child:not(:checked):not(:disabled):hover+label::before {
    border-color: #85CE36 !important;
}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle 
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle
{
    background-color:#85CE36 !important;
    border-color:#85CE36 !important;
}
.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-primary.dropdown-toggle:focus {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125), 0 0 0 .2rem  rgba(133, 206, 54, .5);
}
.btn-outline-primary.focus, .btn-outline-primary:focus {
    box-shadow: 0 0 0 .2rem rgba(133, 206, 54, .5);
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus
.btn-primary.focus, .btn-primary:focus
{
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125), 0 0 0 .2rem rgba(133, 206, 54, .5);
}


.btn-outline-primary{
    border-color: #85CE36;
    color: #85CE36;
    border-radius: 6.25rem !important;
    
}

.badge-outline-main{
    color: #85CE36;
    border:solid 1px #85CE36;
}
.badge-outline-main:hover{
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    background-color: #85CE36;
    box-shadow: 0 0 30px 5px #85CE3682;
    color: #fff;
}
.badge-outline-primary{
    color: #007bff;
    border:solid 1px #007bff;
}
.badge-outline-primary:hover{
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    background-color: #007bff;
    box-shadow: 0 0 30px 5px #007bff82;
    color: #fff;
}
.badge-outline-danger{
    color: #DC3545;
    border:solid 1px #DC3545;
}
.badge-outline-danger:hover{
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    background-color: #DC3545;
    box-shadow: 0 0 30px 5px #DC354582;
    color: #fff;
}
.badge-outline-info{
    color: #17A2B8;
    border:solid 1px #17A2B8;
}

.badge-outline-info:hover{
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    background-color: #17A2B8;
    box-shadow: 0 0 30px 5px #17A2B882;
    color: #fff;
}
.btn-outline-primary:hover {
    background: linear-gradient(90deg, #38620A 0%, #85CE36 62%, #89D338 62.01%) !important;
    box-shadow: 0 0 30px 5px #85CE3682;
    border-color: #85CE36;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}


.badge-pill{
    padding:5px;
    cursor: pointer;
}

.badge{
    padding: 6px;
    cursor: pointer;
}

.badge-main{
    background-color: #85ce36;
    color: #fff;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice, .page-item.active .page-link {
    border-color: #85ce36;
    background-color: #85ce36;
    color: #fff;
}

.bg-dark, .sidebar-dark-primary{
    background-color: #3A4651 !important;
    
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    background: linear-gradient(90deg, #85CE36 54%, #85CE36 100%, #85CE36 100%);
    color: #fff;
}
th:last-child{
    min-width: 150px !important;
}

.card-header{
    font-family: "Source Sans 3", sans-serif;
    font-size: 1rem;
    font-weight: 400;
}

.paginate_button{
    padding: 0 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border: 1px solid #85ce36 !important;
    background: linear-gradient(90deg, #85CE36 54%, #85CE36 100%, #85CE36 100%);
}

.alert-success, .bg-success, .label-success {
    border-color: #85ce36 !important;
    background: linear-gradient(90deg, #85CE36 54%, #85CE36 100%, #85CE36 100%);
}
.alert-danger, .bg-danger, .label-danger {
    border-color: #dc3545 !important;
    background: linear-gradient(90deg, #dc3545 54%, #dc3545 100%, #dc3545 100%);
}

.badge-secondary-light{
    color: #fff;
    background-color: #ABACAD;
}

.form-control-sm {
    height: calc(1.8125rem + 5px) !important;
}
.btn.extra-rounded{
    border-radius: 100px !important;
}
.disabled, [disabled]{
    cursor: not-allowed !important;
}

ul.nav-treeview li a i.nav-icon{
    font-size: smaller !important;
    margin: 0px !important;
}

ul.nav-treeview li a.active{
    background: #F4F6F9 !important;
}

td .badge.status{
    width: 100%;
}

table.dataTable.no-footer {
    border-bottom: 1px solid #dee2e6;
}

.select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus {
    border: unset;
}
.notification {
    display: none; /* Initially hidden */
    position: absolute;
    top: 100%;
    right: 0;
    background-color: white;
    color: black;
    border: 1px solid #ddd;
    padding: 10px;
    z-index: 1000;
    width: 200px; /* Adjust width as needed */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional shadow for better visibility */
}

.position-relative {
    position: relative;
}

#notification-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background-color: red;
    color: white;
    border-radius: 50%;
    padding: 5px 10px;
    font-size: 12px;
}
.notification {
    background-color: #fff;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    padding: 10px;
    width: 300px;
    max-height: 200px;
    overflow-y: auto;
    right: 0;
    top: 40px;
}

.notification ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.notification li {
    padding: 8px 10px;
    border-bottom: 1px solid #ccc;
    position: relative;
}

.notification li:last-child {
    border-bottom: none;
}

.notification .close-btn {
    background: none;
    border: none;
    color: #888;
    font-size: 14px;
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
}

.notification .close-btn:hover {
    color: #f00;
}




/* end figma styles  */