@media all and (max-width: 768px) {
  .el-mobile-table > div > table,
  .el-mobile-table > div > table > thead,
  .el-mobile-table > div > table > tbody,
  .el-mobile-table > div > table > tbody > tr > th,
  .el-mobile-table > div > table > tbody > tr > td,
  .el-mobile-table > div > table > tbody > tr {
    display: block;
  }
  /* .color-table tr {
    background-image: linear-gradient(45deg, #ed213a, #93291e);
    color: #fff;
  }
  .color-table tr:hover {
    background-image: linear-gradient(45deg, #ed213a, #93291e);
    color: #fff;
    background-color: #fff;
  } */
  .el-mobile-table > div > table {
    width: 100% !important;
  }
  .el-mobile-table > div > table > thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  .el-mobile-table > div > table > tbody > tr {
    border-bottom: 3px solid #ddd;
    display: flex;
    flex-flow: column;
  }
  .el-mobile-table > div > table > tbody > tr .cell {
    /* line-height: unset; */
    text-align: right;
  }
  .el-mobile-table > div > table > tbody > tr > td {
    border-bottom: 1px solid #ddd;
    display: block;

    text-align: right;
  }
  .el-mobile-table > div > table > tbody > tr > td * {
    display: inline-block;
    /* float: right; */
  }

  .el-mobile-table .el-table__expand-column {
    order: 1;
  }
  .el-mobile-table > div > table > tbody > tr > td .cell {
    width: 100%;
  }
  .el-mobile-table > div > table > tbody > tr > td .dat-cell {
    width: 100%;
    font-size: 10pt;
  }
  .el-mobile-table > div > table > tbody > tr > td .dat-cell::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */

    content: attr(label);
    float: left;
    font-weight: bold;
  }
}

.el-table .cell {
  box-sizing: border-box;
  white-space: normal;
  word-break: keep-all !important;
  line-height: 23px;
}
.el-table th > .cell {
  font-size: 10pt;
}
.el-dialog.chat-modal { border-radius: 12px !important; overflow: hidden; }
.chat-modal .el-dialog__header { padding: 0 !important; }
.chat-modal .el-dialog__body { padding: 0 !important; }
.chat-modal .el-dialog__headerbtn { top: 14px; z-index: 10; }
.chat-modal .el-dialog__headerbtn .el-dialog__close { color: rgba(255,255,255,0.85); font-size: 18px; }
.chat-modal .el-dialog__headerbtn:hover .el-dialog__close { color: #fff; }
.chat-dialog-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 48px 12px 16px;
  background: linear-gradient(135deg, #1877f2 0%, #0a5dc5 100%);
  border-radius: 8px 8px 0 0;
}
.chat-dialog-avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,0.18);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.chat-dialog-avatar i { font-size: 22px; color: #fff; }
.chat-dialog-meta { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chat-dialog-name {
  font-size: 15px; font-weight: 600; color: #fff; line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-dialog-sub { display: flex; align-items: center; gap: 5px; font-size: 12px; color: rgba(255,255,255,0.8); }
.chat-online-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #42b72a; box-shadow: 0 0 0 2px rgba(255,255,255,0.3);
  display: inline-block; flex-shrink: 0;
}
.small2-modal {
  width: 450px !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.small-modal {
  width: 580px !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.default-modal {
  width: 680px !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.default2-modal {
  width: 900px !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.default2-modal .el-dialog__body {
  padding: 10px 20px;
}
.default-modal .el-dialog__body {
  padding: 10px 20px;
}
.small2-modal .el-dialog__body {
  padding: 10px 20px;
}
.small-modal .el-dialog__body {
  padding: 10px 20px;
}
.medium2-modal .el-dialog__body {
  padding: 10px 20px;
}
.medium2-modal {
  width: 80% !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.big-modal {
  width: 100% !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.big-modal .el-dialog__body {
  padding: 10px 20px;
}
.medium-modal {
  width: 960px !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.medium-modal .el-dialog__body {
  padding: 10px 20px;
}
.fullscreen-modal {
  width: 90% !important;
  max-width: 98%;
  margin-top: 5px !important;
}
.el-message {
  min-width: 320px !important;
  max-width: 100% !important;
}
.group-header {
  font-weight: 700;
  font-size: 24px;
  color: #636e72;
  padding: 8px;
}
.a-desc img {
  max-width: 100%;
}
h2 {
  color: #130f40;
}
.blank-table {
  margin-top: 15px;
  color: #a4b0be;
  height: 100px;
  font-size: 22px;
  text-align: center;
  line-height: 100px;
  border: 2px dashed #a4b0be;
}

.el-button-group > a:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.el-button-group > a:not(:last-child) {
  margin-right: -1px;
}

.el-button-group > a {
  float: left;
  position: relative;
  display: inline-block;
}

.el-row[height-sync] {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}

.el-row[height-sync] .el-col {
  /* width: 100%; */
  display: flex;
  /* flex-direction: column; */
}

.a-link {
  color: #0984e3;
}
.selectIDGroup .el-input__inner {
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #dcdfe6;
}
.selectIDGroup .el-textarea__inner {
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #dcdfe6;
}
.item-date-picker .el-input__inner {
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #02bc77;
  background-color: rgb(244 244 244);
}
.item-date-picker {
  margin-right: 5px;
}
.selectIDGroup.is-disabled .el-input__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.selectIDGroup .el-input.is-disabled .el-input__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.border-form {
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 10px;
}
.upload-demo {
  display: flex;
}
.t-tooltip {
  border-color: #02bc77 !important;
}
.el-select-months .el-input__inner {
  font-size: 10pt;
  text-align: center;
  border-radius: 40px;
  background-color: #eee;
  padding: 8px;
  min-height: 31px;
  border: 0;
}
.el-select-months.active .el-input__inner {
  background-color: rgba(253, 1, 1, 0.226) !important;
  color: #da1212 !important;
}
.el-select-months.group .el-input__inner {
  background-image: linear-gradient(45deg, #ed213a, #cb2e49);
  color: #fff !important;
  text-align: center;
}
.el-select-months.group .el-input__prefix {
  visibility: hidden;
}
.el-button.el-button-custom {
  font-size: 10pt;
  border-radius: 50px;
  background-color: #eee;
  padding: 8px;
  min-height: 31px;
  border: 0;
  width: 100%;
  margin-bottom: 5px;
}
.el-button-custom.active {
  /* background-color: rgba(253, 1, 1, 0.226) !important;
  color: #da1212 !important; */
  background-image: linear-gradient(45deg, #ed213a, #cb2e49);
  color: #fff !important;
}

.el-button-search.is-circle {
  background-image: linear-gradient(45deg, #ed213a, #cb2e49);
  color: #fff !important;
  min-height: 31px;
  margin: 0 5px;
}
.item-form-custom .el-form-item__label {
  font-size: 10pt;
}
.title-dialog {
  margin: 0;
  font-weight: 600;
  font-size: 14pt;
  color: rgb(64, 158, 255);
  text-transform: uppercase;
}
.form-custom .el-form-item__label {
  font-size: 10pt;
}
.image-company ul {
  display: none;
}
.content-edit img {
  max-width: 100%;
}
.infoInvalidate {
  outline: 1px dashed #fc4b08;
  color: red;
}
.no-data:empty:before {
  content: "Không có dữ liệu";
  color: #9197a3;
  text-align: center;
  font-weight: 100;
  font-size: 10pt;
  padding: 3px;
}
@media all and (max-width: 768px) {
  .el-select-dropdown {
    max-width: 400px !important;
  }
  .el-message-box {
    max-width: 420px !important;
  }
  .el-message-box__btns {
    text-align: center !important;
  }
  .big-modal,
  .default-modal,
  .default2-modal,
  .small-modal,
  .small2-modal,
  .medium-modal,
  .medium2-modal {
    width: 100% !important;
  }
}
.header-table {
  width: 100%;
  background-color: #fff;
  margin-left: 1px;
  border-right: 2px solid rgb(236 240 241);
  padding: 10px;
}
.footer-table {
  padding: 5px;
  background-color: #fff;
  margin: 0 1px;
}
.el-select-promo .el-input__inner {
  text-align: center;
}
.clear-both {
  clear: both;
  content: "";
}
.inline-block {
  display: inline-block;
  padding: 5px;
}
.t-table .el-table__empty-text {
  color: red;
}
.float-right {
  float: right;
}
.float-left {
  float: left;
}
.is-disabled .el-input__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.el-input.is-disabled .el-input__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.el-textarea.is-disabled .el-textarea__inner {
  background-color: #fff !important;
  border-bottom: 1px dotted #dcdfe6;
  color: #606266 !important;
}
.custom-input .el-input__inner {
  height: 33px !important;
}
.form-footer {
  text-align: center;
  padding: 10px;
  position: sticky;
  z-index: 99;
  bottom: 0px;
  background-color: #fff;
}
.text-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  width: 100%;
}
.el-popper {
  word-break: break-word !important;
  font-size: 10pt !important;
  max-height: 96%;
  overflow-y: auto;
}
.el-popover__title {
  font-weight: 600 !important;
  font-size: 10pt !important;
  color: #e6a23c !important;
}
.el-popover__scroll {
  max-height: 96%;
  overflow-y: auto;
}
@media only screen and (min-width: 763px) {
  ::-webkit-scrollbar-track {
    background: #ddd;
    border-radius: 20px;
  }

  ::-webkit-scrollbar {
    width: 5px;
    height: 8px;
    background-color: #f5f5f5;
  }

  ::-webkit-scrollbar-thumb {
    background: #b2bec3;
    border-radius: 20px;
  }
}
.align-center {
  text-align: center;
}
.align-right {
  text-align: right;
}
.icon-table {
  font-size: 18px;
}
@media only screen and (max-device-width: 736px) {
  ::-webkit-scrollbar-thumb,
  ::-webkit-scrollbar,
  ::-webkit-scrollbar-track {
  }
}
.font-10 {
  font-size: 10pt;
}
.mg-3 {
  margin: 3px;
}
.mg-10 {
  margin: 10px;
}
.font-bold {
  font-weight: 600;
}
.el-textarea .el-textarea__inner {
  word-break: break-word !important;
}
.el-dropdown-link {
  cursor: pointer;
  color: #409eff;
}
.el-icon-arrow-down {
  font-size: 12px;
}
.el-time_modify {
  color: #409eff;
}
.grecaptcha-badge {
  visibility: hidden;
}