halleyx-ui-framework 11.7.45 → 11.7.47

package/dist/src/assets/styles/dashboard.css

@@ -1,1817 +0,0 @@
-.dashboard-right-container {
-  font-family: var(--hlx-font-type-content);
-  width: 100%;
-  height: 100vh;
-  display: flex;
-  flex-direction: row;
-}
-.dashboard-right-container .link {
-  color: var(--hlx-color-primary);
-  text-decoration: underline;
-  cursor: pointer;
-}
-.dashboard-right-container .profile-options {
-  background: #fff;
-  border: 1px solid var(--hlx-border-color);
-  border-radius: 10px;
-  box-shadow: 0px 0px 20px var(--hlx-border-color);
-  width: 200px;
-  max-height: 300px;
-  overflow: auto;
-  display: flex;
-  position: absolute;
-  top: 55px;
-  right: 20px;
-  z-index: 13;
-  display: flex;
-  flex-direction: column;
-}
-.dashboard-right-container .profile-options .top {
-  width: 100%;
-  height: 25%;
-  border-bottom: 1px solid var(--hlx-border-color);
-  padding: 10px 20px 10px 20px;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-}
-.dashboard-right-container .profile-options .top div img {
-  width: 50px;
-  height: 50px;
-  border-radius: 100%;
-  margin-right: 20px;
-  margin-top: 7px;
-}
-.dashboard-right-container .profile-options .top .content {
-  display: flex;
-  flex-direction: column;
-}
-.dashboard-right-container .profile-options .top .content .headerr {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-  font-weight: bold;
-  margin-bottom: 5px;
-}
-.dashboard-right-container .profile-options .top .content .sub-header {
-  font-size: var(--hlx-font-content-size-xs);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .profile-options .middle {
-  width: 100%;
-  height: 60%;
-  border-bottom: 1px solid var(--hlx-border-color);
-  padding: 20px 20px 10px 20px;
-}
-.dashboard-right-container .profile-options .middle .content {
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  margin-bottom: 10px;
-}
-.dashboard-right-container .profile-options .middle .content .icon {
-  width: 10%;
-  margin-right: 10px;
-}
-.dashboard-right-container .profile-options .middle .content .icon i {
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-icon-size-md);
-}
-.dashboard-right-container .profile-options .middle .content .item {
-  width: 90%;
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .profile-options .bottom {
-  width: 100%;
-  height: 10%;
-  padding: 10px 20px 10px 20px;
-}
-.dashboard-right-container .profile-options .bottom .content {
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-}
-.dashboard-right-container .profile-options .bottom .content .icon {
-  width: 10%;
-  margin-right: 10px;
-}
-.dashboard-right-container .profile-options .bottom .content .icon i {
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-icon-size-md);
-}
-.dashboard-right-container .profile-options .bottom .content .item {
-  width: 90%;
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .notifications {
-  background: #fff;
-  border: 1px solid var(--hlx-border-color);
-  border-radius: 10px;
-  box-shadow: 0px 0px 20px var(--hlx-border-color);
-  width: 300px;
-  display: flex;
-  position: absolute;
-  top: 55px;
-  right: 20px;
-  z-index: 13;
-  display: flex;
-  flex-direction: column;
-}
-.dashboard-right-container .notifications .top {
-  width: 100%;
-  height: 12%;
-  border-bottom: 1px solid var(--hlx-border-color);
-  padding: 10px 20px 10px 20px;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  position: sticky;
-  font-weight: bold;
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .notifications .middle {
-  width: 100%;
-  max-height: 300px;
-  overflow: auto;
-  border-bottom: 1px solid var(--hlx-border-color);
-}
-.dashboard-right-container .notifications .middle .contain {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  border-bottom: 1px solid var(--hlx-border-color);
-}
-.dashboard-right-container .notifications .middle .contain .icon {
-  margin: 10px 10px 10px 20px;
-}
-.dashboard-right-container .notifications .middle .contain .icon i {
-  font-size: var(--hlx-icon-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .notifications .middle .contain .content {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  margin-right: 20px;
-}
-.dashboard-right-container .notifications .middle .contain .content .headerr {
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  justify-content: space-between;
-  margin-bottom: 5px;
-}
-.dashboard-right-container .notifications .middle .contain .content .headerr .main {
-  font-size: var(--hlx-font-content-size-xs);
-  color: var(--hlx-text-color-primary);
-  font-weight: bold;
-}
-.dashboard-right-container .notifications .middle .contain .content .headerr .sub {
-  font-size: 10px;
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .notifications .middle .contain .content .sub-header {
-  font-size: var(--hlx-font-content-size-xs);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .notifications .bottom {
-  width: 100%;
-  height: 12%;
-  padding: 10px 20px 15px 20px;
-  position: sticky;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: center;
-  position: sticky;
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-header {
-  width: 100%;
-  height: 60px;
-  background: #fff;
-  z-index: 10;
-  box-shadow: 0px 0px 20px var(--hlx-border-color);
-  position: absolute;
-  display: flex;
-  padding: 20px 20px;
-  align-items: center;
-  justify-content: space-between;
-}
-.dashboard-right-container .dashboard-header .searchh {
-  width: 25%;
-}
-.dashboard-right-container .dashboard-header .actions {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  justify-content: flex-end;
-  width: 28%;
-}
-.dashboard-right-container .dashboard-header .actions div {
-  margin-right: 20px;
-}
-.dashboard-right-container .dashboard-header .actions div i {
-  font-size: var(--hlx-icon-size-sm);
-  color: var(--hlx-text-color-primary);
-  cursor: pointer;
-}
-.dashboard-right-container .dashboard-header .actions div img {
-  height: 30px;
-  width: 30px;
-  border-radius: 100%;
-  cursor: pointer;
-}
-.dashboard-right-container .card-title {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-font-content-size);
-  font-weight: bold;
-  margin: 20px;
-}
-.dashboard-right-container .card-title1 {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-font-content-size);
-  font-weight: bold;
-  margin: 0 20px 20px 0;
-}
-.dashboard-right-container .dashboard-body {
-  overflow-y: auto;
-  width: 100%;
-  height: 100%;
-  background: var(--hlx-border-color-light);
-  padding: 20px;
-}
-.dashboard-right-container .dashboard-body-header-panel {
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  height: 120px;
-}
-.dashboard-right-container .dashboard-body-header-panel .dashboard-body-header {
-  display: flex;
-  align-items: center;
-  color: var(--hlx-text-color-primary);
-  font-size: var(--hlx-font-content-size-lg);
-  font-weight: bold;
-  margin-top: 40px;
-  margin-right: 20px;
-}
-.dashboard-right-container .dashboard-body-header-panel .dashboard-body-breadcrumb {
-  height: 30px;
-  border-left: 1px solid var(--hlx-border-color);
-  margin-top: 66px;
-  display: flex;
-  align-items: center;
-  padding-left: 20px !important;
-}
-.dashboard-right-container .dashboard-body .small-cards-container {
-  height: 200px;
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 20px;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards {
-  width: 24%;
-  height: 100%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding-top: 20px;
-  padding-bottom: 20px;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .icon-bg {
-  width: 50px;
-  height: 50px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--hlx-border-color-dark);
-  border-radius: 100%;
-  margin-bottom: 10px;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .icon-bg i {
-  font-size: var(--hlx-icon-size-sm);
-  color: #fff;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-header {
-  font-size: 25px;
-  font-weight: 600;
-  color: var(--hlx-text-color-primary);
-  margin-bottom: 5px;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-sub-header {
-  font-size: var(--hlx-font-content-size);
-  color: var(--hlx-color-primary-dark);
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-percentage {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-color-primary-dark);
-  display: flex;
-  align-items: center;
-  font-weight: bold;
-}
-.dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-percentage i {
-  color: var(--hlx-color-primary-dark);
-  font-size: var(--hlx-icon-size-xs);
-}
-.dashboard-right-container .dashboard-body .container-1 {
-  width: 100%;
-  height: auto;
-  margin-bottom: 20px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.dashboard-right-container .dashboard-body .container-1 .left-container-1 {
-  width: 52%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 {
-  width: 48%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  position: relative;
-  bottom: 0;
-  margin-bottom: 10px;
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content-metric {
-  margin-left: 20px;
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content-count {
-  margin-right: 20px;
-  color: #fff;
-  font-weight: bold;
-  font-size: var(--hlx-font-content-size-xs);
-  width: 30px;
-  border-radius: 20%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content {
-  position: relative;
-  top: -65%;
-  width: 50%;
-  margin: 0 auto;
-  width: 30%;
-  height: 100px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content-total {
-  font-weight: bold;
-  font-size: var(--hlx-font-content-size-lg);
-}
-.dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content-title {
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-2 {
-  width: 100%;
-  height: auto;
-  margin-bottom: 20px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: 2%;
-}
-.dashboard-right-container .dashboard-body .container-2 .left-container-2 {
-  width: 43%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-}
-.dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content {
-  position: relative;
-  top: -53%;
-  right: 17%;
-  width: 50%;
-  margin: 0 auto;
-  height: 100px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content-total {
-  font-weight: bold;
-  font-size: var(--hlx-font-content-size-lg);
-}
-.dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content-title {
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 {
-  width: 55%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  padding: 20px;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container {
-  width: 100%;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr {
-  height: 35px;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .flag {
-  width: 10%;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .label {
-  width: 20%;
-  text-overflow: ellipsis;
-  font-size: var(--hlx-font-content-size);
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percent-num {
-  width: 10%;
-  font-size: var(--hlx-font-content-size-sm);
-  padding: 0 10px 0 10px;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage {
-  margin-right: 10px;
-  width: 60%;
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage .grey-container {
-  border-radius: 5px;
-  width: 100%;
-  height: 5px;
-  display: flex;
-  align-items: flex-start;
-  background: var(--hlx-border-color-dark);
-}
-.dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage .grey-container .inner-container {
-  border-radius: 6px;
-  width: 30%;
-  background: var(--hlx-color-primary);
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-3 {
-  gap: 2%;
-  width: 100%;
-  height: auto;
-  margin-bottom: 20px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 {
-  width: 32%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  padding: 20px;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container {
-  width: 100%;
-  height: 20%;
-  border: 1px solid var(--hlx-border-color);
-  border-radius: 10px;
-  margin-top: 45px;
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  padding: 15px;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container .title {
-  font-size: var(--hlx-font-content-size-lg);
-  color: var(--hlx-color-primary);
-  margin-bottom: 15px;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container .sub-title {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container .title {
-  font-size: var(--hlx-font-content-size-lg);
-  color: var(--hlx-color-primary) -light;
-  margin-bottom: 15px;
-}
-.dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container .sub-title {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 {
-  padding: 20px;
-  width: 32%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .percent {
-  position: relative;
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg {
-  position: relative;
-  width: 210px;
-  height: 210px;
-  max-width: 210px;
-  transform: rotate(-90deg);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg circle {
-  fill: none;
-  stroke: #f0f0f0;
-  stroke-width: 5%;
-  stroke-linecap: round;
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg circle:last-of-type {
-  stroke-dasharray: 625px;
-  stroke-dashoffset: calc(625px - 625px * var(--percent) / 100);
-  stroke: var(--hlx-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number {
-  position: absolute;
-  text-align: center;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h3 {
-  font-weight: 600;
-  font-size: var(--hlx-font-content-size-lg);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h4 {
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h3 span {
-  font-size: var(--hlx-font-content-size-lg);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .title h2 {
-  margin: 25px 0 0;
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd:nth-child(1) svg circle:last-of-type {
-  stroke: var(--hlx-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin-top: 20px;
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .top {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  width: 100%;
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .bottom .grey-container {
-  border-radius: 5px;
-  width: 100%;
-  height: 5px;
-  display: flex;
-  align-items: flex-start;
-  background: var(--hlx-border-color-dark);
-}
-.dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .bottom .grey-container .inner-container {
-  border-radius: 6px;
-  width: 30%;
-  background: var(--hlx-color-primary);
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 {
-  width: 32%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  padding: 20px;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  margin-bottom: 39%;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool {
-  width: 10%;
-  height: 70px;
-  display: flex;
-  flex-direction: column;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool div {
-  background: var(--hlx-text-color-primary);
-  height: 50%;
-  width: 100%;
-  margin-bottom: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 5px;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool div i {
-  font-size: var(--hlx-icon-size-xs);
-  color: #fff;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .mapp {
-  display: flex;
-  position: relative;
-  flex-direction: row;
-  width: 100%;
-  height: 70%;
-  overflow: scroll;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .mapp #canvas {
-  width: 100%;
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin-top: 20px;
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .top {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  width: 100%;
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .bottom .grey-container {
-  border-radius: 5px;
-  width: 100%;
-  height: 5px;
-  display: flex;
-  align-items: flex-start;
-  background: var(--hlx-border-color-dark);
-}
-.dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .bottom .grey-container .inner-container {
-  border-radius: 6px;
-  width: 30%;
-  background: var(--hlx-color-primary);
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-4 {
-  width: 100%;
-  height: auto;
-  margin-bottom: 20px;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 {
-  display: flex;
-  flex-direction: column;
-  width: 33%;
-  margin-right: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 {
-  width: 100%;
-  height: 50%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  display: flex;
-  flex-direction: column;
-  padding: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .icon {
-  background: var(--hlx-color-primary);
-  width: 40px;
-  height: 40px;
-  border-radius: 7px;
-  margin-bottom: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .icon i {
-  color: #fff;
-  font-size: var(--hlx-icon-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .count {
-  font-size: var(--hlx-font-content-size-lg);
-  color: var(--hlx-text-color-primary);
-  font-weight: bold;
-  margin-bottom: 15px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin-top: 10px;
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .top {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  width: 100%;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom {
-  margin-bottom: 10px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom .grey-container {
-  border-radius: 5px;
-  width: 100%;
-  height: 5px;
-  display: flex;
-  align-items: flex-start;
-  background: var(--hlx-border-color-dark);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom .grey-container .inner-container {
-  border-radius: 6px;
-  width: 30%;
-  background: var(--hlx-color-primary);
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 {
-  padding: 20px;
-  width: 100%;
-  height: 50%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  margin-top: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .icon {
-  background: var(--hlx-color-primary);
-  width: 40px;
-  height: 40px;
-  border-radius: 7px;
-  margin-bottom: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .icon i {
-  color: #fff;
-  font-size: var(--hlx-icon-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .count {
-  font-size: var(--hlx-font-content-size-lg);
-  color: var(--hlx-text-color-primary);
-  font-weight: bold;
-  margin-bottom: 15px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  margin-top: 10px;
-  font-size: var(--hlx-font-content-size-sm);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .top {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  width: 100%;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom {
-  margin-bottom: 10px;
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom .grey-container {
-  border-radius: 5px;
-  width: 100%;
-  height: 5px;
-  display: flex;
-  align-items: flex-start;
-  background: var(--hlx-border-color-dark);
-}
-.dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom .grey-container .inner-container {
-  border-radius: 6px;
-  width: 30%;
-  background: var(--hlx-color-primary);
-  height: 100%;
-}
-.dashboard-right-container .dashboard-body .container-4 .middle-container-4 {
-  width: 33%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  margin-right: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 {
-  display: flex;
-  flex-direction: column;
-  width: 33%;
-  margin-bottom: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 {
-  width: 100%;
-  height: 50%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  display: flex;
-  padding: 20px;
-  flex-direction: column;
-  margin-bottom: 20px;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .title {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .count {
-  color: var(--hlx-text-color-primary);
-  font-weight: 600;
-  font-size: var(--hlx-font-content-size-lg);
-  margin: 10px 20px 0 0;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .count .sub-count {
-  font-size: var(--hlx-font-content-size-xs);
-  color: var(--hlx-color-success);
-  margin-left: 10px;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 {
-  width: 100%;
-  height: 50%;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  margin-bottom: 20px;
-  display: flex;
-  padding: 20px;
-  flex-direction: column;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .title {
-  font-size: var(--hlx-font-content-size-sm);
-  color: var(--hlx-text-color-primary);
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .count {
-  color: var(--hlx-text-color-primary);
-  font-weight: 600;
-  font-size: var(--hlx-font-content-size-lg);
-  margin: 10px 20px 0 0;
-}
-.dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .count .sub-count {
-  font-size: var(--hlx-font-content-size-xs);
-  color: #ff3642;
-  margin-left: 10px;
-}
-.dashboard-right-container .dashboard-body .container-5 {
-  flex-wrap: wrap;
-  width: 100%;
-  height: auto;
-  margin-bottom: 20px;
-  display: flex;
-  flex-direction: column;
-  background: white;
-  box-shadow: 0px 0px 5px var(--hlx-border-color);
-  border-radius: 10px;
-  padding: 20px;
-}
-.dashboard-right-container footer {
-  height: 60px;
-  width: 100%;
-  font-size: var(--hlx-font-content-size-sm);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.component-description-link {
-  color: var(--hlx-color-primary);
-  text-decoration: underline;
-  cursor: pointer;
-  font-size: var(--hlx-font-content-size-sm);
-}
-
-@media only screen and (max-width: 1390px) {
-  .dashboard-right-container {
-    font-family: var(--hlx-font-type-content);
-    width: 100%;
-    height: 100vh;
-    display: flex;
-    flex-direction: row;
-  }
-  .dashboard-right-container .link {
-    color: var(--hlx-color-primary);
-    text-decoration: underline;
-    cursor: pointer;
-  }
-  .dashboard-right-container .profile-options {
-    background: #fff;
-    border: 1px solid var(--hlx-border-color);
-    border-radius: 10px;
-    box-shadow: 0px 0px 20px var(--hlx-border-color);
-    width: 200px;
-    max-height: 300px;
-    overflow: auto;
-    display: flex;
-    position: absolute;
-    top: 55px;
-    right: 20px;
-    z-index: 13;
-    display: flex;
-    flex-direction: column;
-  }
-  .dashboard-right-container .profile-options .top {
-    width: 100%;
-    height: 25%;
-    border-bottom: 1px solid var(--hlx-border-color);
-    padding: 10px 20px 10px 20px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
-  .dashboard-right-container .profile-options .top div img {
-    width: 50px;
-    height: 50px;
-    border-radius: 100%;
-    margin-right: 20px;
-    margin-top: 7px;
-  }
-  .dashboard-right-container .profile-options .top .content {
-    display: flex;
-    flex-direction: column;
-  }
-  .dashboard-right-container .profile-options .top .content .headerr {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-    font-weight: bold;
-    margin-bottom: 5px;
-  }
-  .dashboard-right-container .profile-options .top .content .sub-header {
-    font-size: var(--hlx-font-content-size-xs);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .profile-options .middle {
-    width: 100%;
-    height: 60%;
-    border-bottom: 1px solid var(--hlx-border-color);
-    padding: 20px 20px 10px 20px;
-  }
-  .dashboard-right-container .profile-options .middle .content {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    margin-bottom: 10px;
-  }
-  .dashboard-right-container .profile-options .middle .content .icon {
-    width: 10%;
-    margin-right: 10px;
-  }
-  .dashboard-right-container .profile-options .middle .content .icon i {
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-icon-size-md);
-  }
-  .dashboard-right-container .profile-options .middle .content .item {
-    width: 90%;
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .profile-options .bottom {
-    width: 100%;
-    height: 10%;
-    padding: 10px 20px 10px 20px;
-  }
-  .dashboard-right-container .profile-options .bottom .content {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-  }
-  .dashboard-right-container .profile-options .bottom .content .icon {
-    width: 10%;
-    margin-right: 10px;
-  }
-  .dashboard-right-container .profile-options .bottom .content .icon i {
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-icon-size-md);
-  }
-  .dashboard-right-container .profile-options .bottom .content .item {
-    width: 90%;
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .notifications {
-    background: #fff;
-    border: 1px solid var(--hlx-border-color);
-    border-radius: 10px;
-    box-shadow: 0px 0px 20px var(--hlx-border-color);
-    width: 300px;
-    display: flex;
-    position: absolute;
-    top: 55px;
-    right: 20px;
-    z-index: 13;
-    display: flex;
-    flex-direction: column;
-  }
-  .dashboard-right-container .notifications .top {
-    width: 100%;
-    height: 12%;
-    border-bottom: 1px solid var(--hlx-border-color);
-    padding: 10px 20px 10px 20px;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    position: sticky;
-    font-weight: bold;
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .notifications .middle {
-    width: 100%;
-    max-height: 300px;
-    overflow: auto;
-    border-bottom: 1px solid var(--hlx-border-color);
-  }
-  .dashboard-right-container .notifications .middle .contain {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    border-bottom: 1px solid var(--hlx-border-color);
-  }
-  .dashboard-right-container .notifications .middle .contain .icon {
-    margin: 10px 10px 10px 20px;
-  }
-  .dashboard-right-container .notifications .middle .contain .icon i {
-    font-size: var(--hlx-icon-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .notifications .middle .contain .content {
-    display: flex;
-    width: 100%;
-    flex-direction: column;
-    margin-right: 20px;
-  }
-  .dashboard-right-container .notifications .middle .contain .content .headerr {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    justify-content: space-between;
-    margin-bottom: 5px;
-  }
-  .dashboard-right-container .notifications .middle .contain .content .headerr .main {
-    font-size: var(--hlx-font-content-size-xs);
-    color: var(--hlx-text-color-primary);
-    font-weight: bold;
-  }
-  .dashboard-right-container .notifications .middle .contain .content .headerr .sub {
-    font-size: 10px;
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .notifications .middle .contain .content .sub-header {
-    font-size: var(--hlx-font-content-size-xs);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .notifications .bottom {
-    width: 100%;
-    height: 12%;
-    padding: 10px 20px 15px 20px;
-    position: sticky;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    position: sticky;
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-header {
-    width: 100%;
-    height: 60px;
-    background: #fff;
-    z-index: 10;
-    box-shadow: 0px 0px 20px var(--hlx-border-color);
-    position: absolute;
-    display: flex;
-    padding: 20px 20px;
-    align-items: center;
-    justify-content: space-between;
-  }
-  .dashboard-right-container .dashboard-header .searchh {
-    width: 25%;
-  }
-  .dashboard-right-container .dashboard-header .actions {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-end;
-    width: 28%;
-  }
-  .dashboard-right-container .dashboard-header .actions div {
-    margin-right: 20px;
-  }
-  .dashboard-right-container .dashboard-header .actions div i {
-    font-size: var(--hlx-icon-size-sm);
-    color: var(--hlx-text-color-primary);
-    cursor: pointer;
-  }
-  .dashboard-right-container .dashboard-header .actions div img {
-    height: 30px;
-    width: 30px;
-    border-radius: 100%;
-    cursor: pointer;
-  }
-  .dashboard-right-container .card-title {
-    width: 100%;
-    display: flex;
-    align-items: center;
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-font-content-size);
-    font-weight: bold;
-    margin: 20px;
-  }
-  .dashboard-right-container .card-title1 {
-    width: 100%;
-    display: flex;
-    align-items: center;
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-font-content-size);
-    font-weight: bold;
-    margin: 0 20px 20px 0;
-  }
-  .dashboard-right-container .dashboard-body {
-    overflow-y: auto;
-    width: 100%;
-    height: 100%;
-    background: var(--hlx-border-color-light);
-    padding: 20px;
-  }
-  .dashboard-right-container .dashboard-body-header-panel {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    height: 120px;
-  }
-  .dashboard-right-container .dashboard-body-header-panel .dashboard-body-header {
-    display: flex;
-    align-items: center;
-    color: var(--hlx-text-color-primary);
-    font-size: var(--hlx-font-content-size-lg);
-    font-weight: bold;
-    margin-top: 40px;
-    margin-right: 20px;
-  }
-  .dashboard-right-container .dashboard-body-header-panel .dashboard-body-breadcrumb {
-    height: 30px;
-    border-left: 1px solid var(--hlx-border-color);
-    margin-top: 66px;
-    display: flex;
-    align-items: center;
-    padding-left: 20px !important;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container {
-    height: auto;
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    margin-bottom: 20px;
-    flex-wrap: wrap;
-    gap: 20px;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards {
-    width: 45%;
-    height: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding-top: 20px;
-    padding-bottom: 20px;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .icon-bg {
-    width: 50px;
-    height: 50px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: var(--hlx-border-color-dark);
-    border-radius: 100%;
-    margin-bottom: 10px;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .icon-bg i {
-    font-size: var(--hlx-icon-size-sm);
-    color: #fff;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-header {
-    font-size: 25px;
-    font-weight: 600;
-    color: var(--hlx-text-color-primary);
-    margin-bottom: 5px;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-sub-header {
-    font-size: var(--hlx-font-content-size);
-    color: var(--hlx-color-primary-dark);
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-percentage {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-color-primary-dark);
-    display: flex;
-    align-items: center;
-    font-weight: bold;
-  }
-  .dashboard-right-container .dashboard-body .small-cards-container .small-cards .card-percentage i {
-    color: var(--hlx-color-primary-dark);
-    font-size: var(--hlx-icon-size-xs);
-  }
-  .dashboard-right-container .dashboard-body .container-1 {
-    width: 100%;
-    height: auto;
-    gap: 20px;
-    margin-bottom: 20px;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
-  .dashboard-right-container .dashboard-body .container-1 .left-container-1 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    position: relative;
-    bottom: 0;
-    margin-bottom: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content-metric {
-    margin-left: 20px;
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .right-container-1-content-count {
-    margin-right: 20px;
-    color: #fff;
-    font-weight: bold;
-    font-size: var(--hlx-font-content-size-xs);
-    width: 30px;
-    border-radius: 20%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content {
-    position: relative;
-    top: -65%;
-    width: 50%;
-    margin: 0 auto;
-    width: 30%;
-    height: 100px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content-total {
-    font-weight: bold;
-    font-size: var(--hlx-font-content-size-lg);
-  }
-  .dashboard-right-container .dashboard-body .container-1 .right-container-1 .chartoptions2-content-title {
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-2 {
-    width: 100%;
-    height: auto;
-    margin-bottom: 20px;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    gap: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .left-container-2 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content {
-    position: relative;
-    top: -53%;
-    right: 17%;
-    width: 50%;
-    margin: 0 auto;
-    height: 100px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content-total {
-    font-weight: bold;
-    font-size: var(--hlx-font-content-size-lg);
-  }
-  .dashboard-right-container .dashboard-body .container-2 .left-container-2 .chartoptions2-content-title {
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    padding: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container {
-    width: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr {
-    height: 35px;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .flag {
-    width: 10%;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .label {
-    width: 20%;
-    text-overflow: ellipsis;
-    font-size: var(--hlx-font-content-size);
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percent-num {
-    width: 10%;
-    font-size: var(--hlx-font-content-size-sm);
-    padding: 0 10px 0 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage {
-    margin-right: 10px;
-    width: 60%;
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage .grey-container {
-    border-radius: 5px;
-    width: 100%;
-    height: 5px;
-    display: flex;
-    align-items: flex-start;
-    background: var(--hlx-border-color-dark);
-  }
-  .dashboard-right-container .dashboard-body .container-2 .right-container-2 .row-container tr .percentage .grey-container .inner-container {
-    border-radius: 6px;
-    width: 30%;
-    background: var(--hlx-color-primary);
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 {
-    gap: 20px;
-    width: 100%;
-    height: auto;
-    margin-bottom: 20px;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    padding: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container {
-    width: 100%;
-    height: 20%;
-    border: 1px solid var(--hlx-border-color);
-    border-radius: 10px;
-    margin-top: 45px;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    padding: 15px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container .title {
-    font-size: var(--hlx-font-content-size-lg);
-    color: var(--hlx-color-primary);
-    margin-bottom: 15px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .left-bottom-container .sub-title {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container .title {
-    font-size: var(--hlx-font-content-size-lg);
-    color: var(--hlx-color-primary) -light;
-    margin-bottom: 15px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .left-container-3 .bottom-container .right-bottom-container .sub-title {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 {
-    padding: 20px;
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .percent {
-    position: relative;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg {
-    position: relative;
-    width: 210px;
-    height: 210px;
-    max-width: 210px;
-    transform: rotate(-90deg);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg circle {
-    fill: none;
-    stroke: #f0f0f0;
-    stroke-width: 5%;
-    stroke-linecap: round;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd svg circle:last-of-type {
-    stroke-dasharray: 625px;
-    stroke-dashoffset: calc(625px - 625px * var(--percent) / 100);
-    stroke: var(--hlx-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number {
-    position: absolute;
-    text-align: center;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h3 {
-    font-weight: 600;
-    font-size: var(--hlx-font-content-size-lg);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h4 {
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .number h3 span {
-    font-size: var(--hlx-font-content-size-lg);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd .title h2 {
-    margin: 25px 0 0;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .cardd:nth-child(1) svg circle:last-of-type {
-    stroke: var(--hlx-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-top: 20px;
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .top {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    width: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .bottom .grey-container {
-    border-radius: 5px;
-    width: 100%;
-    height: 5px;
-    display: flex;
-    align-items: flex-start;
-    background: var(--hlx-border-color-dark);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .middle-container-3 .bottom-container .bottom .grey-container .inner-container {
-    border-radius: 6px;
-    width: 30%;
-    background: var(--hlx-color-primary);
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    padding: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    margin-bottom: 39%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool {
-    width: 10%;
-    height: 70px;
-    display: flex;
-    flex-direction: column;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool div {
-    background: var(--hlx-text-color-primary);
-    height: 50%;
-    width: 100%;
-    margin-bottom: 10px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 5px;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .tool div i {
-    font-size: var(--hlx-icon-size-xs);
-    color: #fff;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .mapp {
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    width: 100%;
-    height: 70%;
-    overflow: scroll;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .map .mapp #canvas {
-    width: 100%;
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-top: 20px;
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .top {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    width: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .bottom .grey-container {
-    border-radius: 5px;
-    width: 100%;
-    height: 5px;
-    display: flex;
-    align-items: flex-start;
-    background: var(--hlx-border-color-dark);
-  }
-  .dashboard-right-container .dashboard-body .container-3 .right-container-3 .bottom-container .bottom .grey-container .inner-container {
-    border-radius: 6px;
-    width: 30%;
-    background: var(--hlx-color-primary);
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-4 {
-    width: 100%;
-    gap: 20px;
-    height: auto;
-    margin-bottom: 20px;
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-right: 0px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 {
-    width: 100%;
-    height: 50%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    display: flex;
-    flex-direction: column;
-    padding: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .icon {
-    background: var(--hlx-color-primary);
-    width: 40px;
-    height: 40px;
-    border-radius: 7px;
-    margin-bottom: 20px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .icon i {
-    color: #fff;
-    font-size: var(--hlx-icon-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .count {
-    font-size: var(--hlx-font-content-size-lg);
-    color: var(--hlx-text-color-primary);
-    font-weight: bold;
-    margin-bottom: 15px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-top: 10px;
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .top {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    width: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom {
-    margin-bottom: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom .grey-container {
-    border-radius: 5px;
-    width: 100%;
-    height: 5px;
-    display: flex;
-    align-items: flex-start;
-    background: var(--hlx-border-color-dark);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-1 .bottom-container .bottom .grey-container .inner-container {
-    border-radius: 6px;
-    width: 30%;
-    background: var(--hlx-color-primary);
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 {
-    padding: 20px;
-    width: 100%;
-    height: 50%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    margin-top: 20px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .icon {
-    background: var(--hlx-color-primary);
-    width: 40px;
-    height: 40px;
-    border-radius: 7px;
-    margin-bottom: 20px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .icon i {
-    color: #fff;
-    font-size: var(--hlx-icon-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .count {
-    font-size: var(--hlx-font-content-size-lg);
-    color: var(--hlx-text-color-primary);
-    font-weight: bold;
-    margin-bottom: 15px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-top: 10px;
-    font-size: var(--hlx-font-content-size-sm);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .top {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    width: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom {
-    margin-bottom: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom .grey-container {
-    border-radius: 5px;
-    width: 100%;
-    height: 5px;
-    display: flex;
-    align-items: flex-start;
-    background: var(--hlx-border-color-dark);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .left-container-4 .left-container-4-2 .bottom-container .bottom .grey-container .inner-container {
-    border-radius: 6px;
-    width: 30%;
-    background: var(--hlx-color-primary);
-    height: 100%;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .middle-container-4 {
-    width: 100%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    margin-right: 0px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    margin-right: 0px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 {
-    width: 100%;
-    height: 50%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    display: flex;
-    padding: 20px;
-    flex-direction: column;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .title {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .count {
-    color: var(--hlx-text-color-primary);
-    font-weight: 600;
-    font-size: var(--hlx-font-content-size-lg);
-    margin: 10px 20px 0 0;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-1 .count .sub-count {
-    font-size: var(--hlx-font-content-size-xs);
-    color: var(--hlx-color-success);
-    margin-left: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 {
-    width: 100%;
-    height: 50%;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    display: flex;
-    padding: 20px;
-    flex-direction: column;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .title {
-    font-size: var(--hlx-font-content-size-sm);
-    color: var(--hlx-text-color-primary);
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .count {
-    color: var(--hlx-text-color-primary);
-    font-weight: 600;
-    font-size: var(--hlx-font-content-size-lg);
-    margin: 10px 20px 0 0;
-  }
-  .dashboard-right-container .dashboard-body .container-4 .right-container-4 .right-container-4-2 .count .sub-count {
-    font-size: var(--hlx-font-content-size-xs);
-    color: #ff3642;
-    margin-left: 10px;
-  }
-  .dashboard-right-container .dashboard-body .container-5 {
-    flex-wrap: wrap;
-    width: 100%;
-    overflow: auto;
-    height: auto;
-    margin-bottom: 20px;
-    display: flex;
-    flex-direction: column;
-    background: white;
-    box-shadow: 0px 0px 5px var(--hlx-border-color);
-    border-radius: 10px;
-    padding: 20px;
-  }
-  .dashboard-right-container footer {
-    height: 60px;
-    width: 100%;
-    font-size: var(--hlx-font-content-size-sm);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-}/*# sourceMappingURL=dashboard.css.map */