/*
html {filter: invert(1);}
img, button,svg {filter: invert(1);}
 BADGE'S */
.gray-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    border: 1px solid #E6E8EE;
    background: #F9FAFC;
    padding: 7px;
    color:#767B89;
    width: fit-content;
}

/* GENERAL */

* {
    -webkit-font-smoothing: antialiased;
}
sup {
    font-size: 18px;
    font-weight: bold;
    top: 2px;
    color: #bb254a;
}
.content-scroll {
    height: 100vh;
    overflow: auto;
    padding-bottom: 200px;
}
input {
    border: 1px solid transparent;
}
input:focus {
    box-shadow: 0px 0px 4px 3px rgba(117, 173, 222, 0.25)!important;
    border: 1px solid #2626260f !important;
}
input:focus-within {
    outline:none!important

}

.percent-input-content {
    position: relative;
}

.percent-input-content span:before {
    content: "%";
    position: absolute;
    font-family: 'Inter',sans-serif;
    color: #98A2B3;
    top: 50%;
    transform: translate(10px, -50%);
    font-weight: bold;
}

.percent-input-content input {
    padding-left: 26px;
    color:#1D2939;
    font-weight:500;
}
.percent-input-content input:placeholder {
    color:#1D2939;
    font-size:40px
}
.soft-badge-danger {
    border-radius: 4px!important;
    border: 1px solid rgba(187, 37, 74, 0.20)!important;
    background: rgba(187, 37, 74, 0.10)!important;
    color: #BB254A;
}



.soft-badge-warning {
    border-radius: 4px!important;
    border: 1px solid rgba(241, 88, 43, 0.20)!important;
    background: rgba(241, 88, 43, 0.10)!important;
    color: #F1582B;
    padding:0px;
    max-width: 130px;
}
.soft-badge-primary {
    border-radius: 4px!important;
    border: 1px solid rgba(29, 78, 122, 0.20)!important;
    background: rgba(29, 78, 122, 0.05)!important;
    color: #2c567e;
    padding:0px;
    max-width: 130px;
}
.soft-badge-success {
    border-radius: 4px!important;
    border: 1px solid #52a89485!important;
    background: #52a89445 !important;
    color: #52a894;
    max-width: 130px;
}
.soft-badge-primary.download-button:before {content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_676_33752)'%3E%3Cpath d='M15.8327 7.5H12.4993V2.5H7.49935V7.5H4.16602L9.99935 13.3333L15.8327 7.5ZM9.16602 9.16667V4.16667H10.8327V9.16667H11.8077L9.99935 10.975L8.19102 9.16667H9.16602ZM4.16602 15H15.8327V16.6667H4.16602V15Z' fill='%231D4E7A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_676_33752'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
.soft-badge-primary.view-button:before {content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_676_33717)'%3E%3Cpath d='M10.0007 4.99967C13.159 4.99967 15.9756 6.77467 17.3506 9.58301C15.9756 12.3913 13.159 14.1663 10.0007 14.1663C6.84232 14.1663 4.02565 12.3913 2.65065 9.58301C4.02565 6.77467 6.84232 4.99967 10.0007 4.99967ZM10.0007 3.33301C5.83398 3.33301 2.27565 5.92467 0.833984 9.58301C2.27565 13.2413 5.83398 15.833 10.0007 15.833C14.1673 15.833 17.7256 13.2413 19.1673 9.58301C17.7256 5.92467 14.1673 3.33301 10.0007 3.33301ZM10.0007 7.49967C11.1507 7.49967 12.084 8.43301 12.084 9.58301C12.084 10.733 11.1507 11.6663 10.0007 11.6663C8.85065 11.6663 7.91732 10.733 7.91732 9.58301C7.91732 8.43301 8.85065 7.49967 10.0007 7.49967ZM10.0007 5.83301C7.93398 5.83301 6.25065 7.51634 6.25065 9.58301C6.25065 11.6497 7.93398 13.333 10.0007 13.333C12.0673 13.333 13.7506 11.6497 13.7506 9.58301C13.7506 7.51634 12.0673 5.83301 10.0007 5.83301Z' fill='%231D4E7A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_676_33717'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}
.time-button:before {content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_669_28220)'%3E%3Cpath d='M9.9915 1.66699C5.3915 1.66699 1.6665 5.40033 1.6665 10.0003C1.6665 14.6003 5.3915 18.3337 9.9915 18.3337C14.5998 18.3337 18.3332 14.6003 18.3332 10.0003C18.3332 5.40033 14.5998 1.66699 9.9915 1.66699ZM9.99984 16.667C6.3165 16.667 3.33317 13.6837 3.33317 10.0003C3.33317 6.31699 6.3165 3.33366 9.99984 3.33366C13.6832 3.33366 16.6665 6.31699 16.6665 10.0003C16.6665 13.6837 13.6832 16.667 9.99984 16.667ZM10.4165 5.83366H9.1665V10.8337L13.5415 13.4587L14.1665 12.4337L10.4165 10.2087V5.83366Z' fill='%231D4E7A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_669_28220'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")!important;}
.comment-button:before {content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_669_28222)'%3E%3Cpath d='M12.4998 3.33366V9.16699H4.30817L3.33317 10.142V3.33366H12.4998ZM13.3332 1.66699H2.49984C2.0415 1.66699 1.6665 2.04199 1.6665 2.50033V14.167L4.99984 10.8337H13.3332C13.7915 10.8337 14.1665 10.4587 14.1665 10.0003V2.50033C14.1665 2.04199 13.7915 1.66699 13.3332 1.66699ZM17.4998 5.00033H15.8332V12.5003H4.99984V14.167C4.99984 14.6253 5.37484 15.0003 5.83317 15.0003H14.9998L18.3332 18.3337V5.83366C18.3332 5.37533 17.9582 5.00033 17.4998 5.00033Z' fill='%231D4E7A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_669_28222'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")!important;}

.soft-bage-content {}
.soft-badge-button {padding: 5px 20px;/* white-space: nowrap; */font-size: 14px;font-weight: 500;border-radius: 4px!important;height: auto;}
td button {max-width: 200px;}
span.soft-badge-bg {
    position: absolute;
    width: 100%;
    display: block;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 8px;
}
button.btn.soft-badge-button:after {
    content: "";
    background-color: var(--bg-color);
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: .3;
    filter: opacity(0.3);
}
button.btn.soft-badge-button:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid var(--bg-color);
    border-radius: 4px;
    opacity: 0.3;
}
#fluid .offcanvas-body .btn {
    border-radius: 4px!important;
    font-weight: 600;
    line-height: 1rem!important;
    z-index: 9999;
}
button.btn.soft-badge-button {}
button.accept-the-data {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translate(-20px, -50%);
    font-size: 1rem;
    padding: 5px 20px;
    border-radius: 4px!important;
    background-color: var(--bs-primary-600)!important;
}
div.modal button:not(.dt-button) {padding-left: 0px;}
div#page-buttons {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
}
div#loading {width: calc(100vw - 256px);}
aside.main-sidebar {
    min-width: 280px;
    width: 280px;
    max-width: 280px;
    padding:14px;
    border-right: 1px solid #E0E0E0;
    background: #FFF;
    position: relative;
    z-index: 9;
}
.dashboard-cover-photo {
    height: 300px;
    background-image: url('/dist/img/project-cover.png');
    background-size: cover;
    background-repeat: no-repeat;
}
nav.main-header {
    position: absolute;
    width: calc(100vw - 280px);
    left: 280px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
nav.main-header ul.navbar-nav:last-child {
    display: flex;
    align-items: center;
    padding-right: 20px;
}
nav.main-header ul.navbar-nav li.nav-item:first-child {
    display: none;
}
li.breadcrumb-item.active {
    font-weight: bold;
    color: var(--bs-gray-400)!important;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
ol.breadcrumb a {
    color: var(--bs-primary-700)!important;
    text-decoration: unset;
}
div#admin-bc {
    font-size: 15px;
    font-weight: bold;
}

div#admin-bc p {
    color: #8E8E8E;
}

.dropdown-menu-content {
    display: none;
    position: absolute;
    right: 18px;
    width: 100%;
    max-width: 300px;
    border: none;
    filter: drop-shadow(1px 12px 10px #9999);
    z-index: 9999999;
    background-color: black;
    right: 0;
    padding: 20px;
}
ul#profile-dropdown-menu li {}

ul#profile-dropdown-menu li a {
    display: flex;
    align-items: center;
    gap: 10px;
}
.breadcrumb-item+.breadcrumb-item::before {
    content: var(--bs-breadcrumb-divider, ">")! important;
}

nav.main-header ul.navbar-nav:last-child li.nav-item.dropdown {
}

nav.main-header ul.navbar-nav:last-child a.nav-link.active {
    background-color: transparent!important;
}

nav.main-header ul.navbar-nav:last-child .w3-animate-zoom.account-name {
    display: none;
}
.my-profile {
    margin: 20px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
input#search-box, input#search-box-sidebar{
    border-radius: 8px;
    background-color: #F3F3F3;
    padding: 8px  30px;
}
input#search-box::placeholder, input#search-box-sidebar::placeholder {
    font-size:0.88rem;
    color:#8E8E8E;
}
.my-profile  li {
    list-style: none;
}
.my-profile li a {
    color: var(--bs-gray-600);
}
ul.nav {display: block;}

.my-project h6 {
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--bs-gray-600);
    font-weight: 500;
}
.my-project {
    display: flex;
    padding: 10px 0px;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
}
.my-project a {
    font-size: 1.4rem;
    color: var(--bs-gray-400)!important;
    cursor: pointer;
}
.my-project h6 svg {}
nav#mainMenu {}
li.nav-item {}
.nav-pills .nav-link {
    display: flex;
    gap: 12px;
    padding: 12px 8px;
    line-height: 20px;
    align-items: center;
    color: #444;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.14px;
    font-family: "Inter", sans-serif;
    white-space: nowrap;
}
.nav-pills .nav-link p {
    width: 100%;
    margin: 0px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
}
.nav-pills .nav-link p i {
    color:var(--bs-gray-400)
}
.card:hover {
    box-shadow: none;
    border: none;
    border-radius: 0px;
}
.modal-body {padding: 0px!important;}
.modal-content {padding: 30px 30px;}
.modal-content button:not(.dt-button) {
    border-radius: 4px!important;
    height: 48px;
    font-weight: 500;
}
.nav-link.active {
    background-color: var(--bs-primary-25)!important;
    color: var(--bs-primary-700)!important;
}
a.nav-link.nav-item2 {
    padding: 0.5rem 1.125rem!important;
}
.account-name {
    color: var(--bs-gray-900);
    font-size: 15px;
    white-space: nowrap;
    max-width: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
}

h5.offcanvas-title {color: #212121;font-size: 22px;font-style: normal;font-weight: 600;line-height: 30px;letter-spacing: -0.44px;}
#updWeights label {border-bottom: 1px solid #E6E8EE;margin: 10px 0px;width: 100%;}

/* TABLE */

#fluid table thead {
    background-color: var(--bs-gray-100)!important;
    background: var(--bs-gray-100)!important;
    background-color: var(--bs-gray-100)!important;
}
#fluid .icon-0 {
    padding-left: 8px!important;
}
#fluid .icon-0:before {
    content: ""!important;
}
table .dataTables_scrollBody {border: none!important;}
table.dataTable thead .sorting {
    background: var(--bs-gray-100)!important;
    color: var(--bs-gray-700);
    font-size: .9rem;
}
table .dataTables_scrollBody {border: none!important;}
table .dataTables_scrollHead {}
#fluid table.dataTable thead th, table.dataTable thead td {border-bottom: var(--bs-gray-900)!important;background-image: unset!important;}
table td.wide-column {
    font-family: "Inter", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 142.857% */
    letter-spacing: -0.14px;
    color: var(--bs-gray-700);
}
.dataTables_scrollBody {border: none!important;}
.dt-buttons {
    margin-bottom: 24px;
    display: inline-flex;
    height: 40px;
    align-items: center;
    gap: 9px;
    margin-left: 301px;
}
.dataTables_scrollBody thead {display: none!important;}
.dt-buttons button:not(.btn) {border-radius: 8px!important;border: 1px solid #F3F3F3!important;background: #FCFCFC!important;color: #8E8E8E!important;padding: 10px 30px;font-weight: 400!important;box-shadow: none!important;font-family: 'Intern', sans-serif;margin: 0px!important;}
.dt-buttons button span {font-weight: 500;font-size: 14px;}
.buttons-excel {
    background-color: var(--bs-primary-700)!important;
    color: var(--bs-gray-100)!important;
    font-weight: bold;
    box-shadow: none!important;
}
.btn {
    position:relative;
}
.btn:before {
    content: "";
    left: 9px;
    position: absolute;
    top: 11px;
}
.btn span {
    margin-left: 30px;
}
.edit-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_495_15233)'%3E%3Cpath d='M11.7167 7.51667L12.4833 8.28333L4.93333 15.8333H4.16667V15.0667L11.7167 7.51667ZM14.7167 2.5C14.5083 2.5 14.2917 2.58333 14.1333 2.74167L12.6083 4.26667L15.7333 7.39167L17.2583 5.86667C17.5833 5.54167 17.5833 5.01667 17.2583 4.69167L15.3083 2.74167C15.1417 2.575 14.9333 2.5 14.7167 2.5ZM11.7167 5.15833L2.5 14.375V17.5H5.625L14.8417 8.28333L11.7167 5.15833Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_495_15233'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.soft-badge-warning.edit-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_270_11152)'%3E%3Cpath d='M11.7167 7.51667L12.4833 8.28333L4.93333 15.8333H4.16667V15.0667L11.7167 7.51667ZM14.7167 2.5C14.5083 2.5 14.2917 2.58333 14.1333 2.74167L12.6083 4.26667L15.7333 7.39167L17.2583 5.86667C17.5833 5.54167 17.5833 5.01667 17.2583 4.69167L15.3083 2.74167C15.1417 2.575 14.9333 2.5 14.7167 2.5ZM11.7167 5.15833L2.5 14.375V17.5H5.625L14.8417 8.28333L11.7167 5.15833Z' fill='%23F1582B'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_270_11152'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.add-button:before {
    content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_495_15236)'%3E%3Cpath d='M15.8334 10.8334H10.8334V15.8334H9.16675V10.8334H4.16675V9.16675H9.16675V4.16675H10.8334V9.16675H15.8334V10.8334Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_495_15236'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A")!important;
}

.save-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_467_8904)'%3E%3Cpath d='M14.1667 2.5H4.16667C3.24167 2.5 2.5 3.25 2.5 4.16667V15.8333C2.5 16.75 3.24167 17.5 4.16667 17.5H15.8333C16.75 17.5 17.5 16.75 17.5 15.8333V5.83333L14.1667 2.5ZM15.8333 15.8333H4.16667V4.16667H13.475L15.8333 6.525V15.8333ZM10 10C8.61667 10 7.5 11.1167 7.5 12.5C7.5 13.8833 8.61667 15 10 15C11.3833 15 12.5 13.8833 12.5 12.5C12.5 11.1167 11.3833 10 10 10ZM5 5H12.5V8.33333H5V5Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_467_8904'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");!important;
}

.tag-filter:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M5.25001 4.5H12.75L8.99251 9.225L5.25001 4.5ZM3.18751 4.2075C4.70251 6.15 7.50001 9.75 7.50001 9.75V14.25C7.50001 14.6625 7.83751 15 8.25001 15H9.75001C10.1625 15 10.5 14.6625 10.5 14.25V9.75C10.5 9.75 13.29 6.15 14.805 4.2075C15.1875 3.7125 14.835 3 14.2125 3H3.78001C3.15751 3 2.80501 3.7125 3.18751 4.2075Z' fill='%237A7A7A'/%3E%3C/svg%3E");
    position: absolute;
    left: 12px;
}

.import-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_493_12889)'%3E%3Cpath d='M7.49996 13.3333H12.5V8.33333H15.8333L9.99996 2.5L4.16663 8.33333H7.49996V13.3333ZM9.99996 4.85833L11.8083 6.66667H10.8333V11.6667H9.16663V6.66667H8.19163L9.99996 4.85833ZM4.16663 15H15.8333V16.6667H4.16663V15Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_493_12889'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    position: absolute;
    left: 12px;
}

.download-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_631_4202)'%3E%3Cpath d='M15.8334 7.5H12.5001V2.5H7.50008V7.5H4.16675L10.0001 13.3333L15.8334 7.5ZM9.16675 9.16667V4.16667H10.8334V9.16667H11.8084L10.0001 10.975L8.19175 9.16667H9.16675ZM4.16675 15H15.8334V16.6667H4.16675V15Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_631_4202'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    position: absolute;
}

.delete-button:before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_526_19159)'%3E%3Cpath d='M13.3333 7.5V15.8333H6.66663V7.5H13.3333ZM12.0833 2.5H7.91663L7.08329 3.33333H4.16663V5H15.8333V3.33333H12.9166L12.0833 2.5ZM15 5.83333H4.99996V15.8333C4.99996 16.75 5.74996 17.5 6.66663 17.5H13.3333C14.25 17.5 15 16.75 15 15.8333V5.83333Z' fill='%23BB254A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_526_19159'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.dt-buttons .buttons-excel span:before {
    content: "";
    background-image: url("/dist/img/excel.ico");
    display: block;
    width: 20px;
    height: 20px;
    background-position: center;
    background-size: cover;
    position: absolute;
    left: 12px;
}
.soft-badge-danger:before {
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_526_17637)'%3E%3Cpath d='M13.3337 7.5V15.8333H6.66699V7.5H13.3337ZM12.0837 2.5H7.91699L7.08366 3.33333H4.16699V5H15.8337V3.33333H12.917L12.0837 2.5ZM15.0003 5.83333H5.00033V15.8333C5.00033 16.75 5.75033 17.5 6.66699 17.5H13.3337C14.2503 17.5 15.0003 16.75 15.0003 15.8333V5.83333Z' fill='%23BB254A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_526_17637'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")!important;
}
.btn-danger:before {content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_524_13635)'%3E%3Cpath d='M10.6666 6V12.6667H5.33325V6H10.6666ZM9.66659 2H6.33325L5.66659 2.66667H3.33325V4H12.6666V2.66667H10.3333L9.66659 2ZM11.9999 4.66667H3.99992V12.6667C3.99992 13.4 4.59992 14 5.33325 14H10.6666C11.3999 14 11.9999 13.4 11.9999 12.6667V4.66667Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_524_13635'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");}
.btn-text-center {
    padding-left: 8px!important;
}
button.dt-button span.dt-down-arrow,
div.dt-button span.dt-down-arrow,
a.dt-button span.dt-down-arrow,
input.dt-button span.dt-down-arrow {
    color: #463d3d45!important;
}
div#t_filter, .dataTables_filter {
    position: absolute;
    width: 290px;
    height: 40px;
    margin: 0px!important;
}
.dataTables_filter label, .dataTables_filter label input {
    margin: 0px;
    width: 100%;
    height: 100%;
}
.dataTables_wrapper .dataTables_filter input, #search-label {
    border-radius: 8px;
    background: #F3F3F3;
    border: none;
    height: 100%;
    margin: 0px!important;
    padding-left: 2.5rem;
    color: #8E8E8E;
    font-weight: 400;
}
.dataTables_filter label:after, .dataTables_filter label input:after,#search-label {
    position: absolute;
    left: 11px;
    top: 10px;
    content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_549_17372)'%3E%3Cpath d='M12.9167 11.6667H12.2583L12.025 11.4417C12.8417 10.4917 13.3333 9.25833 13.3333 7.91667C13.3333 4.925 10.9083 2.5 7.91667 2.5C4.925 2.5 2.5 4.925 2.5 7.91667C2.5 10.9083 4.925 13.3333 7.91667 13.3333C9.25833 13.3333 10.4917 12.8417 11.4417 12.025L11.6667 12.2583V12.9167L15.8333 17.075L17.075 15.8333L12.9167 11.6667ZM7.91667 11.6667C5.84167 11.6667 4.16667 9.99167 4.16667 7.91667C4.16667 5.84167 5.84167 4.16667 7.91667 4.16667C9.99167 4.16667 11.6667 5.84167 11.6667 7.91667C11.6667 9.99167 9.99167 11.6667 7.91667 11.6667Z' fill='%238E8E8E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_549_17372'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.search-icon:before {
    position: absolute;
    left: 10px;
    top: 9px;
    display:block;
    content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_549_17372)'%3E%3Cpath d='M12.9167 11.6667H12.2583L12.025 11.4417C12.8417 10.4917 13.3333 9.25833 13.3333 7.91667C13.3333 4.925 10.9083 2.5 7.91667 2.5C4.925 2.5 2.5 4.925 2.5 7.91667C2.5 10.9083 4.925 13.3333 7.91667 13.3333C9.25833 13.3333 10.4917 12.8417 11.4417 12.025L11.6667 12.2583V12.9167L15.8333 17.075L17.075 15.8333L12.9167 11.6667ZM7.91667 11.6667C5.84167 11.6667 4.16667 9.99167 4.16667 7.91667C4.16667 5.84167 5.84167 4.16667 7.91667 4.16667C9.99167 4.16667 11.6667 5.84167 11.6667 7.91667C11.6667 9.99167 9.99167 11.6667 7.91667 11.6667Z' fill='%238E8E8E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_549_17372'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");

}
label.search-container {
    position: relative;
    width: 100%;
}
label.search-container > span {
    position: absolute;
    z-index: 99999;
}
.dataTables_wrapper .dataTables_filter input::placeholder {
    color:#8E8E8E;
    font-weight:400;
    font-size:0.875rem;
}
.dataTables_wrapper .dataTables_filter input:focous {

}
#t_wrapper button.dt-button:hover:not(.disabled),
div.dt-button:hover:not(.disabled),
a.dt-button:hover:not(.disabled),
input.dt-button:hover:not(.disabled) {background-color: #f2f4f7!important;}
button.dt-button.buttons-columnVisibility.active {background-color: var(--bs-gray-300)!important;margin-bottom: 3px!important;}
span.dt-down-arrow {font-size: 0px!important;}
span.dt-down-arrow:after {
    content: "\f078";
    opacity: 1;
    font-family: 'FontAwesome';
    font-size: 12px;
    display: inline-block;
}
.table>:not(caption)>*>* {
    background-color: transparent!important;
    border-bottom: 1px solid var(--bs-gray-200)!important;
    padding: 10px 20px!important;
    color: var(
            --bs-gray-800);
    font-size: 14px;
    width: fit-content!important;
}
table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected {
    background-color: var(--bs-primary-200);
    color: var(--bs-gray-700);
}
/* Change */

.info-box {
    height: 150px;
    font-size: 17px;
    background-color: #00000012;
    padding: 15px;
    margin: 10px;
    border-radius: 10px;
}


/* TOAST */
div#swal2-html-container {
    font-size: 12px;
    margin: 0px;
    margin-left: 17px;
    color: #98A2B3!important;
}

.swal2-center div#swal2-html-container {
    font-size: 18px;
}
.swal2-container {
    left: 50%!important;
    transform: translate(-50%, 20%);
    padding: unset!important;
    width: fit-content!important;
    min-width: 400px!important;
    height: auto;
}
.swal2-center {
    width: 100vw!important;
    height: 100vh!important;
    z-index: 9999999;
    position: fixed;
    transform: none!important;
    left: 0!important;
}
.swal2-container.swal2-center.swal2-backdrop-show h2#swal2-title {
    font-size: 23px;
    margin: 10px;
}

.swal2-popup.swal2-modal.swal2-icon-question.swal2-show {
    box-shadow: none!important;
}
.swal2-popup.swal2-toast.swal2-show {
    background: #FFF!important;
    margin-bottom: 14px!important;
}

.swal2-timer-progress-bar-container {
    overflow: visible!important;
}
.swal2-icon.swal2-success.swal2-icon-show {
    background-color: #00e17b;
    border-color: #95f2c8;
}
span.swal2-success-line-tip, span.swal2-success-line-long {
    background-color: #ffffffd4 !important;
}
.swal2-timer-progress-bar {
    height: 6px;
    background-color: #01E17B!important;
    border-bottom-right-radius: 10px!important;
    border-top-right-radius: 10px!important;
}
.swal2-icon-error .swal2-timer-progress-bar {
    background-color: #F04248!important;
}
h2#swal2-title {
    color: #000000!important;
    font-size: 17px;
}
.swal2-center .swal2-icon:after {
    width: 100px!important;
    height: 100px!important;
    border-radius: 50%;
}

div:where(.swal2-container) div:where(.swal2-icon) {
    /* filter: drop-shadow(0px 0px 26px #00e17b)!important; */
}
.swal2-icon  div {background-color: transparent!important;}
.swal2-icon-error div:where(.swal2-container) div:where(.swal2-icon).swal2-error [class^=swal2-x-mark-line] {
    background-color: #ef4348!important;
}
.swal2-icon.swal2-error.swal2-icon-show {}
div:where(.swal2-container) div:where(.swal2-icon).swal2-error {filter: drop-shadow(0px 0px 16px #F04248)!important;border-color: #ff9ea1 !important;color: #F04248!important;animation-name: error!important;animation-duration: 5s!important;animation-iteration-count: infinite!important;background-color: #F04248;}
div:where(.swal2-container) div:where(.swal2-icon).swal2-error [class^=swal2-x-mark-line] {
    background-color: #ffffff!important;
}
.swal2-popup.swal2-toast.swal2-icon-info.swal2-show {}
.swal2-popup.swal2-toast.swal2-icon-info.swal2-show .swal2-timer-progress-bar {
    background-color: #40c3ed !important;
}
.swal2-icon.swal2-warning.swal2-icon-show {
    background-color: #FFD21F;
    border-color: #ffeda5;
    color: #ffffff;
    filter: drop-shadow(0px 0px 26px #FFD21F)!important;
}
.swal2-icon-warning  .swal2-timer-progress-bar {
    background-color: #ffd21f !important;
}
div:where(.swal2-container) div:where(.swal2-icon):after {
    content: "";
    border: 10px solid #eedbdb57;
    width: 37px;
    height: 37px;
    position: absolute;
    border-radius: 32px;
    z-index: 9;
    top: -11px!important;
    animation-name: shake;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}
body.dark  div#swal2-html-container  {
    color: var(--bs-gray-300)!important;
}
body.dark .swal2-popup.swal2-toast.swal2-show {
    background: #242C32!important;
}
body.dark span.swal2-success-line-tip, body.dark  span.swal2-success-line-long {
    background-color: #252c32d4 !important;
}
.dark h2#swal2-title {
    color: #FFF!important;
}
body.dark div:where(.swal2-container) div:where(.swal2-icon).swal2-error {filter: drop-shadow(0px 0px 16px #F04248)!important;border-color: #F04248!important;color: #F04248!important;animation-name: error!important;animation-duration: 5s!important;animation-iteration-count: infinite!important;}
body.dark div:where(.swal2-container) div:where(.swal2-icon).swal2-error [class^=swal2-x-mark-line] {
    background-color: #252c32 !important;
}
body.dark .swal2-icon.swal2-warning.swal2-icon-show {
    background-color: #FFD21F;
    border-color: #FFD21F;
    color: #252c32;
    filter: drop-shadow(0px 0px 26px #FFD21F)!important;
}

@keyframes shake {
    0% {border: 8px solid #eedbdb63}
    50% {border: 8px solid #eedbdb00}
    100% {border: 8px solid #eedbdb63}
}
.dark div:where(.swal2-container) div:where(.swal2-icon):after {}
button.swal2-confirm.swal2-styled.swal2-default-outline {
    border: 1px solid rgb(220 53 69 / 27%) !important;
    background-color: rgb(220 53 69 / 13%) !important;
    margin: 0px;
    width: 100%;
    color: rgb(220 53 69 / 53%) !important;
    margin: 5px 10px;
}


button.swal2-cancel.swal2-styled.swal2-default-outline {
    border: 1px solid #98a2b369 !important;
    background-color: #98a2b32e;
    margin: 0px;
    width: 100%;
    color: #98A2B3;
}
button.swal2-confirm.swal2-styled.swal2-default-outline:focus,
button.swal2-cancel.swal2-styled.swal2-default-outline:focus {
    box-shadow:none!important
}

.swal2-actions {
    width: 80%;
    flex-wrap: nowrap;
    padding: 10px;
    gap: 3px;
    justify-content: center;
}
div#page-tab-menu {
    display: flex;
    gap: 20px;
    border-bottom: 2px solid #E0E0E0;
    margin-bottom: 20px;
    position: relative;
    width: 100%;
}

div#page-tab-menu .page-tab-menu-item {
    padding: 20px 0px;
    transition: all ease 700ms;
    position:relative
}
.page-tab-menu-item.active:after {
    position: absolute;
    content: "";
    border-bottom: 3px solid var(--bs-gray-700);
    bottom: -2px;
    width: 100%;
    left: 0;
    border-radius: 30px;
    transition: all ease 700ms;
}

.page-tab-menu-item:hover :after {
    position: absolute;
    content: "";
    border-bottom: 2px solid var(--bs-gray-400);
    bottom: -2px;
    width: 100%;
    left: 0;
    border-radius: 30px;
    transition: all ease 700ms;
}

div#page-tab-menu .page-tab-menu-item button {
    border: none;
    background-color: transparent;
    font-size: 14px;
    font-weight: 600;
    color: #8E8E8E;
    padding: 0px;
}
div#page-tab-menu .page-tab-menu-item.active {position: relative;}
div#page-tab-menu .page-tab-menu-item.active button {
    color: #444444;
}
.page-tab-menu-content.active {display: block;}
.page-tab-menu-content {display: none;}
.info-card {
    width: 374px;
    height: 70px;
    flex-shrink: 0;
    border-radius: 8px;
    border: 1px solid #F3F3F3;
    background: #FCFCFC;
    display: flex;
    align-items: center;
    padding-left: 30px;
    color: black;
    gap: 5px;
}

.info-card .count {
    font-size: 28px;
    font-weight: bold;
}

.profile-bg {
    height: 200px;
    width: 100%;
    background-image: url('/dist/img/profile-bg.png');
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    background-position: center;
}

.profile-profile-photo {
    width: 120px;
    height: 120px;
    position: absolute;
    bottom: -60px;
    left: 40px;
}

.profile-profile-photo img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 4px solid white;
    position: absolute;
}

.document-upload-sections {
    text-align: center;
    padding: 20px;
    border: 2px dashed var(--bs-gray-300);
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}


.document-upload-sections path { animation: pixie 10s infinite;animation-delay:initial;}

@keyframes pixie {
    0% {opacity:.2}
    50% {opacity:1}
    100% {opacity:.2}
}

.document-upload-sections.active {
    background-color: var(--bs-gray-100);
    transition: all ease 700ms;
}

.document-upload-sections img {
    /* position: absolute; */
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    z-index: 1;
    opacity: 1;
    display: block;
    height: 200px;
    width: 200px!important;
    margin: auto;
}
.document-upload-sections label {
    border-bottom: none!important;
}
.document-upload-sections p {
    font-size: 18px;
}
.document-upload-sections span {
    color: var(--bs-gray-400);
}

@keyframes success {
    0% {filter: drop-shadow(0px 0px 16px #FFD426)}
    50% {filter: drop-shadow(0px 0px 16px #ffd42600)}
    100% {filter: drop-shadow(0px 0px 16px #FFD426)}
}

@keyframes error {
    0% {filter: drop-shadow(0px 0px 16px #F04248)}
    50% {filter: drop-shadow(0px 0px 16px #ffd42600)}
    100% {filter: drop-shadow(0px 0px 16px #F04248)}
}
@keyframes warning {
    0% {filter: drop-shadow(0px 0px 16px #FFD426)}
    50% {filter: drop-shadow(0px 0px 16px #ffd42600)}
    100% {filter: drop-shadow(0px 0px 16px #FFD426)}
}
.tooltip.bs-tooltip-auto {
    display: none!important;
}
.faster-delete-id, .faster-delete, .faster-edit {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all ease 700ms;
}

.faster-delete {
    transform: translate(150%, -50%);
}
.faster-edit {
    transform: translate(250%, -50%);
}

.faster-edit-content .faster-delete-id  {
    transform: translate(-250%, -50%)!important;
}
tr:hover  .faster-delete-id {
    transform: translate(-250%, -50%)!important;
}

tr:hover .faster-delete {
    transform: translate(-50%, -50%)!important;
}
#fluid .faster-edit-content .faster-delete  {
    transform: translate(-250%, -50%)!important;
}
.faster-edit-content .faster-edit {
    transform: translate(-50%, -50%)!important;

}

section.content {
    padding-bottom: 0px;
    overflow: auto;
    height: 100vh;
}

div#projectList {
    display: flex;
    flex-wrap: wrap;
}
.selectProjectLogo {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 4px;
}
.projectCard {
    border-radius: 5px;
    margin: 7px;
}

.bottom-info {
    display: flex;
    flex-wrap: wrap;
    font-weight: bold;
    margin: 10px 0px;
    padding-top: 10px;
    gap: 5px 20px;
    flex-direction: column;
}
span.info-box-number.text-dark.text-truncate {
    font-size: 15px;
    color: #2e629e!important;
}

.projectCard {
    color: #000;
    font-family: "Inter",sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 142.857% */
}

.projectCard span {
    color: #8E8E8E;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.14px;
    text-decoration: none!important;
}
h5.projectName {
    color: #000;
    font-weight: bold;
    font-size: 14px;
}
.projectCard a {
    text-decoration: none;
}
td.templateCol {
    max-height: 100px!important;
    overflow:hidden;
    height: 100px!important;
}
.viewTemplateModal {
    position: absolute;
    background-color: var(--bs-gray-100);
    padding: 45px;
    border-radius: 10px;
    filter: drop-shadow(2px 4px 6px #9993);
    top: 0;
    left: 0;
    transform: translate(-110%, -50%);
    max-width: 900px;
    max-height: 900px;
    border: 2px dashed  var(--bs-gray-200);
}
.viewTemplateModal:before{
    content:"";
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid var(--bs-gray-100);
    display: block;
    position: absolute;
    right: -9px;
    top: calc(50% - 0px);
}
.viewTemplateModal figure,
.viewTemplateModal table {
    max-width:700px;
    max-height:700px;
}

th.sorting:nth-child(1) {
    width: 40px!important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
table.dataTable tbody tr td:nth-child(1) {
    width: 50px!important;
}
span.w-100.h-100.position-absolute.d-flex.align-items-center.text-bold {
    color: white!important;
    padding: 10px;
    font-weight: bold;
}
.content-gray-letter {
    color: #98a2b3;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.fast-action {
    width: 50px!important;
    height: 50px!important;
}
.checkmark-sm:hover {
    box-shadow: 0px 0px 4px 3px rgba(117, 173, 222, 0.25)!important;
    border: 1px solid #262626!important;
}
.checkmark-sm {
    background-color: #121212!important;
    border: 1px solid #262626;
    width: 32px;
    height: 32px;
    display: block;
    border-radius: 8px;
    padding: 14px 16px;
    position: relative;
    margin-right: 10px;
    cursor: pointer;
}

.checkmark-sm svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}
input[type=checkbox]:checked ~ .checkmark-sm svg {
    display:block;
}

div.empty-data {
    position: fixed;
    left: 56%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    display: block;
}

div.empty-data p {
    font-weight:bold;
    font-size:20px
}




