.loader-wrapper {
  pointer-events: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999
}

.loader {
  width: 48px;
  height: 48px;
  border: 5px solid #ba1a16;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: rotation 1s linear infinite
}

@keyframes rotation {
  0% {
    transform: rotate(0)
  }

  100% {
    transform: rotate(360deg)
  }
}

.loading {
  overflow: hidden
}

.menu .app-brand.demo {
  height: 64px;
  margin-top: 12px
}

.app-brand-logo.demo svg {
  width: 22px;
  height: 38px
}

.app-brand-text.demo {
  font-size: 1.75rem;
  letter-spacing: -.5px;
  text-transform: lowercase
}

.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
  padding-top: 5.2rem !important
}

.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important
}

.docs-page .layout-menu-fixed.layout-wrapper:not(.layout-without-menu) .layout-page,
.docs-page .layout-navbar-fixed.layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 62px !important
}

/* .content-wrapper .navbar{z-index:auto} */

.demo-blocks>* {
  display: block !important
}

.demo-inline-spacing>* {
  margin: 1rem .375rem 0 0 !important
}

.demo-vertical-spacing>* {
  margin-top: 1rem !important;
  margin-bottom: 0 !important
}

.demo-vertical-spacing.demo-only-element>:first-child {
  margin-top: 0 !important
}

.demo-vertical-spacing-lg>* {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important
}

.demo-vertical-spacing-lg.demo-only-element>:first-child {
  margin-top: 0 !important
}

.demo-vertical-spacing-xl>* {
  margin-top: 5rem !important;
  margin-bottom: 0 !important
}

.demo-vertical-spacing-xl.demo-only-element>:first-child {
  margin-top: 0 !important
}

.rtl-only {
  display: none !important;
  text-align: left !important;
  direction: ltr !important
}

[dir=rtl] .rtl-only {
  display: block !important
}

@media (max-width:576px) {
  #dropdown-variation-demo .btn-group .text-truncate {
    width: 231px;
    position: relative
  }

  #dropdown-variation-demo .btn-group .text-truncate::after {
    position: absolute;
    top: 45%;
    right: .65rem
  }
}

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem
}

.layout-demo-placeholder img {
  width: 900px
}

.layout-demo-info {
  text-align: center;
  margin-top: 1rem
}

/* g translate */
.gtranslate_wrapper.gt_container--hich1m {
  position: relative
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher {
  border-radius: 4px;
  width: 120px
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_selected {
  background: 0 0
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_selected a {
  padding: 10px;
  box-shadow: none;
  background-color: #f5f5f5;
  border: 0;
  width: 100%;
  font-size: 12px
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_selected a:hover {
  background-color: #f5f5f5
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_selected a img {
  margin-right: 8px
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_option {
  position: absolute;
  left: 0;
  top: 100%;
  border: 0;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  width: 120px
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_option a {
  font-size: 12px;
  padding-left: 10px;
  padding-right: 10px
}

.gtranslate_wrapper.gt_container--hich1m .gt_switcher .gt_option a img {
  margin-right: 8px
}

.bg-blocks,
.bg-blocks>* {
  position: relative
}

.bg-blocks:before {
  content: "";
  position: absolute;
  left: -20px;
  top: -20px;
  width: 150px;
  height: 150px;
  background-image: url('../img/blur-blue-bg.png');
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  transform: rotate(45deg);
  opacity: .15
}

.reg-login-section {
  min-height: 100vh;
  padding: 50px 0;
  background: url('../img/see-safe-bg-lg.svg');
  background-size: cover
}

.check-list-group .form-check-input:checked {
  opacity: .5
}

.check-list-group .form-check-input:checked~a,
.check-list-group .form-check-input:checked~span {
  text-decoration: line-through !important;
  opacity: .5 !important
}

.check-list-group .form-check-input:checked~a {
  opacity: .5
}

.kanban-wrapper {
  overflow: auto
}

.kanban-board {
  background: 0 0
}

.kanban-board header {
  padding: 0;
  margin-bottom: 24px;
  color: #303030
}

.kanban-board .kanban-drag {
  padding: 0
}

.kanban-item {
  box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
  padding: 0
}

.max-h-px-600 {
  max-height: 600px
}

.left-line {
  position: relative
}

.left-line>* {
  z-index: 1
}

.left-line:not(:last-child):before {
  content: "";
  display: block;
  width: 1px;
  height: 100%;
  background-color: #eee;
  position: absolute;
  left: 20px;
  top: 0;
  margin-top: 20px
}

.before-pt-100:before {
  padding-top: 100%
}

.toggle-switch {
  width: 200px;
  background-color: #1b2844;
  border: 2px solid #1b2844;
  height: 30px;
  position: relative;
  border-radius: 50px;
  display: inline-flex;
  cursor: pointer
}

.toggle-switch .toggle-bg-layer {
  display: block;
  width: 100px;
  background-color: #fff;
  border-radius: 50px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0
}

.toggle-switch .toggle-switch-btn {
  color: #1b2844;
  display: block;
  text-align: center;
  position: relative;
  font-weight: 700;
  flex: 1
}

.toggle-switch .toggle-switch-btn:last-child {
  color: #fff
}

.toggle-switch.active .toggle-bg-layer {
  left: auto;
  right: 0
}

.toggle-switch.active .toggle-switch-btn {
  color: #fff
}

.toggle-switch.active .toggle-switch-btn:last-child {
  color: #1b2844
}

.image-btn-hover>i {
  display: none
}

.image-btn-hover:hover>i {
  display: block
}

.app-chat {
  position: relative;
  height: calc(100vh - 5.8rem);
}

.layout-navbar-hidden .app-chat {
  height: calc(100vh - 7rem)
}

.chat-contact-list .chat-contact-list-item:hover {
  background: #f7f7f7
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat {
    height: calc(100vh - 11rem - 2rem)
  }

  .textmessagedtaa {
    max-width: 600px
  }
}

@media(max-width:992px) {
  .app-chat .app-sidebar {
    z-index: 4
  }

  .textmessagedtaa {
    max-width: 600px
  }
}

@media screen and (max-width:480px) and (min-width:320px) {
  .textmessagedtaa {
    max-width: 300px
  }
}

/* Chat CSS */
.app-chat .app-sidebar .sidebar-header {
  position: relative
}

.app-chat .app-sidebar .sidebar-header .close-sidebar {
  position: absolute;
  top: .5rem;
  right: .05rem
}

.app-chat .app-chat-contacts {
  position: absolute;
  left : 100%;
  height: calc(100vh - 5.8rem);
  /* min-width: 19rem;
  flex-basis: 19rem; */
  transition: all .25s ease
}

.layout-navbar-hidden .app-chat .app-chat-contacts {
  height: calc(100vh - 5.8rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-contacts {
    height: calc(100vh - 11rem - 2rem)
  }
}

@media(min-width:992px) {
  .app-chat .app-chat-contacts {
    position: static
  }
}

.app-chat .app-chat-contacts.show {
  left: 0
}

.app-chat .app-chat-contacts .sidebar-body {
  overflow: auto;
  height: calc(calc(100vh - 11rem) - .49rem)
}

.layout-navbar-hidden .app-chat .app-chat-contacts .sidebar-body {
  height: calc(calc(100vh - 7rem) - 5rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-contacts .sidebar-body {
    height: calc(calc(100vh - 11rem) - 4.49rem - 2rem)
  }
}

.app-chat .app-chat-contacts .sidebar-body .chat-contact-list .chat-contact-list-item-title {
  padding-bottom: 0 !important
}

.app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item {
  display: flex;
  justify-content: space-between;
  padding: .2rem .75rem;
  margin: .5rem .75rem;
  border-left: 2px solid transparent;
  cursor: pointer;
  border-radius: .375rem
}

.app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item a {
  width: 100%
}

.app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item .avatar {
  border: 2px solid transparent;
  border-radius: 50%
}

.app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item .chat-contact-info {
  min-width: 0
}

/* .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item .chat-contact-info .chat-contact-name{line-height:1.5} */
.app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.chat-contact-list-item small {
  /* white-space:nowrap */
}

.app-chat .app-chat-sidebar-left {
  position: absolute;
  top: 0;
  left: calc(-21rem - 1rem);
  width: 21rem;
  height: calc(100vh - 11rem);
  opacity: 0;
  z-index: 5;
  transition: all .25s ease
}

.layout-navbar-hidden .app-chat .app-chat-sidebar-left {
  height: calc(100vh - 7rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-sidebar-left {
    height: calc(100vh - 11rem - 2rem)
  }
}

.app-chat .app-chat-sidebar-left.show {
  left: 0;
  opacity: 1
}

.app-chat .app-chat-sidebar-left .sidebar-body {
  height: calc(calc(100vh - 11rem) - 11.7rem)
}

.layout-navbar-hidden .app-chat .app-chat-sidebar-left .sidebar-body {
  height: calc(calc(100vh - 7rem) - 11rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-sidebar-left .sidebar-body {
    height: calc(calc(100vh - 11rem) - 11.7rem - 2rem)
  }
}

.app-chat .app-chat-history {
  position: relative;
  /* width: calc(100vw - 40rem); */
  transition: all .25s ease
}

.layout-navbar-hidden .app-chat .app-chat-history {
  height: calc(100vh - 7rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-history {
    height: calc(100vh - 11rem - 2rem)
  }
}

.app-chat .app-chat-history .chat-history-header {
max-height: 54px;
padding: 11px 8px;}

.app-chat .app-chat-history .chat-history-header .user-status {
  margin-bottom: .1rem
}

.app-chat .app-chat-history .chat-history-body {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  margin-top: auto;
  overflow: auto
}

.layout-navbar-hidden .app-chat .app-chat-history .chat-history-body {
  height: calc(100vh - 16.7rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-history .chat-history-body {
    height: calc(100vh - 20.8rem - 2rem)
  }
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message {
  display: flex;
  justify-content: flex-start;
  padding: .5rem .75rem;
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message .chat-message-text {
  border-radius: .375rem;
  padding: 1px 9px
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message:not(.chat-message-right) .chat-message-text {
  border-top-left-radius: 0;
  
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right {
  justify-content: flex-end
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right .chat-message-text {
  border-top-right-radius: 0;
 
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right .user-avatar {
  margin-right: 0;
  margin-left: 1rem
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message .thumbnail {
  cursor: zoom-in
}

.app-chat .app-chat-history .chat-history-body .chat-history .chat-message:not(:last-child) {
  margin-bottom: 1rem
}

.app-chat .app-chat-history .chat-history-footer {
  padding: .3rem .1rem;
  margin: 0 .2rem;
  border-radius: .375rem;
  position: sticky;
  bottom: 0
}

.app-chat .app-chat-sidebar-right {
  position: absolute;
  top: 0;
  right: calc(-21rem - 1rem);
  width: 21rem;
  height: calc(100vh - 11rem);
  opacity: 0;
  z-index: 5;
  transition: all .25s ease
}

.layout-navbar-hidden .app-chat .app-chat-sidebar-right {
  height: calc(100vh - 7rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-sidebar-right {
    height: calc(100vh - 11rem - 2rem)
  }
}

.app-chat .app-chat-sidebar-right.show {
  opacity: 1;
  right: 0
}

.app-chat .app-chat-sidebar-right .sidebar-body {
  height: calc(calc(100vh - 11rem) - 11.5rem)
}

.layout-navbar-hidden .app-chat .app-chat-sidebar-right .sidebar-body {
  height: calc(calc(100vh - 7rem) - 11.19rem)
}

@media(min-width:1200px) {
  .layout-horizontal .app-chat .app-chat-sidebar-right .sidebar-body {
    height: calc(calc(100vh - 11rem) - 11.5rem - 2rem)
  }
}

@media(max-width:576px) {

  .app-chat .app-chat-contacts.show,
  .app-chat .app-chat-sidebar-left.show,
  .app-chat .app-chat-sidebar-right.show {
    width: 100%
  }
}

.light-style .app-chat .app-chat-contacts,
.light-style .app-chat .app-chat-sidebar-left {
  background-color: #fff;
  z-index: 99;
  box-shadow: 0 0 0 1px rgba(67, 89, 113, .075)
}

.light-style .app-chat .app-chat-contacts .chat-actions .chat-search-input,
.light-style .app-chat .app-chat-sidebar-left .chat-actions .chat-search-input {
  background-color: #f5f5f9
}

.light-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active,
.light-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active {
  background: #ffebeb;
  color: #000 !important
}

.light-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active .text-muted,
.light-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active h6,
.light-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active .text-muted,
.light-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active h6 {
  background: #ffebeb;
  color: #000 !important
}

.light-style .app-chat .app-chat-history .chat-history-wrapper .chat-history-header {
  background-color: #fff
}

.light-style .app-chat .app-chat-history .chat-history-body .chat-history .chat-message .chat-message-text {
  background-color: #afafaf2b;
  position: relative;
}

.light-style .app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right {
  justify-content: flex-end
}

.light-style .app-chat .app-chat-sidebar-right {
  background-color: #fff;
  box-shadow: 16px 1px 45px 3px rgba(67, 89, 113, .5)
}

@media(max-width:992px) {
  .light-style .app-chat .app-chat-contacts .chat-actions .chat-search-input {
    background-color: #fff
  }
}

.dark-style .app-chat .app-chat-contacts,
.dark-style .app-chat .app-chat-sidebar-left {
  background-color: #2b2c40
}

.dark-style .app-chat .app-chat-contacts .chat-actions .chat-search-input,
.dark-style .app-chat .app-chat-sidebar-left .chat-actions .chat-search-input {
  background-color: #232333
}

.dark-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active,
.dark-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active {
  color: #fff
}

.dark-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active .text-muted,
.dark-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active h6,
.dark-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active .text-muted,
.dark-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active h6 {
  color: #fff !important
}

.dark-style .app-chat .app-chat-contacts .sidebar-body .chat-contact-list li.active .avatar,
.dark-style .app-chat .app-chat-sidebar-left .sidebar-body .chat-contact-list li.active .avatar {
  border-color: #2b2c40
}

.dark-style .app-chat .app-chat-history {
  background-color: #232333
}

.dark-style .app-chat .app-chat-history .chat-history-wrapper .chat-history-header {
  background-color: #2b2c40
}

.dark-style .app-chat .app-chat-history .chat-history-footer {
  background-color: #2b2c40;
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25)
}

.dark-style .app-chat .app-chat-history .chat-history-body .chat-history .chat-message .chat-message-text {
  background-color: #2b2c40;
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25)
}

.dark-style .app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right {
  justify-content: flex-end
}

.dark-style .app-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right .chat-message-text {
  color: #fff
}

.dark-style .app-chat .app-chat-sidebar-right {
  background-color: #2b2c40
}

[dir=rtl] .app-chat .app-chat-contacts,
[dir=rtl] .app-chat .app-chat-sidebar-left {
  right: calc(-21rem - 1rem);
  left: auto
}

[dir=rtl] .app-chat .app-chat-contacts.show,
[dir=rtl] .app-chat .app-chat-sidebar-left.show {
  left: auto;
  right: 0
}

[dir=rtl] .app-chat .app-chat-sidebar-right {
  left: calc(-21rem - 1rem);
  right: auto
}

[dir=rtl] .app-chat .app-chat-sidebar-right.show {
  left: 0;
  right: auto
}

[dir=rtl] .app-chat .app-chat-history .chat-history-body .chat-history .chat .user-avatar {
  margin-left: 1rem;
  margin-right: 0
}

[dir=rtl] .app-chat .app-chat-history .chat-message:not(.chat-message-right) .chat-message-text {
  border-top-right-radius: 0;
  border-top-left-radius: .375rem !important
}

[dir=rtl] .app-chat .app-chat-history .chat-message.chat-message-right .chat-message-text {
  border-top-left-radius: 0;
  border-top-right-radius: .375rem !important
}


#contact-list {
  max-height: calc(100vh - 210px);
  /* Adjust as needed */
  overflow-y: auto ;
  padding-right: 10px !important;
  /* Optional: Add padding to prevent scrollbar overlap */
}

.chat-contact-list-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 12px !important;
}

.scroll_member {
  /* display: flex !important;
  flex-direction: row; */
  height: 69px;
  overflow-x: scroll !important;
  flex-wrap: nowrap !important;
}

@media screen and (max-width: 480px) {
  .project_name_cls {
    display: flex;
    flex-direction: column !important;
  }

  .project_name_cls td {
    align-items: unset !important;
    margin-top: 5px !important;
  }

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

  .ck.ck-toolbar>.ck-toolbar__items>:not(.ck-toolbar__line-break) {
    margin-right: unset !important;
  }

  .descriptionContainer {
    display: flex;
    flex-direction: column;
  }

  .descriptionContainer .left-column {
    width: 100%;
  }

  .descriptionContainer .right-column {
    width: 100%;
    border-left: unset;
  }

  .descriptionContainer .left-column {
    border-right: unset;
    padding-right: 8px;
  }

  .descriptionContainer .right-column {
    padding-left: 8px;
  }

  /* .new_emp_Card {
    display: flex !important;
    flex-direction: column;
    border: 1px solid #ccc;
    padding: 5px;
  }

  .new_emp_Card .span_new {
    margin-left: unset;
  } */

}

.fa-circle-notch {
  margin-right: -12px;
  margin-left: 8px;
}
.send:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 100%;
  width: 0px;
  height: 0px;
  border: 5px solid #1ca9f61a;
  border-right-color: transparent;
  border-bottom-color: transparent;
}
.receive:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0px;
  right: 100%;
  width: 0px;
  height: 0px;
  border: 5px solid #afafaf2b;
  border-left-color: transparent;
  border-bottom-color: transparent;
}