#lc-taskgov :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(small) {
  line-height: 21px;
}
* {
  font-family: Roboto;
}
html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  padding: 0px;
  margin: 0px;
  font-family: Roboto;
  color: black;
}

#lc-taskgov {
  width: 100%;
  height: 100%;
  z-index: 5000001;
}

.lc-header {
  display: flex;
  justify-content: space-between;
  /* padding-top: 36px; */
  align-items: center;
  position: absolute;
  top: 0;
  justify-content: space-between;
  width: 100%;
  z-index: 2;
}

.lc-company {
  padding: 36px;
}

.lc-company-name {
  font-size: 20px;
  font-weight: 500;
  color: #2f2f2f;
  align-items: center;
  line-height: 36px;
}

.lc-user {
  margin-right: 30px !important;
  background-color: unset !important;
}

.user-popover .lc-user-name {
  color: #1f1f1f;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 4px;
}

.lc-user-image {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  cursor: pointer;
}

.lc-user-name {
  padding-right: 14px;
  font-weight: bold;
  font-size: 20px !important;
}

.lc-body {
  background-size: cover;
  height: 100%;
  justify-content: center;
  grid-template-rows: 200px 200px 200px;
  display: grid;
  grid-template-columns: repeat(4, 230px);
  padding-top: 14%;
  align-items: center;
}


/* Selector cho các item ở hàng thứ 3 trở đi */
.lc-body > *:nth-child(n+9) {
    align-self: center; /* Thiết lập vị trí top cho các item từ hàng 3 */
}

.lc-logo-company {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 12px;
}

.lc-app-icon {
  width: 80px;
  height: 80px;
  overflow: hidden;
}

.lc-app-item {
  margin: 0px 12px;
  padding: 12px 52px;
  cursor: pointer;
  text-align: center;
  align-items: center;
  border: 1px solid transparent;
  display: block;
  text-decoration: none !important;
}

.lc-app-item:hover {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0);
}

.lc-app-name {
  font-size: 20px;
  color: #ffffff;
  margin-top: 12px;
  text-align: center;
}

#user-popover {
  background: #ffffff;
  box-shadow: -1px 1px 2px rgb(0 0 0 / 15%);
  border-radius: 4.5px;
  font-size: 16px !important;
  line-height: 1.35715;
  font-size: 16px;
}

#user-popover :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(small){
  font-size: 16px;
  line-height: 21px;
}

.lc-user-job {
  font-size: 13px !important;
  font-weight: 400;
  color: #666;
  text-align: center;
  margin-bottom: 24px;
  padding: 0 16px;
}

.lc-logout {
  font-size: 16px;
  cursor: pointer;
  align-items: center;
  color: #e61d1d;
  font-weight: 100;
  cursor: pointer;
}

.lc-user-50 {
  width: 64px;
  height: 64px;
  margin: 26px auto 9px;
  display: block;
  border-radius: 50%;
  overflow: hidden;
}

.lc-hr {
  margin: 0px;
  border: none;
  border-bottom: 1px solid #ddd;
}

.lc-icon-change-password {
  width: 24px;
  height: 24px;
  margin-right: 14px;
  background-repeat: no-repeat;
  background-image: url(../iconApp/ico_key_20.svg);
}

.lc-icon-user-info {
  width: 24px;
  height: 24px;
  margin-right: 14px;
  background-repeat: no-repeat;
  background-image: url(../iconApp/ic_user_20.svg);
}

.btn-logout {
  display: flex;
  align-items: center;
  padding: 8px;
  cursor: pointer;
  height: 36px;
  border-radius: 4px;
  justify-content: center;
  width: 100% !important;
}

.btn-logout .dx-button-content{
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-logout:hover {
  background: #e5f4fb;
}

.btn-user-info,
.btn-change-password {
  display: flex;
  align-items: center;
  margin: 0px 12px;
  padding-inline: 4px;
  padding-left: 14px;
  cursor: pointer;
  height: 36px;
  border-radius: 4px;
  width: calc(100% - 24px) !important;
}

.btn-change-password:hover,
.btn-user-info:hover {
  background: #e8f2fe;
}
.btn-change-password .dx-button-content,
.btn-user-info .dx-button-content{
  display: flex;
}

.btn-user-info {
  margin: 0px 12px 16px;
}

.lc-quick-taskgov {
  display: flex;
  height: 90px;
  max-height: 90px;
  height: 90px;
  width: 100vw;
  background: rgba(255, 255, 255, 1);
  box-shadow: 1px 2px 8px rgba(0, 0, 0, 0.24);
  position: fixed;
  left: 0;
  top: 56px;
  border-top: 1px solid #f2f2f2;
  outline: none;
  overflow: hidden;
  z-index: 1100;
}

.lc-app-icon-small {
  transition: 0.3s;
  width: 36px;
  height: 36px;
  margin-bottom: 4px;
}

.lc-all-item {
  width: 100px;
}

.lc-all-item .lc-app-icon-small {
  width: 36px !important;
  height: 36px !important;
}

.lc-app-item-small {
    width: 120px;
    height: 90px;
    text-align: center;
    text-decoration: none !important;
    /* padding: 14px 12px 0px; */
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
}

.lc-app-item-small:hover {
  background: #f2f2f2;
}

.lc-app-item-small:hover .lc-app-icon-small {
  width: 42px;
  height: 42px;
}

.lc-app-name-small {
  color: #1f1f1f;
}

.icon-all-app {
  display: inline-block;
  text-align: center;
  background: #e6e6e6;
  border-radius: 8px;
  margin-bottom: 8px;
}

.lc-quick-taskgov {
  transition: 0.5s;
}

.height-0 {
  height: 0px !important;
  max-height: 0px !important;
  overflow: hidden !important;
  box-shadow: unset !important;
  border: none !important;
}

.display {
  display: none;
}

.lc-popup {
  /* position: fixed;
  display: none;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9999; */
}

.lc-popup-shadow {
  position: absolute;
  bottom: 0;
  right: 0;
  top: 0;
  left: 0;
  background-color: rgb(0, 0, 0);
  opacity: 0.3;
}

.lc-popup-user {
  background-color: #fff;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  padding-inline: 24px;
}

.lc-display-flex{
  display: flex;
}

.lc-popup-title {
  display: flex;
  padding: 21px 24px;
  justify-content: space-between;
  border-bottom: 1px solid #E0E1EF;
}

.lc-popup-name {
  font-size: 20px;
  font-weight: bold;
}

.lc-popup-iconHelp{
  background-image: url(../iconApp/ic_help_24.svg);
  width: 24px !important;
  height: 24px !important;
  background-repeat: no-repeat;
  background-size: contain !important;
}

.lc-popup-iconClose {
  background-image: url(../iconApp/ico_close_24.svg);
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
}

.lc-popup-iconClose:hover {
  cursor: pointer;
}

.lc-popup-body {
  margin-top: 24px;
  flex: 1;
  line-height: normal;
  display: flex;
}

.lc-label {
  font-size: 14px;
  color: #707070;
  margin-bottom: 8px;
}

.lc-input {
  border: 1px solid #ddd;
  border-radius: 5px;
}

.lc-input#date {
  width: 100% !important;
}

.lc-border-error{
  border: 1px solid #e61d1d !important;
}

.lc-border-error + .lc-textError {
  display: block;
}

.lc-mt14 {
  margin-top: 14px;
}

.lc-input input {
  height: 36px;
  width: 100%;
  margin: 0;
  border: none !important;
  outline: none !important;
  box-sizing: border-box;
}

.lc-row {
  position: relative;
}

.lc-form-control {
  display: block;
  padding: .375rem .75rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border-radius: .25rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.lc-textError {
  display: none;
  color: #e61d1d;
  font-size: 11px;
}

.lc-popup-footer {
  border-top: 1px solid #E0E1EF;
  height: 60px;
  width: 100%;
  background-color: #FBFBFE;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

.lc-popup-btn {
  width: 80px;
  height: 36px;
  text-align: center;
  line-height: 36px;
  border-radius: 5px;
  cursor: pointer;
}

.lc-btn-Cancel {
  border: 1px solid #ddd;
  background-color: #fff;
}

.lc-btn-Submit {
  background-color: #2979FF;
  color: #fff;
  margin-right: 24px;
  margin-left: 12px;
}

.lc-info-user {
  display: flex;
  align-items: center;
  padding-bottom: 22px;
}

.lc-info-name {
  font-size: 20px;
}

.lc-image-user {
  position: relative;
}

.lc-info-email {
  margin-top: 4px 0;
}

.lc-info-job {
  font-size: 12px;
  color: #666;
}

/* .lc-popup-help {
  position: absolute;
  display: none;
  top: 18px;
  left: -250px;
  width: 243px;
  height: 43px;
  background-color: #fff;
  border-radius: 5px;
  text-align: center;
  line-height: 43px;
  box-shadow: 1px 1px #ddd;
  z-index: 999999;
} */

.lc-popup-help {
  /* content: "";
  position: absolute;
  top: 10px;
  right: -11px; */
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 12px solid #fff;
}

.lc-popup-text span {
  text-decoration: none;
  color: #2979FF;
}

.lc-icon-edit {
  position: absolute;
  width: 32px;
  height: 32px;
  background-color: #fff;
  border-radius: 50% !important;
  bottom: 0px;
  right: 9px;
  cursor: pointer;
  box-shadow: 1px 1px #ddd;
}

.lc-icon-edit::after {
  content: "";
  width: 20px;
  height: 20px;
  background-color: #ddd;
  border-radius: 50%;
  bottom: 6px;
  right: 6px;
  position: absolute;
  background-image: url(../iconApp/ic_edit.svg);
  background-position: center;
  background-repeat: no-repeat;
}

.lc-info-left {
  margin-left: 8px;
}

.lc-user-80 {
  width: 80px;
  height: 80px;
  margin-left: auto;
  margin-right: 8px;
  display: block;
  border-radius: 50%;
  border: 1px solid #ddd;
  overflow: hidden;
}

#lc-toast {
  position: fixed;
  bottom: 40px;
  right: 32px;
  z-index: 99999999999;
}

.lc-toast {
  background-color: #17a562;
  padding: 10px;
  border-radius: 5px;
  animation: slideInleft ease .3s, fadeOut linear 1s 3s forwards;
}

@keyframes slideInleft {
  from {
    opacity: 0;
    transform: translateX(calc(100% + 32px));
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeOut {
  to {
    opacity: 0;
  }
}

.lc-toast-text {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
}

/*  CSS Style for popup
*/

.popup-container-launcher {
  display: none;
  width: auto;
  height: auto;
  bottom: 0;
  right: 0;
  z-index: 9;
  position: fixed;
  top: 0;
  left: 0;
}

.popup-shadow-launcher {
  position: absolute;
  bottom: 0;
  right: 0;
  top: 0;
  left: 0;
  background-color: rgb(0, 0, 0);
  opacity: 0.3;
  z-index: -1;
}

.form-popup-launcher {
  display: flex;
  flex-direction: column;
  background-color: rgb(255, 253, 253);
  opacity: 10;
  min-width: 300px;
  min-height: 300px;
  margin: auto;
  max-width: 80%;
  max-height: 70%;
  z-index: 1;
  border-radius: 5px 5px 5px 5px;
}


.popup-zone-launcher {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: transparent;
}

#content-popup-launcher {
  display: flex;
  justify-content: center;
  text-align: center;
  background-color: rgb(255, 255, 255);
  border-radius: 5px 5px 5px 5px;
  overflow: scroll;
  width: auto;
  height: auto;
}

#content-popup-launcher a img {
  width: 100%;
  float: none;
}

/* CSS button */

#btn-close-launcher {
  position: relative;
  display: flex;
  justify-content: flex-end;
  padding: 10px 10px;
}

.button-close-launcher {
  background-color: initial;
  border: none;
  content: "";
  background-position-x: -240px;
  background-position-y: -24px;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: auto;
  background-origin: padding-box;
  background-clip: border-box;
  height: 24px;
  width: 24px;
}

.button-close-launcher:hover,
.button-close-launcher:active {
  background-color: initial;
  background-position-x: -264px;
  background-position-y: -24px;
}

.left-header{
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;  
}

#icon-notify{
  border: none;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  background: transparent url(../iconApp/ic_notify.svg) no-repeat 0 0;
  background-size: cover !important;
  margin-right: 24px;
  background-color: #4d5276;
}
#icon-notify:hover{
  
}

.dx-popup-wrapper .dx-popup-content{
  padding: 0 !important;
}

.icon-check-read-all{
  width: 20px;
  height: 10px;
  background: transparent url(../iconApp/ic-check-notify.svg) no-repeat 0 0;
}

.dx-toolbar-label div{
  font-size: 24px;
  line-height: 28px !important;
}

p{
  margin: 0;
}

.dx-button-has-icon .dx-button-content{
  padding: 0px !important;
}

.dx-popup-bottom .dx-button.secondary{
  border: 1px solid #DDDDDD !important;
}

.dx-popup-bottom .dx-button.primary{
  background-color: #2979FF !important;
  color: white !important;
}

.dx-popup-bottom .dx-button{
  min-width: 80px !important;
}

.lc-popup-user .dx-datebox .dx-dropdowneditor-icon{
  width: 20px !important;
  height: 20px !important;
  background: transparent url(../iconApp/ic_calendar.svg) no-repeat !important;
  transform: rotate(180deg);
}

.lc-popup-user .dx-datebox .dx-button-content{
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
  width: 20px !important;
}
.lc-popup-user .dx-datebox .dx-texteditor-buttons-container{
  margin-right: 8px;
}

.lc-input input{
  /* padding: 7px 60px 8px 9px !important; */
}

.lc-popup-user .dx-datebox-calendar .dx-dropdowneditor-icon:before{
  display: none !important;
}

/*Popup Thỏa thuận sử dụng/chính sách quyền riêng tư*/
.lc-popup-agreement{
  background-color: #fff;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  padding:0px 0px 0px 24px;
  width: 100%;
  height: 100%;
}

.lc-popup-agreement .lc-popup-agreement-body{
  width: 100%;
  height: 100%;
  display: flex;
}

.lc-agreement-img-contain{
  width: 200px;
  height: 100%;
  margin-right: 16px;
  display: flex;
  align-items: center;
  padding-top: 76px;
}

.lc-image-agreement{
  width: 200px;
  height: 150px;
  background: transparent url(../iconApp/img_agreement.svg) no-repeat !important;
}

.lc-agreement-left{
  width: calc(100% - 200px);
  height: 100%;
  padding: 24px 0px 8px 24px;
}

.lc-agreement-left .lc-agreement-title{
  font-weight: 700;
  font-size: 20px;
  width: 100%;
  word-wrap: break-word;
  height: 50px;
}

.lc-agreement-left .lc-message-agreement{
  width: 100%;
  height: calc(100% - 40px);
  overflow:auto;
  display: flex;
  flex-direction: column;
  margin-top: 8px;
  padding-right: 8px;
}

.lc-agreement-left .lc-agreement-mess{
  font-size: 16px;
  width: 100%;
  word-wrap: break-word;
  padding-right: 8px;
}

.lc-agreement-left .mess-bottom{
  margin-top: 24px;
}

.lc-agreement-mess-link .blue-text{
  color : #2979FF;
  font-size: 16px;
}

.lc-agreement-mess-link .pointer{
  cursor: pointer;
}

.lc-icon-more{
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  background-image: url(../iconApp/ic-more-hover.svg);
  border-radius: 50%;
  overflow: hidden;
  cursor: pointer;
  margin-right: 14px
}

.lc-icon-agreement{
  background-repeat: no-repeat;
  background-image: url(../iconApp/ic_agreement.svg);
}
.lc-icon-security{
  background-repeat: no-repeat;
  background-image: url(../iconApp/ic_security.svg);
}
.lc-icon-privacy{
  background-repeat: no-repeat;
  background-image: url(../iconApp/ic_privacy.svg);
}
.lc-more-selection{
  padding: 8px 0px;
}

.lc-more-selection-body{
  display: flex;
  flex-direction: column;
}

.more-item .dx-button-content{
  width: 240px;
  height: 48px;
  padding: 0px 24px !important;
  display: flex;
  align-items: center;
}

.more-btn-icon{
  width: 24px;
  height: 24px;
  margin-right: 8px;
}

.more-btn-text{
  width: calc(100% - 56px);
  display: flex;
  align-items: center;
  height: 48px;
  font-size: 14px;
}

::-webkit-scrollbar {
  width: 20px;
}

::-webkit-scrollbar-thumb {
  background-color: #66717E;
  border-radius: 20px;
  border: 6px solid transparent;
  background-clip: content-box;
}

.dx-scrollbar-vertical .dx-scrollable-scroll{
  width: 6px !important;
}

.dx-scrollbar-vertical .dx-scrollable-scroll{
  background-color: #66717E !important;
  border-radius: 20px;
  border: none;
}

.dx-scrollable-scroll-content{
  background-color:#66717E !important;
}

.dx-popup-normal:has(.popup-notice-content) .dx-popup-bottom.dx-toolbar {
  padding: 10px 16px;
  border-top:1px solid #D1D5DB;
  background-color: #f5f5f5;
}