:root {
  font-family: "Microsoft JhengHei", Poppins, Helvetica, Calibri, Arial, "sans-serif";
  font-size: 14px !important;
}

/* body */
/**, body, html {
    font-family: $font-family;
    font-size: $root-font-size !important;
}*/
body {
  background-color: #F5F8FA !important;
}

/* Metronic */
.app-header {
  background-color: #fff !important;
  height: 65px !important;
}

.app-content {
  padding-top: 10px;
}

.app-toolbar {
  background-color: #fff !important;
  border-top: rgba(204, 204, 204, 0.8) 1px dashed !important;
}

#kt_header {
  /*    background-color: #fff;
  */ /*    height: 45px;
*/
}

#kt_toolbar {
  /*    top: 45px;
  */
}

.breadcrumb {
  background-color: transparent;
}

.breadcrumb span {
  /*    padding: 6px 12px;
      background-color: #f3f3f3;
      border-radius: 20px;
      color: #000;
      font-weight: 500;
      white-space: nowrap;
      font-size: 14px;
  */
}

.content {
  padding: 10px 0;
}

.brand-logo-title {
  color: #ffffff;
  font-size: 2rem;
}

/* Bootstrap 5*/
.form-floating > label {
  font-size: 1rem;
}

/* font , color */
.font-weight-700 {
  font-weight: 700;
}

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

.text-blue {
  color: #3699FF;
}

/* Card */
.card.card-custom {
  border: 0;
}

.card.card-custom > .card-body {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.card .card-footer {
  padding: 1rem 1rem;
}

/* form */
.form-group {
  margin-bottom: 0.5rem;
}

.form-group .col-form-label {
  font-weight: 700;
  /*    text-align: right;
  */
}

.form-control-plaintext {
  background-color: #fafafa;
}

.form-control[readonly] {
  background-color: #f5f8fa;
  border-color: #f5f8fa;
  color: #5e6278;
  transition: color 0.2s ease, background-color 0.2s ease;
}

/*label[required]:before {
    content: "*";
    color: red;
}*/
.align-center {
  align-items: center !important;
}

/* KTDatatable - datatable-umall */
.datatable.datatable-umall > .datatable-table > .datatable-head {
  background-color: #f8f8f8;
}

.datatable.datatable-umall > .datatable-table > .datatable-head > .datatable-row > .datatable-cell > span {
  font-size: 0.8rem;
  text-transform: none;
  font-weight: 700;
}

.datatable.datatable-umall > .datatable-table > .datatable-body .datatable-row > .datatable-cell {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 0.8rem;
}

.datatable.datatable-umall > .datatable-table > .datatable-foot .datatable-row > .datatable-cell {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 0.8rem;
}

.datatable-pager-size {
  font-size: 0.9rem !important;
  width: 90px !important;
}

div::-webkit-scrollbar {
  height: 1rem;
}

div::-webkit-scrollbar-thumb {
  background-color: rgb(53, 149, 246);
}

/* modal */
.modal-max {
  max-width: 90%;
}

/* FLOAT LABEL */