.jd-levels-container {
    width: 1720px !important;
    max-width: 1720px !important;
}
.settings-levels {
    display: flex;
    align-items: flex-start;
    height: calc(100vh - 180px);
    overflow: hidden;
}
.settings-levels__left {
    width: 276px;
    margin-right: 12px;
    position: sticky;
    align-self: flex-start;
}
.levels-sidebar {
    background: #E4F3F6;
    border: 1px solid #CDE9EE;
    border-radius: 24px;
    padding: 16px;    
    height: calc(100vh - 180px);
    overflow-y: auto;
}
.levels-sidebar h6 {
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    text-transform: uppercase;
    color: #0B3E47;
    margin-bottom: 16px;
}
.levels-sidebar .nav-list > li {
    padding: 12px 0;
    opacity: 0.7;
    cursor: pointer;
}
.levels-sidebar .nav-list > li.completed,
.levels-sidebar .nav-list > li.current {
    opacity: 1;
}
.levels-sidebar .nav-list > li.completed .nav-title span {
    background: #1C9CB2;
    color: #fff;
}
.levels-sidebar .nav-list > li.current .nav-title {
    font-weight: 600;
}
.levels-sidebar .nav-list > li:not(:last-of-type) {
    border-bottom: 1px solid #CDE9EE;
}
.levels-sidebar .nav-list .nav-title {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #0C0C0C;
    padding: 4px;
}
.levels-sidebar .nav-list .nav-title span {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #A4D7E0;
    width: 20px;
    height: 20px;
    font-weight: 500;
    color: #0B3E47;
    font-size: 12px;
    line-height: 16px;
    border-radius: 50%;
    margin-right: 12px;
}
.levels-sidebar .nav-list .subitems {
    padding-left: 32px !important;
    padding-top: 16px;
}
.levels-sidebar .nav-list .subitems li {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    color: #3F3F3F;
    padding: 4px 0;
    cursor: pointer;
}
.levels-sidebar .nav-list .subitems li.active {
    font-weight: 600;
    color: #000000DE;
}
.levels-sidebar .nav-list .subitems li.active::before {
    background: #1C9CB2;
}
.levels-sidebar .nav-list .subitems li:not(:last-of-type) {
    margin-bottom: 12px;
}
.levels-sidebar .nav-list .subitems li::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    background: #A4D7E0;
    border-radius: 50%;
    margin-right: 12px;
}
.settings-levels__right {
    background: #fff;
    width: calc(100% - 288px);
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 180px);
}
.settings-levels__right.full-width {
    width: 100%;
    /* margin-left: auto; */
}
.settings-levels__right .levels-head {
    display: flex;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.settings-levels__right .levels-head .icon {
    width: 78px;
    min-width: 78px;
    margin-right: 20px;
}
.settings-levels__right .levels-head .icon img {
    display: block;
    width: 100%;
}
.settings-levels__right .levels-head h4 {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    color: #000;
    margin-bottom: 4px;    
}
.settings-levels__right .levels-head p {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #3F3F3F;
    margin-bottom: 0;
}
.settings-levels__right .levels-head > div {
    margin-right: 12px;
}
.settings-levels__right .levels-head .save-button, .export-excel {
    display: flex;
    align-items: center;
    background: #E4F3F6;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.1px;
    text-align: center;
    color: #051B1E;
    border-radius: 100px;
    box-shadow: 0px 1px 3px 1px #00000026;
    white-space: nowrap;
    padding: 10px 16px;
    margin-left: auto;
}
.export-excel {
    margin-left: 8px;
    padding: 10px 10px;
}
.export-excel img {
    margin: 0 !important;
}
.settings-levels__right .levels-head .save-button#deploy-header-btn {
    background: #1E9068;
    color: #fff;
}
.settings-levels__right .levels-head .save-button img, .export-excel img {
    display: block;
    width: 20px;
    margin-right: 8px;
}
.settings-levels__right .levels-body {
    padding: 20px 20px 12px;
    overflow: auto;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.levels-body > .create-job-families,
.levels-body > .assign-levels-to-jobs,
.levels-body > .map-jobs-over {
    flex: 1;
    min-height: 0;
}
.settings-levels__right .levels-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 12px 20px 20px;
    margin-top: auto;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.levels-body .career-tracks {
    width: 100%;
    max-width: 735px;
    border: 1px solid #E1E1E1;
    border-radius: 17px;
}
.levels-body .career-tracks .career-tracks-add-new {
    border-radius: 0 0 17px 17px;
    overflow: hidden;
}
.levels-body .career-track-levels {
    max-width: 980px;
}
/* .levels-body .levels-checkbox-all {
    padding: 15px 23px;
    border-bottom: 1px solid #0000001A;
} */
.levels-body .levels-checkbox-all span {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #3F3F3F;
}
.levels-body .levels-checkbox-head {
    display: flex;
    align-items: center;
    padding: 15px 23px;
    border-bottom: 1px solid #0000001A;
}
.levels-body .levels-checkbox-head .levels-count {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #3F3F3F;
}
.career-track-levels ul,
.career-tracks ul,
.define-competencies ul {
    margin-bottom: 0;
}
.career-track-levels ul li,
.career-tracks ul li,
.define-competencies ul li {
    border-bottom: 1px solid #0000001A;
}
.define-competencies ul li {
    display: flex;
    align-items: center;
    cursor: move;
}
.define-competencies ul li .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: transparent;
    margin-right: 8px;
}
.define-competencies ul li .icon img {
    display: block;
    width: 18px;
}
.career-track-levels ul li.custom-level,
.career-tracks ul li.custom-track,
.define-competencies ul li.custom-competency {
    position: relative;
}
.career-track-levels ul li .actions,
.career-tracks ul li .actions {
    display: flex;
    align-items: center;
    gap: 12px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.career-track-levels ul li .actions button,
.career-tracks ul li .actions button,
.define-competencies ul li .actions button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    padding: 4px;
}
.career-track-levels ul li .actions button.edit-level-button,
.career-tracks ul li .actions button.edit-track-button,
.define-competencies ul li .actions button.edit-competency-button {
    background: #E4F3F6;
}
.career-track-levels ul li .actions button.delete-level-button,
.career-tracks ul li .actions button.delete-track-button,
.define-competencies ul li .actions button.delete-competency-button {
    background: #FAECEC;
}
.career-track-levels ul li .actions button img,
.career-tracks ul li .actions button img,
.define-competencies ul li .actions button img {
    display: block;
    width: 18px;
}
.career-tracks ul li .confirm-box,
.career-track-levels ul li .confirm-box{
    display: flex;
    align-items: center;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}
.career-tracks ul li .confirm-box .accept-button,
.career-track-levels ul li .confirm-box .accept-button {
    border-radius: 24px 0 0 24px;
    background: #CDE9EE;
    padding: 6px;
}
.career-tracks ul li .confirm-box .decline-button,
.career-track-levels ul li .confirm-box .decline-button {
    border-radius: 0 24px 24px 0;
    background: #F5D9D9;
    padding: 6px;
}
.career-track-levels ul li label,
.career-tracks ul li label,
.define-competencies ul li {
    padding: 16px 22px;
}
.career-track-levels ul li label span,
.career-tracks ul li label span,
.define-competencies ul li span {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.25px;
    color: #000000DE;
}
.career-tracks ul li,
.career-track-levels ul li {
    display: flex;
    padding: 8px 16px;
    position: relative;
}
.career-tracks ul li label {
    display: flex;
    align-items: center;
    cursor: pointer;
    height: 40px;
    padding: 0 0 0 8px;
}
.career-track-levels ul li label {
    display: flex;
    align-items: center;
    width: calc(100% - 54px);
    height: 40px;
    padding: 0 0 0 8px;
}
.career-tracks ul li label input[type="text"],
.career-track-levels ul li label select {
    background: #fff;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.25px;
    color: #000000DE;
    opacity: 1 !important;
    border: none;
}
/* .career-tracks ul li.editable,
.career-track-levels ul li.editable {
    background: #E4F3F6;
} */
.career-track-levels ul li.editable label {
    padding: 0;
}
.career-tracks ul li.editable label input[type="text"],
.career-track-levels ul li.editable label select {
    width: calc(100% - 70px);
    height: 40px;
    background: #fff;
    border-radius: 7px;
    padding: 10px 12px;
    font-weight: 400;
    letter-spacing: 0.25px;
    color: #0C0C0C;
    border: 1px solid #B4DBE1;
    opacity: 1 !important;
}
.career-tracks ul li.editable label input[type="text"]:disabled {
    border: none;
    padding: 0;
}
.career-tracks ul li.editable label input[type="text"].error,
.career-track-levels ul li.editable label select.error {
    border-color: #f57070;
    color: #000 !important;
}
.career-track-levels ul li.editable.has-error label input {
    border-color: #f57070;
}
.career-track-levels ul li label select {
    width: 100%;
    appearance: none;
}
.career-track-levels ul li label .select2 {
    width: 100% !important;
}
.career-track-levels ul li label .selection {
    width: 100%;
}
.career-track-levels ul li label .select2 .select2-selection {
    width: 100%;
    height: 40px;
    opacity: 1 !important;
    border: none;
}
.career-track-levels ul li label .select2 .select2-selection .select2-selection__rendered {
    line-height: 40px;
    padding: 0;
    font-weight: 500;
}
.career-track-levels ul li label .select2 .select2-selection .select2-selection__arrow {
    display: none;
    height: 100px;
}
.career-track-levels ul li label .select2 .select2-selection .select2-selection__arrow b {
    height: 40px;
}
.career-track-levels ul li.editable label .select2 .select2-selection {
    background: #fff;
    border-radius: 7px !important;
    font-weight: 400;
    letter-spacing: 0.25px;
    color: #0C0C0C;
    border: 1px solid #B4DBE1;
}
.career-track-levels ul li.editable label .select2 .select2-selection .select2-selection__rendered {
    padding-left: 8px;
}
.career-track-levels ul li.editable label .select2 .select2-selection .select2-selection__arrow {
    display: block;
}
.career-track-levels ul li label .select2-container--default .select2-selection--single .select2-selection__clear {
    display: none;
}

.career-tracks ul li .levels-count-field input {
    width: 200px;
    height: 40px;
    background: #fff;
    border-radius: 7px;
    padding: 10px 12px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    color: #0C0C0C;
    border: none;
    opacity: 1 !important;
}
.career-tracks ul li .levels-count-field input:disabled {
    opacity: 0.6 !important;
}
.career-tracks ul li.editable .levels-count-field input {
    border: 1px solid #B4DBE1;
}
.levels-checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
}
.levels-checkbox input[type="checkbox"] {
    display: none;
}
.levels-checkbox b {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: #DDF0F3;
    border-radius: 7px;
    position: relative;
    margin-right: 24px;
}
.levels-checkbox b::before {
    display: block;
    content: '';
    width: 14px;
    height: 14px;
    border: 2px solid #000;
    border-radius: 2px;
}
.levels-checkbox input[type="checkbox"]:checked + b::before {
    background: #1C9CB2;
    border-color: #1C9CB2;
    background-image: url("../images/redesign-icons/check-white-icon.svg");
    background-repeat: no-repeat;
    background-position: center;    
}
.career-tracks .levels-checkbox {
    width: 440px;
}
.levels-add-new button,
.career-tracks-add-new button,
.competency-add-new button {
    display: flex;
    align-items: center;
    width: 100%;
    background: #E4F3F6;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.25px;
    color: #000000DE;
    padding: 16px 22px;
}
.levels-add-new button .icon,
.career-tracks-add-new button .icon,
.competency-add-new button .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: #CDE9EE;
    border-radius: 7px;
    margin-right: 24px;
}
.levels-add-new button .icon img,
.career-tracks-add-new button .icon img,
.competency-add-new button .icon img {
    width: 20px;
    height: 20px;
}
.career-track-levels {
    width: 100%;
    max-width: 680px;
}
.career-track-level-item {
    border: 1px solid #E1E1E1;
    border-radius: 17px;
    overflow: hidden;
    position: relative;
}
.career-track-level-item:not(:last-of-type) {
    margin-bottom: 16px;
}
.define-competencies-item:not(:last-of-type) {
    margin-bottom: 24px;
}
.level-head {
    padding: 20px;
    border-bottom: 1px solid #0000001A;
    cursor: pointer;
}
.level-head h6 {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #000;
    margin-bottom: 2px;
}
.level-head button {
    margin-right: 0;
}
.level-head button img {
   margin-left: 4px;
}
.competency-head {
    padding: 12px;
}
.competency-head h6 {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #000;
    margin-bottom: 2px;
}
.level-head p {
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #3F3F3F;
    margin-bottom: 0;
}
.career-track-level-item.collapsed .level-head {
    border-bottom: none;
}
.career-track-level-item ul li label span,
.define-competencies-item ul li span {
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 20px;
    /* padding-left: 8px; */
}
/* .career-track-level-item ul li label span::before,
.define-competencies-item ul li span::before {
    display: inline-block;
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #000000;
    margin-right: 8px;
} */
.career-track-level-item .levels-checkbox-all span {
    font-size: 13px;
}
.career-track-level-item .levels-checkbox-group h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    vertical-align: middle;
    padding: 16px 24px;
    color: #3F3F3F;
    margin-bottom: 0;
    border-bottom: 1px solid #0000001A;
}
.competency-sorting-group li.sortable-placeholder {
    background: #B4DBE1 !important;
    height: 59px;
    box-shadow: none !important;
}
.competency-sorting-group li.ui-sortable-helper {
    background: #B4DBE1 !important;
}
.map-jobs-over {
    border: 1px solid #E1E1E1;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.map-jobs-over__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    box-shadow: 0px -1px 0px 0px #0000001F inset;
}
.map-jobs-over__head h4 {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #000;
    margin-bottom: 0;
}
.map-jobs-over__body {
    padding: 8px 20px;
    flex: 1;
    min-height: 0;
    overflow: auto;
}
.map-jobs-over__body .table-box {
    overflow: auto;
}
.map-jobs-over__body table tbody tr:hover {
    background: transparent !important;
}
.map-jobs-over__body input[type="search"],
.create-job-families-body input[type="search"] {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 0;
    padding: 10px 12px 10px 46px;
	background-image: url('../images/redesign-icons/search-dark-icon.svg');
    background-size: 18px;
	background-repeat: no-repeat;
	background-position: left 20px center;
}
.map-jobs-over__body table thead th {
    min-width: 200px;
}
.map-jobs-over__body .select2-custom.select2-custom-redesigned .select2-container--default .select2-selection--single, 
.map-jobs-over__body .select2-custom.select2-custom-redesigned .select2-container--default .select2-selection--multiple {
    max-width: 300px !important;
    width: 100% !important;
}
.map-jobs-over.full-screen-window,
.build-leveling-matrix.full-screen-window,
.create-job-families.full-screen-window,
.assign-levels-to-jobs.full-screen-window {
    position: fixed;
    width: 100%;
    height: 100vh;
    background: #fff;
    top: 0;
    left: 0;
    z-index: 9999;
    overflow: auto;
    border-radius: 0;
}
.build-leveling-matrix.full-screen-window .jd-levels-content,
.create-job-families.full-screen-window .create-job-families-content,
.assign-levels-to-jobs.full-screen-window .assign-levels-to-jobs-content {
    border-radius: 0;
    border: none;
}
.map-jobs-over.full-screen-window .map-jobs-over__body {
    height: calc(100vh - 70px);
}
.map-jobs-over.full-screen-window .table-box {
    height: calc(100% - 36px);
    max-height: 100%;
}
#map_my_job_levels_modal .modal-body {
    padding: 24px 0 0;
}
#map_my_job_levels_modal .modal-body__content {
    display: flex;
    align-items: flex-start;
    background: #fff;
    padding: 20px;
    border: 1px solid #0000001A;
    border-radius: 12px;
}
#map_my_job_levels_modal .modal-body__content .icon {
    width: 54px;
    margin-right: 16px;
}
#map_my_job_levels_modal .modal-body__content .icon img {
    display: block;
    width: 100%;
}
#map_my_job_levels_modal .modal-body__content .text-info {
    width: calc(100% - 70px);
}
#map_my_job_levels_modal .modal-body__content .text-info h6 {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.15px;
    color: #1C1B1F;
    margin-bottom: 10px;
}
#map_my_job_levels_modal .modal-body__content .text-info p {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.1px;
    color: #0C0C0C;
    margin-bottom: 10px;
}
#map_my_job_levels_modal .modal-body__content .text-info ul {
    padding-left: 18px !important;
}
#map_my_job_levels_modal .modal-body__content .text-info ul li {
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.1px;
    color: #0C0C0C;
    list-style-type: disc;
}
#map_my_job_levels_modal .modal-body__content .text-info ul li:not(:last-of-type) {
    margin-bottom: 8px;
}
.create-job-families-content,
.assign-levels-to-jobs-content {
    border: 1px solid #0000001A;
    border-radius: 24px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.create-job-families-body,
.assign-levels-to-jobs .create-job-families-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.create-job-families-body .table-box,
.assign-levels-to-jobs .create-job-families-body .table-box {
    flex: 1;
    min-height: 0;
    overflow: auto;
}
.create-job-families-head,
.assign-levels-to-jobs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 14px 24px 0 24px;
    box-shadow: 0px -1px 0px 0px #0000001F inset;
}
.create-job-families-head h3 {
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 0;
    margin-right: 24px;
}
.create-job-families-head .redesigned-cancel-button {
    padding: 7px 16px;
}
.create-job-families-head .redesigned-cancel-button img {
    width: 24px;
    margin-left: 4px;
}
.create-job-families-head .assigned-jobs-count {
    display: flex;
    align-items: center;
    background: #DDF0F3;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.09px;
    color: #000000DE;
    padding: 8px 8px 8px 12px;
    border-radius: 8px;
    cursor: pointer;
}
.create-job-families-head .assigned-jobs-count span {
    font-weight: 700;
    margin: 0 4px;
}
.create-job-families-head .assigned-jobs-count img {
    display: block;
    width: 18px;
    margin-left: 6px;
}
.create-job-families-body tbody tr,
.map-jobs-over__body table tbody tr {
    box-shadow: none !important;
}
.create-job-families-body table {
    margin-bottom: 0 !important;
}
.create-job-families-body tbody tr:hover {
    background: transparent !important;
    cursor: auto;
}
.create-job-families-body tbody td,
.map-jobs-over__body tbody td {
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.12);
}
#jobs-table_wrapper .select2-custom.select2-custom-redesigned .select2-container--default .select2-selection--single,
#jobs-table_wrapper .select2-custom.select2-custom-redesigned .select2-container--default .select2-selection--multiple {
    min-height: 40px !important;
}
#jobs-table_wrapper .cell-field .table-field .select2-selection__rendered {
    width: 100%;
}
#jobs-table_wrapper .select2-container--default .select2-selection--single .select2-selection__clear {
    display: none;
}
.create-job-families-body .btn.btn-icon.color-primary,
.map-jobs-over__body .btn.btn-icon.color-primary {
    background: transparent;
    color: #49454F;
}
.create-job-families-body .btn.btn-icon.color-primary.disabled,
.map-jobs-over__body .btn.btn-icon.color-primary.disabled {
    opacity: 0.6;
    cursor: auto;
}
.create-job-families-body table th {
    vertical-align: middle;
}
.create-job-families-body .generate-ai-td {
    background: #FDF7F0;
}
.create-job-families-body .generate-with-ai-button {
    background: #F8DDBF;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 8px;
    border-radius: 100px;
}
.create-job-families-body .loading-icon {
    display: block;
    height: 40px;
    margin: 0 auto;
}
.create-job-families-body .unassign-job-td {
    background: #FCF5F5;
}
.create-job-families-body .unassign-job-button {
    background: #F5D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 8px;
    border-radius: 100px;
}
.datatable-pagination-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
}
.datatable-pagination-box .dataTables_info {
    padding: 0;
    font-size: 13px;
    color: #666;
}
.datatable-pagination-box .dataTables_paginate {
    padding: 0;
}
.map-jobs-over .accordion:not(:last-of-type) {
    margin-bottom: 12px;
}
.map-jobs-over .accordion .accordion__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #E4F3F6;
    padding: 12px;
    cursor: pointer;
}
.map-jobs-over .accordion .accordion__head h6 {
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.25px;
    color: #000000DE;
    margin-bottom: 0;
}
.map-jobs-over .accordion .accordion__head img {
    display: block;
    width: 24px;
    transition: transform 0.2s ease;
}
.map-jobs-over .accordion.collapsed .accordion__head img {
    transform: rotate(-90deg);
}
.assign-levels-to-jobs__tabs {
    border-bottom: 1px solid #1C9CB24D;
}
.create-job-families__tabs button,
.assign-levels-to-jobs__tabs button {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.1px;
    text-align: center;
    color: #3F3F3F;
    padding: 15px 27px 15px 0px;
}
.create-job-families__tabs button span,
.assign-levels-to-jobs__tabs button span {
    font-weight: 400;
    font-size: 20px;
    line-height: 16px;
    letter-spacing: 0.1px;
    text-align: center;
    color: #000000;
    margin-top: 8px;
}
.create-job-families__tabs button.active,
.assign-levels-to-jobs__tabs button.active {
    font-weight: 600;
    color: #000;
    position: relative;
}
.create-job-families__tabs button.active span,
.assign-levels-to-jobs__tabs button.active span {
    font-weight: 500;
}
.create-job-families__tabs button.active::before,
.assign-levels-to-jobs__tabs button.active::before {
    content: '';
    width: calc(100% - 54px);
    height: 4px;
    background: #1C9CB2;
    position: absolute;
    bottom: 0;
    left: 0;
    border-radius: 100px 100px 0 0;
}
.selected-jobs-list-box {
    position: relative;
}
.selected-jobs-list-box ul {
    position: absolute;
    width: 100%;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    top: 46px;
    margin-bottom: 0;
    z-index: 2;
    padding: 8px 0;
}
.selected-jobs-list-box ul li {
    font-size: 14px;
    line-height: 20px;
    color: #000;
    padding: 8px 12px;
}
.confirm-generated-box {
    display: flex;
    height: 46px;
    margin-right: 8px;
}
.confirm-generated-box button {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}
.confirm-generated-box .approve-generated-button {
    background: #CDE9EE;
    height: 46px;
    color: #0B3E47;
    border-radius: 24px;
    padding: 8px 8px 8px 12px;
}
.confirm-generated-box .reject-generated-button {
    background: #F5D9D9;
    color: #7A2626;
    border-radius: 0 24px 24px 0;
    padding: 8px 8px 8px 8px;
}
.confirm-generated-box button img {
    display: block;
    width: 24px;
}
.approve-generated-button img {
    margin-left: 8px;
}
.reject-generated-button img {
    margin-left: 8px;
}
.jd-levels-head .confirm-generated-box button img {
    margin-left: 0;
    margin-right: 8px;
}
.jd-levels-head .confirm-generated-box {
    height: 40px;
}
.jd-levels-head .confirm-generated-box .approve-generated-button {
    height: 40px;
    padding: 8px 12px 8px 8px;
}
.create-job-families .ai-accept-reject-buttons,
.assign-levels-to-jobs .ai-accept-reject-buttons {
    display: flex;
    height: 40px;
}
.create-job-families .ai-accept-reject-buttons .accept-ai-button,
.assign-levels-to-jobs .ai-accept-reject-buttons .accept-ai-button {
    width: 100%;
    height: 100%;
    background: #CDE9EE;
    border-radius: 100px 0 0 100px;
}
.create-job-families .ai-accept-reject-buttons .reject-ai-button,
.assign-levels-to-jobs .ai-accept-reject-buttons .reject-ai-button {
    width: 100%;
    height: 100%;
    background: #F5D9D9;
    border-radius: 0 100px 100px 0;
}
.create-job-families .generate-with-ai-button,
.assign-levels-to-jobs .generate-with-ai-button {
    width: 100%;
    height: 100%;
    background: #FBECDB;
    padding: 8px;
    border-radius: 100px;
}
.create-job-families .generate-with-ai-button img,
.assign-levels-to-jobs .generate-with-ai-button img {
    display: block;
    width: 24px;
}
.create-job-families .generate-with-ai-button:disabled,
.assign-levels-to-jobs .generate-with-ai-button:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}
.deploy-job-architecture__details {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}
.deploy-job-architecture__item {
    flex: 1;
    border: 1px solid #E1E1E1;
    border-radius: 12px;
    padding: 16px 20px;
}
.deploy-job-architecture__item img {
    display: block;
    width: 24px;
    margin-bottom: 6px;
}
.deploy-job-architecture__item h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.1px;
    color: #000000B2;
    margin-bottom: 8px;
}
.deploy-job-architecture__item span {
    display: block;
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0.1px;
    color: #000;
    margin-bottom: 6px;
}
.deploy-job-architecture__item p {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.15px;
    color: #1C1B1FB2;
    margin-bottom: 0;
}
.configuration-details {
    border: 1px solid #E1E1E1;
    border-radius: 17px;
    overflow: hidden;
}
.configuration-details__title {
    padding: 20px;
    border-bottom: 1px solid #E1E1E1;
}
.configuration-details__title h4 {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    color: #000;
    margin-bottom: 0;
}
.configuration-details__item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 16px 20px;
    border-bottom: 1px solid #E1E1E1;
    gap: 20px;
}
.configuration-details__left {
    display: flex;
    align-items: flex-start;
}
.configuration-details__left .icon {
    margin-right: 16px;
}
.configuration-details__left .icon img {
    display: block;
    width: 20px;
}
.configuration-details__left .info h5 {
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0.25px;
    vertical-align: middle;
    color: #000000DE;
    margin-bottom: 8px;
}
.configuration-details__left .info ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 0;
}
.configuration-details__left .info ul li {
    font-weight: 500;
    font-size: 13px;
    line-height: 100%;
    text-align: center;
    color: #696969;
    padding: 6px 8px;
    border: 1px solid #E1E1E1;
    border-radius: 6px;
    position: relative;
}
.configuration-details__left .info ul li:not(:last-of-type)::before {
    content: '→';
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0.15px;
    color: #878787;
    position: absolute;
    right: -18px;
    top: 50%;
    transform: translateY(-50%);
}
.configuration-details__right {
    display: flex;
    align-items: center;
    gap: 5px;
}
.configuration-details__right .tag {
    background: #E4F3F6;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #3F3F3F;
    padding: 6px 16px;
    border: 1px solid #CDE9EE;
    border-radius: 8px;
}
.configuration-details__foo {
    background: #F8F8F8;
    padding: 20px;
    display: flex;
    justify-content: flex-end;
}
.export-configuration-button {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0.1px;
    text-align: center;
    color: #000000DE;
    padding: 8px 24px;
}
.export-configuration-button img {
    display: block;
    width: 24px;
    margin-right: 8px;
}
.project-setup-box {
    border: 1px solid #E1E1E1;
    border-radius: 16px;   
    overflow: hidden;
}
.project-setup-box__head {
    padding: 16px 24px;
    border-bottom: 1px solid #E1E1E1;
}
.project-setup-box__head h3 {
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #000;
    margin-bottom: 4px;
}
.project-setup-box__head p {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #3F3F3F;
    margin-bottom: 0;
}
.project-setup-box:not(:last-of-type) {
    margin-bottom: 20px;
}
.project-setup-box__content {
    padding: 15px;
    gap: 16px;
}
.project-setup-box__item {
    flex: 1;
}
.project-setup-box__item input {
    display: none;
}
.project-setup-box__item > div.flex {
    align-items: flex-start;
    width: 100%;
    height: 100%;
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #E1E1E1;
    cursor: pointer;
}
.project-setup-box__item img {
    display: block;
    width: 24px;
    margin-right: 12px;
}
.project-setup-box__item h6 {
    font-weight: 600;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.15px;
    color: #1C1B1F;
    margin-bottom: 6px;
}
.project-setup-box__item p {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.15px;
    color: #3F3F3F;
    margin-bottom: 0;
}
.project-setup-box__item > .flex > div {
    margin-right: 12px;
}
.project-setup-box__item span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    min-width: 26px;
    height: 26px;
    background: #DDF0F3;
    border-radius: 7px;
    margin-left: auto;
}
.project-setup-box__item b {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid #000;
    border-radius: 2px;
}
.project-setup-box__item input:checked + div {
    border-color: #1C9CB2;
}
.project-setup-box__item input:checked + div span b {
    background: #1C9CB2;
    background-image: url('../images/redesign-icons/check-white-icon.svg');
    border-color: #1C9CB2;
    background-repeat: no-repeat;
    background-position: center center;
}
.create-job-families-body .table-field {
    display: flex;
    align-items: center;
} 
.create-job-families-body .table-field input {
    width: 100%;
    min-width: 200px;
}
.create-job-families-body .table-field .tag {
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
    padding: 4px 8px;
    border-radius: 8px;
    margin-left: 4px;
    border: 1px solid;
    white-space: nowrap;
}
.create-job-families-body .table-field .tag.green {
    background: #E9F4F0;
    border-color: #D2E9E1;
    color: #12563E;
}
.create-job-families-body .table-field .tag.red {
    background: #FAECEC;
    border-color: #F5D9D9;
    color: #7A2626;
}
.create-job-families-body .table-field .tag.orange {
    background: #FBECDB;
    border-color: #F8DDBF;
    color: #5B3A15;
}
.job-list {
    column-gap: 8px;
    max-height: 400px;
    overflow: auto;
}
.job-list li {
    background: #FFFFFF;
    border: 1px dashed rgba(28, 156, 178, 0.2);
    border-radius: 8px;
    padding: 0;
    margin-bottom: 3px;
    transition: all .3s ease;
}
.job-list li:hover {
    background: #DDF0F3;
    border-color: #ffffff;
}
.job-list label {
    height: 42px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 16px;
    cursor: pointer;
}
.job-list label.disabled {
    opacity: .5;
}
.job-list li label span {
    font-size: 13px;
    line-height: 18px;
    letter-spacing: 0.5px;
    color: rgba(0, 0, 0, 0.87);
    width: calc(100% - 24px);
}
.job-list li label input {
    display: none;
}
.job-list li label b {
    display: block;
    width: 15px;
    height: 15px;
    border: 2px solid #49454F;
    border-radius: 2px;
}
.job-list li label input:checked + b {
    background-image: url('../images/redesign-icons/check-white-icon.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #1C9CB2;
    border-color: #1C9CB2;
}

/* =========================================================================
   BOX-TO-BOX COMPETENCIES LAYOUT
   ========================================================================= */

.define-competencies {
    max-width: 1120px;
}
.competency-box-to-box {
    display: flex;
    gap: 16px;
}
.competency-box {
    flex: 1;
    border: 1px solid #E1E1E1;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 200px;
}
.competency-box-header {
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #000;
    padding: 16px;
    border-bottom: 1px solid #E1E1E1;
}
.competency-box ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 0;
    list-style: none;
    position: relative;
    height: 100%;
}
.competency-box .competency-box__list {
    padding: 12px !important;
    flex: 1;
    overflow-y: auto;
}
.competency-available-box.competency-box .competency-box__list {
    background: #F8DDBF;
}
.competency-selected-box.competency-box .competency-box__list {
    background: #CDE9EE;
}
.competency-box ul li {
    background: #fff;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #000000DE;
    position: relative;
    border-radius: 8px;
    border: 1px dashed #1C9CB266;
}
.competency-box ul li.competency-custom-input {
    padding: 5px 12px;
}
.competency-available-box.competency-box ul li {
    cursor: pointer;
}
.competency-selected-box.competency-box ul li {
    border: none;
}
.competency-box ul li span {
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0.3px;
    color: #000000DE;
}

/* Available box items */
.competency-available-item {
    cursor: pointer;
    transition: background 0.15s ease, opacity 0.15s ease;
}
.competency-available-item:hover:not(.disabled) {
    background: #E4F3F6;
}
.competency-available-item.disabled {
    background: #F2BF87;
    border: 1px solid #F2BF87;
    cursor: default;
    pointer-events: none;
}
.competency-available-item.disabled {
    color: #1E1307;
}
.competency-available-item.disabled img {
    display: none;
}
.competency-available-item span {
    flex: 1;
}
.competency-available-item .add-icon {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.competency-available-item .add-icon img {
    width: 18px;
    height: 18px;
}

/* Selected box items */
.competency-selected-item {
    cursor: grab;
}
.competency-selected-item:active {
    cursor: grabbing;
}
.competency-selected-item .drag-handle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: #DDF0F3;
    border-radius: 7px;
    margin-right: 12px;
    cursor: move;
}
.competency-selected-item .drag-handle img {
    display: block;
    width: 18px;
}
.competency-selected-item span {
    flex: 1;
}
.competency-selected-item .actions {
    display: flex;
    align-items: center;
    gap: 8px;
    position: static;
    transform: translateY(0);
}
.competency-selected-item .actions button {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    padding: 4px;
    border: none;
    cursor: pointer;
}
.competency-selected-item .actions .remove-competency-button {
    background: transparent;
}
.competency-selected-item .actions button img {
    display: block;
    width: 18px;
}

/* Custom competency input row */
.competency-custom-input {
    cursor: grab;
}
.competency-custom-input .custom-competency-input {
    flex: 1;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 14px;
    font-weight: 500;
    outline: none;
    transition: border-color 0.15s ease;
    cursor: text;
}
.competency-custom-input .custom-competency-input:focus {
    border-color: #1C9CB2;
}

/* Selected empty state */
.competency-selected-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 20px;
}
.competency-selected-empty.hidden {
    display: none;
}
.competency-selected-empty p {
    margin: 0;
    color: #999;
    font-size: 14px;
    text-align: center;
}

/* Sortable placeholder */
.competency-selected-box .sortable-placeholder {
    border: 2px dashed #B0D8DF !important;
    background: #F0FAFB !important;
    height: 44px;
    margin: 0;
    border-radius: 8px;
    box-shadow: none !important;
}

/* Add your own button inside selected box */
.competency-selected-box .competency-add-new {
    background: #E4F3F6;
}
.competency-selected-box .competency-add-new button {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #3F3F3F;
    padding: 16px 20px;
    width: 100%;
    border-radius: 8px;
    transition: background 0.15s ease;
}
.competency-selected-box .competency-add-new button:hover {
    background: #E4F3F6;
}
.competency-selected-box .competency-add-new button .icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    background: transparent;
}
.competency-selected-box .competency-add-new button .icon img {
    width: 20px;
    height: 20px;
}

.map-jobs-over .cell-field {
    background: transparent;
}
.map-jobs-over .cell-field .table-field .select2-selection--multiple .select2-selection__rendered {
    padding-right: 0 !important;
}
.map-jobs-over .select2-selection.select2-selection--multiple {
    width: 200px !important;
    white-space: nowrap;
    overflow: auto;
    height: auto !important;
    background-color: #fff !important;
}

.approve-dropdown-menu {
    background: #fff;
    position: absolute;
    top: 100%;
    left: 0px;
    z-index: 10;
    min-width: 304px;
    margin-top: 4px;
    box-shadow: 0px 8px 24px 2px #00000012;
    padding: 8px;
    border-radius: 12px;
}
.approve-dropdown-menu .approve-dropdown-item {
    width: 100%;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #000000;
    letter-spacing: 0.5px;
    padding: 8px 12px;
}
.approve-dropdown-menu .approve-dropdown-item strong {
    margin-left: 4px;
}
.approve-dropdown-menu .approve-dropdown-item-all {
    border-bottom: 1px solid #CAC4D0;
}

@media (max-width: 1900px) {
    .jd-levels-container {
        width: 1520px !important;
        max-width: 1520px !important;
    }
    .create-job-families__tabs button, 
    .assign-levels-to-jobs__tabs button {
        padding: 15px 20px 15px 0px;
    }
    .create-job-families .redesigned-cancel-button, 
    .assign-levels-to-jobs .redesigned-cancel-button {
        padding: 10px 16px;
    }
    .criteria-generate-ai-box {
        left: 1110px !important;
    }
    .levels-body.has-scroll .criteria-generate-ai-box {
        left: 1102px !important;
    }
    .jd-levels-page-content .criteria-generate-ai-box {
        left: 1198px !important;
    }
}
@media (max-width: 1600px) {
    .jd-levels-container {
        width: 1280px !important;
        max-width: 1280px !important;
    }
    .settings-levels__right .levels-head .icon {
        min-width: 60px;
        width: 60px;
        margin-right: 12px;
    }
    .settings-levels__right .levels-head h4 {
        font-size: 18px;
        line-height: 24px;
    }
    .settings-levels__right .levels-head p {
        font-size: 14px;
        line-height: 20px;
    }
    .settings-levels__right .levels-head .save-button {
        font-size: 12px;
        line-height: 18px;
        padding: 10px 12px;
    }
    .settings-levels__right .levels-head .save-button img {
        width: 16px;
        margin-right: 4px;
    }
    .criteria-generate-ai-box {
        left: 870px !important;
    }
    .levels-body.has-scroll .criteria-generate-ai-box {
        left: 862px !important;
    }
    .jd-levels-page-content .criteria-generate-ai-box {
        left: 1198px !important;
    }
    .create-job-families-head, 
    .assign-levels-to-jobs-head {
        flex-direction: column;
    }
    .create-job-families-head .align-center, 
    .assign-levels-to-jobs-head .align-center {
        align-self: self-start;
    }
    .create-job-families-head .top-buttons, 
    .assign-levels-to-jobs-head .top-buttons {
        width: 100%;
        justify-content: space-between;
    }
}
@media (max-width: 1480px) {
    .jd-levels-page-content .criteria-generate-ai-box {
        left: 1088px !important;
    }
}