/* Khoa  start*/

body.setting .content .panel_s:has(.widget-tabs) {
    margin-top: 12px;
}

#wrapper {
    min-height: 100% !important;
}

.btn {
    border-radius: 0 !important;
}

.table_number_record {
    text-align: right;
    margin-top: 10px;
}

.btn-main_color {
    background-color: #3CA1FF;
    color: #fff;
}

.ui-widget.ui-widget-content {
    z-index: 10000 !important;
}

.input-group-addon {
    border-radius: 0;
}

[class*="active"]>ul>li:first-child {
    margin-top: 8px;
}

[class*="active"]>ul>li:last-child {
    margin-bottom: 8px;
}

.box-staff {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

table .row-options {
    display: flex;
    flex-direction: column;
    text-align: right;
    margin-left: 15px;
    left: 0 !important;
}

.text-danger {
    --tw-text-opacity: 1;
    color: rgb(239 68 68/var(--tw-text-opacity)) !important;
}

.not-wrap .form-group {
    flex-wrap: inherit;
}

._delete .fa-trash {
    color: #ef4444;
}

.tag-department {
    margin-bottom: 10px;
}

.member_profile {
    background-color: #fff;
}

.box-profile-staff {
    padding: .625rem .875rem;
}

.nav-profile {
    border: none;
    box-shadow: none;
}

.profile-bg {
    background-color: #ECE7E7;
}

.flex-container {
    display: flex;
    align-items: center;
    /* Align items vertically */
}

.header-profile {
    padding-left: 0 !important;
    padding-left: 0 !important;
    background-color: #B2AFAF;
}

.flex-item>h5 {
    margin: 0;
    font-weight: 600;
    color: #000;
    font-size: 16px;
}

.background-section {
    background-color: #fff;
    padding: 15px;
}

.m-t-0 {
    margin-top: 0;
}

.pd-l-0 {
    padding-left: 0;
}

.pd-r-0 {
    padding-right: 0;
}

.pd-l-15-px {
    padding-left: 15px;
}

.pd-r-15-px {
    padding-left: 15px;
}

.m-l-15-px {
    margin-left: 15px;
}

.m-r-15-px {
    margin-right: 15px;
}

.mt-15-px {
    margin-top: 15px;
}

.mt-25-px {
    margin-top: 25px !important;
}

.mb-0 {
    margin-bottom: 0;
}

.col-lg-3 {
    width: 25%;
}

.col-lg-6 {
    width: 50%;
}

.col-lg-12 {
    width: 100%;
}

.row_cs {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

.profile_tab_btn:hover {
    background-color: #0369A1;
    color: #fff !important;
    border: 1px solid #0284c7 !important;
}

.profile_tab_btn {
    color: #000;
    font-size: 12px;
    padding: .25rem .625rem;
    border-radius: 0 !important;
    display: inline-block;
    line-height: 20px;
    font-weight: 500;
    transition: all 0.2s;
    border: 1px solid transparent;
}

.info_title_section {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px !important;
    border-bottom: 1px solid #ccc;
    padding: 7px 0;
    margin-top: 0;
    margin-left: 0 !important;
    width: 90%;
}

.profile-info-title-head {
    color: #000;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 12px;
}

.profile-info-title-head+b {
    color: #000;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    font-size: 12px;
}

.profile-content-section {
    height: calc(95vh - 170px);
    overflow: auto;
}

.box--info__row p span {
    font-size: 12px !important;
}

.box--info__title:before {
    content: none !important;
}


/* Khoa end */

.table-responsive th:after {
    display: none !important;
}

.menu-item-qu-n-l-nh-n-s4,
.menu-item-qu-n-l-nh-n-s6,
.menu-item-qu-n-l-d-n3,
.menu-item-h-th-ng5,
.menu-item-qu-n-l-d-n7,
.menu-item-h-th-ng8,
.menu-item-qu-n-l-x-ng6 {
    margin-top: 15px;
}

.sidebar li a i.menu-icon {
    opacity: 1;
}

.menu-item-qu-n-l-nh-n-s4 .menu-text,
.menu-item-qu-n-l-nh-n-s6 .menu-text,
.menu-item-qu-n-l-d-n3 .menu-text,
.menu-item-h-th-ng5 .menu-text,
.menu-item-qu-n-l-d-n7 .menu-text,
.menu-item-ph-n-t-ch5 .menu-text,
.menu-item-ph-n-t-ch2 .menu-text,
.menu-item-h-th-ng8 .menu-text,
.menu-item-qu-n-l-x-ng6 .menu-text {
    font-size: 15px;
    font-weight: bold;
    color: #B9B6B6
}

.menu-item-hr_profile .menu-text,
.menu-item-timesheets .menu-text,
.menu-item-hr_payroll .menu-text,
.menu-item-project_roadmap .menu-text,
.menu-item-factory .menu-text,
.menu-item-contractual .menu-text,
#setup-menu-item .menu-text {
    font-size: 13px;
    text-transform: uppercase;
}

.menu-item-hr_profile .menu-icon,
.menu-item-timesheets .menu-icon,
.menu-item-hr_payroll .menu-icon,
.menu-item-factory .menu-icon,
.menu-item-contractual .menu-icon,
.menu-item-project_roadmap .menu-icon,
#setup-menu-item .menu-icon {
    padding-top: 2px;
}

.logo.img-responsive img {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

#header {
    position: fixed;
    width: calc(100% - 230px);
    transition: .3s;
    top: 0;
}

#menu {
    position: fixed;
    width: 230px;
    z-index: 9;
    left: 1px;
    transition: .3s;
    overflow-y: scroll;
}

#menu::-webkit-scrollbar {
    width: 0;
}

#setup-menu-wrapper {
    z-index: 10;
    position: fixed;
}

#setup-menu-wrapper .metis-menu {
    overflow-y: scroll;
    height: 100vh;
}

#setup-menu-wrapper .metis-menu::-webkit-scrollbar {
    width: 0;
}

#staff_view_name {
    margin-bottom: 15px;
    background: rgba(60, 161, 255, 0.6);
    ;
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

#staff_view_name .bootstrap-select .dropdown-toggle {
    background: transparent;
    border: none !important;
    outline: none !important;
    box-shadow: none;
    font-weight: bold;
}

.font-weight-bold {
    font-weight: bold;
}

.form-group {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.form-group>* {
    width: calc(100% - 150px) !important;
}

.form-group>label {
    width: 150px !important;
    padding-right: 10px;
}

.form-group p.text-danger {
    margin-left: 150px;
    margin-top: 5px;
}

.no-wrap .form-group {
    flex-wrap: inherit;
}

.wi-100 .form-group>* {
    width: 100% !important;
}

.w-100 {
    width: 100% !important;
}

#header {
    z-index: 9999;
}

.sidebar li .nav-second-level a .menu-icon {
    margin-right: 5px;
    font-size: 13px;
    padding-top: 4px;
}

#menu #logo .logo {
    background: #ffffff;
}

#wrapper {
    margin-top: 63px;
}

table td:last-child .btn {
    padding: 3px 6px;
}

table td:last-child .btn:not(:last-child) {
    margin-right: 5px;
}

.dataTables_wrapper div.dataTables_filter input {
    min-width: 250px !important;
}

.custom-search {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
    z-index: 10;
}

.custom-search>div {
    width: auto;
}

.dataTables_scroll {
    z-index: 9;
}

.custom-search>div:last-child {
    padding-left: 0;
}

div.dtfh-floatingparenthead {
    z-index: 999999;
    top: 62.2px !important;
    margin-top: 0 !important;
}

body {
    padding-right: 0 !important;
}

.table>tbody>tr>td {
    border: 0.1em solid rgba(226, 232, 240, .7);
    vertical-align: middle;
}

#table-table_job_position.table>tbody>tr>td,
.table-contractual.table>tbody>tr>td,
.table-factory.table>tbody>tr>td {
    border: none;
}

@media screen and (min-width: 1001px) and (max-width: 1200px) {
    .dataTables_scrollBody {
        height: 30vh;
    }
}

@media screen and (min-width: 1201px) and (max-width: 1399px) {
    .dataTables_scrollBody {
        height: 40vh;
    }
}

@media screen and (min-width: 1400px) and (max-width: 1600px) {
    .dataTables_scrollBody {
        height: 45vh;
    }
}

@media screen and (min-width: 1601px) and (max-width: 1800px) {
    .dataTables_scrollBody {
        height: 50vh;
    }
}

@media screen and (min-width: 1801px) and (max-width: 1900px) {
    .dataTables_scrollBody {
        height: 53vh;
    }
}

@media screen and (min-width: 1901px) and (max-width: 2000px) {
    .dataTables_scrollBody {
        height: 58vh;
    }
}

@media screen and (min-width: 2001px) and (max-width: 2400px) {
    .dataTables_scrollBody {
        height: 63vh;
    }
}

@media screen and (min-width: 2401px) {
    .dataTables_scrollBody {
        height: 71vh;
    }
}

.align-items-center {
    align-items: center !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

.d-flex {
    display: flex !important
}

.d-none {
    display: none !important;
}

.widget-header {
    position: relative;
    margin-bottom: 5px;
}

.widget-header>form {
    position: absolute;
    top: 40px;
    right: 0;
    width: 480px;
    background-color: #d8ecff;
    padding: 15px;
    z-index: 1000;
    font-size: 12px;
    display: none;
}

.widget-header .widget-tabs {
    margin-bottom: 0;
}

.widget-header .widget-tabs>li {
    display: inline-block;
    overflow: hidden;
}

.widget-header .widget-tabs>li.active a {
    background-color: #0094de;
    color: #fff
}

.widget-header .widget-tabs>li a {
    display: inline-block;
    font-weight: 600;
    font-size: 12px;
    padding: .5rem .625rem;
    color: #000;
}

.widget-header .widget-tabs>li a:hover {
    background-color: #038acd;
    color: #fff;
}

.widget-header .widget-tools {
    display: inline-flex;
}

.widget-header .widget-tools>* {
    margin-right: 0;
}

.widget-header .widget-tools>*:not(:first-child) {
    margin-left: 7px;
}

.widget-header .widget-tools .btn {
    border-radius: 0;
}

.widget-header .widget-tools .btn:not(.btn-info) {
    display: inline-flex;
    width: 29px;
    height: 29px;
    background-color: #fff;
    align-items: center;
    justify-content: center;
    border-radius: 0;
    color: #333;
}

.widget-header .widget-tools .btn:hover {
    opacity: .9;
}

.widget-header .widget-tools .btn:not(.btn-info) i {
    font-size: 16px;
}

.widget-header .widget-tools+form>.form-group+.text-right {
    margin-top: 15px;
    ;
}

.widget-header>form .dropdown-menu {
    margin-top: 0;
}

.widget-header>form label {
    font-weight: 400;
    margin-bottom: 0;
}

.widget-header>form .input-group input {
    /* border-top-right-radius: .375rem !important;
    border-bottom-right-radius: .375rem !important; */
    border-radius: 0px;
}

.widget-header>form .form-group {
    margin-bottom: 5px;
}

.form-control {
    border-radius: 0 !important;
}

.widget-header>form .form-control,
.widget-header>form .bootstrap-select .btn {
    font-size: 12px;
    height: 30px;
}

body .handsontable {
    font-family: 'Arial', 'sans-serif';
}

.bg-alpha {
    background-color: #3CA1FF !important;
}

.bg-alpha:hover,
.bg-alpha:focus {
    background-color: #038acd !important;
}

.panel-body {
    padding: 0 !important;
}

.panel,
.panel-body,
.panel_s {
    background-color: transparent !important;
    border: none !important;
    --tw-shadow: 0 !important;
}

.hr_profile_view_profile {
    background: #fff;
    overflow: auto;
    max-height: 91vw;
}

.hr_profile_view_profile>* {
    padding: 10px 21px !important;
}

.text_right .group_info {
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 8px;
}

.group_item {
    margin-left: 50px;
    font-size: 16px;
}

.group_item p {
    margin-bottom: 5px;
}

.group_item b {
    font-weight: 600;
}

.handsontable table.htCore thead th {
    background: rgb(214, 214, 214) !important;
    font-weight: 400;
}

.handsontable table.htCore thead th,
.handsontable table.htCore tbody th,
.handsontable table.htCore tbody td {
    vertical-align: middle;
}

.handsontable table.htCore tbody th:first-child {
    font-weight: 400;
}

.sidebar .nav>li .nav-second-level>li:not(.active)>a:focus,
.sidebar .nav>li .nav-second-level>li:not(.active)>a:hover {
    color: rgb(0, 148, 222);
}


/* light css */

.sidebar li .nav-second-level li a {
    display: block !important;
}

.handsontable table.htCore tbody tr:nth-child(even) {
    background-color: #f8fafc;
}

body:has(.widget-tools) {
    overflow-y: hidden;
}

@media screen and (max-width: 769px) {
    body:has(.widget-tools) {
        overflow-y: auto;
    }
}

@media screen and (max-height: 480px) {
    body:has(.widget-tools) {
        overflow-y: auto;
    }
}

.sidebar li .nav-second-level li.active a {
    background-color: #41547b;
    border-radius: 0px;
}

.sidebar li .nav-second-level li a {
    display: block !important;
}

.btn_blue {
    background-color: #3CA1FF;
    color: #fff;
}

.ht_master img.staff-profile-image-small {
    display: none !important;
}

.widget-tools {
    display: flex;
    align-items: center;
}

.widget-tools>* {
    order: 10;
}

.widget-tools>.js-widget-tools-show-form {
    margin-left: 10px;
    order: 0;
}

.widget-tools> :is(button, a):has(.fa.fa-refresh) {
    order: 1;
}

.widget-tools> :is(button, a):has(.fa-regular.fa-square-plus) {
    order: 2;
}

.widget-tools> :is(button, a):has(.fa-solid.fa-download) {
    order: 47;
}

.widget-tools> :is(button, a):has(.fa.fa-upload) {
    order: 48;
}

.widget-tools> :is(form, div, button, a):has(.fa-solid.fa-trash) {
    order: 49;
}

.widget-tools .fa-solid.fa-trash {
    color: #ff0000;
}

.orgchart .node .main.title_name {
    font-weight: 600;
}

.justify-items-end {
    justify-content: end;
}


/* .bg-gray {
    background-color: #B2AFAF;
}

.bg-gray .btn_icon {
    background-color: #fff;
} */

.dt-loader:not(:required) {
    transform: translateY(-50%);
    margin-left: -55px;
    margin-top: -55px;
}

.handsontable td,
.handsontable th {
    font-size: 12px;
}

b,
strong {
    font-weight: 600;
}

.handsontable-pagination {
    margin-top: 15px;
}

.handsontable td>.div-tool {
    padding: 5px;
}

.handsontable td>.div-tool>.btn {
    padding: 0px 4px;
}

div.handsontable div.wtHolder div.wtHider table tbody tr td {
    color: #000;
    /* Lucas tạm thời ẩn important để tô màu trong báo cáo */
}

.title_orange {
    color: #DC5F00 !important;
    font-weight: 600 !important;
}

.title_red {
    color: #c00000 !important;
    font-weight: 600 !important;
}

.hr_profile_view_profile>#asset_file_data {
    padding: 0 !important;
}

.h3,
h3 {
    font-size: 20px;
}

.\!tw-overflow-hidden {
    overflow: hidden !important;
}

.btn-info.hr_q_a_ind {
    background-color: #0094de;
}

.btn-info.hr_q_a_ind:hover {
    background-color: #038acd;
    color: #fff;
}

.input-group-btn:first-child>select+.btn {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btn-info.a_acticle:hover {
    background-color: #0094de;
    color: #fff;
}

.btn-info.a_acticle {
    background-color: transparent;
    color: #000;
    border-color: transparent;
}

.article-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.edit_article_knowlage {
    margin-left: 10px;
}

.\!row {
    margin-left: -15px !important;
    margin-right: -15px !important;
}

.mtz-monthpicker {
    color: #000;
}

.ui-widget-header {
    background: transparent;
    border-color: transparent;
}

.ui-widget-header .mtz-monthpicker-year {
    width: 100%;
}


.mtz-monthpicker :is(.ui-button, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, html .ui-button.ui-state-disabled:active, html .ui-button.ui-state-disabled:hover) {
    border-color: transparent;
    color: #000;
    font-weight: 400;
    font-size: .875rem;
    padding: 8px;
}

.mtz-monthpicker :is(.ui-button.ui-state-active:hover, .ui-button:active, .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-state-default.mtz-monthpicker-month:hover) {
    border-color: #1c94c4;
    background: #1c94c4;
    color: #fff !important;
}

.ui-state-default.mtz-monthpicker-month:hover {
    cursor: pointer !important;
}

form .form-group {
    align-items: center;
}

form .form-group:has(textarea) {
    align-items: flex-start;
}

.\!align-items-start {
    align-items: flex-start !important;
}

.line-clamp-1 {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.article_header_detail {
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

.article_update {
    border-bottom: 1px solid #3f3c3c;
}

.tinymce-w .mce-tinymce.mce-container.mce-panel {
    width: 100% !important;
}

.article_show {
    border-bottom: 1px solid #e4dfdffa;
}

table.table th {
    background-color: #d6d6d6 !important;
    font-weight: bold !important;
}

.c-alert {
    padding: 5px 10px;
    color: #fff;
    border-radius: 5px;
    font-size: 0.85em;
    white-space: nowrap;
}

.c-alert-primary {
    background: #0069d9;
}

.c-alert-success {
    background: #28a745;
}

.c-alert-danger {
    background: #c82333;
}

.c-alert-muted {
    background: #6c757d;
}

.onoffswitch {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.onoffswitch>select {
    height: 27px;
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
}

.form-group>.input-group:has(.monthyearpicker) {
    width: 100% !important;
}

.handsontable .action-field {
    display: flex;
    width: 100%;
    justify-content: center;
    padding: 3px 0;
    align-items: center;
    flex-wrap: nowrap;
}

.handsontable .action-field > * {
    display: inline-block;
}

.handsontable  .action-field form{
    display: flex;
    justify-content: center;
    align-items: center;
}

.handsontable .action-field > *:not(:last-child) {
    margin-right: 5px;
}

.btn-success{
    background-color: #409f40 !important;
}

.btn-error{
    background-color: #e82747 !important;
}

.btn-warning{
    background-color: #ff9f41 !important;
}