:root {
  --main-theme-color: #4d7cfe;
  --main-element-color: rgba(0, 0, 0, 0.3);
}

.header-panel-color {
  cursor: pointer;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
}

.btn-ezcmp {
  background-color: var(--main-theme-color);
  border-color: var(--main-theme-color);
  color: #fff;
}

.btn-ezcmp:hover, .btn-ezcmp:focus, .btn-ezcmp:active:hover {
  color: #fff;
}

.cb-um-search-icon {
  position: absolute;
  top: 20%;
  color: #b2b2b2;
  left: 90%;
}

.cb-um-search-box {
  position: relative;
  width: 150%;
}

/* checkbox */

.labelCheck {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 15px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.labelCheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.user-modal-checkbox {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

.labelCheck:hover input~.user-modal-checkbox {
  background-color: #ccc;
}

.labelCheck input:checked~.user-modal-checkbox {
  background-color: var(--main-theme-color);
}

.user-modal-checkbox:after {
  content: "";
  position: absolute;
  display: none;
}

.labelCheck input:checked~.user-modal-checkbox:after {
  display: block;
}

.labelCheck .user-modal-checkbox:after {
  left: 8px;
  top: 2px;
  width: 9px;
  height: 16px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.cb-user-text {
  color: #555555;
}

.pl-pr-0 {
  padding-left: 7px;
}

.text-gray-light {
  color: #c4c4c4;
}

.image-cover-um {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: contain;
  object-position: center;
  border: 1px solid #d0d0d0;
}

.padding-10 {
  padding: 8px 15px;
}

.cb-width-4 {
  width: 200px;
}

.font-list-color {
  color: #949494;
  margin-bottom: 0px;
}

.btn-ezcmp-width {
  padding: 8px 12px;
  width: 18%;
}

.hover-for-list {
  cursor: pointer;
  border-left: 6px solid transparent;
}

.border-ezcmp {
  border-left: 6px solid var(--main-theme-color);
  background-color: #f2f2f2;
}

.hover-for-list:hover, .hover-for-list:active, .hover-for-list:focus {
  border-left: 6px solid var(--main-theme-color);
  background-color: #f2f2f2;
}