body,
.bg-body {
  background-color: rgba(221, 225, 233, 1) !important;
}

@media only screen and (max-width: 1280px) {
  .form-login {
    max-height: 100vh;
  }
}

/* total width */
::-webkit-scrollbar {
  background-color: #fff;
  width: 16px;
}

/* background of the scrollbar except button or resizer */
::-webkit-scrollbar-track {
  background-color: #fff;
}
::-webkit-scrollbar-track:hover {
  background-color: #f4f4f4;
}

/* scrollbar itself */
::-webkit-scrollbar-thumb {
  background-color: #babac0;
  border-radius: 16px;
  border: 5px solid #fff;
}
::-webkit-scrollbar-thumb:hover {
  background-color: #a0a0a5;
  border: 4px solid #f4f4f4;
}

/* set button(top and bottom of the scrollbar) */
::-webkit-scrollbar-button {
  display: none;
}

.form-login:last-child {
  padding: 6.25rem 3.125rem;
}
.form-login {
  height: calc(100vh - 50px - 44px);
}
.form-login * {
  line-height: 40px !important;
}
.ui-carousel .slick-next,
.ui-carousel .slick-prev {
  color: #000 !important;
}
.ui-carousel .slick-dots li button,
.ui-carousel .slick-dots li.slick-active button {
  background-color: rgba(24, 144, 255, 1) !important;
}

.form-login .ui-form-item-label > label {
  font-size: 16px !important;
}
.form-login [oh-input],
.form-login [oh-select] *,
.form-login
  .ui-select-single:not(.ui-select-customize-input)
  .ui-select-selector,
.form-login [oh-button] {
  height: 40px !important;
}
.form-login + .form-login {
  border-left: 2px solid rgb(221, 225, 233);
}
.ui-his-menu.ui-menu {
  background-color: rgba(240, 241, 245, 1);
}
.cdkt-editable oh-select-item {
  width: fit-content !important;
}
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:last-child
  > oh-text-edit
  > textarea {
  min-width: 50vw;
  max-width: 100vw;
}
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:last-child {
  margin: 0 !important;
}
.cdkt-editable oh-select-item > span:not(.ui-select-selection-item-remove),
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:last-child,
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:last-child
  oh-text-edit
  textarea {
  width: 100% !important;
}
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:first-child {
  width: 100px !important;
}
.cdkt-editable
  oh-select-item
  > span:not(.ui-select-selection-item-remove)
  > p:last-child {
  white-space: pre-wrap;
}
.cdkt-editable oh-select-item {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
}
* {
  font-family: "Roboto", sans-serif;
}
*:not([oh-button] *, h1, h2, h3, h4, h5, h6, .cdk-overlay-container *) {
  font-size: 14px !important;
}
.ui-table-thead > tr > td > .ui-input,
.ui-table-thead
  > tr
  > td
  > .ui-select:not(.ui-select-customize-input)
  .ui-select-selector,
.ui-table-thead > tr > td > .ui-picker,
.ui-table-thead > tr > td > .ui-input-number,
.ui-table-thead > tr > td > .ui-picker-input > input {
  border-color: rgba(217, 217, 217, 1) !important;
}
.ui-table-thead > tr > td > .ui-input,
.ui-table-thead
  > tr
  > td
  > .ui-select:not(.ui-select-customize-input)
  .ui-select-selector,
.ui-table-thead > tr > td > .ui-picker,
.ui-table-thead > tr > td > .ui-picker-input > input,
.ui-table-thead > tr > td > .ui-input-focused,
.ui-table-thead > tr > td > .ui-input:focus,
.ui-table-thead > tr > td > .ui-input-number {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid;
  border-radius: 0 !important;
  color: black;
}
.ui-table-thead > tr > td > .ui-picker {
  padding: 3px 11px;
}

*:not(.cdk-overlay-container *) {
  line-height: 28px;
}
.ui-btn-icon-only {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ui-btn-default,
.ui-his-action-bar .ui-btn-default {
  color: #40a9ff;
  border-color: #40a9ff;
}
.ui-btn * {
  line-height: normal;
}
.ui-btn-his-primary:not([disabled]) {
  color: white !important;
  border-color: #096dd9 !important;
  background: #096dd9 !important;
}
.ui-his-action-bar .ui-btn:only-child {
  width: 100%;
  margin: 0 !important;
}
.ui-his-action-bar .ui-btn > span {
  padding-left: 0px;
}
.ui-his-action-bar .ui-btn {
  /* font-size: 13px !important; */
  height: 30px !important;
}
.ui-his-action-bar .ui-btn > .anticon + span,
.ui-btn > span + .anticon {
  margin: 0 0 0 4px !important;
}
.sub-title {
  font-weight: 400;
  font-size: 14px;
  color: #6c7093 !important;
}
.h-100 {
  height: 100% !important;
}
.fs-14 {
  font-size: 14px;
}
.ui-flex {
  display: flex;
}
.w-100 {
  width: 100% !important;
}

#main {
  height: 100vh;
  width: 100%;
  padding: 16px;
  padding-top: 0;
  margin: 0 auto;
}

#body-content {
  width: 100%;
  padding-top: calc(85px + 20px);
  padding-bottom: calc(44px + 20px);
  /* height: 100vh; */
}
#main-dang-nhap {
  display: flex;
  flex-direction: column;
  height: 100vh;
}
#body-content-dang-nhap {
  width: 100%;
  flex: 1 1;
  background-color: #fff;
  margin: 2px 0;
}
.form-login > *,
.form-login > * > * {
  height: 100%;
  display: block;
}
.his-footer {
  bottom: 0;
}
.his-header {
  top: 0;
}
.his-header,
.his-footer {
  position: fixed;
  left: 50%;
  width: 100%;
  margin: 0 auto;
  transform: translate(-50%, 0);
  z-index: 999;
}

.ui-form-item {
  margin: 2px 10px !important;
}

.label-fixed {
  width: 120px !important;
}

.content-fixed {
  width: calc(100% - 120px) !important;
}

.ui-form-item-control *:not(.ui-table-cell),
[oh-input] {
  border-radius: 4px !important;
}

.page-area {
  padding: 8px 0 !important;
  margin: auto !important;
}

.page-area > *:not(.panel-area, .ui-form-item) {
  margin: 8px 0px !important;
}

.panel-area > *:not(.ui-form-item) {
  margin: 6px 10px !important;
}

oh-divider.divider {
  border-top: 4px solid #f5f5f5 !important;
}

.panel-area > .divider {
  margin: 6px 0 !important;
}

.page-area.ui-collapse,
.panel-area.ui-collapse {
  background-color: transparent !important;
}

.page-area > *:first-child,
.panel-area > *:first-child {
  margin-top: 0 !important;
}

.ui-card,
.page-area.ui-collapse > .ui-collapse-item,
.panel-area.ui-collapse > .ui-collapse-item {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.ui-card-head {
  padding: 0 !important;
  border: none !important;
}

.ui-card-head > * {
  padding: 0 12px !important;
}

ui-card-head .ui-card-head-wrapper {
  min-height: 40px !important;
  margin: auto 0 !important;
}
.ui-collapse .ui-collapse-item.ui-collapse-no-header .ui-collapse-header {
  display: none;
}
.ui-card-head .ui-card-head-wrapper .ui-card-head-title,
.ui-collapse .ui-collapse-header .ui-collapse-header-text {
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.ui-card:not(.ui-card-basic) .ui-card-head-wrapper,
.ui-collapse:not(.ui-collapse-basic):not(.ui-collapse-ghost)
  .ui-collapse-header {
  background-color: rgba(233, 237, 241, 1);
}

.ui-collapse.ui-collapse-ghost .ui-collapse-header {
  background-color: transparent !important;
}
.ui-collapse:not(.ui-collapse-basic) .ui-collapse-content {
  background-color: white !important;
}

.ui-collapse:not(.ui-collapse-basic)
  .ui-collapse-content
  .ui-collapse-content-box {
  padding: 0 !important;
}

.ui-card:not(.ui-card-basic)
  .ui-card-head
  .ui-card-head-wrapper
  .ui-card-head-title,
.ui-collapse:not(.ui-collapse-basic)
  .ui-collapse-header
  .ui-collapse-header-text {
  color: #000 !important;
  /* text-transform: uppercase; */
}

.ui-card.no-header > .ui-card-head > .ui-card-head-wrapper {
  display: none !important;
}

.ui-card.no-body > .ui-card-body {
  padding: 0 !important;
  margin: 0 !important;
}

.ui-typography {
  margin: 0 !important;
}

.ui-page-header.back-to-list {
  border-radius: 8px !important;
  padding: 0 4px 0 12px !important;
}

.ui-table-thead > tr > th {
  background-color: rgba(234, 237, 241, 1) !important;
  color: rgba(0, 79, 158, 1) !important;
}

.ui-table tfoot > tr > td,
.ui-table tfoot > tr > th,
.ui-table-thead > tr > th,
.ui-table-tbody
  > tr:not(.ui-table-expanded-row)
  > td:not(.ui-table-cell-empty, .oh-disable-td) {
  padding: 3px !important;
}
.ui-table-thead
  > tr
  > th:not(:last-child):not(.ui-table-selection-column):not(
    .ui-table-row-expand-icon-cell
  ):not([colspan])::before {
  content: none !important;
}
.tr-selected {
  background-color: #a5e3ff !important;
}

.ui-card-extra {
  padding: 0 !important;
}

.ui-tabs-tab + .ui-tabs-tab {
  margin: 0 0 0 20px !important;
}

.ui-tabs-tab {
  padding: 8px 0px 0px 0px !important;
}
.ui-form-item-label > label {
  line-height: 18px !important;
}
.ui-form-item-label
  > label.ui-form-item-required:not(
    .ui-form-item-required-mark-optional
  )::after {
  color: #ff4d4f !important;
  content: "*" !important;
  display: inline-block;
  margin-right: 4px;
  font-size: 14px;
  font-family: "Roboto", sans-serif;
  line-height: 1;
  font-weight: 700;
}

.ui-form-item-label
  > label.ui-form-item-required:not(
    .ui-form-item-required-mark-optional
  )::before {
  content: none !important;
}

.card-menu .ui-menu-vertical .ui-menu-item {
  margin: 0 !important;
}

.ui-form-item-control-input-content > * {
  width: 100% !important;
}

.ui-modal-content {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.ui-modal-content .ui-modal-header {
  background-color: #004f9e !important;
  padding: 8px 20px !important;
}

.ui-modal-content .ui-modal-header .ui-modal-title *,
.ui-modal-content .ui-modal-close-icon {
  color: white !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
}

.ui-modal-body {
  padding: 8px !important;
}
.ui-card-head-wrapper {
  height: 48px;
}
.ui-card-head-wrapper,
.ui-card-body {
  padding: 8px !important;
}

.ui-drawer-header {
  background: #004f9e !important;
  color: white !important;
  padding: 8px 20px !important;
}

.ui-drawer-header > .ui-drawer-header-title > *,
.ui-drawer-close,
.ui-drawer-title {
  color: white !important;
}

.ui-collapse-borderless {
  background-color: transparent !important;
}

.ui-select-multiple .ui-select-selection-item,
oh-select-table .ui-select-multiple .ui-select-selection-item {
  border: 1px solid #14b814;
  background: rgba(20, 184, 20, 0.2);
  color: black !important;
}
.ui-input[disabled],
.ui-select-disabled.ui-select:not(.ui-select-customize-input)
  .ui-select-selector,
.ui-picker.ui-picker-disabled,
.ui-picker-input > input[disabled],
.ui-select-disabled.ui-select:not(.ui-select-customize-input)
  .ui-select-selector,
.ui-select-multiple.ui-select-disabled.ui-select:not(.ui-select-customize-input)
  .ui-select-selector {
  color: black !important;
}

.h3,
h3 {
  font-size: 1.17em;
}

/* .ui-input-disabled,
.ui-select-disabled,
.ui-input-number-disabled {
  color: rgba(0, 0, 0, 0.85) !important;
  background-color: #fff !important;
  border: none !important;
  border-bottom: 1px solid #d9d9d9 !important;
} */

.ui-spin-nested-loading > div > .ui-spin .ui-spin-dot {
  width: 30px !important;
  height: 30px !important;
}
.ui-his-footer-right {
  max-width: 60vw !important;
}

.ui-his-menu .ui-menu-title-content > span {
  font-size: 15px !important;
}
.ui-his-menu .ui-menu-title-content {
  font-size: 15px !important;
}

.ui-his-menu-dropdown .ui-menu-title-content span {
  font-size: 15px !important;
}

.ui-his-menu-dropdown .ui-menu-title-content {
  font-size: 15px !important;
}

.ui-his-menu * {
  font-size: 15px !important;
}
.tr-selected td {
  background-color: #f7efd4 !important;
  /* color: #004f9e !important;
  font-weight: 700; */
}
.ui-picker-separator {
  display: flex !important;
  align-items: center;
}
.ui-table-cell-empty {
  padding: 15px 0 15px 0 !important;
}
.ui-table.ui-table-bordered thead > tr > * {
  border-bottom: 1px solid #f0f0f0;
  border-right: 1px solid #f0f0f0;
}

.ui-table-body {
  scrollbar-width: thin;
  scrollbar-color: #888 #f0f0f0;
}

.ui-table-body::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

.ui-table-body::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 3px;
}

.ui-table-body::-webkit-scrollbar-track {
  background: #f0f0f0;
}

.ui-drawer-body {
  padding: 10px !important;
}
/* .ui-his-menu .ui-his-menu-item {
  padding: 0 5px !important;
} */

.ui-menu-sub.ui-menu-inline {
  position: relative;
}