/*color palette
#f1a422;
*/

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.container {
    /*margin-top: 3rem;*/
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}

.container-fluid {
    overflow-x: clip;
}

body {
    color: #3a3a3a;
}

h1 {
    font-size: 2.7rem;
}

h2.body-head-content {
    font-size: 2.2rem;
}

h3 {
    font-size: 1.5rem;
}

#loading-screen {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9999;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.7s;
}

#loading-screen.hidden {
    opacity: 0;
}

.hidden-elm {
    visibility: hidden !important;
}

/*==================='
*/
#sidebar-layout .sidebar {
    width: 250px;
    height: 100vh;
    padding-left: 0;
    position: fixed;
    bottom: 0;
    background-color: #f1a422 !important;
    color: #ffffff !important;
    border: none;
    z-index: 3;
    transition: transform 0.3s;
    top: 0;
}

.sidebar-shadow .sidebar {
    box-shadow: 0 0 10px #0000005e;
}

#sidebar-layout.hidden #sidebar {
    transform: translate(-270px);
}

#sidebar-layout.hidden #mbl-sidebar {
    transform: translate(-85px);
}

.offcanvas.offcanvas-start {
    width: 290px;
    box-shadow: 0 0 10px #0000005e;
    background-color: #f1a422 !important;
}

#offcanvas-sidebar.sidebar {
    width: 290px;
    border-right: none;
}

#offcanvas-sidebar .sidebar .workforce-icon {
    margin-right: 12px;
}

#close-offcanvas {
    position: absolute;
    z-index: 90;
    right: 0;
}

.nav-pills .nav-link {
    color: #272727;
    /*cari id warnanya nnti*/
    /*background-color: #;*/
}

.logout-item {
    /*background-color: #FE0000;*/
    border-top: 1px solid #ddd;

}

.nav-pills .logout-link {
    /*color: #842029;*/
    color: #FE0000 !important;
}

.nav-pills .nav-link.active {
    color: #ffffff !important;
    background-color: #f1a422;
}

.sidebar .img-icon {
    width: 12rem;
}

.sidebar .nav-item .nav-link, .offcanvas-body .nav-item .nav-link {
    display: flex;
    column-gap: 0.5rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: 0.85em;
}

.sidebar .nav-item .nav-link.active, .offcanvas-body .nav-item .nav-link.active {
    color: #ffffff !important;
    background-color: #704906;
    border-radius: unset;
}

.sidebar .nav-item, .offcanvas-body .nav-item {
    margin-bottom: 1rem;
}

hr {
    color: #ffffff;
}

/*.tab-pane hr{*/
/*    color: #333333; !important;*/
/*}*/

.sidebar .nav-item .nav-link.active img, .offcanvas-body .nav-item .nav-link.active img, #close-offcanvas {
    filter: brightness(0) invert(1);
}

.header-section {
    display: flex;
    justify-content: end;
    position: sticky;
    top: 0;
    z-index: 2;
    background: #ffff;
    border-bottom: 1px solid #ddd;
}

.header-section .dropdown {
    padding: 0.5rem 1rem 0.5rem calc(1em - 6px);
}

.header-section .dropdown .username {
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-section .dropdown .dropdown-item:hover {
    background-color: #e19c29;
    color: #ffffff;
}

.mbl-sidebar .sidebar .nav-item {
    margin-bottom: 0;
}

.round-image {
    height: 45px;
    width: 45px;
    object-fit: cover;
    border-radius: 50%;
}

.icon-menu {
    /*margin: 0;*/
    padding: 2px;
}

.sub-title {
    font-size: 1.2rem;
    font-weight: 400;
}

#showNav {
    display: none;
}

.main-content {
    transition: all 0.3s;
}

.main-content.hidden {
    padding-left: 0;
}

.mbl-sidebar #main-content {
    padding-left: 4.5rem;
}


/*dropdown (header)*/
.my-profile-item:hover {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.logout-item:hover {
    color: #fff !important;
    background-color: red !important;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.dropdown-icon {
    font-size: 1.1rem;
    padding-left: 0;
    padding-right: 0.4rem;
}

ul.dropdown-menu {
    padding: 0 !important;
}


/*==================='
*/

.icon-svg {
    height: 2.5rem;
}

.icon-svg-sm {
    height: 1.3rem;
}

.active .icon-svg-sm {
    color: #ffffff;
}

.logo-img {
    width: 205px;
}

.hide-show-btn {
    font-size: 1.6rem;
    padding: 0.4rem;
}

/*==================='
*/

a {
    color: #333333;
}


/*==================='
*/

.btn {
    transition: ease-in 4ms;
}

.btn-primary {
    background-color: #f1a422;
    border: none;
    color: #333;

    transition: ease-in 4ms;
}

.btn:disabled {
    background-color: #f1a422;
    border: 1px solid #f1a422;
    color: #ffffff;
}

.btn-primary:hover,
.btn-primary:active {
    background-color: #c5851b !important;
}

.input-group .dropdown-toggle.btn-select {
    border: 1px solid #b3b3b3;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.timeline-btn {
    float: right !important;
}

.btn-wrapper {
    display: flex;
    column-gap: 0.3rem;
}

/*==================='
*/
.search-form {
    /*display: flex;*/
    column-gap: 1rem;
    margin-bottom: 3rem;
    flex-grow: 1;
}

.search-input {
    flex-grow: 1;
}

/*==================='
*/

.pagination .active > .page-link, .page-link.active {
    background-color: #e19c29 !important;
    border: 1px solid #e19c29;
}

.pagination .page-link {
    color: #4c4c4c;
}

/*==================='
*/
table tr {
    vertical-align: middle;
}

.table > :not(caption) > * > * {
    color: #333333;
    padding: 1rem .5rem;
}

.img-profile-row {
    min-width: 60px;
}

.img-background {
    background-image: linear-gradient(to right bottom,
    rgba(0, 0, 0, 0.46),
    rgba(0, 0, 0, 0.46)),
    url("../background/workforce-bg.jpg");
    background-size: cover;
    background-position: center;

}

/*==================='
*/
.input-form .wrapper {
    margin-bottom: 0.85rem;
}

.row.wrapper {
    margin-bottom: 2rem;

    flex-wrap: wrap;
}

.input-form .required::after {
    content: '*';
    color: #FF0000FF;
    width: 12px;
    padding-left: 3px;
}

.input-form .input-label {
    margin-bottom: 0.2rem;
}

.input-form textarea {
    height: auto;
}

.input-form-layout .mobile-view-value {
    margin-top: 0.5rem;
    padding: 0.4rem 0.75rem;
    color: #232323;
    border-radius: 6px;
    border: 1px solid #e7e7e7;

}

.input-form-layout.view-page .mobile-view-value {
    max-height: 220px;
    overflow-y: scroll;
}

.input-form-layout.timeline-card .mobile-view-value {
    padding: 0;
    margin-top: 0.2rem;
    border: none;
    color: #232323;
}

.input-form-layout .mobile-view-value.below-value {
    flex-grow: 1;

    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-form-layout .mobile-view-value.above-value {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;

    z-index: 0;
}

span.nav-link-styling {
    border-bottom: 1px solid #333333;
}

span.nav-link-styling:hover {
    border-bottom: 1px solid #4c4c4c;
    color: #555555;
}

.info {
    font-size: 1rem;
    color: #1164B4;
}

.password-format-reset {
    font-size: 0.9rem;
    color: #555;
    padding-top: 0.5rem;
}

.nav-tabs, .nav-tabs .nav-link {
    font-size: 1.1rem;
}

/*==================='
*/

.wrapper span.tiny-text {
    font-size: 0.85rem;
    color: #5c5c5c;
}

/*==================='
*/
.profile-wrapper {
    text-align: start;
    overflow: hidden;
    padding-bottom: 2rem;
    max-width: 100%;
    width: 300px;
    height: 300px;
}

.profile-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thumbnail-picture {
    padding: 3px;
    border: 2px solid #e7e7e7;
}

.talent-profile-wrapper {
    text-align: start;
    overflow: hidden;
    padding-bottom: 2rem;
    max-width: 100%;
    width: 250px;
    height: 250px;
}

/*RESPONSIVE-NEEDS*/
.table-responsive table .mobile-view-label {
    color: #242424;
    font-size: 0.8rem;
    font-weight: 500;
}

.table-responsive table .mobile-view-value {
    color: #232323;
}

/*CARDS*/
.timeline.card .card-body {
    padding: 1rem 2rem;
}

.input-form-layout .mobile-view-label {
    color: #575757FF;
}

.timeline.card {
    width: auto;

    border: 1px solid #e7e7e7;
    box-shadow: none;
}

.timeline .card-content {
    padding: 1rem 2rem;
}

.timeline-card-status-PASSED,
.timeline-card-status-REJECTED,
.timeline-card-status-INTERVIEWED_BY_PARTNER,
.timeline-card-status-INTERVIEWED_BY_BALABALI,
.timeline-card-status-INTERVIEWED_BY_END_USER,
.timeline .card-header {
    color: #e7e7e7;
    border-bottom: none;
}

.timeline-card-status-PASSED {
    background-color: #198754;
}

.timeline-card-status-REJECTED {
    background-color: #dc3545;
}

.timeline-card-status-INTERVIEWED_BY_PARTNER {
    background-color: #0d6efd;
}

.timeline-card-status-INTERVIEWED_BY_BALABALI {
    background-color: #f1a422;
}

.timeline-card-status-INTERVIEWED_BY_END_USER {
    background-color: #6c757d;
}


/*JOB HISTORY STATUS COLOR(s)*/
.history-status-label-ACTIVE,
.history-status-label-INACTIVE {
    color: #e7e7e7 !important;
}

.history-status-label-ACTIVE {
    background-color: #198754;
}

.history-status-label-INACTIVE {
    background-color: #dc3545;
}

/*JOB APPLICATIONS CARD*/
.job {
    margin-bottom: 1rem;
}

.talent-view.card {
    width: auto;
    border: 1px solid #e7e7e7;
    box-shadow: none;
}

/*DASHBOARD WIDGETS*/
.card {
    box-shadow: none;
}


.job-card {
    /*background-color: #20c997;*/
    background-color: #42d4a9;
}

.talent-card {
    background-color: #fcc419;
}

.talent-placed-card {
    /*background-color: #15aabf;*/
    background-color: #40c8dc;
}

.current-talent-placed {
    background-color: #7FFFD4FF;
}

.widget.card {
    width: 100%;
    align-content: center;
    margin: auto;
    box-shadow: none;
    text-decoration: none;
}

.widget-icon {
    font-size: 2.4rem;
    padding: 0.5rem;
    border-radius: 100%;
    margin-bottom: 0.5rem;
}

/***************************/
/*index talent status label*/
/***************************/
.talent-status-label-wrapper {
    padding: 0.3rem 0.5rem;
    border-radius: 8px;
    max-width: 8.5rem;
}

.talent-status-label-new {
    background-color: #198754;
}

.talent-status-label-resigned {
    background-color: #dc3545;
}

.talent-status-label-working {
    background-color: #0d6efd;
}

.talent-status-label-not_working {
    background-color: #f1a422;
}

.talent-status-label-interviewed {
    background-color: #f1a422;
}

.talent-status-label-passed {
    background-color: #0d6efd;
}

.talent-status-label-rejected {
    background-color: #dc3545;
}

.status-label {
    color: white !important;
}

.status-icon {
    color: white;
}

/***************************/
/*index talent status label*/
/***************************/
.talent-status-label-wrapper {
    padding: 0.2rem 0.5rem;
    border-radius: 8px;
    max-width: 8.5rem;
}

.talent-status-label-new {
    background-color: #198754;
}

.talent-status-label-resigned {
    background-color: #dc3545;
}

.talent-status-label-working {
    background-color: #0d6efd;
}

.talent-status-label-not_working {
    background-color: #f1a422;
}

.talent-status-label-interviewed {
    background-color: #f1a422;
}

.talent-status-label-passed {
    background-color: #0d6efd;
}

.talent-status-label-rejected {
    background-color: #dc3545;
}

.status-label {
    color: white !important;
}

.status-icon {
    color: white;
}

.reactivate.btn-info{
    color: inherit;
}
/***************************/
/* Preview File Attachment */
/***************************/
.preview-file-pdf {
    /*width: 700px;*/
    width: 100%;
    height: 500px;
}

.preview-file {
    width: 100%;
    height: 500px;
}

.preview-file-image {
    max-width: 100%;
    height: auto;
}

.attachment-name {
    min-width: 12rem;
}

/*No Data image*/
.no-data-img {
    align-content: center;
    width: 320px;
    max-width: 100%;
}


/***************************/
/*Progress Bar*/
/***************************/
/*.progress-bar{*/
/*    position: relative;*/
/*    height: 250px;*/
/*    width: 250px;*/
/*    border-radius: 50%;*/
/*    background: conic-gradient(#7d2ae8 3.6deg, #ededed 0deg);*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/

/*.progress-bar::before{*/
/*    content: "";*/
/*    position: absolute;*/
/*    height: 210px;*/
/*    width: 210px;*/
/*    border-radius: 50%;*/
/*    background-color: #fff;*/
/*}*/

.progress-bar {
    align-items: center;
}

.lds-roller,
.lds-roller div,
.lds-roller div:after {
    box-sizing: border-box;
}

.lds-roller {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}

.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7.2px;
    height: 7.2px;
    border-radius: 50%;
    background: currentColor;
    margin: -3.6px 0 0 -3.6px;
}

.lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
}

.lds-roller div:nth-child(1):after {
    top: 62.62742px;
    left: 62.62742px;
}

.lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
}

.lds-roller div:nth-child(2):after {
    top: 67.71281px;
    left: 56px;
}

.lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
}

.lds-roller div:nth-child(3):after {
    top: 70.90963px;
    left: 48.28221px;
}

.lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
}

.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}

.lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
}

.lds-roller div:nth-child(5):after {
    top: 70.90963px;
    left: 31.71779px;
}

.lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
}

.lds-roller div:nth-child(6):after {
    top: 67.71281px;
    left: 24px;
}

.lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
}

.lds-roller div:nth-child(7):after {
    top: 62.62742px;
    left: 17.37258px;
}

.lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
}

.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12.28719px;
}

@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/*ICONS*/
.icon-plus {
    font-size: 21px;
    margin-right: 0.1rem;
}

.icon-arrow-back {
    font-size: 18px;
    margin-right: 0.1rem;
}

.custom-select {
    max-width: 11rem;
}

.icon-menu {
    font-size: 1.7rem;
}

.last-up-info {
    font-size: 0.85rem;
    color: #818080;
}

.last-up-info.card-last-up-info {
    padding-top: 0.5rem;
}

/*********/
/*Vacancy*/
/*********/
.input-title {
    margin: 0;
}

.search-field {
    width: 100%;
}

.form-check .form-check-input {
    height: 1.4rem;
    width: 3rem;
    border: 1px solid #717171;
}

.form-check-input:checked {
    border: none;
    background-color: #0d6efd;
}

.form-check .form-check-label {
    font-size: 0.9rem;
    padding-left: 0.5rem;
    padding-top: 0.3rem;
}

/*********/
/* BREADCRUMBS */
/*********/
.dashboard-breadcrumb .home-icon {
    font-size: 1.3rem;
    color: #575757;
    font-weight: 600;
}

.breadcrumbs-link {
    color: #575757;
    text-decoration: none;
    font-weight: 400;
}

.breadcrumb-item.active {
    color: #1a1a1a;
    font-weight: 460;
}

.small-header-text {
    margin-top: 3rem;
}