* {
    color: #555 !important;
}

::-webkit-scrollbar {
	width: 8px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #555;
}

.webix_progress_state, .webix_overlay div strong {
    color: black !important;
}

.webix_inp_bottom_label[role="alert"] {
    color: #ff8d82 !important;
}

.webix_disabled {
    background-color: inherit !important; /* Atur latar belakang agar tetap sama */
    opacity: 1 !important; /* Mengembalikan opacity ke normal */
    pointer-events: none; /* Memastikan elemen tidak bisa diklik */
}

/* Mengatasi perubahan warna teks pada elemen yang dinonaktifkan */
.webix_disabled .webix_view {
    color: inherit !important; /* Menjaga warna teks agar tetap sama */
}

/* Jika ingin menonaktifkan elemen tanpa visual cue, hapus shadow box */
.webix_disabled .webix_button {
    box-shadow: none !important; /* Menghilangkan shadow pada button yang dinonaktifkan */
}

.webix_alert {
    border-radius: 10px !important;
}

.webix_progress_state {
    mix-blend-mode: screen !important;
}

/* ANOTHER CUSTOM CSS */
.dashboard-box {
    background-color: #f0faff !important;
    box-shadow: 2px 2px 5px 2px #d9d9d9 !important;
    border-radius: 10px !important;
}
.profile .webix_template {
    background-color: #990a0a !important;
    font-weight: 500 !important;
    border-radius: 30px !important;
    color: #ffffff !important;
}
.profile .webix_view {
    background-color: inherit !important;
}
.bullet-complete {
    color: #27ae60 !important;
}
.bullet-incomplete {
    color: #d9d9d9 !important;
}
.bullet-info {
    color: #ffdb59 !important;
}
.bullet-rejected {
    color: #ff4343 !important;
}
.window-bg-gray {
    background-color: #f2f2f2 !important;
}
.window-rounded {
    border-radius: 10px !important;
}
.detail-border {
    border: 1px solid #dadee0 !important;
}
.track-checkbox .webix_custom_checkbox::before {
    color: #27ae60 !important;
}
.pdf-header * {
    color: #ffffff !important;
}
.rm-margin {
    margin: 0 !important;
}
#pdf-container {
    background-color: #202020 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;  /* Menengahkan canvas secara horizontal */
    align-items: center !important;      /* Menengahkan canvas secara vertikal */
    height: 100% !important; 
}
.card-copercores {
    box-shadow: 0 2px 8px #dadee0 !important;
    border-radius: 10px;
}

.br-radius input,
.br-radius button,
.br-radius textarea,
.br-radius .webix_inp_static {
    border-radius: 10px !important;
}

.white-icon .webix_progress_icon {
    color: white !important;
}

.border-width .webix_cell,
.border-width .webix_hcell,
.border-width .webix_dtable .webix_ss_header .webix_hcolumn div.webix_last_row, 
.border-width .webix_dtable .webix_ss_header .webix_span.webix_last_row {
    border-width: 2px !important;
    border-color: #dadee0 !important;
}
.border-width .webix_hcolumn {
    background-color: #2e5ca1 !important;
}
.border-width .webix_hcell {
    color: white !important;
}
.vcenter-content .webix_template {
    display: flex;
    align-items: center;
}
/* END ANOTHER CUSTOM CSS */


/* INPUT CSS */
.icon-input .webix_input_icon {
    left: 7px !important;
    right: auto !important;
    color: #a4a4ad !important;
}
.icon-input input {
    padding-left: 35px !important;
    border-radius: 10px !important;
}
/* END INPUT CSS */


/* PADDING CSS */
.pl-0 .webix_template {
    padding-left: 0 !important;
}
/* END PADDING CSS */



/* WEBIX ICON CSS */
.icon-large .webix_icon {
    font-size: 100px !important;
}
/* END WEBIX ICON CSS */



/* BACKGROUND COLOR  CSS */
.bg-red {
    background-color: #eb1c22 !important;
}
.bg-white .webix_layout_wide {
    background-color: inherit !important;
}
.bg-gray {
    background-color: #dfdfdf !important;
}
.bg-dark-gray {
    background-color: #404040 !important;
}
.bg-light-blue {
    background-color: #f0faff !important;
}
/* END BACKGROUND COLOR  CSS */


/* FONT CUSTOM CSS */
.font-slarge .webix_el_box,
.font-slarge .webix_el_box .webix_inp_label,
.font-slarge .webix_el_box button.webix_button, 
.font-slarge .webix_el_box button.webix_button span {
    font-size: 24pt !important;
}

.font-large .webix_el_box,
.font-large .webix_el_box .webix_inp_label,
.font-large .webix_el_box button.webix_button, 
.font-large .webix_el_box button.webix_button span {
    font-size: 18pt !important;
}
.font-medium .webix_el_box,
.font-medium .webix_el_box .webix_inp_label,
.font-medium .webix_el_box button.webix_button, 
.font-medium .webix_el_box button.webix_button span {
    font-size: 12pt !important;
}
.font-regular .webix_el_box,
.font-regular .webix_el_box .webix_inp_label,
.font-regular .webix_el_box button.webix_button, 
.font-regular .webix_el_box button.webix_button span {
    font-size: 10pt !important;
}
.font-small-medium .webix_el_box,
.font-small-medium .webix_el_box .webix_inp_label,
.font-small-medium .webix_el_box button.webix_button, 
.font-small-medium .webix_el_box button.webix_button span {
    font-size: 9pt !important;
}
.font-small .webix_el_box,
.font-small .webix_el_box .webix_inp_label,
.font-small .webix_el_box button.webix_button, 
.font-small .webix_el_box button.webix_button span {
    font-size: 8pt !important;
}


.font-bold .webix_el_box,
.font-bold .webix_template {
    font-weight: bold !important;
}
.font-semibold .webix_el_box,
.font-semibold .webix_template {
    font-weight: 500 !important;
}


.fc-white .webix_el_box,
.fc-white .webix_icon,
.fc-white .webix_icon_btn,
.fc-white .webix_button {
    color: #ffffff !important;
}
.fc-gray .webix_el_box,
.fc-gray .webix_icon,
.fc-gray .webix_icon_btn,
.fc-gray .webix_buttonx {
    color: #a4a4a4 !important;
}
.fc-blue .webix_el_box,
.fc-blue .webix_icon,
.fc-blue .webix_icon_btn,
.fc-blue .webix_buttonx{
    color: #2e5ca1 !important;
}
.fc-black .webix_el_box,
.fc-black .webix_icon,
.fc-black .webix_icon_btn,
.fc-black .webix_buttonx {
    color: #202020 !important;
}
.fc-green .webix_el_box,
.fc-green .webix_icon,
.fc-green .webix_icon_btn,
.fc-green .webix_button,
.fc-green {
    color: #27ae60 !important;
}

.fc-yellow .webix_el_box,
.fc-yellow .webix_icon,
.fc-yellow .webix_icon_btn,
.fc-yellow .webix_button,
.fc-yellow {
    color: #ffb921 !important;
}

.fc-red .webix_el_box,
.fc-red .webix_icon,
.fc-red .webix_icon_btn,
.fc-red .webix_button,
.fc-red {
    color: #eb1c22 !important;
}

.no-decoration .webix_el_box a {
    text-decoration: none !important;
}

.text-center .webix_template {
    text-align: center !important;
}

/* END FONT CUSTOM CSS */



/* BUTTON CUSTOM CSS */
.webix_icon_btn {
    cursor: pointer !important;
}

.btn-blue button.webix_button.webix_img_btn, 
.btn-blue button.webix_button.webix_img_btn .webix_icon_btn {
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
}
.btn-blue button.webix_button.webix_img_btn:hover {
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
    border-radius: 10px !important;
}
.btn-blue button.webix_button.webix_img_btn:hover .webix_icon_btn {
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    border-radius: 10px !important;
}
.btn-blue button.webix_button {
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
}
.btn-blue button.webix_button:hover {
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
    border-radius: 10px !important;
}
.btn-blue button.webix_button:disabled {
    background-color: #6988b8 !important;
    color: #ffffff !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
    border-radius: 10px !important;
}

.btn-white button.webix_button {
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
    border-radius: 10px !important;
}
.btn-white button.webix_button.webix_img_btn, 
.btn-white button.webix_button.webix_img_btn .webix_icon_btn {
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    border-radius: 10px !important;
}
.btn-white button.webix_button:hover,
.btn-white button.webix_button.webix_img_btn:hover,
.btn-white button.webix_button.webix_img_btn:hover .webix_icon_btn {
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
}


.btn-gray button.webix_button {
    background-color: gray !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-gray button.webix_button.webix_img_btn, 
.btn-gray button.webix_button.webix_img_btn .webix_icon_btn {
    background-color: gray !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-gray button.webix_button:hover,
.btn-gray button.webix_button.webix_img_btn:hover,
.btn-gray button.webix_button.webix_img_btn:hover .webix_icon_btn {
    background-color: whitesmoke !important;
    color: gray !important;
    box-shadow: inset 0 0 0 1px gray !important;
    border-radius: 10px !important;
}

.btn-green button.webix_button {
    background-color: #04b11b !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-green button.webix_button.webix_img_btn, 
.btn-green button.webix_button.webix_img_btn .webix_icon_btn {
    background-color: #04b11b !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-green button.webix_button:hover,
.btn-green button.webix_button.webix_img_btn:hover,
.btn-green button.webix_button.webix_img_btn:hover .webix_icon_btn {
    background-color: whitesmoke !important;
    color: #04b11b !important;
    box-shadow: inset 0 0 0 1px #04b11b !important;
    border-radius: 10px !important;
}

.btn-red button.webix_button {
    background-color: #eb1c22 !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-red button.webix_button.webix_img_btn, 
.btn-red button.webix_button.webix_img_btn .webix_icon_btn {
    background-color: #eb1c22 !important;
    color: whitesmoke !important;
    border-radius: 10px !important;
}
.btn-red button.webix_button:hover,
.btn-red button.webix_button.webix_img_btn:hover,
.btn-red button.webix_button.webix_img_btn:hover .webix_icon_btn {
    background-color: whitesmoke !important;
    color: #eb1c22 !important;
    box-shadow: inset 0 0 0 1px #eb1c22 !important;
    border-radius: 10px !important;
}
/* END BUTTON CUSTOM CSS */

/* ACCORDION CUSTOM CSS */
.accor-border {
    border-width: 1px !important;
}
.accor-border .webix_accordionitem_header {
    background-color: #ffffff !important;
}
/* END ACCORDION CUSTOM CSS */


/* POPUP CUSTOM CSS */
.popup-success .webix_popup_title {
    box-shadow: none !important;
    background-color: #27ae60 !important;
    color: white !important;
    margin-bottom: 20px;
}
.popup-success .webix_popup_controls .webix_popup_button,
.popup-success .webix_popup_controls .webix_popup_button div {
    border-radius: 10px !important;
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
}
.popup-success .webix_popup_controls .webix_popup_button div:hover {
    border-radius: 10px !important;
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
}

.popup-error .webix_popup_title {
    box-shadow: none !important;
    background-color: #eb1c22 !important;
    color: white !important;
    margin-bottom: 20px;
}
.popup-error .webix_popup_controls .webix_popup_button,
.popup-error .webix_popup_controls .webix_popup_button div {
    border-radius: 10px !important;
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
}
.popup-error .webix_popup_controls .webix_popup_button div:hover {
    border-radius: 10px !important;
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
}

.popup-warning .webix_popup_title {
    box-shadow: none !important;
    background-color: #ffaa00 !important;
    color: white !important;
    margin-bottom: 20px;
}
.popup-warning .webix_popup_controls .webix_popup_button,
.popup-warning .webix_popup_controls .webix_popup_button div {
    border-radius: 10px !important;
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
}
.popup-warning .webix_popup_controls .webix_popup_button div:hover {
    border-radius: 10px !important;
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
}

.popup-info .webix_popup_title {
    box-shadow: none !important;
    background-color: #2e5ca1 !important;
    color: white !important;
    margin-bottom: 20px;
}
.popup-info .webix_popup_controls .webix_popup_button,
.popup-info .webix_popup_controls .webix_popup_button div {
    background-color: #2e5ca1 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
}
.popup-info .webix_popup_controls .webix_popup_button div:hover {
    border-radius: 10px !important;
    background-color: #ffffff !important;
    color: #2e5ca1 !important;
    box-shadow: inset 0 0 0 1px #2e5ca1 !important;
}
/* END POPUP CUSTOM*/