@font-face {
  font-family: Lato;
  src: url('../fonts/Lato-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Lato;
  src: url('../fonts/Lato-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Lato;
  src: url('../fonts/Lato-Light.ttf') format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Lato;
  src: url('../fonts/Lato-Heavy.ttf') format("truetype"), url('../fonts/Lato-Black.ttf') format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Lato;
  src: url('../fonts/Lato-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --newblack: #1f2937;
  --new-blue1: #0ea5e9;
  --new-dark-green: #247d78;
  --white: white;
  --blue-main: #2563eb;
  --sidebar-bg: #17142e;
  --text: #4b5563;
  --line: #e5e5e5;
  --new-blue: #06b6d4;
  --new-green: #34d399;
  --new-sidebar-bg: #2c3e50;
  --blue-dark: #1f44b3;
  --blue-lighter: #387df0;
  --black: black;
  --primary: #e76422;
}

.w-checkbox {
  margin-bottom: 5px;
  padding-left: 20px;
  display: block;
}

.w-checkbox:before {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox:after {
  content: " ";
  clear: both;
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox-input {
  float: left;
  margin: 4px 0 0 -20px;
  line-height: normal;
}

.w-checkbox-input--inputType-custom {
  border: 1px solid #ccc;
  border-radius: 2px;
  width: 12px;
  height: 12px;
}

.w-checkbox-input--inputType-custom.w--redirected-checked {
  background-color: #3898ec;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/custom-checkbox-checkmark.589d534424.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-color: #3898ec;
}

.w-checkbox-input--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.page-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: 50px auto;
  grid-template-columns: 220px 1fr 270px;
  grid-auto-columns: 1fr;
  width: 100vw;
  height: 100vh;
  font-family: Inter, sans-serif;
  display: grid;
  overflow: hidden;
}

.sec__sidebar {
  flex: 0 auto;
  height: 100%;
  position: relative;
}

.sb__group {
  margin-top: 5px;
}

.sb__link-text {
  margin-left: 10px;
}

.sb__link-contain {
  height: 80vh;
  padding-left: 10px;
  padding-right: 10px;
  overflow: auto;
}

.sb__content {
  border-right: 1px solid #f1f1f1;
  flex-flow: column;
  justify-content: space-between;
  width: 220px;
  height: 100%;
  padding-bottom: 10px;
  padding-right: 0;
  display: flex;
}

.sb__bot {
  padding-left: 10px;
  padding-right: 10px;
}

.sb__top {
  flex: 1;
}

.sb__logo {
  width: 60%;
}

.sb__link {
  opacity: 1;
  filter: grayscale();
  color: var(--newblack);
  letter-spacing: .15px;
  cursor: pointer;
  border-radius: 10px;
  justify-content: flex-start;
  align-items: center;
  padding: 10px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.sb__link:hover {
  filter: none;
  color: #1f44b3;
  background-color: #0ea5e933;
  background-image: none;
  font-weight: 600;
}

.sb__link.w--current {
  filter: none;
  color: #1f44b3;
  background-color: #0ea5e933;
  background-image: none;
  border: 1px solid #ede9ff;
  box-shadow: inset 0 4px 4px #00000026;
}

.sb__link.is-signout {
  filter: none;
  color: #ef4444;
}

.sb__link.is-signout:hover {
  background-color: #ef44441a;
}

.sb__brand {
  border-bottom: 1px solid #ffffff4d;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 15px;
  display: flex;
}

.profile-name {
  margin-left: 10px;
  margin-right: 10px;
}

.name-profile {
  color: #333c;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2em;
}

.tb__btn-profile-link {
  color: #666;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.profile-loc {
  font-size: 10px;
  line-height: 1.2em;
}

.sec__main-content {
  flex-flow: column;
  flex: 1;
  display: flex;
}

.tb__btn-profile {
  justify-content: flex-start;
  align-items: center;
  margin-left: 10px;
  padding: 2px;
  display: flex;
}

.tb__btn-profile:hover {
  background-color: #ede9ff;
}

.tb__controls-div {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.tb__icon-btn-notification {
  cursor: pointer;
  justify-content: center;
  align-items: stretch;
  width: 40px;
  height: 40px;
  margin-left: 10px;
  padding: 5px 8px;
  display: flex;
}

.topbar {
  border-bottom: 1px solid #e6e6e6;
  justify-content: space-between;
  align-items: center;
  padding: 5px 10px 5px 20px;
  display: flex;
}

.avatar-profile {
  width: 32px;
  height: 32px;
}

.aw__search-input {
  color: #fff;
  background-color: #ffffff05;
  background-image: url('../images/cccx-widget-icon-18.svg');
  background-position: 8px;
  background-repeat: no-repeat;
  background-size: 15px 20px;
  border: 1px solid #fff3;
  border-radius: 10px;
  height: 30px;
  margin-bottom: 0;
  padding-left: 30px;
  font-size: 12px;
}

.aw__search-input::placeholder {
  color: #fff9;
}

.search-button {
  display: none;
}

.search {
  margin-bottom: 0;
}

.mc__wrap {
  background-color: #eef4ff;
  flex: 1;
  justify-content: space-between;
  display: flex;
}

.mc__body {
  flex: 1;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}

.mc__body.p-0 {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.mc__body.is-scroll {
  height: 95vh;
  padding-bottom: 50px;
  overflow: auto;
}

.maincontent-side {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #f8f8f8;
  flex-flow: column;
  width: 270px;
  padding: 15px 15px 15px 0;
  display: flex;
}

.maincontent-header {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  display: flex;
}

.u__hd-text {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2em;
}

.u__hd-text.style2 {
  color: var(--white);
  font-size: 28px;
}

.db-tab {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.db-tabsmenu {
  background-color: #dbeafe;
  border-radius: 50px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  padding: 8px;
  display: flex;
  box-shadow: inset 0 2px 5px #0000001a;
}

.u__tabscontent {
  width: 100%;
  overflow: visible;
}

.db-tablink {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #333c;
  background-color: #fff0;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  height: 36px;
  padding: 2px 20px;
  font-size: 13px;
  line-height: 1.2em;
  display: flex;
}

.db-tablink.w--current {
  background-color: var(--blue-main);
  color: var(--white);
  font-weight: 500;
}

.db-tablink.right {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.db-tablink.left {
  border-right-style: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.db-content-wrap {
  height: 72vh;
  overflow: auto;
}

.db-statcontainer {
  justify-content: space-between;
  width: 100%;
  display: flex;
}

.db-statcontainer.wrap {
  flex-flow: wrap;
}

.u__stat-card {
  background-color: #fff;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  width: 32%;
  padding: 15px;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.u__stat-card._w-24 {
  width: 24%;
}

.card__ps-stat-card-label {
  color: #6b7280;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
}

.card__ps-stat-card-label.mb-10 {
  margin-bottom: 10px;
}

.card__ps-stat-card-top {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}

.card__ps-stat-card-icon {
  background-color: #f0fdf4;
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.card__ps-stat-card-icon.bg-blue {
  background-color: #f0fdf4;
}

.card__ps-stat-card-data-text {
  color: var(--newblack);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2em;
}

.dash_table_col {
  flex: 1;
  align-items: center;
  display: flex;
}

.dash_table_col._w-30 {
  flex: none;
  width: 30%;
}

.dash_table_col._w-20 {
  flex: none;
  width: 20%;
}

.dash_table_col._w-20.align-right {
  justify-content: flex-end;
  align-items: center;
}

.dash_table_col._w-7 {
  flex: 0 auto;
  width: 7%;
}

.dashtable-text {
  color: var(--newblack);
  text-transform: none;
  font-size: 13px;
}

.dashtable-text.time {
  color: #231f2099;
  font-size: 11px;
}

.dashtable-tag {
  color: #333c;
  text-align: center;
  text-transform: none;
  background-color: #fbeeb7;
  border-radius: 5px;
  padding: 2px 5px;
  font-size: 13px;
}

.db-cardcol-stretch {
  background-color: #fff;
  border-radius: 20px;
  flex: 1;
  width: 60%;
  margin-left: 10px;
  padding: 20px;
  box-shadow: 0 1px 6px #00000012;
}

.db-cardcol-stretch.m-0 {
  margin-left: 0;
  margin-right: 10px;
}

.db-cardcol-stretch._w-49 {
  flex: none;
  width: 49.5%;
  margin-left: 0;
}

.db-cardcol-75 {
  background-color: #fff;
  border-radius: 20px;
  width: 60%;
  padding: 20px;
  box-shadow: 0 1px 6px #00000012;
}

.dash-table-content {
  border: 1px solid #ececec;
  border-radius: 20px;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 0;
  padding: 15px;
  display: flex;
}

.dash-table-row-style1 {
  cursor: pointer;
  border-radius: 5px;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.dash-table-row-style1:hover {
  background-color: #effff9;
}

.u__card-hd-text {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2em;
}

.db-row {
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 20px;
  display: flex;
}

.graphdiv {
  border: 1px solid #ececec;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  padding: 10px;
  display: flex;
}

.side-card {
  background-color: #fff;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  margin-bottom: 20px;
  padding: 15px;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.side-card.mb-10 {
  margin-bottom: 10px;
}

.side-card.top-border {
  border-top: 5px solid #00a86b;
}

.side-card-top {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.side-card-top.center {
  justify-content: center;
}

.sidecard-hd-text {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2em;
}

.side-card-topleft {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sidecard-hd-icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  display: flex;
}

.sidecard-option {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-left: 3px;
  display: flex;
}

.sidecard-body {
  border: 1px solid #ececec;
  border-radius: 20px;
  padding: 10px 5px;
}

.sidecard-body.no-border {
  border-style: none;
}

.sd-cheers-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #eff6ff;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
  padding: 5px;
  display: flex;
}

.sd-cheers-left {
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sd-cheers-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 5px;
  display: flex;
}

.sd-cheers-textcontent {
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sd-cherrs-text {
  font-size: 13px;
  line-height: 1.2em;
}

.sd-cheers-reactdiv {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.sd-cheers-react {
  color: #bcbec0;
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  display: flex;
}

.sd-cheers-react-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  margin-right: 2px;
  display: flex;
}

.sd-cheers-right {
  margin-left: 5px;
}

.text-time {
  font-size: 10px;
  line-height: 1.2em;
}

.sd-leaderboard-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sd-top-subhd {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.sd-top-subhd.smaller {
  font-size: 10px;
  font-weight: 400;
}

.sd-leaderboard-item {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items: center;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.sd-leaderboard-item.no-border {
  border-bottom-style: none;
}

.sd-leaderboard-avatar {
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  margin-right: 10px;
  display: flex;
  position: relative;
}

.sd-leaderboard-avatar.margin-0 {
  margin-right: 0;
}

.sd-leaderboard-avatar.margin-0.winner {
  border: 1px solid #fcab28;
  border-radius: 50%;
}

.sd-leaderboard-textcontent {
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sd-leaderboard-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.sd-leaderboard-subtext {
  color: gray;
  font-size: 11px;
  line-height: 1.2em;
}

.sd-leaderboard-award-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
  position: absolute;
  inset: auto -5% -10% auto;
}

.sd-coaching-item {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.sd-coaching-left {
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.sd-coaching-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2em;
}

.sd-coaching-info {
  color: gray;
  justify-content: flex-start;
  align-items: center;
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.2em;
  display: flex;
}

.sd-coaching-info.bigger {
  margin-top: 0;
  font-size: 12px;
}

.sd-coaching-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.link-style1 {
  color: var(--new-blue1);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
}

.db-fullcard {
  background-color: #fff;
  border-radius: 10px;
  padding: 15px;
  box-shadow: 0 1px 6px #00000012;
}

.tabs {
  flex-flow: column;
  flex: 1;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: visible;
}

.tabs-menu {
  border-bottom: 1px solid #e6e6e6;
  align-items: flex-end;
  margin-bottom: 10px;
  display: flex;
}

.tablink {
  color: #333c;
  text-transform: uppercase;
  background-color: #fff0;
  border-bottom: 3px solid #f4978e00;
  margin-bottom: -2px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 600;
}

.tablink.w--current {
  border-bottom-color: var(--new-blue);
  color: var(--new-blue);
  background-color: #fff0;
  font-weight: 700;
}

.tabscontent {
  height: 95%;
}

.tabpane {
  height: 100%;
  overflow: auto;
}

.checkbox-field {
  margin-bottom: 0;
}

.image-100 {
  width: 100%;
}

.checkbox-label {
  display: none;
}

.u__tablehd_container {
  border-bottom: 1px solid #e6e6e6;
  justify-content: space-between;
  margin-bottom: 5px;
  padding: 5px 10px;
  display: flex;
}

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

.form-block {
  margin-bottom: 30px;
}

.form-block.mb-0, .form-block.margin-0 {
  margin-bottom: 0;
}

.table_navicon {
  background-color: #fff;
  border-radius: 5px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  margin-bottom: 2px;
  margin-left: 2px;
  margin-right: 2px;
  padding: 5px 3px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.checkbox {
  background-color: #fff;
  border-color: #e6e6e6;
  width: 15px;
  height: 15px;
  margin-top: 0;
}

.u__tablecell {
  color: var(--newblack);
  flex: 1;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 5px;
  font-size: 13px;
  line-height: 1.2em;
  display: flex;
  overflow: hidden;
}

.u__tablecell._w-10 {
  flex-flow: wrap;
  flex: none;
  width: 10%;
}

.u__tablecell._w-5 {
  flex: none;
  width: 5%;
}

.u__tablecell._w-4 {
  flex: none;
  width: 4%;
}

.u__tablecell._w-auto {
  flex: none;
  width: auto;
  margin-right: 5px;
}

.u__tablecell._w-15 {
  flex: none;
  width: 15%;
}

.u__tablecell._w-20 {
  flex: none;
  width: 20%;
}

.u__tablecell.align-right {
  justify-content: flex-end;
  align-items: center;
  padding-right: 10px;
}

.u__tablecell._w-8 {
  flex: none;
  width: 8%;
}

.u__tablecell._w-2 {
  flex: none;
  width: 2%;
}

.u__tablecell._w-30 {
  flex: none;
  width: 30%;
}

.u__tablerow {
  background-color: #fff;
  border: 1px #e6e6e6;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  padding: 2px 10px;
  display: flex;
}

.u__tablerow.invoice-item {
  border-style: none;
}

.u__tableheader_text {
  color: var(--text);
  font-size: 12px;
  font-weight: 400;
}

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

.basicinfo {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.bi-avatar {
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 5px;
  display: flex;
}

.bi-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.bi-email {
  color: #939598;
  font-size: 11px;
}

.maincontent-header-right, .tablecontrol_container_right {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.icon_btn {
  color: #fff;
  background-color: #ffffff4d;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  margin-left: 5px;
  padding: 5px 7px;
  display: flex;
}

.icon_btn:hover {
  background-color: #ffffff80;
}

.icon_btn.mb-10 {
  margin-bottom: 10px;
  margin-left: 0;
}

.icon_btn.mb-10.green {
  border-color: var(--new-green);
  background-color: var(--new-green);
}

.icon_btn.style2 {
  border: 1px solid var(--line);
}

.icon_btn.style2.m-0 {
  margin-left: 0;
}

.btn {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: var(--blue-main);
  color: #fff;
  white-space: nowrap;
  border: 1px solid #0000;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  height: 40px;
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2em;
  text-decoration: none;
  display: flex;
  box-shadow: 0 4px 4px #0000000d;
}

.btn:hover {
  background-image: linear-gradient(90deg, var(--new-blue), var(--new-blue1));
}

.btn.white {
  border-color: var(--line);
  color: var(--text);
  white-space: nowrap;
  background-color: #fff;
  background-image: none;
}

.btn.white:hover {
  background-color: #ffffff80;
}

.btn.m-0 {
  margin-left: 0;
}

.btn.outline-green {
  border: 1px solid var(--new-blue);
  background-color: var(--white);
  color: var(--new-blue);
  background-image: none;
}

.btn.outline-green:hover {
  background-color: #d8fffd;
}

.btn.main {
  background-color: var(--white);
  color: var(--newblack);
  background-image: none;
}

.btn.main:hover {
  background-color: #fffc;
}

.btn.style3 {
  border: 1px solid var(--line);
  color: var(--newblack);
  background-color: #ffffff4d;
  background-image: none;
}

.btn.style3:hover {
  background-color: #f3f3f3;
}

.btn.small {
  height: 30px;
  font-size: 11px;
}

.btn.toggle {
  box-shadow: none;
  height: 30px;
  font-size: 11px;
}

.btn.blue {
  box-shadow: none;
  color: var(--blue-main);
  background-color: #eff6ff;
  background-image: none;
  border-color: #bfdbfe;
}

.btn.blue:hover {
  background-color: #ffffff80;
}

.btn.bg-lightblue {
  border-color: var(--line);
  color: var(--blue-main);
  white-space: nowrap;
  background-color: #eff6ff;
  background-image: none;
}

.btn.bg-lightblue:hover {
  background-color: #ffffff80;
}

.btn.bg-lightgreen {
  border-color: var(--line);
  color: #16a34a;
  white-space: nowrap;
  background-color: #f0fdf4;
  background-image: none;
}

.btn.bg-lightgreen:hover {
  background-color: #ffffff80;
}

.btn.endcall {
  border-color: var(--line);
  color: var(--white);
  white-space: nowrap;
  background-color: #ef4444;
  background-image: none;
}

.btn.endcall:hover {
  background-color: #d63030;
}

.btn.transfercall {
  background-color: #f59e0b;
}

.btn.transfercall:hover {
  background-color: #dd8d07;
  background-image: none;
}

.btn.acceptcall {
  background-color: #22c55e;
}

.btn.acceptcall:hover {
  background-color: #16a84c;
  background-image: none;
}

.btn_icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: flex;
}

.btn_icon.mr-0 {
  margin-right: 0;
}

.popup-adduser {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.popup-div {
  background-color: #fff;
  border-radius: 20px;
  flex-flow: column;
  width: 45%;
  display: flex;
}

.popup-top {
  border-bottom: 1px none var(--line);
  justify-content: space-between;
  align-items: flex-start;
  padding: 15px 15px 15px 30px;
  display: flex;
}

.popup-top-left {
  margin-top: 10px;
}

.popup-hd-text {
  color: var(--newblack);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2em;
}

.popup-close {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.popup-body {
  padding: 0 30px 10px;
}

.popup-body.p-20 {
  padding-left: 20px;
  padding-right: 20px;
}

.adduser-container {
  flex-flow: column;
  padding-left: 20px;
  padding-right: 50px;
  display: flex;
}

.form-row {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.form-row.wide {
  flex: 1;
}

.form-label-div {
  width: 30%;
}

.p-style1 {
  color: var(--new-sidebar-bg);
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
}

.p-style1.smallgrey {
  color: #2c3e50b3;
  font-size: 12px;
}

.p-style1.large {
  font-size: 15px;
  font-weight: 600;
}

.span-red {
  color: #ef4136;
}

.formfield-div {
  flex: 1;
  width: 100%;
}

.formfield-div.align-left {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.formfield-div.align-right {
  justify-content: flex-end;
  display: flex;
}

.textfield-01 {
  border: 1px solid var(--line);
  border-radius: 10px;
  height: 35px;
  margin-bottom: 0;
  font-size: 13px;
}

.selectfield-01 {
  border: 1px solid var(--line);
  background-color: #fff;
  border-radius: 10px;
  height: 35px;
  margin-bottom: 0;
  font-size: 13px;
}

.cni-card {
  border: 1px none var(--line);
  background-color: #fff;
  border-radius: 20px;
  flex-flow: column;
  height: 80vh;
  padding: 20px;
  display: flex;
  overflow: auto;
  box-shadow: 0 1px 6px #00000012;
}

.cnv-firstrow {
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  padding-bottom: 20px;
  display: flex;
}

.cnv-firstrow-col {
  width: 49%;
}

.h2 {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2em;
}

.formcontrol {
  margin-bottom: 10px;
}

.formcontrol.mt-10 {
  margin-top: 10px;
}

.fieldlabel {
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 500;
}

.div-block {
  background-color: #f1f2f2;
  border-radius: 10px;
  margin-top: 10px;
  padding: 10px;
}

.form2col {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.form2col-col {
  width: 49%;
}

.datefield-01 {
  border: 1px solid var(--line);
  background-image: url('../images/tencx-icon-date.svg');
  background-position: 95%;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  border-radius: 10px;
  height: 35px;
  margin-bottom: 0;
  font-size: 13px;
}

.cnv-secondrow {
  border-bottom: 1px solid var(--line);
  flex-flow: column;
  justify-content: space-between;
  padding-top: 20px;
  padding-bottom: 20px;
  display: flex;
}

.items-moreinfo {
  background-color: #f1f2f2;
  border-radius: 20px;
  flex-flow: wrap;
  justify-content: space-between;
  padding: 15px 30px 5px;
  display: flex;
}

.items-moreinfo-row {
  width: 24%;
  margin-bottom: 10px;
}

.moreinfo-field-row {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.moreinfo-remove {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-left: 5px;
  display: flex;
}

.cnv-third-row {
  justify-content: space-between;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.description-container {
  width: 55%;
}

.textarea-01 {
  border: 1px solid var(--line);
  border-radius: 10px;
  min-height: 90px;
  margin-bottom: 0;
  font-size: 13px;
}

.total-div {
  background-color: #f1f2f2;
  border: 1px solid #d1d3d4;
  border-radius: 10px;
  flex-flow: column;
  flex: 1;
  margin-left: 10px;
  padding: 15px;
  display: flex;
}

.total-row {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  display: flex;
}

.total-row.grandtotal {
  margin-top: 10px;
}

.cnv-btncontainer {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.u__table-tag {
  color: #16a34a;
  text-align: center;
  background-color: #dcfce7;
  border-radius: 8px;
  padding: 1px 5px;
  font-size: 12px;
}

.u__table-tag.bg-red {
  color: #dc2626;
  background-color: #fef2f2;
}

.u__table-tag.bg-blue {
  color: #2563eb;
  background-color: #eff6ff;
}

.u__table-tag.bg-yellow {
  color: #d97706;
  background-color: #fffbeb;
}

.accent-content {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.accent-card {
  width: 80%;
  padding: 15px;
}

.voice-signal {
  border: 1px solid var(--line);
  background-color: #f0fdf4;
  border-radius: 20px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  padding: 15px;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.callinprogress {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: var(--new-green);
  justify-content: flex-start;
  align-items: center;
  font-size: 12px;
  line-height: 1.2em;
  display: flex;
}

.callstat-round {
  background-color: var(--new-green);
  border-radius: 50%;
  width: 8px;
  height: 8px;
  margin-right: 5px;
  display: flex;
}

.accent-card-row {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.accent-card-2col {
  width: 49%;
}

.accent-card-sub {
  background-color: #fff;
  border-radius: 20px;
  flex-flow: column;
  padding: 15px;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.accent-card-sub.mb-10 {
  margin-bottom: 10px;
}

.accent-card-sub.horizontal {
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
}

.accent-card-subtop {
  justify-content: space-between;
  margin-bottom: 10px;
  display: flex;
}

.accent-card-subtop.mt-10 {
  margin-top: 10px;
}

.accent-card-subtopleft {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.u__togglecheck_container {
  background-color: var(--new-blue1);
  border-radius: 100px;
  align-items: center;
  width: 32px;
  height: 16px;
  margin-bottom: 0;
  display: flex;
}

.u__togglecheck {
  cursor: pointer;
  background-color: #ced7e0;
  background-image: url('../images/6554a4c42e478af42f8e15cf_black-circle.svg');
  background-position: 10% 45%;
  background-repeat: no-repeat;
  background-size: 12px 12px;
  border-radius: 100px;
  width: 32px;
  height: 16px;
  margin-top: 0;
  margin-right: 0;
  transition: all .2s;
}

.u__togglecheck.w--redirected-checked {
  background-color: #0000;
  background-image: url('../images/6554a4c42e478af42f8e15cf_black-circle.svg');
  background-position: 85% 45%;
  background-size: 12px 12px;
  border-style: none;
}

.checkbox-label-2 {
  display: none;
}

.divider {
  border-top: 1px solid var(--line);
  width: 100%;
  height: 1px;
  margin-top: 5px;
  margin-bottom: 15px;
}

.divider.mt-10 {
  margin-top: 10px;
}

.limit-icon {
  background-color: #fff1db;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
}

.limit-content {
  flex-flow: column;
  flex: 1;
  margin-left: 10px;
  display: flex;
}

.limit-item {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 5px;
  display: flex;
}

.limit-tag {
  color: #fbb040;
  text-align: center;
  background-color: #fff1db;
  border-radius: 8px;
  margin-left: 10px;
  padding: 1px 5px;
  font-size: 12px;
}

.popup-accent-config {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.config-content {
  flex-flow: column;
  display: flex;
}

.popup-bottom {
  border-top: 1px solid var(--line);
  justify-content: flex-end;
  align-items: center;
  padding: 10px;
  display: flex;
}

.config-group {
  border-bottom: 1px solid var(--line);
  margin-top: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.config-group.no-border {
  border-bottom-style: none;
  margin-bottom: 0;
}

.config-hd-div {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 15px;
  display: flex;
}

.radio-button-label {
  display: none;
}

.radio-text-content {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 10px;
  font-weight: 400;
  display: flex;
}

.radio-label {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2em;
}

.popup-h2 {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2em;
}

.radiobutton {
  width: 15px;
  height: 15px;
}

.radiobutton.w--redirected-checked {
  border-color: var(--new-green);
}

.span-link {
  color: var(--new-green);
  text-decoration: none;
}

.radio-button-field {
  margin-bottom: 10px;
}

.live-transcription {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.live-transcription-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  width: 250px;
  display: flex;
}

.live-transcription-right {
  flex-flow: column;
  flex: 1;
  margin-left: 10px;
  display: flex;
}

.lt-player-card {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  background-color: #fff;
  border: 1px solid #0000000d;
  border-radius: 20px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px;
  display: flex;
  position: relative;
  box-shadow: 0 1px 6px #00000012;
}

.lt-duration {
  color: #2c3e50cc;
  font-size: 11px;
  line-height: 1.2em;
}

.lt-player-card-right {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.lt-player-iconbtn {
  opacity: .8;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-left: 5px;
  display: flex;
}

.lt-player-iconbtn:hover {
  opacity: 1;
}

.lt-player-iconbtn.m-0 {
  margin-left: 0;
}

.lt-player-center {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.lt-player-btn {
  background-color: var(--new-blue);
  opacity: .8;
  cursor: pointer;
  border: 1px solid #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-left: 5px;
  margin-right: 5px;
  padding-left: 15px;
  padding-right: 15px;
  display: flex;
  box-shadow: inset 0 2px 3px #0003, 0 2px 5px #0003;
}

.lt-player-btn:hover {
  opacity: 1;
}

.speaker-item {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  padding: 8px 5px;
  font-size: 13px;
  display: flex;
  box-shadow: 0 2px 5px #0000001a;
}

.speaker-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 5px;
  display: flex;
}

.keywords-body {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.keywords {
  color: var(--text);
  background-color: #f3f4f6;
  border-radius: 10px;
  margin-bottom: 3px;
  margin-right: 3px;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 12px;
}

.keywords._2 {
  color: #6a952f;
  background-color: #d1e8b2;
}

.keywords._3 {
  color: #bc8430;
  background-color: #fddfb3;
}

.keywords._4 {
  color: #bf4d65;
  background-color: #ffc2cf;
}

.sd-right {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.notes-body {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.notes-card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #f5fff9;
  border: 1px solid #c2e5cf;
  border-radius: 5px;
  flex-flow: column;
  margin-bottom: 10px;
  padding: 5px 10px 10px;
  font-size: 12px;
  line-height: 1.2em;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.notes-details {
  color: var(--new-dark-green);
  justify-content: space-between;
  align-items: center;
  margin-top: 5px;
  font-size: 11px;
  display: flex;
}

.notes-edited-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.textarea-notes {
  border: 1px solid var(--line);
  border-radius: 5px;
  min-height: 60px;
  margin-bottom: 0;
  font-size: 13px;
}

.lt-top {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 10px;
  display: flex;
}

.lt-top-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.lt-hd-text {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.2em;
}

.lt-top-left-sub {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.lt-top-subdetails {
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.lt-top-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.lt-top-right {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.lt-body {
  flex-flow: column;
  height: 75vh;
  display: flex;
  overflow: auto;
}

.lt-convo-row {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 10px;
  display: flex;
}

.lt-speaker-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.lt-speaker-textcontent {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 10px;
  display: flex;
}

.lt-convo-duration {
  color: #2c3e50cc;
  margin-bottom: 2px;
  font-size: 11px;
  line-height: 1.2em;
}

.popup-live-transcript-config {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.config-row {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.checkbox-config-col {
  width: 45%;
}

.config-checkbox {
  width: 15px;
  height: 15px;
}

.config-checkbox.w--redirected-checked {
  border-color: var(--new-green);
  background-color: var(--new-green);
}

.config-checkbox-label {
  font-size: 13px;
  line-height: 1.2em;
}

.lt-export-config {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.lt-export-config-right {
  width: 30%;
}

.card_translate_body {
  height: 400px;
}

.lt-wrap {
  flex-flow: row;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 8px;
  display: flex;
}

.cardtranslate_topright {
  justify-content: flex-end;
  align-items: center;
  display: flex;
  position: relative;
}

.card_translate {
  background-color: #fff;
  border-radius: 20px;
  flex: 1;
  padding: 8px;
  box-shadow: 0 1px 6px #00000012;
}

.card_translate_top {
  border-bottom: 1px solid #cbcbcb66;
  justify-content: space-between;
  margin-bottom: 10px;
  padding: 0 8px 8px;
  display: flex;
}

.formlabel {
  color: var(--new-sidebar-bg);
  white-space: nowrap;
  margin-right: 16px;
  font-size: 13px;
}

.dashboardtranslate_centercontrol {
  margin-left: 8px;
  margin-right: 8px;
  padding-top: 8px;
}

.cardtranslate_topleft {
  justify-content: flex-start;
  align-items: center;
  margin-right: 20px;
  display: flex;
}

.livetranslate-textarea {
  border: 1px #000;
  min-height: 100px;
  font-size: 13px;
}

.translate-mic {
  background-color: var(--new-green);
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.icon-speaker {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.popup-live-translate-config {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.coaching-container {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.coaching-hd {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 20px;
  line-height: 1.2em;
}

.coaching-lists {
  flex-flow: wrap;
  place-content: flex-start space-between;
  align-items: flex-start;
  height: 70vh;
  display: flex;
  overflow: auto;
}

.coaching-item {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #333;
  background-color: #fff;
  border-radius: 20px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  width: 49%;
  margin-bottom: 15px;
  padding: 15px;
  text-decoration: none;
  display: flex;
  box-shadow: 0 1px 6px #00000012;
}

.coaching-item-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.coaching-item-hd {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2em;
}

.coaching-item-subdetails {
  justify-content: flex-start;
  align-items: center;
  margin-top: 5px;
  display: flex;
}

.vertical-divider-small {
  border-left: 1px solid var(--line);
  height: 15px;
  margin-left: 0;
  margin-right: 5px;
}

.text-session {
  color: var(--new-green);
  font-size: 11px;
  line-height: 1.2em;
}

.coaching-item-right {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  display: flex;
}

.coaching-item-right._w-100 {
  width: 100%;
  margin-left: 0;
  margin-right: 5px;
}

.u-progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  align-self: stretch;
  width: 100%;
  height: 8px;
  margin-bottom: 5px;
  position: relative;
}

.u-progress.size-stretch {
  flex: 1;
  margin-bottom: 0;
}

.aw__progress-status {
  background-color: var(--new-blue1);
  border-radius: 50px;
  width: 80%;
  position: absolute;
  inset: 0%;
}

.coaching-details-container {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.cd-left {
  background-color: #fff;
  border-radius: 20px;
  width: 65%;
  padding: 15px;
  box-shadow: 0 1px 6px #00000012;
}

.cd-list {
  padding-top: 10px;
}

.cd-hd {
  color: var(--text);
  text-transform: none;
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2em;
}

.cd-hd.mt-20 {
  margin-top: 20px;
}

.cd-checkbox {
  border: 1px solid #0000001a;
  border-radius: 12px;
  width: 100%;
  margin-bottom: 10px;
  padding: 10px 10px 5px;
}

.cd-checkbox-textcontent {
  cursor: pointer;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 5px;
  padding-bottom: 10px;
  display: flex;
}

.cd-checkbox-textcontent-left {
  width: 60%;
}

.cd-checkbox-textcontent-right {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex: 1;
  justify-content: flex-end;
  align-items: flex-start;
  margin-left: 10px;
  display: flex;
}

.cd-right {
  background-color: #fff;
  border-radius: 20px;
  flex: 1;
  margin-left: 10px;
  padding: 15px;
  box-shadow: 0 1px 6px #00000012;
}

.form {
  display: flex;
}

.icon-table {
  width: 15px;
  height: 15px;
  display: flex;
}

.dash-table-row-style2 {
  cursor: pointer;
  border-bottom: 1px solid #e5e5e5;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.dash-table-row-style2:hover {
  background-color: #effff9;
}

.filter-div {
  margin-right: 10px;
}

.agent-config-row {
  border-bottom: 1px solid #e5e5e5;
  display: flex;
}

.agent-config-row.padding-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.popup-performance-configuration {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.form-col {
  width: 45%;
}

.agent-config-container {
  flex-flow: column;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.agent-config-container.p-0 {
  padding-left: 0;
  padding-right: 0;
}

.checkbox-field-div {
  margin-top: 20px;
  margin-bottom: 20px;
}

.form-button-div {
  justify-content: flex-end;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  display: flex;
}

.icon-versus {
  width: 30px;
  height: 30px;
}

.icon-rank {
  color: #fff;
  background-color: #29abe2;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 13px;
  display: flex;
}

.icon-rank.yellow {
  background-color: #fcab28;
}

.icon-rank.green {
  background-color: #00a86b;
}

.leaderboard-div {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex: 1;
  justify-content: center;
  align-items: flex-end;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.text-scorename {
  font-weight: 500;
}

.text-scorename.bigger {
  font-size: 15px;
  line-height: 22px;
}

.challenge-div {
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  display: flex;
}

.text-score {
  color: #8dc63f;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3em;
}

.text-score.smaller {
  font-size: 14px;
  font-weight: 600;
}

.text-score.smaller.blue {
  color: #29abe2;
}

.text-score.smaller.yellow {
  color: #fcab28;
  font-size: 15px;
}

.text-score.smaller.green {
  color: #00a86b;
}

.text-score.red {
  color: #ff6687;
}

.gamification-col2 {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  flex: 1;
  margin-left: 2%;
  display: flex;
}

.score-div {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  font-size: 12px;
  display: flex;
}

.card-label {
  color: #333333b3;
  text-transform: uppercase;
  margin-top: 5px;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 500;
}

.todays-stats-div {
  justify-content: space-between;
  align-self: stretch;
  margin-top: 5px;
  font-size: 11px;
  display: flex;
}

.circle-rank {
  color: #fff;
  background-color: #00a86b;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  font-size: 12px;
  display: flex;
}

.challenge-col {
  text-align: center;
  flex: 0 auto;
  width: 40%;
  font-size: 11px;
}

.avatar-leaderboard {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  display: flex;
}

.avatar-leaderboard.margin-0 {
  margin-right: 0;
}

.agent-gamification {
  display: flex;
}

.text-todays-stats {
  color: var(--newblack);
  justify-content: center;
  align-items: center;
  font-size: 14px;
  font-weight: 900;
  display: flex;
}

.leaderboard-content {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.icon-small {
  width: 20px;
  height: 20px;
  margin-right: 2px;
}

.btn-tag {
  color: var(--new-blue);
  text-align: center;
  background-color: #d5ebea;
  border-radius: 5px;
  padding: 7px 5px;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.3em;
}

.icon-crown {
  width: 15px;
  height: auto;
  margin-bottom: 2px;
}

.icon-crown.hide {
  opacity: 0;
}

.gamification-col1 {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  width: 49%;
  display: flex;
}

.card-stats {
  color: var(--new-blue);
  text-align: center;
  text-transform: uppercase;
  background-color: #d5ebea;
  border-radius: 10px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding: 5px 7px 7px;
  font-size: 12px;
  font-weight: 700;
  display: flex;
}

.cheerleading-item {
  border-bottom: 1px solid #e5e5e5;
  justify-content: space-between;
  align-items: center;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 11px;
  display: flex;
}

.card-my-rank {
  width: 30%;
}

.todays-stats-card {
  color: #5e5e5e;
  text-transform: none;
  background-color: #fff;
  border-radius: 5px;
  width: 48%;
  padding-top: 5px;
  padding-bottom: 5px;
}

.todays-stats-card.wide {
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  width: auto;
  display: flex;
}

.name-leaderboard {
  margin-top: 20px;
}

.leaderboard-column {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.image-leaderboard-avatar {
  border: 3px solid #29abe2;
  border-radius: 50%;
  width: 60px;
  height: 60px;
}

.image-leaderboard-avatar.green {
  border-color: #00a86b;
}

.image-leaderboard-avatar.winner {
  border-color: #fcab28;
  width: 80px;
  height: 80px;
}

.motivation-col3 {
  width: 28%;
}

.btn-send {
  cursor: pointer;
  background-color: #00a86b;
  background-image: url('../images/tencx-livetranslate-02.svg');
  background-position: 5px;
  background-repeat: no-repeat;
  background-size: 20px;
  border-radius: 20px;
  padding: 5px 10px 5px 30px;
  font-size: .85rem;
}

.btn-send:hover {
  background-color: #05925f;
}

.cheers-slider {
  justify-content: space-between;
  align-items: center;
  height: 100%;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.add-button {
  color: #6e6e6e;
  cursor: pointer;
  border-radius: 5px;
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  padding: 3px 5px;
  font-size: .8rem;
  display: flex;
}

.add-button:hover {
  background-color: #00a86b17;
}

.send-cheers-btn {
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  display: flex;
}

.btn-icon {
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  display: flex;
}

.right-arrow {
  color: #3d3d3d;
  width: 30px;
  font-size: 15px;
}

.cheers-textarea-div {
  height: 100px;
  margin-bottom: 10px;
  display: flex;
}

.mask {
  padding-left: 20px;
  padding-right: 20px;
}

.slide-nav {
  display: none;
}

.send-cheers-subbutton-containers {
  display: flex;
}

.col-btn-cheers {
  text-align: center;
  flex-flow: column;
  flex: 1;
  margin-left: 5px;
  margin-right: 5px;
  display: flex;
}

.motivation-col1 {
  width: 28%;
}

.slider-button {
  background-color: #fff;
  height: 40px;
}

.slide {
  margin-left: 0;
  margin-right: 15px;
}

.motivation-content {
  justify-content: space-between;
  display: flex;
}

.left-arrow {
  color: #3d3d3d;
  width: 30px;
  font-size: 15px;
  display: flex;
}

.motivation-col2 {
  width: 40%;
}

.lcn-content {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  margin-top: 10px;
  display: flex;
}

.lcn-item {
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
  display: flex;
}

.lcn-label {
  color: #a7a9ac;
  flex: none;
  width: 40%;
  font-size: 12px;
  line-height: 1.2em;
}

.lcn-data {
  color: var(--new-sidebar-bg);
  flex: 1;
  margin-left: 10px;
  font-size: 12px;
  line-height: 1.2em;
}

.sb__link-embed-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 0;
  display: flex;
}

.db-left {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.db-right {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.db-calendar {
  border-left: 1px solid var(--line);
  color: var(--newblack);
  justify-content: flex-end;
  align-items: center;
  margin-left: 10px;
  padding-left: 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2em;
  display: flex;
}

.db-calendar-day {
  border: 1px solid var(--newblack);
  text-align: center;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 70px;
  height: 70px;
  margin-right: 10px;
  font-size: 25px;
  font-weight: 700;
  display: flex;
}

.card-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.card-select-filter {
  border: 1px solid var(--line);
  color: var(--newblack);
  cursor: pointer;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 2px 10px;
  font-size: 12px;
  display: flex;
}

.select-filter-arrow {
  justify-content: center;
  align-items: center;
  width: 7px;
  height: 7px;
  margin-left: 5px;
  display: flex;
}

.subpagescontent-header {
  background-image: linear-gradient(90deg, var(--new-blue1), var(--new-blue));
  border-bottom-right-radius: 30px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 20px;
  display: flex;
}

.icon-btn-embed {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: flex;
}

.icon-btn-embed-stretch {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.subpages-content-body {
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.subpages-content-body.pt-20 {
  padding-top: 20px;
}

.card-table {
  background-color: #fff;
  border-radius: 20px;
  height: 68vh;
  padding: 15px;
  overflow: auto;
  box-shadow: 0 1px 6px #00000012;
}

.gamehistory-scroll {
  height: 50vh;
  overflow: auto;
}

.u__main-div {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.db-maincol-left {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  flex: none;
  width: 45%;
  display: flex;
}

.db-maincol-left.admin {
  width: 60%;
}

.u__card {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  flex-flow: column;
  flex: none;
  width: 100%;
  padding: 15px;
  display: flex;
  box-shadow: -4px -4px 10px #fff6, 0 4px 10px #0000001a;
}

.u__card-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.u__card-title-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__card-body {
  flex-flow: column;
  display: flex;
}

.db-maincol-right {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  flex: none;
  width: 25%;
  display: flex;
}

.card__ps-stat-card-contain {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.card__ps-stat-card-percent {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #16a34a;
  justify-content: flex-end;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  display: flex;
}

.card__ps-stat-card-percent-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 10px;
  height: 10px;
  display: flex;
}

.tb__text {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2em;
}

.u__tag {
  color: #1d4ed8;
  text-align: center;
  background-color: #dbeafe;
  border-radius: 8px;
  padding: 1px 5px;
  font-size: 11px;
  line-height: 1.3;
}

.u__tag.bg-red {
  color: #b91c1c;
  background-color: #fee2e2;
}

.u__tag.bg-yellow {
  color: #854d0e;
  background-color: #fef9c3;
}

.u__tag.bg-green {
  color: #166534;
  background-color: #dcfce7;
}

.u__tag.bg-gray {
  color: #374151;
  background-color: #f3f4f6;
}

.u__tag.bg-violet {
  color: #7e22ce;
  background-color: #f3e8ff;
}

.ch__card-control-icon {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.u__table-name-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.compli__icon {
  background-color: #f3f4f6;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 2px 5px #0003;
}

.db-tabs {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__tab-icon-embed {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 0;
  display: flex;
}

.u__tabpane {
  width: 100%;
}

.db-greetings-card {
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 20px;
  display: flex;
}

.db-gc-left {
  flex-flow: column;
  flex: 1;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.db-gc-date-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #6b7280;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 5px;
  font-size: 12px;
  line-height: 1.5;
  display: flex;
}

.db-gc-icon {
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.db-gc-right {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #eff6ff;
  justify-content: flex-start;
  align-items: flex-start;
  width: 25%;
  padding: 15px;
  display: flex;
}

.db-gc-priority-icon {
  background-color: #fff;
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
}

.db-gc-priority-textcontent {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.db-gc-priority-hd-text {
  color: var(--blue-dark);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
}

.db-gc-priority-list {
  color: var(--blue-main);
  margin-bottom: 0;
  padding-left: 20px;
}

.db-gc-priority-text {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.db-gc-priority-listitem {
  margin-bottom: 5px;
}

.db-maincol-center {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.card__ps-stat-card {
  background-color: #f9fafb;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  width: 32%;
  padding: 15px;
  display: flex;
}

.alert-data {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__stat-card-alert-dot-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__stat-card-alert-dot {
  background-color: #f59e0b;
  border-radius: 50%;
  width: 12px;
  height: 12px;
}

.u__stat-card-alert-dot.bg-red {
  background-color: #ef4444;
}

.card__ps-call-resolution-rate-label-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.card__ps-call-resolution-rate-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border-top: 1px solid #0000001a;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  padding-top: 10px;
  display: flex;
}

.u__card-tabs {
  flex-flow: column;
  display: flex;
}

.u__card-tabsmenu {
  border-bottom: 1px solid #0000001a;
  width: 100%;
  display: flex;
}

.u__card-tablink {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--text);
  background-color: #ddd0;
  border-bottom: 2px solid #0000;
  justify-content: center;
  align-items: center;
  padding: 5px 15px;
  font-size: 12px;
  display: flex;
}

.u__card-tablink.w--current {
  border-bottom-color: var(--new-blue1);
  color: var(--new-blue1);
  background-color: #fff0;
}

.u__card-tablink-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 0;
  display: flex;
}

.u__card-tablink-count {
  color: var(--text);
  background-color: #f3f4f6;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  line-height: 1.4;
  display: flex;
}

.compli__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #f9fafb;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 10px;
  display: flex;
}

.compli__item-hd-text {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.compliprog__statcard {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #f9fafb;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  width: 49%;
  padding: 15px;
  display: flex;
}

.compliprog__statcard.bg-blue {
  background-color: #eff6ff;
}

.compliprog__statcard.bg-yellow {
  background-color: #fffbeb;
}

.quicklink__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #eff6ff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 8px 10px;
  text-decoration: none;
  display: flex;
}

.quicklink__item:hover {
  box-shadow: 0 2px 5px #0000001a;
}

.quicklink__item.bg-green {
  background-color: #f0fdf4;
}

.quicklink__item.bg-purple {
  background-color: #faf5ff;
}

.ql__icon {
  background-color: #fff;
  border-radius: 10px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  overflow: hidden;
}

.teamsnap__title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2em;
}

.teamsnap__item-percent-text {
  color: var(--new-blue1);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2em;
}

.topperf__name {
  color: var(--newblack);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.teamsnap__tc-item {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border-top: 1px solid #0000001a;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  padding-top: 5px;
  display: flex;
}

.teamporf__bot {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.topperf__trend-icon {
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
}

.flagalert__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #f9fafb;
  border-radius: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 10px;
  padding: 10px;
  display: flex;
}

.flagalert__item-top {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.flagalert-btncontain {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.agent-widget__contain {
  display: flex;
  position: absolute;
  inset: auto 2% 2% auto;
}

.agent-widget {
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  background-color: #0009;
  background-image: linear-gradient(#0009, #0000001a);
  border-radius: 10px;
  flex-flow: column;
  display: flex;
}

.aw__topbar {
  justify-content: space-between;
  align-items: center;
  padding: 8px;
  display: flex;
}

.aw__tb-right {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.aw__tb-btn {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.aw__tb-btn.minimal, .aw__tb-btn.expanded {
  display: none;
}

.aw__content {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  padding: 0 8px 12px;
  display: flex;
}

.aw__tb-status-dot {
  background-color: #4ade80;
  border-radius: 50%;
  flex: none;
  width: 10px;
  height: 10px;
}

.aw__tb-status-dot.bg-blue {
  background-color: var(--new-blue);
}

.aw__tb-status-dot.bg-grey {
  background-color: #d3d3d3;
}

.aw__oc-suggestions-list {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.aw__oc-suggestions-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #fff;
  background-image: linear-gradient(90deg, #0000001a, #fff3 50%, #0000001a);
  border: 1px solid #ffffff1a;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 8px;
  font-size: 12px;
  display: flex;
  box-shadow: inset 0 4px 4px -1px #0003;
}

.aw__oc-suggestions-item.secondary {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 11px;
}

.aw__oc-suggest-icon {
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
}

.aw__script-card {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #fff;
  background-image: linear-gradient(#00000080, #0000001a);
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 4px 4px #0003;
}

.aw__kn-textcontent {
  flex: 1;
  font-size: 11px;
}

.aw__idle-tabs-div {
  display: flex;
}

.aw__idle-tabs {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__idle-tabs-menu {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  justify-content: center;
  align-items: center;
  margin-bottom: 4px;
  display: flex;
}

.aw__idle-tablink {
  color: var(--white);
  text-align: center;
  background-color: #ddd0;
  border: 1px solid #ffffff1a;
  border-radius: 50px;
  padding: 2px 8px;
  font-size: 11px;
  line-height: 1.4;
}

.aw__idle-tablink.w--current {
  background-color: #ffffff4d;
  border-color: #fff6;
}

.aw__idle-tabscontent {
  width: 100%;
}

.aw__metrics {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.aw__metric-card {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  color: #fff;
  background-image: linear-gradient(#0000004d, #0000000d);
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 32%;
  padding: 4px;
  font-size: 10px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 4px 4px #0003;
}

.aw__metric-card._w-49 {
  width: 49%;
}

.aw__metric-card.is-gradient-orange {
  background-image: linear-gradient(#0000004d, #eab30833);
}

.aw__metric-card.is-gradient-green {
  background-image: linear-gradient(#0000004d, #22c55e4d);
}

.aw__metric-card.is-gradient-red {
  background-image: linear-gradient(#0000004d, #ef44444d);
}

.aw__metric-card_text-content {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 500;
  display: flex;
}

.aw__metric-card_text-content.vertical {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
}

.aw__onboarding-list {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  display: flex;
}

.aw__onboarding-item {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #fff;
  background-image: linear-gradient(#0000004d, #0000000d);
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 8px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding: 6px 8px;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 4px 4px #0003;
}

.aw__ob-item_left {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__ob-item_right {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 10px;
  height: 10px;
  display: flex;
}

.aw__btn {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 50px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  padding: 6px 0;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.aw__btn:hover {
  background-color: #ffffff1a;
}

.aw__btn.bg-blue {
  background-color: var(--new-blue1);
}

.aw__script-menu-row {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__script-menu {
  color: #fff;
  cursor: pointer;
  background-color: #0003;
  border-radius: 20px;
  padding: 4px 6px;
  font-size: 9px;
  line-height: 1.4;
  box-shadow: 0 2px 5px #0003;
}

.aw__script-menu.is-active {
  background-color: #fff3;
}

.aw__btn-roleplay {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: var(--new-blue1);
  color: #fff;
  cursor: pointer;
  border-radius: 50px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.aw__btn-icon-div {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.aw__roleplay-description {
  color: #fff;
  text-align: center;
  justify-content: center;
  align-items: center;
  font-size: 10px;
  line-height: 1.4;
  display: flex;
}

.aw__search-formblock {
  margin-bottom: 0;
}

.aw__knowledge-card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #fff;
  background-image: linear-gradient(#00000080, #0000001a);
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 4px 4px #0003;
}

.aw__kn-top {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.aw__kn-topleft {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__kn-topright {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.aw__kn-btn-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  padding-left: 2px;
  padding-right: 2px;
  display: flex;
}

.aw__oc-minimal {
  flex-flow: column;
  width: 320px;
  display: flex;
}

.aw__tb-oncall-left {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  display: none;
}

.aw__tb-callduration {
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
}

.aw__tb-calldetails {
  color: #fff;
  font-size: 10px;
  font-weight: 400;
  line-height: 1;
}

.aw__tb-btn-endcall {
  cursor: pointer;
  background-color: #f6513b;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 1px 6px;
  display: flex;
}

.aw__image-15 {
  width: 15px;
}

.aw__group {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
}

.aw__grp-hd-row {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.aw__grp-hd-text {
  color: #fff;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-size: 10px;
  line-height: 1.4;
}

.aw__grp-hd-row_left {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__grp-hd-row_right {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.aw__grp-p {
  color: #fff;
  font-size: 10px;
  line-height: 1.4;
}

.aw__checklist {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  margin-bottom: 4px;
  padding-left: 8px;
  display: flex;
}

.aw__cl-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.aw__cl-item.checked {
  text-decoration: line-through;
}

.aw__cl-dot {
  background-color: var(--new-blue1);
  border: 2px solid #ffffff80;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  box-shadow: 0 2px 5px #0003;
}

.aw__cl-dot.unchecked {
  opacity: .5;
  filter: grayscale();
}

.aw__progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  align-self: stretch;
  height: 5px;
  margin-bottom: 5px;
  position: relative;
}

.aw__progress.is-stretch {
  flex: 1;
  align-self: auto;
  margin-bottom: 0;
}

.aw__progress-stat {
  background-color: var(--new-blue1);
  border-radius: 50px;
  width: 50%;
  position: absolute;
  inset: 0%;
}

.aw__oc-average {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: 320px;
  display: none;
}

.aw-group-hd-chevron {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  padding-left: 2px;
  padding-right: 2px;
  display: flex;
}

.aw__oc-expanded {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: none;
}

.aw-suggestion-count {
  text-align: center;
  background-color: #0a0a0a33;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.aw-expanded-suggestion-item-left {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw-expanded-suggestion-item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #fff;
  background-image: linear-gradient(90deg, #0000001a, #fff3 50%, #0000001a);
  border: 1px solid #ffffff1a;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 8px;
  font-size: 12px;
  display: flex;
  box-shadow: inset 0 4px 4px -1px #0003;
}

.aw-expanded-suggestion-item.secondary {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 11px;
}

.aw-btn-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  padding-left: 2px;
  padding-right: 2px;
  display: flex;
}

.aw__tb-postcall-left {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  display: none;
}

.aw__pc-minimal {
  flex-flow: column;
  width: 320px;
  display: flex;
}

.aw__grp-card-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-image: linear-gradient(#0003, #0000);
  border: 1px solid #fff3;
  border-radius: 8px;
  flex-flow: column;
  padding: 8px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aw__pc-call-score {
  color: #9ee1ff;
  background-color: #ffffff1a;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 10px;
  line-height: 1.2;
  display: flex;
}

.aw__grp-body_div {
  flex-flow: column;
  display: flex;
}

.aw__pc-feedback {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  padding-left: 8px;
  display: flex;
}

.aw__pc-feedback-hd {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.aw__pc-feedback-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  justify-content: flex-start;
  align-items: center;
  padding-left: 8px;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.aw__pc-feedback-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.aw__pc-feedback-grp {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  margin-bottom: 4px;
  display: flex;
}

.aw__pc-empathy {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  text-align: center;
  background-image: linear-gradient(#22c55e1a, #22c55e4d);
  border: 1px #fff3;
  border-radius: 8px;
  flex-flow: column;
  flex: 1;
  padding: 8px;
  font-size: 12px;
  line-height: 1.2;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aw__pc-average {
  flex-flow: column;
  width: 320px;
  display: none;
}

.aw__btn-2col-row {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.aw__btn-2col {
  flex: 1;
}

.aw__pc-expanded {
  flex-flow: column;
  width: 320px;
  display: none;
}

.transcript-con-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-image: linear-gradient(#0000004d, #0000);
  border-radius: 8px;
  flex-flow: column;
  max-height: 120px;
  padding: 8px;
  display: flex;
  overflow: auto;
}

.aw-transcript-text {
  color: #fff;
  font-size: 11px;
  line-height: 1.4;
}

.span-transcript-customername {
  color: #0ea5e9;
  font-weight: 700;
}

.span-transcript-agentname {
  color: #f59e0b;
  font-weight: 700;
}

.aw__tb-idle-left {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__tb-idle-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.aw__tb-idle-namediv {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__tb-idle-nd-wave {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.aw__idle-minimal {
  flex-flow: column;
  width: 320px;
  display: flex;
}

.aw__idle-control-row {
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px 8px;
  display: flex;
}

.aw__btn-nextcall {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: var(--new-blue1);
  color: #fff;
  cursor: pointer;
  border-radius: 50px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aw__btn-nextcall:hover {
  background-color: #007bb3;
}

.aw__idle-state-toggle-control {
  background-color: #c7c7c733;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 4px;
  display: flex;
  box-shadow: inset 0 4px 4px #0000001a, 0 4px 4px #0000001a;
}

.aw__idle-state-toggle {
  cursor: pointer;
  background-color: #22c55e;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 2px 10px;
  display: flex;
  position: relative;
}

.aw__idle-state-toggle.is-ready:hover {
  background-color: #22c55e;
}

.aw__idle-state-toggle.is-onbreak {
  background-color: #f59e0b00;
}

.aw__idle-state-toggle.is-onbreak:hover {
  background-color: #f59e0b;
}

.aw__idle-state-toggle.is-dnd {
  background-color: #dc262600;
}

.aw__idle-state-toggle.is-dnd:hover {
  background-color: #dc2626;
}

.aw__idle-average {
  flex-flow: column;
  width: 320px;
  display: none;
}

.aw-performance-textcontent {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  box-shadow: none;
  color: #fff;
  text-align: center;
  background-image: linear-gradient(#22c55e1a, #22c55e4d);
  border: 1px solid #fff3;
  border-radius: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 8px;
  font-size: 12px;
  line-height: 1.2;
  display: flex;
}

.aw__group-hd-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.aw__idle-expanded {
  flex-flow: column;
  display: none;
}

.aw__tb-btn-oncall {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  display: none;
}

.aw__tb-btn-postcall {
  display: none;
}

.aw__oncall, .aw__postcall {
  flex-flow: column;
  display: none;
}

.aw__idle {
  flex-flow: column;
  display: flex;
}

.u__tabs {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.u__tabsmenu {
  border-bottom: 1px solid #0000001a;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}

.u__tablink {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #333c;
  background-color: #fff0;
  border-bottom: 2px solid #0ea5e900;
  border-radius: 10px 10px 0 0;
  justify-content: center;
  align-items: center;
  height: 36px;
  padding: 2px 12px;
  font-family: Headland One, sans-serif;
  font-size: 13px;
  line-height: 1.2em;
  display: flex;
}

.u__tablink.w--current {
  background-color: var(--white);
  color: var(--new-blue1);
  border-bottom-color: #0ea5e9;
  font-weight: 500;
}

.aw__idle-state-tooltip {
  color: #fff;
  text-align: center;
  background-color: #14141480;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  padding: 2px 5px;
  font-size: 10px;
  line-height: 1.2;
  display: none;
  position: absolute;
  bottom: 120%;
}

.sec__livecallsupport {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: none;
}

.lcs__hd-div {
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.lcs__hd-div-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.lcs__hd-icon {
  background-color: #dcfce7;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
}

.lcs__hd-div-left-text-content {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.lcs__active-call-row {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.lcs__status-dot {
  background-color: #22c55e;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.lcs__btn-contain {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.lcs__body {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.lcs__body-left {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  width: 60%;
  display: flex;
}

.lcs__livetranscrip {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  display: flex;
  box-shadow: -4px -4px 10px #fff6, 0 4px 10px #0000001a;
}

.lcs__lt-top {
  background-color: #f9fafb;
  border-bottom: 1px solid #0000001a;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  display: flex;
}

.lcs__lt-btn-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.btn__small {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  box-shadow: none;
  color: var(--text);
  background-color: #2563eb00;
  border: 1px solid #cacaca;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  display: flex;
}

.btn__small:hover {
  background-color: #f1f1f1;
}

.lcs__lt-body {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  max-height: 45vh;
  padding: 12px;
  display: flex;
  overflow: auto;
}

.lcs__transcript-row {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.lcs__transcript-source {
  color: #1d4ed8;
  background-color: #dbeafe;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.lcs__transcript-source.customer {
  color: #374151;
  background-color: #f3f4f6;
}

.lcs__transcript-textcontent {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.lcs__transcript-time {
  color: #b1b0b0;
  font-size: 10px;
}

.lcs__transcript-row-left {
  flex: none;
  justify-content: flex-start;
  align-items: flex-start;
  width: 18%;
  display: flex;
}

.lcs__compliance-card {
  background-color: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  display: flex;
}

.lcs__compliance-card-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex: 1;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}

.lcs__compliance-card-icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.lcs__compliance-card-text-content {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  line-height: 1.4;
  display: flex;
}

.lcs__compliance-card-hd-text {
  color: #92400e;
  font-size: 13px;
  font-weight: 600;
}

.lcs__compliance-card-text {
  color: #92400e;
  font-size: 12px;
}

.lcs__compliance-card-right {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.lcs__compliance-close-icon {
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
}

.lcs__body-right {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.card-hd-text-style2 {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2em;
}

.aw__metric-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
}

.aw__encouragement-card {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  text-align: center;
  background-image: linear-gradient(#0ea5e91a, #0ea5e94d);
  border: 1px #fff3;
  border-radius: 8px;
  flex-flow: column;
  padding: 4px 8px;
  font-size: 12px;
  line-height: 1.2;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aw__metric-overall-phase {
  display: none;
}

.aw-metric-comment {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.aw-metric-comment.text-orange {
  color: #eab308;
}

.aw-metric-comment.text-gren {
  color: #22c55e;
}

.aw-metric-comment.text-red {
  color: #ef4444;
}

.aw-suggestion-row {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.sa-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.sa-emoji-row {
  justify-content: center;
  align-items: center;
  display: flex;
}

.sa-emoji {
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
}

.sa-recent-change {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border-top: 1px solid #0000001a;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 10px;
  padding-top: 10px;
  display: flex;
}

.sa-recent-change-contents {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.sec__aisuggestion {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}

.aisuggest__item {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  cursor: pointer;
  background-color: #eff4ff;
  border: 1px solid #dbeafe;
  border-radius: 12px;
  flex-flow: column;
  padding: 12px;
  display: flex;
}

.aisuggest__top {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.aisuggest__icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.aisuggest__textcontent {
  flex: 1;
  font-size: 12px;
  line-height: 1.4;
}

.aisuggest__bot {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.ai-suggest__tag {
  color: #1d4ed8;
  background-color: #dbeafe;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.ai-suggest__tag.purple {
  color: #7e22ce;
  background-color: #f3e8ff;
}

.aisuggest__review-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.ai-suggest__review-icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.u__text-live {
  color: #2563eb;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

.sec__calls {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.calls-main {
  flex: 1;
}

.calls-side {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: none;
  width: 30%;
  display: flex;
}

.perfanalysis_imagetemp {
  justify-content: center;
  align-items: center;
  display: flex;
}

.rectrain__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 10px;
  padding: 10px;
  display: flex;
}

.rectrain__item-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.rectrain__item-progress-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex: none;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.u__searchfilter-row {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.u__search-input-style2 {
  background-image: url('../images/cccx-ch-04.svg');
  background-position: 10px;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  margin-bottom: 0;
  padding-left: 40px;
}

.u__seachfilter-formblock {
  margin-bottom: 0;
}

.ch__card-list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: wrap;
  display: flex;
}

.ch__card {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 32%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.ch__card-top {
  border-bottom: 1px solid #0000001a;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
  display: flex;
}

.ch__card-topleft {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.ch__card-icon {
  background-color: #dbeafe;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
  position: relative;
}

.ch__card-textcontent {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.ch__card-topright {
  cursor: pointer;
  background-color: #dcfce7;
  border-radius: 50%;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.ch__card-bot {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.ch__card-bot-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.ch__card-tagdiv {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aw__script-list {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  width: 320px;
  display: flex;
}

.aw__script-icon {
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
}

.aw__script-textcontent {
  flex: 1;
  font-size: 11px;
}

.aw__knowledge-list {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  display: flex;
}

.card__personalsnapshot {
  flex-flow: column;
  display: flex;
}

.card__ps-call-resolution-rate-label-row {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.card__ps-call-resolution-rate-progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  align-self: stretch;
  height: 8px;
  margin-bottom: 5px;
  position: relative;
}

.card__ps-call-resolution-rate-progress-percent {
  background-color: var(--new-blue1);
  border-radius: 50px;
  width: 85%;
  position: absolute;
  inset: 0%;
}

.card__ps-call-resolution-rate-label {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.card__ps-call-resolution-rate-label.smaller {
  font-size: 10px;
  font-weight: 400;
}

.sec__compliance-issues {
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  padding-top: 15px;
  padding-bottom: 15px;
  display: flex;
}

.compli__textdiv {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.compli__item-subhd {
  color: var(--text);
  font-size: 10px;
  line-height: 1.2em;
}

.db-gc-text {
  font-size: 13px;
  line-height: 1.2em;
}

.compliprog__stat-row {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.compliprog__statcard-label {
  color: #6b7280;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2em;
}

.compliprog__statcard-label.text-orange {
  color: #92400e;
}

.compliprog__statcard-label.text-blue {
  color: var(--blue-dark);
}

.compliprog__statcard-data {
  color: var(--newblack);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2em;
}

.ql__textcontent {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.ql__text {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.ql__subtext {
  color: var(--text);
  font-size: 10px;
  line-height: 1.2em;
}

.sec__teamsnapshot {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.teamsnap__group {
  flex-flow: column;
  display: flex;
}

.teamsnap__icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.teamsnap__list {
  flex-flow: column;
  margin-top: 5px;
  display: flex;
}

.teamsnap__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
  padding: 10px;
  display: flex;
}

.teamsnap__item-left {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.teamsnap__item-right {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.teamsnap__item-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
}

.teamsnap__item-text {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
}

.teamsnap__trainingcompletion {
  flex-flow: column;
  margin-top: 5px;
  display: flex;
}

.teamsnap__tc-label-div {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.teamsnap__tc-label {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.teamsnap__tc-label.smaller {
  font-size: 10px;
  font-weight: 400;
}

.teamsnap__tc-progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  align-self: stretch;
  height: 8px;
  margin-bottom: 5px;
  position: relative;
}

.teamsnap__tc-progress-percent {
  background-color: var(--new-blue1);
  border-radius: 50px;
  width: 80%;
  position: absolute;
  inset: 0%;
}

.teamsnap__tc-progress-percent.bg-green {
  background-color: #22c55e;
}

.teamsnap__tc-progress-percent.bg-yellow {
  background-color: #f59e0b;
}

.db-admin-overview-card {
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 20px;
  display: flex;
  overflow: hidden;
  box-shadow: 4px 4px 10px #0000001a, -4px -4px 10px #fff6;
}

.db-admin-overview-card-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 15px;
  display: flex;
}

.u__stat-card-contain {
  justify-content: space-between;
  align-items: stretch;
  margin-bottom: 20px;
  display: flex;
}

.u__stat-card-top {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}

.u__stat-card-icon {
  background-color: #f0fdf4;
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.u__stat-card-icon.bg-blue {
  background-color: #f0fdf4;
}

.u__stat-card-percent {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #16a34a;
  justify-content: flex-end;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  display: flex;
}

.u__stat-card-percent-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 10px;
  height: 10px;
  display: flex;
}

.u__stat-card-data-text {
  color: var(--newblack);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2em;
}

.u__stat-card-label {
  color: #6b7280;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
}

.u__stat-card-alert-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.sec__teamperformance {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.u__table-name-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.u__table-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.teamporf__bot-text {
  color: gray;
  font-size: 11px;
  line-height: 1.2em;
}

.teamporf__btn-contain, .u__card-top-btn-contain {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.sec__topperformers {
  flex-flow: column;
  margin-top: 5px;
  display: flex;
}

.topperf__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
  padding: 10px;
  display: flex;
}

.topperf__item-left {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.topperf__count {
  color: var(--blue-main);
  text-align: center;
  background-color: #def5ff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
}

.topperf__avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 0;
  display: flex;
}

.u__link {
  color: var(--new-blue1);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
}

.flagalert__item-icon {
  background-color: #f3f4f6;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 2px 5px #0003;
}

.flagalert__item-textrow {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.flagalert__item-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.flagalert__item-text {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.flagalert__item-text.smaller {
  font-size: 10px;
  font-weight: 400;
}

.lcs__active-text, .lcs__lt-label {
  color: #6b7280;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
}

.sa-progress-labels-div {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.sa-progress-label {
  color: var(--text);
  font-size: 10px;
  line-height: 1.2em;
}

.u-progress-status {
  background-color: var(--new-blue1);
  border-radius: 50px;
  width: 80%;
  position: absolute;
  inset: 0%;
}

.sa-recent-change-title {
  color: var(--text);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2em;
}

.sec__callhistory {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.ch__card-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.ch__card-subtext {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.ch__card-time-details {
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.ch__card-time-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.ch__card-control-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.ch__card-tag {
  color: #1d4ed8;
  background-color: #dbeafe;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.ch__card-tag.gray {
  color: #4b5563;
  background-color: #f3f4f6;
}

.sec__performanceanalysis {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.perfanalysis_card {
  background-color: #f9fafb;
  border-radius: 20px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 32%;
  padding: 15px;
  display: flex;
}

.rectrain__item-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.rectrain__item-text {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.rectrain__item-progress-label {
  color: #b1b0b0;
  flex: none;
  font-size: 10px;
}

.u__card-control-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.u__card-control-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 20px;
  display: flex;
}

.sec__correctionsfeed {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.cf__card {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 100%;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.cf__card-top {
  background-color: #f9fafb;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  display: flex;
}

.cf__card-topleft {
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.cf__card-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.cf__card-tag-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.cf__card-tag {
  color: #1d4ed8;
  background-color: #dbeafe;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.cf__card-main {
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.cf__card-main-col {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 16px;
  display: flex;
}

.cf__card-main-col.bg-green {
  background-color: #f0fdf4;
  border-left: 1px solid #e5e7eb;
}

.cf__card-main-label {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.cf__card-main-text {
  color: var(--text);
  font-size: 13px;
  line-height: 1.2em;
}

.cf__card-bot {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  justify-content: flex-end;
  align-items: center;
  padding: 8px 16px;
  display: flex;
}

.cf__ishelpful {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: var(--text);
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.cf__ishelpful-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.sec__trainingonboarding {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.sec__onboarding {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.sec__onboarding-progress {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  display: flex;
}

.op__top {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  display: flex;
}

.op__topleft {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  border-right: 1px solid #0000001a;
  flex-flow: column;
  flex: none;
  width: 60%;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 16px;
  display: flex;
}

.op__title-div {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.op__progress-label {
  color: var(--new-blue1);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2em;
}

.op__date-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #6b7280;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 5px;
  font-size: 12px;
  line-height: 1.5;
  display: flex;
}

.op__date-icon {
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.op__earnedbadges {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.op__eb-title {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
  display: flex;
}

.op__eb-title-icon {
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.op__eb-list {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.op__eb-item {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  color: var(--text);
  text-align: center;
  flex-flow: column;
  flex: none;
  justify-content: flex-start;
  align-items: center;
  width: 19%;
  font-size: 12px;
  display: flex;
}

.op__eb-item-icon {
  border: 1px solid #0000001a;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  padding-left: 12px;
  padding-right: 12px;
  display: flex;
}

.op__bot {
  border-top: 1px solid #0000001a;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 8px;
  display: flex;
}

.op__bot-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.op__linkblock {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--new-blue1);
  justify-content: flex-start;
  align-items: center;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.op__linkblock-icon {
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.ob__content-row {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.ob__content-col-left {
  flex-flow: column;
  flex: none;
  width: 65%;
  display: flex;
}

.sec__aiguided-checklist {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.aicheck__list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.aicheck_item {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  width: 100%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aicheck__item-icon {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
  position: relative;
}

.aicheck__item-icon.grey {
  filter: grayscale();
}

.aicheck__item-textcontent {
  flex: 1;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.aicheck__item-textleft {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.aicheck__item-time {
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.aicheck__item-time-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.ob__content-col-right {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.sec__progress-dashboard {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.progressdb__list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.progressdb__item {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.progressdb__label {
  color: #6b7280;
  justify-content: space-between;
  align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
  display: flex;
}

.progressdb__datadiv {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-end;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
  display: flex;
}

.progressdb__datadiv-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.u__card-top-mini-label {
  color: #6b7280;
  justify-content: space-between;
  align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2em;
  display: flex;
}

.sec__milestonesbadge {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.mb__list {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.mb__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #1e40af;
  text-align: center;
  background-color: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  flex-flow: column;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 49%;
  padding: 20px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  display: flex;
}

.mb__item-icon {
  background-color: #dbeafe;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.sec__airoleplay {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.airoleplay__content-row {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.airoleplay__inbox {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border-right: 1px solid #0000001a;
  flex-flow: column;
  width: 30%;
  margin-right: 12px;
  padding-right: 12px;
  display: flex;
}

.airoleplay__inbox-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 100%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.airroleplay__inbox-item-name-div {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.airroleplay__inbox-item-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.airoleplay__inbox-item-text {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.airolplay__inbox-tag-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.airoleplay__inbox-content {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex: 1;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.airoleplay__inbox-conleft {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  width: 45%;
  display: flex;
}

.airoleplay__inbox-maincard {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #f9fafb;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 100%;
  padding: 16px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.airoleplay__inbox-maincard-title-div {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.airoleplay__inbox-maincard-title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.airoleplay__inbox-maincard-practicelist-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.airoleplay__inbox-maincard-practicelist-title {
  color: var(--text);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2em;
}

.airoleplay__inbox-maincard-practicelist {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.airoleplay__inbox-maincard-practice-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.airoleplay__inbox-maincard-practice-item-dot {
  background-color: #3b82f6;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.airoleplay__inbox-conleft-btn-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.airoleplay__inbox-conleft-btn-col {
  flex: 1;
}

.airoleplay__inbox-conright {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.sec__scoring-feedback {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.scoringfeedback__title-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.scoringfeedback__title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.scoringfeedback__subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.scoringfeedback__list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.scoringfeedback__item {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.scoringfeedback__item-labels-div {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.sec__assessments {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.assess__tabs {
  flex-flow: column;
  display: flex;
}

.assess__tabsmenu {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 16px;
  display: flex;
}

.assess__tablink {
  background-color: #fff;
  border-radius: 16px;
  padding: 5px 16px;
  font-size: 13px;
}

.assess__tablink.w--current {
  color: var(--new-blue1);
  background-color: #e5f7ff;
  font-weight: 500;
}

.assess__list {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.assess__item {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 100%;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.assess__item-top {
  background-color: #fff;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 16px 16px 8px;
  display: flex;
}

.assess__item-topleft {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.assess__item-title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.assess__item-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.assess__item-time {
  justify-content: flex-start;
  align-items: center;
  margin-top: 5px;
  font-size: 10px;
  display: flex;
}

.assess__item-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.assess__item-topright {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  display: flex;
}

.assess__item-tag {
  color: #1d4ed8;
  background-color: #dbeafe;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.assess__item-tag.green {
  color: #15803d;
  background-color: #dcfce7;
}

.assess__item-main {
  background-color: #f9fafb;
  border-top: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.assess__item-maincol {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 16px;
  display: flex;
}

.assess__item-maincol-hd-div {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.assess__item-main-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  display: flex;
}

.assess__item-maincol-hd-text {
  color: var(--text);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.assess__item-mainlist {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.assess__item-main-item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.assess__item-main-itemdot {
  background-color: #4b5563;
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.assess__item-bot {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  display: flex;
}

.assess__item-completion {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: var(--text);
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.assess__item-completion-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.assess__retake {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: var(--blue-main);
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  text-decoration: none;
  display: flex;
}

.assess__retake-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 10px;
  height: 10px;
  display: flex;
}

.sec__mentorships {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.mentor__row {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.mentor__rowleft {
  flex-flow: column;
  width: 60%;
  display: flex;
}

.sec__aimentor {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.aimentor__list {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.aimentor__item {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  width: 100%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aimentor__item-icon {
  background-color: #dbeafe;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 12px;
  padding-right: 12px;
  display: flex;
  position: relative;
}

.aimentor__item-textcontent {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}

.aimentor__item-title-row {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.aimentor__item-title-rowleft {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.aimentor__item-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.aimentor__item-position {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.aimentor__expertise-con {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.aimentor__expertise-label {
  color: var(--text);
  font-size: 10px;
  line-height: 1.4;
}

.aimentor__expertise-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 4px;
  display: flex;
}

.aimentor__tag {
  color: #111827;
  text-align: center;
  background-color: #f3f4f6;
  border-radius: 2px;
  padding: 1px 5px;
  font-size: 11px;
  line-height: 1.3;
}

.aimentor__btn-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.mentor__rowright {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.sec__sessionprogress {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.sessionprogress__progress {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  display: flex;
}

.sessionprogress__progress-item-label {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  display: flex;
}

.sessionprogress__nextsession {
  background-color: #eff6ff;
  border-radius: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 12px;
  display: flex;
}

.sessionprogress__ns-label {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 500;
  display: flex;
}

.sessionprogress__ns-icon {
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  display: flex;
}

.sessionprogress__ns-data {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.sessionprogress__ns-subtext {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.sec__goals {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  display: flex;
}

.goals__list {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.goals__item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.goals__item-check {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 5px;
  width: 16px;
  height: 16px;
}

.sec__compliance {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.sec__compliancedashboard {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.compliancedb__main {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.compliancedb__main-card {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #f9fafb;
  border-radius: 12px;
  flex-flow: column;
  width: 32%;
  padding: 16px;
  display: flex;
}

.compliancedb__main-card-title {
  font-size: 13px;
  font-weight: 600;
}

.compliancedb__main-card-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.compliancedb__main-card-graphrow {
  justify-content: center;
  align-items: center;
  display: flex;
}

.compliancedb__score-row {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.compliancedb__score-label {
  color: #6b7280;
  justify-content: space-between;
  align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
  display: flex;
}

.compliancedb__score-data {
  color: var(--text);
  font-size: 13px;
  font-weight: 500;
}

.complialert__div {
  flex-flow: column;
  display: flex;
}

.complialert__item {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  background-color: #fff;
  border-radius: 10px;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0000001a;
}

.complialert__icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
  overflow: hidden;
}

.complialert__textdiv {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  display: flex;
}

.complialert__item-hd-text {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.complialert__item-subhd {
  color: var(--text);
  font-size: 10px;
  line-height: 1.2em;
}

.complialert__link-contain {
  justify-content: center;
  align-items: center;
  display: flex;
}

.sec__redactionlogs {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.redlog__table-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.redlag__data-type-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__table-actions-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.u__table-actions {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.sec__securerecordings {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.secrec__card-contain {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.secrec__card {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 32%;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.secrec__cardtop {
  border-bottom: 1px solid #0000001a;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  display: flex;
}

.secrec__card-topleft {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.secrec__card-icon {
  background-color: #dbeafe;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
  position: relative;
}

.secrec__card-textcontent {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.secrec__card-name {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.secrec__card-subtext {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.secrec__card-topright {
  flex-flow: row;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.secrec__tag {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  color: #1d4ed8;
  text-align: center;
  background-color: #eff6ff;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 1px 5px;
  font-size: 12px;
  display: flex;
}

.secrec__tag-icon {
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.secrec__cardbot {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  padding: 10px;
  display: flex;
}

.secrec__card-bot-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.secrec__card-activity-details {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  font-size: 11px;
  display: flex;
}

.secrec__card-activity-details-active {
  color: #16a34a;
}

.secrec__owner {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.secrec__owner-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.secrec__card-control-row {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.secrec__card-control-rowleft {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  display: flex;
}

.secrec__card-control-play {
  background-color: var(--blue-main);
  cursor: pointer;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.secrec__card-control-textcontent {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.secrec__card-duration {
  font-size: 11px;
  line-height: 1.4;
}

.secrec__card-secureplayback {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #16a34a;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.secrec__card-secureplayback-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.secrec__card-action-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.secrec__card-action-icon {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.secrec__progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  align-self: stretch;
  height: 8px;
  position: relative;
}

.secrec__progress-percent {
  background-color: #bfdbfe;
  border-radius: 50px;
  width: 85%;
  position: absolute;
  inset: 0%;
}

.sec__audittrails {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.audtrail__table-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.audtrail-chevron {
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.audtrail__userdiv {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.audtrail__user-icon {
  background-color: #f3f4f6;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding-left: 2px;
  padding-right: 2px;
  display: flex;
}

.audtrail__resource {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.audtrail__resource-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.sec__reportsinsights {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.sec__report-teamperf {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.repteamperf__card-div {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.repteamperf__card {
  background-color: #f9fafb;
  border-radius: 20px;
  flex-direction: column;
  justify-content: center;
  width: 24%;
  padding: 15px;
  display: flex;
}

.sec__agentcomparison {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.agentcomp__table-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.agentcomp__agent {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  display: flex;
}

.agentcomp__agent-icon {
  color: var(--blue-main);
  background-color: #dbeafe;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  padding-left: 2px;
  padding-right: 2px;
  font-weight: 600;
  display: flex;
}

.agentcomp__agent-award-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.agentcomp-progress-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  padding-right: 10px;
  display: flex;
}

.agentcomp-progress {
  background-color: #f1f2f2;
  border-radius: 20px;
  flex: 1;
  height: 8px;
  position: relative;
}

.agentcomp-progress-percent {
  background-color: #c084fc;
  border-radius: 50px;
  width: 85%;
  position: absolute;
  inset: 0%;
}

.agentcomp-progress-percent.bg-green {
  background-color: #22c55e;
}

.agentcomp-progress-percent.bg-blue {
  background-color: #60a5fa;
}

.sec__trendsanalytics {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.trendanalytics__main {
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.trendanalytics__main-card {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #f9fafb;
  border-radius: 12px;
  flex-flow: column;
  width: 32%;
  padding: 16px;
  display: flex;
}

.trendanalytics__main-card-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.trendanalytics__main-card-title {
  font-size: 13px;
  font-weight: 600;
}

.trendanalytics__main-card-graphrow {
  justify-content: center;
  align-items: center;
  display: flex;
}

.sec__exportshare {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.exportshare__main {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.exportshare__col {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #f9fafb;
  border-radius: 12px;
  flex-flow: column;
  width: 49%;
  padding: 16px;
  display: flex;
}

.exportshare__title-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.exportshare__title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.exportshare__subtext {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.exportshare__btn-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.exportshare__configure {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.exportshare__configure-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.exportshare__formblock {
  width: 100%;
  margin-bottom: 0;
}

.exportshare__sharedashboard {
  justify-content: center;
  align-items: center;
  display: flex;
}

.exportshare__sharedashboard-input {
  border: 1px solid #0000001a;
  border-right-style: none;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  height: 45px;
  margin-bottom: 0;
}

.exportshare__sharedashboard-btn {
  background-color: var(--blue-main);
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 45px;
  padding-left: 12px;
  padding-right: 12px;
  display: flex;
}

.exportshare__group {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.exportshare__group-label {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.exportshare__sharewithteam {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #2563eb;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.sec__settings {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.settings__tabs {
  display: flex;
}

.settings__tabsmenu {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  width: 20%;
  padding-right: 12px;
  display: flex;
}

.settings__tabscontent {
  flex: 1;
}

.settings__tablink {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--text);
  background-color: #fff0;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: center;
  padding-left: 12px;
  padding-right: 12px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
}

.settings__tablink.w--current {
  color: var(--blue-lighter);
  background-color: #fff;
  box-shadow: 0 2px 10px #0003;
}

.settings__tablink-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 0;
  display: flex;
}

.sec__usermanagement {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.usermanage__table-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.usermanage__name-div {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 13px;
  display: flex;
}

.usermanage__name-avatar {
  color: var(--blue-main);
  background-color: #dbeafe;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  font-weight: 600;
  display: flex;
}

.usermanage__name {
  font-weight: 500;
}

.usermanage__email {
  font-size: 11px;
}

.sec__rolepermission {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.roleperm__content {
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.roleperm__formblock {
  width: 100%;
  margin-bottom: 0;
}

.roleperm__card {
  border-radius: 12px;
  flex-flow: column;
  width: 32%;
  display: flex;
  overflow: hidden;
  box-shadow: 0 2px 10px #0000001a;
}

.roleperm__card-top {
  background-color: #f9fafb;
  border-bottom: 1px solid #0000001a;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px;
  display: flex;
}

.roleperm__card-title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.roleperm__card-subtitle {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.roleperm__card-bot {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  padding: 10px;
  display: flex;
}

.roleperm__card-bot-title {
  color: #3339;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

.roleperm__list {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.roleperm__item {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.roleperm__item-left {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.roleperm__item-icon {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.roleperm__item-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.roleperm__item-title {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.roleperm__item-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.sec__integratesettings, .integratesettings__content {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.sec__connectedservice {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.connectserv__title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.connectserv__card-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: wrap;
  place-content: flex-start space-between;
  align-items: stretch;
  display: flex;
}

.connectserv__card {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 32%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.connectserv__card-top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.connectserv__card-topleft {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.connectserv__card-logo {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
  position: relative;
}

.connectserv__card-name {
  color: var(--newblack);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2em;
}

.connectserv__card-topright {
  flex-flow: row;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.connectserv__card-tag {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  color: #16a34a;
  text-align: center;
  background-color: #dcfce7;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 1px 5px;
  font-size: 12px;
  display: flex;
}

.connectserv__card-bot {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.connectserv__card-sync {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.connectserv__card-sync-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.sec__apikey {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.apikey__title-div {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.apikey__show {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: var(--blue-lighter);
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.apikey__show-icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
}

.apikey__table-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.sec__usagenotes {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #f9fafb;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.usagenotes__title {
  color: #333;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

.usagenotes__list {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  flex-flow: column;
  width: 100%;
  display: flex;
}

.usagenotes__item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.usagenotes__item-dot {
  background-color: #4b5563;
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.sec__companysettings {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.companysettings__content {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: row;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.companysettings__formblock {
  width: 100%;
  margin-bottom: 0;
}

.companysettings__left {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  width: 65%;
  display: flex;
}

.sec__branding {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.branding__title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.branding__content {
  flex-flow: column;
  place-content: flex-start;
  align-items: stretch;
  display: flex;
}

.u__formcontrol {
  margin-bottom: 10px;
}

.u__fieldlabel {
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 500;
}

.u__textfield {
  border: 1px solid var(--line);
  border-radius: 10px;
  height: 40px;
  margin-bottom: 0;
  font-size: 13px;
}

.branding__companylogo-row {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.branding__companylogo-div {
  background-color: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  width: 200px;
  height: 50px;
}

.u__form-sublabel {
  font-size: 10px;
  line-height: 1.4;
}

.u__form-2-colrow {
  justify-content: space-between;
  display: flex;
}

.u__form-2col {
  width: 49%;
}

.branding__color-select-row {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  display: flex;
}

.branding__color-select {
  border: 1px solid var(--white);
  background-color: var(--blue-main);
  border-radius: 10px;
  flex: none;
  width: 40px;
  height: 40px;
}

.branding__color-select.secondary {
  background-color: #f5f5f5;
}

.sec__compliancepolicies {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.compolicy__title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.compolicy__title-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.compolicy__subtitle {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.compolicy__content {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: wrap;
  place-content: flex-start space-between;
  align-items: stretch;
  display: flex;
}

.compolicy__card {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  width: 49%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.compolicy__card-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.compolicy__card-title {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.compolicy__card-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.companysettings__right {
  flex-flow: column;
  flex: 1;
  display: flex;
}

.sec__dataretention {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  padding: 16px;
  display: flex;
}

.dataret__title-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.dataret__content {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  place-content: flex-start;
  align-items: stretch;
  display: flex;
}

.u__selectfield {
  border: 1px solid var(--line);
  background-color: #fff;
  border-radius: 10px;
  height: 40px;
  margin-bottom: 0;
  font-size: 13px;
}

.dataret__notesdiv {
  color: var(--blue-dark);
  background-color: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px;
  font-size: 11px;
  line-height: 1.4;
  display: flex;
}

.sec__notifiicationpreference {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.notpref__formblock {
  width: 100%;
  margin-bottom: 0;
}

.notpref__content {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.sec__notification {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  width: 100%;
  padding: 16px;
  display: flex;
}

.noti__title-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.noti__title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.noti__subtitle {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.noti__content {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  place-content: flex-start space-between;
  align-items: stretch;
  display: flex;
}

.noti__item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding: 5px 10px;
  display: flex;
}

.noti__item-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.noti__item-right {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.noti__item-title {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.noti__item-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.sec__personalpreferences {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  width: 100%;
  padding: 16px;
  display: flex;
}

.perspref__title-div {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.perspref__title {
  color: #333;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.perspref__subtitle {
  color: var(--text);
  font-size: 12px;
  line-height: 1.2em;
}

.perspref__content {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  place-content: flex-start space-between;
  align-items: stretch;
  display: flex;
}

.perspref__item {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding: 5px 10px;
  display: flex;
}

.prespref__item-textcontent {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.perspref__item-title {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.perspref__item-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.perspref__item-right {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.sec__knowledgehub {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.kh__seach-formblock {
  margin-bottom: 0;
}

.kh__search-formdiv {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.kh__search-input {
  background-image: url('../images/cccx-ch-04.svg');
  background-position: 10px;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  height: 50px;
  margin-bottom: 0;
  padding-left: 40px;
  box-shadow: inset 0 2px 5px #0003, 0 2px 5px #0000001a;
}

.kh__search-tags-div {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 12px;
  display: flex;
}

.kh__search-tag {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: var(--white);
  color: var(--text);
  text-align: center;
  white-space: nowrap;
  border: 1px solid #0000;
  border-radius: 50px;
  justify-content: center;
  align-items: center;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  display: flex;
}

.kh__search-tag.is-active {
  color: var(--blue-dark);
  background-color: #dbeafe;
}

.sec__featureplaybook {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.featurepb__main {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.featurepb__card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: column;
  width: 32%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.featurepb__top {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.featurepb__card-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.featurepb__card-tag {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  color: #1d4ed8;
  text-align: center;
  background-color: #eff6ff;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 1px 5px;
  font-size: 12px;
  display: flex;
}

.featurepb__text {
  font-size: 12px;
  line-height: 1.4;
}

.featurepb__bot {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.featurepb__date {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.featurepb__link {
  color: var(--new-blue1);
  font-size: 12px;
  line-height: 1.4;
  text-decoration: none;
}

.sec__faq {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.faq__main {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.faq__item {
  border-bottom: 1px solid #0000001a;
  flex-flow: column;
  display: flex;
}

.faq__item-top {
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  display: flex;
}

.faq__chevron {
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.faq__question {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.faq__item-bot {
  padding: 10px 10px 10px 20px;
  display: none;
}

.faq__answer {
  font-size: 12px;
  line-height: 1.4;
}

.sec__recommendedforyou {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.recforyou__main {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.recforyou__card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.recforyou__card-left {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.recforyou__card-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.recforyou__card-subtitle {
  font-size: 12px;
  line-height: 1.4;
}

.recforyou__card-tag {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  color: #4b5563;
  text-align: center;
  background-color: #f3f4f6;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 1px 5px;
  font-size: 12px;
  display: flex;
}

.kh__col-row {
  justify-content: space-between;
  display: flex;
}

.kh__col {
  width: 49%;
}

.sec__mostviewed {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.mostviewed__main {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.mostviewed__card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.mostviewed__card-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.mostviewed__card-tag {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  color: #1d4ed8;
  text-align: center;
  background-color: #eff6ff;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 1px 5px;
  font-size: 12px;
  display: flex;
}

.sec__recentlyopened {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.recentlyopened__main {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.recentlyopened__card {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 10px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 12px 10px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.recentlyopened__card-title {
  color: var(--newblack);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2em;
}

.recentlyopened__card-subtitle {
  font-size: 11px;
  line-height: 1.4;
}

.db__visualavatar-row {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.db__visualavatar-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  display: flex;
  position: relative;
}

.db__visualavatar {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.db__visualavatar-bubble {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 16px 24px;
  display: flex;
  position: relative;
  box-shadow: 0 4px 10px #0000000a, -4px -4px 10px #fff6;
}

.db__visualavatar-hd-text {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 25px;
  font-weight: 400;
  line-height: 1.2;
}

.db__visualavatar-bubble-tail {
  background-color: #fff;
  flex: none;
  width: 16px;
  height: 16px;
  position: absolute;
  inset: 26px 98% auto auto;
  transform: rotate(45deg);
  box-shadow: 0 4px 5px -3px #0000001a;
}

.db__visualavatar-voice-icon {
  background-color: #fff;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
  position: absolute;
  inset: auto -6% -6% auto;
  box-shadow: 0 2px 10px #0000001a;
}

.op__visualavatar-div {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.op__progress-div {
  flex-flow: column;
  flex: 1;
  display: flex;
}

.op__visualavatar-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
  display: flex;
  position: relative;
}

.op__visualavatar {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.op__visualavatar-voice-icon {
  background-color: #fff;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
  position: absolute;
  inset: auto -6% -6% auto;
  box-shadow: 0 2px 10px #0000001a;
}

.op__visualavatar-bubble {
  z-index: 2;
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 500px;
  padding: 12px;
  font-size: 13px;
  line-height: 1.2;
  display: none;
  position: absolute;
  top: 115%;
  left: 0%;
  right: auto;
  box-shadow: 0 4px 10px #0000000a, -4px -4px 10px #fff6;
}

.op__visualavatar-bubble-tail {
  background-color: #fff;
  flex: none;
  width: 16px;
  height: 16px;
  position: absolute;
  inset: -6px 459px auto auto;
  transform: rotate(45deg);
  box-shadow: -6px -7px 5px -3px #0000001a;
}

.airoleplay__visualavatar-div {
  flex-flow: column;
  display: flex;
}

.airoleplay__visualavatar-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.airoleplay__visualavatar {
  border-radius: 12px;
  flex: none;
  width: 95%;
  margin-top: 5px;
  margin-bottom: 5px;
  position: relative;
  overflow: hidden;
}

.airoleplay__visualavatar-control-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.airoleplay__visualavatar-control-rowleft {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.airoleplay__visualavatar-mentor-stat {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: #fff;
  background-color: #0003;
  border-radius: 12px;
  justify-content: flex-start;
  align-items: center;
  padding: 4px 5px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  position: absolute;
  inset: auto auto 2% 2%;
}

.airoleplay__visualavatar-mentor-statdot {
  background-color: #22c55e;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.airoleplay__visualavatar-speaking {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: #fff;
  background-color: #0003;
  border-radius: 5px;
  justify-content: flex-start;
  align-items: center;
  width: 25px;
  padding: 4px 5px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  position: absolute;
  inset: auto 2% 2% auto;
}

.sec__ai-rp-livetranslate {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  display: flex;
}

.ai-rp-livetranslate__title-div {
  flex-flow: column;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.ai-rp-livetranslate__title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.ai-rp-livetranslate__body {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  height: 30vh;
  display: flex;
  overflow: auto;
}

.ai-rp-livetranslate__bubble-row {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.ai-rp-livetranslate__bubble-inbound {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-color: #f8f8f8cc;
  border-radius: 12px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 80%;
  padding: 12px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.ai-rp-livetranslate__bubble-time {
  color: #b1b0b0;
  font-size: 10px;
}

.ai-rp-livetranslate__bubble-outbound-row {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}

.ai-rp-livetranslate__bubble-outbound {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-color: #e3f6ff;
  border-radius: 12px;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 80%;
  padding: 12px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.ai-rp-livetranslate__bubble-inbound-ai {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #166534;
  background-color: #dcfce7;
  border-radius: 12px;
  flex-flow: row;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 80%;
  padding: 12px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.ai-rp-livetranslate__bubble-inbound-ai-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.popup__choosementor {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: #6363634d;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  inset: 0%;
}

.cm__card {
  background-color: #fff;
  border-radius: 12px;
  flex-flow: column;
  width: 60%;
  display: flex;
}

.cm__card-top {
  border-bottom: 1px solid #0000001a;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  display: flex;
}

.cm__card-topleft {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.cm__card-title {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2em;
}

.cm__card-subtitle {
  color: var(--text);
  font-size: 11px;
  line-height: 1.4;
}

.u__popup-close {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.cm__card-body {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: stretch;
  max-height: 60vh;
  padding: 20px;
  display: flex;
  overflow: auto;
}

.cm__mentor-card {
  text-align: center;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 32%;
  padding: 16px;
  display: flex;
}

.cm__mentor-card-avatar {
  background-image: url('../images/asg-visualavatar-01.webp');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border: 1px solid #c2c2c2;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  display: flex;
  position: relative;
}

.cm__mentor-card-name {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2em;
}

.cm__mentor-card-name-div {
  text-align: center;
  flex-flow: column;
  margin-top: 12px;
  margin-bottom: 12px;
  display: flex;
}

.cm__mentor-card-name-subtext {
  color: var(--blue-main);
  font-size: 12px;
  line-height: 1.4;
}

.cm__mentor-card-description {
  color: var(--text);
  margin-bottom: 12px;
  font-size: 11px;
  line-height: 1.4;
}

.cm__mentor-card-avatar-play {
  background-color: #0003;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: none;
  position: absolute;
  inset: 0%;
}

.cm__mentor-card-avatar-play-icon {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  display: flex;
}

.aisuggest__visualavatar-row {
  justify-content: center;
  align-items: center;
  display: flex;
}

.aisuggest__visualavatar-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 60%;
  height: 170px;
  display: flex;
  position: relative;
}

.aisuggest__visualavatar {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.aisuggest__visualavatar-voice-icon {
  background-color: #fff;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
  position: absolute;
  inset: auto -6% -6% auto;
  box-shadow: 0 2px 10px #0000001a;
}

.aw__oc-suggestions-item-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.aw__oc-suggestions-item-visual-av-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
  position: relative;
}

.aw__oc-suggestions-item-visual-av-wrap.average {
  width: 80px;
  height: 90px;
}

.aw__oc-suggestions-item-visual-av {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.aw__onboarding-hd-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.aw__onboarding-visual-av-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 90px;
  display: flex;
  position: relative;
}

.aw__onboarding-visual-av {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.aw__onboarding-hd-row-left {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  flex: 1;
  display: flex;
}

.aw__onboarding-visual-av-bubble {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #fff;
  background-image: linear-gradient(#0000004d, #0000000d);
  border: 1px solid #ffffff4d;
  border-top-width: .5px;
  border-radius: 8px;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding: 6px 8px;
  font-size: 10px;
  line-height: 1.4;
  display: flex;
  box-shadow: 0 4px 4px #0003;
}

.aw__idle-perf-tab, .aw__idle-onboard-tab {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: 320px;
  padding-top: 4px;
  display: flex;
}

.aw__idle-script-tab {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  padding-top: 4px;
  display: flex;
}

.aw__idle-knowledge-tab {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: 320px;
  padding-top: 4px;
  display: flex;
}

.aw__practice {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: flex-start;
  display: none;
}

.aw__practice-transcript-col {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  background-image: linear-gradient(#0003, #0000);
  border: 1px solid #fff3;
  border-radius: 8px;
  flex-flow: column;
  width: 280px;
  padding: 8px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.aw__practice-rightcol {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: 200px;
  display: flex;
}

.aw__practice-visualav-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.aw__practice-visualav {
  border-radius: 12px;
  flex: none;
  width: 95%;
  margin-top: 5px;
  margin-bottom: 5px;
  position: relative;
  overflow: hidden;
}

.aw__practice-visualav-mentor-stat {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: #fff;
  background-color: #0003;
  border-radius: 12px;
  justify-content: flex-start;
  align-items: center;
  padding: 4px 5px;
  font-size: 10px;
  line-height: 1.4;
  display: flex;
  position: absolute;
  inset: auto auto 2% 2%;
}

.aw__practice-visualav-mentor-statdot {
  background-color: #22c55e;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.aw__practice-visualav-speaking {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  color: #fff;
  background-color: #0003;
  border-radius: 5px;
  justify-content: flex-start;
  align-items: center;
  width: 25px;
  padding: 4px 5px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
  position: absolute;
  inset: auto 2% 2% auto;
}

.aw__btn-endpractice {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  color: #fff;
  cursor: pointer;
  background-color: #ef4444;
  border-radius: 50px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.aw__practice-visualav-btn-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-end;
  align-items: flex-start;
  display: flex;
  position: absolute;
  inset: 3% 3% auto auto;
}

.aw__practice-visualav-btn {
  cursor: pointer;
  background-color: #0003;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
}

.aw__practice-con-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-image: linear-gradient(#0000004d, #0000001a);
  border-radius: 8px;
  flex-flow: column;
  padding: 8px;
  display: flex;
}

.aw__practice-con-row.isoutbound {
  justify-content: flex-start;
  align-items: flex-end;
}

.aw__practice-con-group {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  max-height: 250px;
  display: flex;
  overflow: auto;
}

.aw__oc-suggestions-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: row;
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.aw__oc-suggestions-visual-av-col {
  flex-flow: column;
  display: flex;
}

.aw__oc-expanded-content-top {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;
}

.aw__oc-expanded-content-topleft {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  width: 320px;
  display: flex;
}

.aw__oc-expanded-content-topright {
  width: 200px;
}

.aw__pc-empathy-row {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.aw__pc-empathy-visual-av-wrap {
  background-image: linear-gradient(180deg, var(--blue-main), var(--new-green));
  border-radius: 12px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
  position: relative;
}

.aw__pc-empathy-visual-av {
  border-radius: 12px;
  width: 90%;
  height: 90%;
  overflow: hidden;
}

.db-admin-gc-left {
  flex-flow: column;
  flex: 1;
  justify-content: center;
  align-items: flex-start;
  padding: 10px 15px;
  display: flex;
}

.sec__livecalls-empty {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 50vh;
  display: flex;
}

.livecallsempty__text {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.sec__dialer {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  flex-flow: column;
  flex: none;
  width: 100%;
  padding: 5px 15px;
  display: flex;
  box-shadow: -4px -4px 10px #fff6, 0 4px 10px #0000001a;
}

.dialer__top {
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.dialer__label-div {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.dialer__label-idle {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.dialer__label-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  display: flex;
}

.dialer__label-col {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.dialer__sublabel {
  color: var(--text);
  font-size: 11px;
  line-height: 1.2em;
}

.dialer__sublabel.is-textgreen {
  color: #16a34a;
  font-weight: 500;
}

.dialer__top-chevron {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
}

.dialer__main {
  display: block;
}

.dialer__label-oncall {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  justify-content: flex-start;
  align-items: center;
  display: none;
}

.dialer__main-div {
  flex-flow: column;
  display: flex;
}

.dialer__field {
  text-align: center;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  height: 45px;
}

.dialer__dialpad-wrap {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
  display: flex;
}

.dialer__dialpad {
  color: #374151;
  text-align: center;
  border: 1px solid #e8e8e8;
  border-radius: 25px;
  justify-content: center;
  align-items: center;
  width: 32%;
  height: 45px;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.dialer__dialpad:hover {
  color: var(--blue-dark);
  background-color: #eef4ff;
}

.dialer__oncall {
  flex-flow: column;
  padding-bottom: 15px;
  display: none;
}

.dialer__oncall-main {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 30px;
  padding-bottom: 30px;
  display: flex;
}

.dialer__oncall-callerimage {
  background-color: #e5e7eb;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  display: flex;
}

.u__icon-code-embed {
  justify-content: center;
  align-items: center;
  display: flex;
}

.dialer__oncall-caller-name {
  text-align: center;
  font-weight: 500;
}

.dialer__oncall-time {
  color: #22c55e;
  font-size: 12px;
}

.dialer__oncall-control-row {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.dialer__control-btn {
  color: #4b5563;
  text-align: center;
  border: 1px solid #e8e8e8;
  border-radius: 25px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 24%;
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.4;
  text-decoration: none;
  display: flex;
}

.dialer__control-btn:hover {
  color: var(--blue-dark);
  background-color: #eef4ff;
}

.dialer__control-btn.is-end {
  color: #ef4444;
}

.dialer__control-btn.is-end:hover {
  background-color: #ffebeb;
}

.dialer__icon-unmute, .dialer__body {
  display: none;
}

.popup__incomingcall {
  border-top: 5px solid var(--new-blue1);
  background-color: #fff;
  border-radius: 12px;
  flex-flow: column;
  width: 300px;
  display: flex;
  position: absolute;
  inset: auto auto 20px 20px;
  box-shadow: 0 2px 13px #0003;
}

.incomingcall__main {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 30px;
  padding-bottom: 30px;
  display: flex;
}

.incomingcall__icon {
  width: 64px;
  height: 64px;
}

.incomingcall__label {
  color: var(--sidebar-bg);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Headland One, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2em;
}

.incomingcall__source {
  color: #6b7280;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.2em;
}

.incomingcall__control-row {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: center;
  align-items: center;
  padding-bottom: 15px;
  display: flex;
}

.incomingcall__close {
  cursor: pointer;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 10px 10px auto auto;
}

.btn_icon-on {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.btn_icon-off {
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: none;
}

.airoleplay__endcall {
  display: none;
}

.signin__form-label {
  color: var(--newblack);
  margin-top: 0;
  margin-bottom: 5px;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
}

.signin__remember-checkfield {
  margin-bottom: 0;
}

.checkbox-text {
  color: #414651;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
}

.signin__formbtn-div {
  grid-row-gap: 16px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.signin__cta-text {
  color: #535862;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
}

.page-wrap-signin {
  background-color: #eef4ff;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  font-family: Inter, sans-serif;
  display: flex;
}

.signin__title {
  color: var(--newblack);
  text-align: center;
  margin-top: 0;
  font-family: Headland One, sans-serif;
  font-size: 30px;
  line-height: 1.3;
  text-decoration: none;
}

.signin__formblock {
  width: 100%;
}

.signin__textfield {
  color: var(--newblack);
  background-color: #fff;
  border: 1px solid #d5d7da;
  border-radius: 12px;
  height: 45px;
  margin-bottom: 0;
  font-size: 14px;
  overflow: hidden;
}

.signin__div {
  grid-row-gap: 24px;
  border-radius: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-decoration: none;
  display: flex;
}

.u__form-row {
  margin-bottom: 20px;
}

.u__form-row.horizontal {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.sec__signin {
  flex-direction: column;
  align-items: center;
  width: 30%;
  display: flex;
}

.signin__form-row-small {
  grid-column-gap: 4px;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  margin-top: 20px;
  text-decoration: none;
  display: flex;
}

.signin__link {
  color: var(--new-blue1);
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
}

.signin__logolink {
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
  display: flex;
}

.signin__title-div {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  text-decoration: none;
  display: flex;
}

.signin__subhd {
  color: #535862;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
}

.video-main-control {
  z-index: 7;
  flex-flow: column;
  justify-content: flex-end;
  align-self: stretch;
  align-items: flex-start;
  padding-bottom: 66px;
  display: flex;
  position: absolute;
  inset: 0% auto 0% -3%;
}

.subtitles-switch {
  border: 1px solid #d4d4d4;
  border-radius: 50%;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  padding: 2%;
  display: flex;
}

.demo-btn-control {
  cursor: pointer;
  background-color: #f2f2f2;
  border-radius: 50px;
  width: 50px;
  height: 50px;
  margin-bottom: 10px;
  padding: 10px;
}

.demo-btn-control:hover {
  background-color: #e4e2e2;
}

.demo-btn-control.mic-off {
  display: none;
}

.demo-btn-control.red {
  background-color: #c1272d;
}

.demo-btn-control.video-off {
  display: none;
}

.demo-sttings-col {
  flex: 0 auto;
  justify-content: center;
  align-items: flex-start;
  width: 57%;
  display: flex;
  position: relative;
}

.tools__tabscontent {
  flex: 1;
}

.text-field-edit-name {
  color: #1a1a1a;
  border-radius: 5px;
  height: 35px;
  margin-bottom: 0;
  font-weight: 500;
}

.language-arrow-down {
  opacity: .9;
  cursor: pointer;
  width: 50px;
  margin-left: auto;
  margin-right: auto;
  display: none;
}

.language-arrow-down:hover {
  opacity: 100;
}

.language-not-set {
  width: 20px;
  height: 20px;
}

.text-translated-language {
  color: #333333fc;
  font-weight: 600;
}

.name-label {
  font-size: 1rem;
}

.avatar-video {
  color: #fff;
  background-color: #363636;
  flex-flow: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
}

.avatar-video.contact {
  background-color: gray;
}

.demo-settings {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 15px;
  flex: 1;
  margin-left: 0;
  padding: 12px 13px 0;
}

.bubble-user {
  color: #fff;
  background-color: #0ea5e9;
  border-radius: 20px 0 20px 20px;
  max-width: 65%;
  padding: 9px 18px;
  box-shadow: 0 0 5px #0000001c;
}

.btn-set-name {
  background-color: var(--blue-dark);
  border-radius: 5px;
  width: 35px;
  height: 35px;
  padding: 8px;
}

.btn-set-name:hover {
  background-color: #483383;
}

.sec__translate {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.pill-control-contact {
  letter-spacing: .1px;
  cursor: pointer;
  background-color: #fff;
  border-radius: 50px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  padding: 5px 7px;
  font-size: .9rem;
  font-weight: 500;
  display: flex;
  box-shadow: 0 0 9px 6px #0000000f;
}

.pill-control-contact:hover {
  background-color: #dad2ee;
}

.pill-control-contact.english {
  color: #fff;
  background-color: #29155f;
}

.pill-control-contact.english.contact {
  color: #000;
  background-color: #fff;
  display: flex;
}

.pill-control-contact.turkish {
  display: none;
}

.pill-control-contact.turkish.contact, .pill-control-contact.portuguese.contact {
  color: #000;
  background-color: #e5e5e5;
  display: none;
}

.pill-control-contact.arabic {
  display: none;
}

.pill-control-contact.arabic.contact, .pill-control-contact.russian.contact, .pill-control-contact.hindi.contact, .pill-control-contact.spanish.contact {
  color: #000;
  background-color: #e5e5e5;
  display: none;
}

.pill-control-contact.german {
  display: none;
}

.pill-control-contact.german.contact {
  color: #000;
  background-color: #e5e5e5;
  display: none;
}

.pill-control-contact.french {
  display: none;
}

.pill-control-contact.french.contact, .pill-control-contact.mandarin.contact {
  color: #000;
  background-color: #e5e5e5;
  display: none;
}

.setting-row {
  flex-flow: wrap;
  justify-content: space-between;
  display: flex;
}

.mobile-language {
  margin-top: 56px;
  display: none;
}

.edit-name-formblock {
  margin-bottom: 0;
}

.settings-select {
  flex: 0 auto;
  width: 47%;
  margin-bottom: 10px;
  margin-left: 3px;
  margin-right: 3px;
}

.demo-controls {
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: 0;
  display: flex;
  position: relative;
}

.demo-transcript {
  z-index: 10;
  flex-flow: column;
  flex: 0 auto;
  width: 410px;
  display: flex;
  position: absolute;
  inset: -120px auto auto 0%;
}

.translation-details {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.bubble-contact-div {
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  margin-top: 10px;
  margin-bottom: 20px;
  display: flex;
}

.room-id-input {
  margin-left: 10px;
}

.text-field {
  color: #353535;
  background-color: #eee;
  border-radius: 50px;
  height: 40px;
  margin-bottom: 0;
  font-size: .9rem;
}

.video-contact {
  flex-flow: column;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  margin-left: 10px;
  padding-bottom: 10px;
  display: flex;
}

.video-main-div {
  border-radius: 25px;
  flex: 0 auto;
  width: 900px;
  height: 350px;
  position: relative;
  overflow: hidden;
}

.video-main-div.contact {
  flex: 0 auto;
  width: 530px;
  height: 380px;
  display: flex;
}

.video-main-div.auto {
  flex: 0 auto;
  width: 400px;
  height: 240px;
  display: flex;
}

.subtitle-switch-inner {
  background-color: #4bd546;
  border-radius: 50%;
  width: 78%;
  height: 78%;
}

.video-demo {
  border-bottom: 1px #b3b3b380;
  justify-content: space-around;
  display: flex;
}

.user-video {
  align-self: stretch;
}

.video-subtitle-div {
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
}

.demo-buttons {
  margin-top: 0;
  margin-left: 10px;
  position: relative;
  top: -23px;
}

.pill-control {
  letter-spacing: .15px;
  cursor: pointer;
  background-color: #fff;
  border-radius: 50px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  padding: 5px 7px;
  font-size: 11px;
  font-weight: 500;
  display: flex;
  box-shadow: 0 0 9px 6px #0000000f;
}

.pill-control:hover {
  background-color: #dad2ee;
}

.pill-control.english {
  color: #fff;
  background-color: #1f2937;
}

.pill-control.arabic, .pill-control.german, .pill-control.turkish, .pill-control.french {
  display: none;
}

.transcript-container {
  background-color: #f1f4f9;
  border-radius: 20px;
  flex: 0 auto;
  align-self: stretch;
  height: 340px;
  margin-top: 10px;
  padding: 10px;
  overflow: auto;
}

.edit-form {
  display: flex;
}

.set-name {
  display: none;
}

.set-name.static {
  cursor: pointer;
  width: 70%;
  display: block;
}

.subtitle {
  color: #fff;
  background-color: #00000094;
  border-radius: 10px;
  width: 80%;
  margin-bottom: 0;
  padding: 7px;
  font-size: 1rem;
}

.subtitle.user {
  width: 90%;
  font-size: 13px;
}

.join-room-button-div {
  margin-left: 10px;
}

.flag {
  justify-content: center;
  align-items: center;
  width: 20px;
  margin-right: 5px;
  display: flex;
}

.flag.us {
  width: 25px;
}

.bubble-contact {
  background-color: #fff;
  border-radius: 0 20px 20px;
  max-width: 70%;
  padding: 9px 18px;
  box-shadow: 0 0 5px #0000001c;
}

.video-subcontrol-subtitle {
  z-index: 3;
  margin-left: -24px;
  display: none;
  position: relative;
  top: -25px;
}

.translated-from-div {
  color: #333333ad;
  justify-content: flex-end;
  align-items: center;
  margin-top: 10px;
  font-size: 11px;
  display: flex;
}

.text-field-edit-name-div {
  flex: 1;
  margin-right: 10px;
}

.avatar-user {
  width: 100px;
  height: 100px;
  margin-bottom: 5px;
}

.language-translation {
  margin-left: 5px;
  display: flex;
}

.tools__tablink {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #4b5563;
  background-color: #fff0;
  border-radius: 8px;
  justify-content: flex-start;
  align-items: center;
  padding-left: 12px;
  padding-right: 12px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
}

.tools__tablink.w--current {
  color: #387df0;
  background-color: #fff;
  box-shadow: 0 2px 10px #0003;
}

.tools__tabs {
  flex: 1;
  display: flex;
}

.demo-settings-div {
  flex: 1;
  margin-left: 20px;
}

.video-subcontrol-language {
  z-index: 3;
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  height: 100%;
  margin-left: -24px;
  display: flex;
  position: relative;
  top: -25px;
}

.pill-icon {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.edit-name {
  margin-right: 10px;
}

.edit-name.form {
  display: none;
}

.tools__tabsmenu {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  width: 15%;
  padding-right: 12px;
  display: flex;
}

.video-subcontrol {
  align-self: stretch;
  margin-left: 0;
  position: absolute;
  inset: 0% -2% auto auto;
}

.video-subcontrol.user {
  z-index: 10;
  position: absolute;
  inset: 0% -4% 0% auto;
}

.language-contact, .language-first-section {
  display: block;
}

.select-field {
  color: #272727;
  background-color: #f3f6ff;
  border: 1px solid #0000000a;
  border-radius: 50px;
  margin-top: 10px;
  padding-left: 35px;
}

.select-field.voice {
  background-image: url('../images/icon-settings-voice.svg');
  background-position: 5px;
  background-repeat: no-repeat;
  background-size: 30px;
}

.select-field.microphone {
  background-image: url('../images/icon-settings-mic.svg');
  background-position: 5px;
  background-repeat: no-repeat;
  background-size: 30px;
}

.select-field.camera {
  background-image: url('../images/icon-camera.svg');
  background-position: 5px;
  background-repeat: no-repeat;
  background-size: 30px;
}

.select-field.speaker {
  background-image: url('../images/icon-settings-speaker.svg');
  background-position: 5px;
  background-repeat: no-repeat;
  background-size: 30px;
}

.video-name-div {
  flex: 1;
}

.video-div {
  z-index: 2;
  flex: 1;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  display: flex;
  position: relative;
}

.pill-main-control {
  color: #fff;
  cursor: pointer;
  background-color: #fff;
  border-radius: 50px;
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px 7px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  box-shadow: 0 0 12px -2px #0000001a;
}

.pill-main-control.subtitle-switch {
  color: #000;
  box-shadow: 0 0 12px -2px #0000005c;
}

.pill-main-control.selected {
  background-color: #2563eb;
}

.pill-icon-main {
  background-color: #fff;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  margin-right: 10px;
  padding: 2px 3px;
}

.p-bubble {
  margin-bottom: 0;
  font-weight: 600;
}

.p-bubble.translated {
  font-size: 12px;
  font-weight: 400;
}

.field-label {
  color: #1f44b3;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2em;
}

.room-id-details {
  display: flex;
}

.contact-info {
  justify-content: space-between;
  align-self: stretch;
  width: 65%;
  margin-left: auto;
  margin-right: auto;
  font-weight: 600;
  display: flex;
}

.contact-info.user, .contact-info.contact {
  justify-content: space-between;
  align-items: center;
  width: 80%;
  height: 35px;
}

.button {
  cursor: pointer;
  background-color: #2563eb;
  border-radius: 50px;
  padding-left: 18px;
  padding-right: 18px;
}

.button:hover {
  background-color: #0ea5e9;
}

.video-you {
  flex-flow: column;
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  margin-right: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.bubble-user-div {
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  margin-top: 10px;
  margin-bottom: 20px;
  display: flex;
}

.language-second-section {
  width: 100%;
  display: none;
}

.room-id-div {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  margin-left: 15px;
  display: flex;
}

.arrow-translation {
  width: 12px;
  margin-right: 5px;
}

.signin__card {
  background-color: #fff;
  border: 1px solid #0000001a;
  border-radius: 12px;
  flex-flow: column;
  width: 100%;
  padding: 20px;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.tools__card {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #fff;
  border: 1px solid #00000014;
  border-radius: 12px;
  flex-flow: column;
  flex: none;
  width: 100%;
  height: 100%;
  padding: 15px;
  display: flex;
  box-shadow: -4px -4px 10px #fff6, 0 4px 10px #0000001a;
}

.sec__tools {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  height: 100%;
  display: flex;
}

.tools__tabpane {
  height: 100%;
}

@media screen and (min-width: 1440px) {
  .card__ps-stat-card-label {
    font-size: .85rem;
  }

  .sidecard-hd-text, .popup-h2, .coaching-item-hd {
    font-size: 1rem;
  }

  .compliprog__statcard-label, .u__stat-card-label, .lcs__active-text, .lcs__lt-label, .progressdb__label, .u__card-top-mini-label, .compliancedb__score-label {
    font-size: .85rem;
  }

  .aisuggest__visualavatar-wrap {
    height: 190px;
  }

  .incomingcall__source {
    font-size: .85rem;
  }

  .pill-control-contact {
    padding: 7px 12px;
    font-size: 1rem;
  }

  .demo-controls {
    margin-bottom: 20px;
  }

  .demo-transcript {
    width: 44%;
  }

  .video-main-div {
    height: 400px;
  }

  .pill-control {
    padding: 7px 12px;
    font-size: 1rem;
  }

  .transcript-container {
    height: 360px;
  }

  .demo-settings-div {
    flex: 0 auto;
    width: 80%;
  }

  .pill-main-control {
    padding: 5px 13px;
    font-size: .9rem;
  }
}

@media screen and (min-width: 1920px) {
  .page-wrapper {
    grid-template-columns: 250px 1fr;
    grid-auto-columns: 270px;
  }

  .sb__content {
    width: 250px;
  }

  .popup-div {
    width: 30%;
  }

  .cni-card {
    height: 86vh;
  }

  .accent-card {
    width: 60%;
  }

  .live-transcription-left {
    width: 260px;
  }

  .lt-body, .coaching-lists {
    height: 80vh;
  }

  .coaching-item-right {
    width: 30%;
  }

  .leaderboard-div {
    justify-content: center;
  }

  .leaderboard-column {
    margin-left: 20px;
    margin-right: 20px;
  }

  .card__ps-call-resolution-rate-div, .teamsnap__tc-item {
    width: 100%;
  }

  .lcs__transcript-row-left {
    width: 12%;
  }

  .calls-side {
    width: 25%;
  }

  .airoleplay__inbox-conleft {
    width: 35%;
  }

  .aisuggest__visualavatar-wrap {
    width: 50%;
    height: 230px;
  }

  .u__form-row {
    margin-bottom: 1.042vw;
  }

  .sec__signin {
    width: 25%;
  }

  .pill-control-contact {
    padding: 12px 17px;
    font-size: 1rem;
  }

  .demo-controls {
    min-height: 30vh;
    margin-bottom: 40px;
  }

  .demo-transcript {
    width: 45%;
  }

  .video-main-div {
    width: 1000px;
    height: 450px;
  }

  .video-main-div.contact {
    width: 680px;
    height: 450px;
  }

  .video-main-div.auto {
    width: 500px;
    height: 300px;
  }

  .pill-control {
    padding: 12px 17px;
    font-size: 1rem;
  }

  .transcript-container {
    height: 370px;
  }

  .demo-settings-div {
    margin-top: 10px;
  }

  .tools__tabsmenu {
    width: 12%;
  }

  .pill-main-control {
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 1rem;
  }

  .signin__card {
    width: 90%;
    padding: 1.042vw;
  }
}

@media screen and (max-width: 991px) {
  .u__togglecheck {
    background-size: 10px 10px;
  }

  .card_translate_body {
    height: 120px;
  }

  .lt-wrap {
    flex-flow: column;
  }

  .dashboardtranslate_centercontrol {
    justify-content: center;
    align-items: center;
    padding-top: 8px;
    padding-bottom: 8px;
    display: flex;
  }

  .sec__signin {
    width: 70%;
  }

  .video-main-control {
    margin-right: -39px;
    inset: auto auto 0% 0%;
  }

  .video-main-control.user {
    margin-right: 0;
  }

  .demo-sttings-col {
    flex-flow: column;
    align-self: stretch;
    width: auto;
    margin-top: 20px;
  }

  .language-not-set {
    filter: brightness(200%);
  }

  .name-label {
    display: none;
  }

  .demo-settings {
    align-self: stretch;
    margin-left: 0;
  }

  .mobile-language {
    flex-flow: column;
    margin-left: -15px;
    display: flex;
    position: absolute;
  }

  .demo-controls {
    flex-flow: column;
  }

  .demo-transcript {
    align-self: stretch;
    width: auto;
    position: static;
  }

  .translation-details {
    margin-right: 10px;
  }

  .translation-details.me {
    margin-right: 0;
  }

  .video-contact {
    position: relative;
  }

  .video-main-div {
    width: 900px;
  }

  .video-main-div.contact {
    border-radius: 10px;
  }

  .video-main-div.auto {
    border-radius: 10px;
    width: 200px;
    height: 120px;
  }

  .video-demo {
    flex-flow: column;
    position: relative;
  }

  .demo-buttons {
    order: -1;
    justify-content: space-between;
    align-self: stretch;
    margin-top: 0;
    display: flex;
    position: static;
    top: 0;
  }

  .subtitle.user {
    display: none;
  }

  .language-details-list.mobile {
    position: static;
  }

  .avatar-user {
    width: 50px;
    height: 50px;
  }

  .demo-settings-div {
    border-top: 1px solid #ebebeb;
    align-self: stretch;
    margin-top: 10px;
    margin-left: 0;
    padding-top: 10px;
  }

  .video-subcontrol-language {
    margin-left: -25px;
    right: -26px;
  }

  .video-subcontrol-language.contact {
    margin-left: 0;
    right: 0;
  }

  .video-subcontrol {
    margin-left: 0;
    inset: 0% 0% auto auto;
  }

  .video-subcontrol.contact {
    inset: 0% auto auto 0%;
  }

  .video-subcontrol.user {
    display: none;
  }

  .video-div.popup {
    justify-content: flex-start;
    align-items: center;
  }

  .pill-main-control.subtitle-switch {
    display: flex;
  }

  .pill-main-control.subtitle-switch.user {
    display: none;
  }

  .contact-info.user {
    z-index: 4;
    justify-content: flex-end;
    align-items: center;
    width: auto;
    height: auto;
    margin-top: 13px;
    margin-bottom: 5px;
    margin-right: 5px;
    display: flex;
    position: absolute;
    inset: 0% 0% auto auto;
  }

  .contact-info.contact {
    z-index: 4;
    justify-content: flex-end;
    align-items: center;
    width: auto;
    height: auto;
    margin-top: 25px;
    margin-bottom: 5px;
    margin-right: 5px;
    display: flex;
    position: absolute;
    inset: 0% 0% auto auto;
  }

  .video-you {
    z-index: 3;
    position: absolute;
    inset: auto 0% 13% auto;
  }

  .arrow-translation {
    filter: brightness(500%);
  }
}

@media screen and (max-width: 767px) {
  .sec__signin {
    width: 90%;
  }

  .demo-settings {
    width: auto;
    margin-top: 20px;
    margin-left: 0;
  }

  .demo-controls {
    flex-flow: column;
  }

  .video-main-div.contact {
    width: 90vw;
    height: 350px;
  }

  .video-main-div.auto {
    width: 150px;
    height: 90px;
  }

  .video-subtitle-div {
    right: 29%;
  }

  .flag.user {
    display: none;
  }

  .avatar-user {
    width: 30px;
    height: 30px;
  }

  .avatar-user.contact {
    width: 60px;
    height: 60px;
  }

  .video-subcontrol-language {
    right: -18px;
  }

  .video-you {
    bottom: 4%;
  }

  .arrow-translation.user {
    display: none;
  }
}

@media screen and (max-width: 479px) {
  .dash_table_col {
    font-size: 12px;
    line-height: 12px;
  }

  .dash-table-row-style1, .dash-table-row-style2 {
    padding-left: 0;
    padding-right: 0;
  }

  .page-wrap-signin {
    align-items: flex-start;
  }

  .sec__signin {
    width: 95%;
    margin-top: 50px;
  }

  .signin__logolink {
    width: 150px;
    margin-top: 1.5vh;
  }

  .video-main-control {
    margin-right: 0;
    padding-bottom: 8px;
    padding-left: 12px;
  }

  .avatar-video {
    flex-flow: row;
    font-size: 10px;
  }

  .avatar-video.contact {
    flex-flow: column;
    font-size: 1rem;
  }

  .setting-row {
    flex-flow: column;
  }

  .settings-select {
    width: auto;
  }

  .room-id-input, .video-contact {
    margin-left: 0;
  }

  .video-main-div {
    height: 250px;
  }

  .video-main-div.contact {
    flex: 1;
    width: auto;
    height: 400px;
  }

  .video-main-div.auto {
    width: 120px;
    height: 70px;
  }

  .user-video {
    width: 100%;
  }

  .video-subtitle-div {
    flex: 0 auto;
    bottom: 16%;
    right: 0%;
  }

  .pill-control {
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 11px;
  }

  .transcript-container {
    height: 500px;
  }

  .subtitle {
    width: 90%;
    margin-bottom: 15px;
    font-size: .8rem;
    line-height: 1.2em;
  }

  .flag {
    width: 15px;
  }

  .flag.us {
    width: 20px;
  }

  .bubble-contact {
    max-width: 80%;
  }

  .avatar-user {
    width: 20px;
    height: 20px;
    margin-bottom: 0;
    margin-right: 5px;
    display: flex;
  }

  .avatar-user.contact {
    margin-bottom: 10px;
    margin-right: 0;
  }

  .video-subcontrol-language {
    margin-right: 3px;
    right: -16px;
  }

  .video-subcontrol-language.contact {
    margin-left: 0;
  }

  .pill-icon {
    width: 15px;
    height: 15px;
    display: flex;
  }

  .video-subcontrol {
    margin-left: 0;
  }

  .video-div {
    flex-flow: row;
  }

  .pill-main-control.subtitle-switch {
    font-size: 14px;
    font-weight: 400;
  }

  .pill-main-control.selected {
    margin-bottom: 5px;
    font-size: 12px;
  }

  .pill-icon-main {
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    display: flex;
  }

  .room-id-div {
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 0;
  }

  .arrow-translation {
    width: 10px;
  }
}

#w-node-_5757709e-0764-fd87-5b3a-1b9c68ac9af7-4eca7955 {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_5757709e-0764-fd87-5b3a-1b9c68ac9af9-4eca7955 {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_5757709e-0764-fd87-5b3a-1b9c68ac9afb-4eca7955 {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-a7f10813-1799-fa99-eb45-bed595714558-4eca7958 {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-a7f10813-1799-fa99-eb45-bed59571455a-4eca7958 {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-a7f10813-1799-fa99-eb45-bed59571456f-4eca7958 {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-_78d96c35-431c-6d98-a649-189c2a8a3460-4eca7959 {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_78d96c35-431c-6d98-a649-189c2a8a3462-4eca7959 {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_78d96c35-431c-6d98-a649-189c2a8a3477-4eca7959 {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-badc2eb3-939c-f39d-4691-c0a069dc98b7-4eca795a {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-badc2eb3-939c-f39d-4691-c0a069dc98b9-4eca795a {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-badc2eb3-939c-f39d-4691-c0a069dc98ce-4eca795a {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-_28a0ede4-5457-b3b3-f9d1-d1071188bcc5-4eca795b {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_28a0ede4-5457-b3b3-f9d1-d1071188bcc7-4eca795b {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_28a0ede4-5457-b3b3-f9d1-d1071188bcdc-4eca795b {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d75-4eca795c {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d77-4eca795c {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d8c-4eca795c {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-_6e2dee2e-2d28-9a88-93e7-f7712ec11da2-4eca795d {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_6e2dee2e-2d28-9a88-93e7-f7712ec11da4-4eca795d {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_6e2dee2e-2d28-9a88-93e7-f7712ec11db9-4eca795d {
  grid-area: 2 / 2 / 3 / 4;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d75-4eca795f {
  grid-area: 1 / 1 / 3 / 2;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d77-4eca795f {
  grid-area: 1 / 2 / 2 / 4;
}

#w-node-_6f17cd54-f29d-fbd9-c4c5-c35fe0de0d8c-4eca795f {
  grid-area: 2 / 2 / 3 / 4;
}


@font-face {
  font-family: 'Lato';
  src: url('../fonts/Lato-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('../fonts/Lato-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('../fonts/Lato-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('../fonts/Lato-Heavy.ttf') format('truetype'), url('../fonts/Lato-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('../fonts/Lato-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}