/* Make clicks pass-through */
#nprogress {
  pointer-events: none;
}

#nprogress .bar {
  background: #29d;

  position: fixed;
  z-index: 1031;
  top: 0;
  left: 0;

  width: 100%;
  height: 2px;
}

/* Fancy blur effect */
#nprogress .peg {
  display: block;
  position: absolute;
  right: 0px;
  width: 100px;
  height: 100%;
  box-shadow: 0 0 10px #29d, 0 0 5px #29d;
  opacity: 1.0;

  -webkit-transform: rotate(3deg) translate(0px, -4px);
      -ms-transform: rotate(3deg) translate(0px, -4px);
          transform: rotate(3deg) translate(0px, -4px);
}

/* Remove these to get rid of the spinner */
#nprogress .spinner {
  display: block;
  position: fixed;
  z-index: 1031;
  top: 15px;
  right: 15px;
}

#nprogress .spinner-icon {
  width: 18px;
  height: 18px;
  box-sizing: border-box;

  border: solid 2px transparent;
  border-top-color: #29d;
  border-left-color: #29d;
  border-radius: 50%;

  -webkit-animation: nprogress-spinner 400ms linear infinite;
          animation: nprogress-spinner 400ms linear infinite;
}

.nprogress-custom-parent {
  overflow: hidden;
  position: relative;
}

.nprogress-custom-parent #nprogress .spinner,
.nprogress-custom-parent #nprogress .bar {
  position: absolute;
}

@-webkit-keyframes nprogress-spinner {
  0%   { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}
@keyframes nprogress-spinner {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


@font-face {
  font-family: 'Sofia';
  src: url("https://app.novatelehealth.com/fonts/Sofia_W03_Regular.ttf") format("truetype"); }

@font-face {
  font-family: 'Sofia';
  src: url("https://app.novatelehealth.com/fonts/Sofia_W03_Light.ttf") format("truetype");
  font-weight: 300; }

@font-face {
  font-family: 'Sofia';
  src: url("https://app.novatelehealth.com/fonts/Sofia_W03_Medium.ttf") format("truetype");
  font-weight: 500; }

@font-face {
  font-family: 'Sofia';
  src: url("https://app.novatelehealth.com/fonts/Sofia_W03_Semi_Bold.ttf") format("truetype");
  font-weight: 600; }

@font-face {
  font-family: 'Sofia';
  src: url("https://app.novatelehealth.com/fonts/Sofia_W03_Bold.ttf") format("truetype");
  font-weight: bold; }

* {
  box-sizing: border-box; }

#nprogress .bar {
  height: 4px !important; }

body {
  margin: 0;
  font-family: 'Sofia', 'sans-serif', 'Roboto';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  body::-webkit-scrollbar {
    width: 4px; }
  body::-webkit-scrollbar-thumb {
    background-color: #c1c4c9; }
  body::-webkit-scrollbar-track {
    background-color: transparent; }

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; }

.nova-table table {
  font-size: 16px; }
  .nova-table table .ant-table-thead > tr > th {
    background-color: transparent;
    color: #25282B;
    border: none; }
  .nova-table table .ant-table-tbody tr:nth-child(odd) td {
    background-color: #F9FAF7; }
  .nova-table table .ant-table-tbody > tr > td {
    border: none;
    color: #52575C; }
    .nova-table table .ant-table-tbody > tr > td a {
      color: #EA0089; }

.nova-table .ant-table-pagination.ant-pagination {
  margin: 30px auto;
  float: none;
  text-align: center; }

.nova-table .ant-pagination-item-active {
  background: #EA0089;
  color: #fff;
  border: none; }
  .nova-table .ant-pagination-item-active a {
    color: #fff; }

.invite-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: auto;
  z-index: 9999;
  height: 100%;
  align-items: center;
  display: flex;
  justify-content: center; }
  .invite-modal .modal-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .invite-modal .modal-header .modal-title {
      font-style: normal;
      font-weight: 500;
      font-size: 20px;
      line-height: 25px;
      color: #29292c;
      margin-left: 20px; }
    .invite-modal .modal-header .close {
      cursor: pointer;
      font-size: 18px; }
  .invite-modal .modal-footer {
    padding: 30px; }
    .invite-modal .modal-footer p {
      font-size: 14px;
      font-weight: 500;
      line-height: 18px; }
    .invite-modal .modal-footer .btn {
      font-size: 14px;
      line-height: 18px;
      border: none;
      box-shadow: none;
      height: 42px;
      border-radius: 4px;
      padding: 0 30px;
      cursor: pointer; }
    .invite-modal .modal-footer .cancel-btn {
      background-color: rgba(125, 136, 142, 0.2);
      color: #25282B;
      font-weight: 600; }
    .invite-modal .modal-footer .cancel-btn:focus {
      outline: none; }

.ant-select-dropdown .ant-select-item-option-selected {
  background-color: rgba(74, 32, 183, 0.2); }

.users-list {
  height: 100vh;
  padding: 50px;
  overflow: auto; }
  .users-list .users-holder {
    background: #FFFFFF;
    box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.14);
    padding: 30px; }
  .users-list h1 {
    color: #25282B;
    font-weight: 600;
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 30px; }
  .users-list .button-container {
    margin-bottom: 20px;
    margin-top: 20px;
    display: flex;
    width: 100%;
    justify-content: center; }
    .users-list .button-container .approve-button {
      font-weight: 600;
      font-size: 14px;
      line-height: 18px;
      background: #EA0089;
      border-radius: 4px;
      color: #FFFFFF;
      cursor: pointer;
      border: none;
      height: 42px;
      width: 203px; }

.dashboard-container {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: auto;
  padding: 50px;
  background-color: #F7F6F4; }
  .dashboard-container .welcome-container {
    text-align: center;
    margin-bottom: 30px; }
    .dashboard-container .welcome-container .title-container {
      font-style: normal;
      font-weight: bold;
      font-size: 32px;
      line-height: 40px;
      color: #29292c; }
  .dashboard-container .main-container {
    width: 1000px;
    height: 521px;
    padding: 40px 0px;
    background-color: white;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.22);
    border-radius: 8px;
    display: flex; }
    .dashboard-container .main-container .queue-container {
      padding: 0px 40px;
      width: 430px;
      height: 100%;
      border-right: 1px solid rgba(0, 0, 0, 0.1);
      display: flex;
      flex-direction: column; }
      .dashboard-container .main-container .queue-container .queue-header {
        font-size: 24px;
        font-weight: 600;
        color: #484848;
        margin-bottom: 20px; }
    .dashboard-container .main-container .invite-container {
      padding: 30px 40px;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center; }
      .dashboard-container .main-container .invite-container .invite-image {
        margin-bottom: 40px; }
      .dashboard-container .main-container .invite-container .invite-note {
        margin-bottom: 0.75rem; }
        .dashboard-container .main-container .invite-container .invite-note span {
          font-style: normal;
          font-size: 16px;
          font-weight: 600;
          line-height: 18px;
          text-align: center;
          color: #52575c; }
      .dashboard-container .main-container .invite-container .copy-link-container {
        width: 100%;
        height: 52px;
        background-color: #f8f8f8;
        border-radius: 4px;
        display: flex;
        justify-content: space-between;
        align-items: center; }
        .dashboard-container .main-container .invite-container .copy-link-container .copy-text {
          padding: 0;
          margin: 0 20px;
          flex: 1;
          font-style: normal;
          font-size: 16px;
          line-height: 20px;
          text-align: center;
          color: #52575c;
          background-color: #f8f8f8;
          border: none;
          text-align: left; }
        .dashboard-container .main-container .invite-container .copy-link-container .copy-link-button {
          display: flex;
          justify-content: center;
          align-items: center;
          width: 87px;
          height: 100%;
          background: #EA0089;
          border-radius: 0px 4px 4px 0px;
          font-style: normal;
          font-weight: 600;
          font-size: 16px;
          line-height: 20px;
          color: #ffffff;
          cursor: pointer; }
        .dashboard-container .main-container .invite-container .copy-link-container .copy-link-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
      .dashboard-container .main-container .invite-container .invite-button-container {
        margin-top: 0.8rem;
        width: 100%;
        height: 52px;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        background-color: #ffffff;
        box-sizing: border-box; }
        .dashboard-container .main-container .invite-container .invite-button-container .text-container {
          display: flex;
          flex-direction: center;
          align-items: center; }
          .dashboard-container .main-container .invite-container .invite-button-container .text-container span.txt {
            font-style: normal;
            font-weight: 600;
            font-size: 16px;
            line-height: 20px;
            color: #52575C; }
          .dashboard-container .main-container .invite-container .invite-button-container .text-container img {
            margin-left: 10px; }
        .dashboard-container .main-container .invite-container .invite-button-container .invite-icons {
          height: 40px;
          width: 40px;
          display: flex;
          justify-content: center;
          align-items: center;
          box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.08);
          border-radius: 8px;
          cursor: pointer; }
          .dashboard-container .main-container .invite-container .invite-button-container .invite-icons .svg-path {
            fill: #29292C; }

.doctor-call-container {
  width: 100vw;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden; }
  .doctor-call-container .left-sidebar {
    width: 72px;
    height: 100%;
    background-color: #424242;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.25); }
    .doctor-call-container .left-sidebar .call-feature-svg {
      fill: white; }
    .doctor-call-container .left-sidebar .logo-container {
      padding: 16px; }
      .doctor-call-container .left-sidebar .logo-container .logo {
        width: 40px;
        height: 40px; }
    .doctor-call-container .left-sidebar .top-icons {
      padding-bottom: 20px;
      margin-top: auto; }
      .doctor-call-container .left-sidebar .top-icons .line-break {
        border-top: 1px solid #666666;
        margin: 0px 20px; }
    .doctor-call-container .left-sidebar .icon-container {
      cursor: pointer;
      padding: 0px 20px; }
    .doctor-call-container .left-sidebar .icon-container:not(:last-child) {
      margin-bottom: 18px; }
    .doctor-call-container .left-sidebar .ant-dropdown {
      left: 80px !important; }
      .doctor-call-container .left-sidebar .ant-dropdown .ant-dropdown-menu {
        background-color: #424242;
        border-radius: 4px;
        padding: 15px 0px; }
        .doctor-call-container .left-sidebar .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item {
          padding: 9px 25px;
          width: 300px;
          font-size: 18px;
          color: white; }
          .doctor-call-container .left-sidebar .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item .call-dropdown-link {
            display: flex;
            align-items: center; }
            .doctor-call-container .left-sidebar .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item .call-dropdown-link .call-feature-svg {
              margin-right: 35px; }
        .doctor-call-container .left-sidebar .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item:hover {
          background-color: #646464; }
    .doctor-call-container .left-sidebar .bottom-icons {
      margin-bottom: 20px; }
    .doctor-call-container .left-sidebar .record-div {
      cursor: pointer;
      background-color: #EA0089;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 51px;
      margin-bottom: 18px; }
    .doctor-call-container .left-sidebar .lock-div {
      background-color: #EA0089;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 51px;
      margin-bottom: 18px;
      position: relative; }
      .doctor-call-container .left-sidebar .lock-div .lock-extension {
        display: none; }
    .doctor-call-container .left-sidebar .lock-div:hover .lock-extension {
      display: block;
      position: absolute;
      left: 100%;
      width: 168px;
      height: 51px;
      background-color: #EA0089;
      color: #ffffff;
      font-size: 14px;
      font-weight: 500;
      display: flex;
      align-items: center;
      justify-content: center; }
  .doctor-call-container .left-sidebar.white {
    background-color: white; }
    .doctor-call-container .left-sidebar.white .call-feature-svg {
      fill: #757575; }
    .doctor-call-container .left-sidebar.white .line-break {
      border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .doctor-call-container .left-sidebar.white .ant-dropdown .ant-dropdown-menu {
      background-color: white; }
      .doctor-call-container .left-sidebar.white .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item {
        color: #757575; }
      .doctor-call-container .left-sidebar.white .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item:hover {
        background-color: #DCDCDC; }
  .doctor-call-container .right-sidebar {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 3; }
    .doctor-call-container .right-sidebar .collapse-icons {
      background-color: #424242;
      width: 72px;
      box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.25); }
      .doctor-call-container .right-sidebar .collapse-icons .icon-container {
        padding: 12px 20px;
        cursor: pointer;
        position: relative; }
      .doctor-call-container .right-sidebar .collapse-icons .number-badge {
        position: absolute;
        top: 15px;
        right: 20px;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background-color: #F2453D;
        color: #ffffff;
        font-size: 9px;
        font-weight: 600;
        display: flex;
        align-items: center;
        justify-content: center; }
      .doctor-call-container .right-sidebar .collapse-icons .icon-container:not(:last-child) {
        border-bottom: 1px solid #666666; }
    .doctor-call-container .right-sidebar .call-feature-svg {
      fill: white; }
    .doctor-call-container .right-sidebar .expanded-items {
      width: 356px;
      height: 100vh;
      background-color: #424242;
      display: flex;
      flex-direction: column;
      box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.25); }
      .doctor-call-container .right-sidebar .expanded-items .expanded-header {
        width: 100%;
        height: 56px;
        padding: 12px 22px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: white;
        border-bottom: 1px solid #303030;
        cursor: pointer; }
        .doctor-call-container .right-sidebar .expanded-items .expanded-header .title {
          display: flex;
          font-size: 16px;
          font-weight: 500;
          align-items: center; }
          .doctor-call-container .right-sidebar .expanded-items .expanded-header .title .call-feature-svg {
            margin-right: 15px; }
      .doctor-call-container .right-sidebar .expanded-items .expanded-header.active {
        border-bottom: none; }
      .doctor-call-container .right-sidebar .expanded-items .expanded-content {
        min-height: 0px;
        flex: 1;
        border-bottom: 1px solid #303030; }
  .doctor-call-container .right-sidebar.white .collapse-icons {
    background-color: white; }
    .doctor-call-container .right-sidebar.white .collapse-icons .icon-container:not(:last-child) {
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .doctor-call-container .right-sidebar.white .call-feature-svg {
    fill: #757575; }
  .doctor-call-container .right-sidebar.white .expanded-items {
    background-color: white; }
    .doctor-call-container .right-sidebar.white .expanded-items .expanded-header {
      color: #29292C;
      border-bottom: 1px solid #F1F1F1; }
    .doctor-call-container .right-sidebar.white .expanded-items .expanded-content {
      border-bottom: 1px solid #F1F1F1; }

.doctor-precall-container {
  min-height: 100vh;
  overflow: auto; }

.spinner-wrapper {
  width: 100vw;
  height: 100vh; }

.settings-container {
  width: 100%;
  flex: 1;
  background-color: #F7F6F4;
  padding: 50px;
  display: flex;
  overflow: auto; }
  .settings-container .settings-sidebar {
    width: 230px; }
    .settings-container .settings-sidebar .settings-nav {
      cursor: pointer; }
    .settings-container .settings-sidebar .settings-header {
      font-weight: 600;
      font-size: 16px;
      color: #333333;
      margin-bottom: 25px; }
    .settings-container .settings-sidebar .settings-header::before {
      content: "";
      display: inline-block;
      width: 10px;
      height: 10px;
      vertical-align: middle;
      margin-right: 10px; }
    .settings-container .settings-sidebar .settings-nav {
      font-size: 16px;
      color: #7E7E7E;
      margin-bottom: 25px;
      display: flex;
      align-items: center; }
    .settings-container .settings-sidebar .settings-nav::before {
      content: "";
      display: inline-block;
      width: 10px;
      height: 10px;
      vertical-align: middle;
      margin-right: 10px; }
    .settings-container .settings-sidebar .settings-nav.active {
      color: #F55004; }
    .settings-container .settings-sidebar .settings-nav.active::before {
      content: "";
      display: inline-block;
      width: 10px;
      height: 10px;
      margin-right: 10px;
      background: #F55004;
      vertical-align: middle; }
  .settings-container .settings-main-content {
    flex: 1;
    background-color: white;
    padding: 40px; }
    .settings-container .settings-main-content .settings-header {
      margin-bottom: 40px; }
      .settings-container .settings-main-content .settings-header .title {
        font-weight: 500;
        font-size: 18px;
        color: #29292C;
        margin-bottom: 4px; }
      .settings-container .settings-main-content .settings-header .sub-title {
        font-size: 12px;
        color: #67676E; }
      .settings-container .settings-main-content .settings-header .checker {
        margin-top: 15px; }
        .settings-container .settings-main-content .settings-header .checker .ant-checkbox-wrapper span {
          font-size: 12px;
          color: #67676E; }
        .settings-container .settings-main-content .settings-header .checker .ant-checkbox-wrapper .ant-checkbox:hover .ant-checkbox-inner {
          border-color: #4A20B7; }
        .settings-container .settings-main-content .settings-header .checker .ant-checkbox-wrapper .ant-checkbox-checked .ant-checkbox-inner {
          background-color: #4A20B7;
          border-color: #4A20B7; }
    .settings-container .settings-main-content .settings-form {
      display: flex;
      flex-direction: column; }
      .settings-container .settings-main-content .settings-form .form-item-container {
        width: 655px; }
        .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item {
          height: 70px;
          width: 100%;
          margin-bottom: 0px; }
          .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-label {
            width: 295px;
            text-align: left;
            font-size: 14px;
            font-weight: 500;
            color: #29292C; }
          .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control {
            width: 360px;
            position: relative; }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-form-item-explain {
              text-align: right; }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-select-selector {
              border-radius: 4px;
              background-color: #F8F8F8;
              height: 40px;
              border: none;
              color: #29292C;
              font-size: 14px;
              border: none; }
              .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-select-selector .ant-select-selection-item {
                padding-top: 5px;
                padding-left: 10px;
                vertical-align: middle; }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-select-focused {
              border-radius: 4px;
              border-color: rgba(74, 32, 183, 0.8);
              -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
              box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .custom-input {
              width: 100%;
              border-radius: 4px;
              background-color: #F8F8F8;
              height: 40px;
              border: none;
              color: #29292C;
              font-size: 14px; }
              .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .custom-input::placeholder {
                font-size: 13px;
                color: rgba(103, 103, 110, 0.6); }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .custom-input:focus {
              -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
              box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-input {
              border-radius: 4px;
              background-color: #F8F8F8;
              height: 40px;
              border: none;
              padding: 10px 20px;
              color: #29292C;
              font-size: 14px; }
              .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-input::placeholder {
                font-size: 13px;
                color: rgba(103, 103, 110, 0.6); }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-input:focus {
              -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
              box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-switch {
              position: relative;
              left: 50px; }
              .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-switch .ant-switch-inner {
                position: relative;
                right: 50px;
                font-size: 14px;
                color: #67676E;
                transition: none;
                margin: 0px; }
            .settings-container .settings-main-content .settings-form .form-item-container .ant-form-item .ant-form-item-control .ant-switch.ant-switch-checked {
              background: #33BC28; }
        .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item {
          height: 70px;
          width: 100%;
          margin-bottom: 0px;
          display: flex; }
          .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item .custom-form-label {
            width: 255px;
            text-align: left;
            font-size: 14px;
            font-weight: 500;
            color: #29292C; }
          .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item .custom-form-control {
            width: 360px;
            font-size: 14px;
            color: #67676E; }
            .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item .custom-form-control a {
              color: #EA0089;
              cursor: pointer; }
            .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item .custom-form-control .link {
              cursor: pointer;
              color: #EA0089; }
            .settings-container .settings-main-content .settings-form .form-item-container .custom-form-item .custom-form-control .disabled {
              color: grey;
              cursor: not-allowed; }
        .settings-container .settings-main-content .settings-form .form-item-container .upgrade-container {
          border: 0.5px solid #EA0089;
          border-radius: 4px;
          height: 54px;
          font-size: 14px;
          color: #67676E;
          display: flex;
          padding: 0px 10px;
          align-items: center;
          justify-content: center; }
          .settings-container .settings-main-content .settings-form .form-item-container .upgrade-container a {
            text-align: center;
            font-size: 14px;
            color: #EA0089; }
      .settings-container .settings-main-content .settings-form .button-container {
        display: flex;
        width: 100%; }
        .settings-container .settings-main-content .settings-form .button-container .update-button {
          margin-left: auto;
          background-color: #EA0089;
          border-radius: 4px;
          font-weight: 600;
          font-size: 14px;
          color: white;
          border: none;
          width: 129px;
          height: 42px;
          cursor: pointer; }
        .settings-container .settings-main-content .settings-form .button-container .delete-button {
          margin-left: auto;
          background-color: #ff4d4f;
          border-radius: 4px;
          font-weight: 600;
          font-size: 14px;
          color: white;
          border: none;
          width: 129px;
          height: 42px;
          cursor: pointer; }
        .settings-container .settings-main-content .settings-form .button-container .delete-button:focus {
          background-color: rgba(255, 77, 79, 0.7); }
        .settings-container .settings-main-content .settings-form .button-container .delete-button:hover {
          background-color: rgba(255, 77, 79, 0.7); }
        .settings-container .settings-main-content .settings-form .button-container .update-button:focus {
          outline: none; }
        .settings-container .settings-main-content .settings-form .button-container .update-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
    .settings-container .settings-main-content .settings-modal-backdrop {
      position: fixed;
      top: 0px;
      left: 0px;
      width: 100vw;
      height: 100vh;
      background-color: rgba(0, 0, 0, 0.2);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 1; }
      .settings-container .settings-main-content .settings-modal-backdrop .settings-modal {
        z-index: 2;
        background-color: white;
        border-radius: 6px;
        width: 619px; }
        .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-header {
          font-weight: 500;
          font-size: 20px;
          color: #29292C;
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 20px;
          height: 65px;
          border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
          .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-header span {
            font-size: 14px;
            color: #67676E;
            cursor: pointer; }
        .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content {
          padding: 30px 20px; }
          .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item {
            height: 70px;
            width: 100%;
            margin-bottom: 0px; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item .ant-form-item-label {
              width: 220px;
              text-align: left;
              font-size: 14px;
              font-weight: 500;
              color: #29292C; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item .ant-form-item-explain {
              text-align: right; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item .ant-input {
              border-radius: 4px;
              background-color: #F8F8F8;
              height: 40px;
              border: none;
              padding: 10px 20px;
              color: #29292C;
              font-size: 14px; }
              .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item .ant-input::placeholder {
                font-size: 13px;
                color: rgba(103, 103, 110, 0.6); }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .ant-form-item .ant-input:focus {
              -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
              box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
          .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .button-container {
            display: flex;
            width: 100%; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .button-container .update-button {
              margin-left: auto;
              background-color: #EA0089;
              border-radius: 4px;
              font-weight: 600;
              font-size: 14px;
              color: white;
              border: none;
              width: 129px;
              height: 42px;
              cursor: pointer; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .button-container .update-button:focus {
              outline: none; }
            .settings-container .settings-main-content .settings-modal-backdrop .settings-modal .settings-modal-content .button-container .update-button:hover {
              background-color: rgba(234, 0, 137, 0.8); }

.landing-container {
  display: flex;
  width: 100vw;
  height: 100vh;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 20px; }
  .landing-container .landing-info {
    font-weight: bold;
    color: #29292C; }
    .landing-container .landing-info .landing-title {
      font-size: 26px; }
    .landing-container .landing-info .landing-subtitle {
      font-size: 16px; }
      .landing-container .landing-info .landing-subtitle .more-info {
        margin-left: 10px; }
    .landing-container .landing-info .landing-rows {
      margin-bottom: 30px; }
  .landing-container .help-link {
    font-weight: bold;
    font-size: 16px;
    color: #EA0089; }
  .landing-container .input-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center; }
    .landing-container .input-container .input-box {
      background: #F8F8F8;
      border: 1px solid #CECECE;
      box-sizing: border-box;
      border-radius: 4px;
      padding: 17px 24px;
      width: 100%;
      height: 54px;
      color: #52575C;
      font-size: 16px;
      font-weight: 600;
      margin-bottom: 24px; }
      .landing-container .input-container .input-box::placeholder {
        font-size: 16px;
        font-weight: 600;
        color: #A0A5B8; }
    .landing-container .input-container .input-box:focus {
      outline-color: rgba(234, 0, 137, 0.8); }
    .landing-container .input-container .checkin-button {
      background-color: #EA0089;
      border-radius: 4px;
      width: 100%;
      height: 54px;
      color: white;
      font-weight: bold;
      font-size: 16px;
      border: none;
      margin-bottom: 40px; }
    .landing-container .input-container .checkin-button:focus {
      outline: none; }
    .landing-container .input-container .checkin-button:hover {
      background-color: rgba(234, 0, 137, 0.8); }

@media (min-width: 768px) {
  .landing-container .landing-info .landing-title {
    font-size: 48px; }
  .landing-container .landing-info .landing-subtitle {
    font-size: 26px; }
  .landing-container .landing-info .landing-rows {
    margin-bottom: 40px; }
  .landing-container .help-link {
    font-size: 20px; }
  .landing-container .input-container {
    flex-direction: row;
    width: 40%; }
    .landing-container .input-container .input-box {
      width: 75%;
      margin-right: 10px; }
    .landing-container .input-container .checkin-button {
      width: 25%; } }

.signup-container {
  display: flex; }
  .signup-container .reset-spinner-container {
    height: 100vh;
    width: 100vw; }
  .signup-container .side-image {
    display: none; }
  .signup-container .main-content-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 60px;
    background-color: #f4f6f5; }
    .signup-container .main-content-container .main-image {
      display: flex;
      flex-direction: column;
      justify-content: center; }
    .signup-container .main-content-container .form-container {
      margin-top: 3.3125rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; }
      .signup-container .main-content-container .form-container .signup-title {
        font-style: normal;
        font-weight: bold;
        font-size: 32px;
        line-height: 25px;
        color: #3e3d44; }
      .signup-container .main-content-container .form-container .signup-form-container {
        margin-top: 2.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center; }
        .signup-container .main-content-container .form-container .signup-form-container .input-container {
          margin-bottom: 1.2rem;
          width: 80%; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container input {
            border: 1px solid #dbdbdb;
            box-sizing: border-box;
            border-radius: 4px;
            height: 55px;
            font-size: 18px; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-input:focus {
            outline: none;
            -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
            box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .input-container .checkbox {
            margin-top: 1.875rem; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper .checkbox-text {
            font-weight: 600;
            font-size: 16px;
            line-height: 20px;
            color: #a0a4a8; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper .ant-checkbox:hover .ant-checkbox-inner {
            border-color: #4A20B7; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper .ant-checkbox-checked .ant-checkbox-inner {
            background-color: #4A20B7;
            border-color: #4A20B7; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select {
            width: 100%; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selector {
              border: 1px solid #dbdbdb;
              box-sizing: border-box;
              border-radius: 4px;
              height: 55px; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selection-item {
              display: flex;
              align-self: center;
              font-size: 18px; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select-focused {
            outline: none;
            -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
            box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
            border-radius: 4px; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .submit-button {
            width: 100%;
            cursor: pointer;
            background: #4A20B7;
            border-radius: 4px;
            height: 55px;
            border: none;
            font-weight: bold;
            font-size: 16px;
            line-height: 20px;
            color: white; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .submit-button:focus {
            outline: none; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .forgot-password-container {
            display: flex;
            justify-content: center;
            align-items: center; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .forgot-password-container .forgot-pass-text {
              font-weight: 500;
              font-size: 16px;
              line-height: 20px;
              color: #4A20B7;
              cursor: pointer; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .or-text-container {
            display: flex;
            justify-content: space-between;
            align-items: center; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .or-text-container .or-text {
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              text-align: center;
              color: #a0a4a8; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .or-text-container .hr {
              width: 210px;
              height: 0px;
              border: 1px solid rgba(0, 0, 0, 0.1); }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .login-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 55px;
            background: #ffffff;
            border: 1px solid #dbdbdb;
            box-sizing: border-box;
            border-radius: 4px;
            cursor: pointer; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .login-container .google-login-text {
              margin-left: 0.625rem;
              height: 100%;
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              color: #ff7c7c; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .login-container .facebook-login-text {
              margin-left: 0.625rem;
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              color: #3d5b96; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container {
            text-align: center;
            margin-top: 2rem; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container .sign-in-text {
              font-weight: 600;
              font-size: 16px;
              line-height: 20px;
              color: #a0a4a8; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container .sign-in-text a {
                color: #EA0089; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container span.form-err {
            display: flex;
            justify-content: flex-end;
            color: tomato;
            font-weight: 500;
            font-size: 12px; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container span.form-room-check-red {
            display: flex;
            justify-content: flex-end;
            color: tomato;
            font-weight: 500;
            font-size: 12px; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container span.form-room-check-green {
            display: flex;
            justify-content: flex-end;
            color: green;
            font-weight: 500;
            font-size: 12px; }

@media (min-width: 768px) and (max-width: 1135px) {
  .signup-container {
    display: flex;
    height: 100vh; }
    .signup-container .side-image {
      display: block;
      height: 100%;
      width: 40%;
      background-position: top;
      background-size: cover;
      background-image: url("https://app.novatelehealth.com/assets/Nova_Login_Image.png"); }
    .signup-container .main-content-container {
      width: 60%;
      height: 100%;
      overflow: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      background-color: #ffffff;
      padding: 60px 10px 0 10px;
      scrollbar-color: slategrey #FBFCFB;
      scrollbar-width: thin; }
      .signup-container .main-content-container::-webkit-scrollbar {
        width: 4px; }
      .signup-container .main-content-container::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .signup-container .main-content-container::-webkit-scrollbar-track {
        background-color: #FBFCFB; }
      .signup-container .main-content-container .form-container {
        margin-top: 3.3125rem;
        width: 460px;
        display: block; }
        .signup-container .main-content-container .form-container .signup-title {
          font-style: normal;
          font-weight: bold;
          font-size: 32px;
          line-height: 40px;
          color: #3e3d44; }
        .signup-container .main-content-container .form-container .signup-form-container {
          margin-top: 2.5rem; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container {
            width: 460px;
            margin-bottom: 1.2rem; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container input {
              border: 1px solid #dbdbdb;
              box-sizing: border-box;
              border-radius: 4px;
              height: 55px;
              font-size: 18px; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .input-container .checkbox {
              margin-top: 1.875rem; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper {
              width: 460px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper .checkbox-text {
                font-weight: 600;
                font-size: 16px;
                line-height: 20px;
                color: #a0a4a8; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select {
              width: 460px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selector {
                border: 1px solid #dbdbdb;
                box-sizing: border-box;
                border-radius: 4px;
                height: 55px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selection-item {
                display: flex;
                align-self: center;
                font-size: 18px; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .submit-button {
              background: #4A20B7;
              border-radius: 4px;
              cursor: pointer;
              width: 460px;
              height: 55px;
              border: none;
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              color: white; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container {
              text-align: center;
              margin-top: 2rem; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container .sign-in-text {
                font-weight: 600;
                font-size: 16px;
                line-height: 20px;
                color: #a0a4a8; }
                .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container .sign-in-text a {
                  color: #EA0089; } }

@media screen and (min-width: 1136px) {
  .signup-container {
    height: 100vh;
    display: flex; }
    .signup-container .side-image {
      display: block;
      height: 100%;
      width: 40%;
      background-position: top;
      background-size: cover;
      background-image: url("https://app.novatelehealth.com/assets/Nova_Login_Image.png"); }
    .signup-container .main-content-container {
      width: 60%;
      height: 100%;
      overflow: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      background-color: #ffffff;
      scrollbar-color: slategrey #FBFCFB;
      scrollbar-width: thin; }
      .signup-container .main-content-container::-webkit-scrollbar {
        width: 4px; }
      .signup-container .main-content-container::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .signup-container .main-content-container::-webkit-scrollbar-track {
        background-color: #FBFCFB; }
      .signup-container .main-content-container .form-container {
        margin-top: 3.3125rem;
        width: 460px;
        display: block; }
        .signup-container .main-content-container .form-container .signup-title {
          font-style: normal;
          font-weight: bold;
          font-size: 32px;
          line-height: 40px;
          color: #3e3d44; }
        .signup-container .main-content-container .form-container .signup-form-container {
          margin-top: 2.5rem; }
          .signup-container .main-content-container .form-container .signup-form-container .input-container {
            width: 460px;
            margin-bottom: 1.2rem; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container input {
              border: 1px solid #dbdbdb;
              box-sizing: border-box;
              border-radius: 4px;
              height: 55px;
              font-size: 18px; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .input-container .checkbox {
              margin-top: 1.875rem; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper {
              width: 460px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-checkbox-wrapper .checkbox-text {
                font-weight: 600;
                font-size: 16px;
                line-height: 20px;
                color: #a0a4a8; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select {
              width: 460px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selector {
                border: 1px solid #dbdbdb;
                box-sizing: border-box;
                border-radius: 4px;
                height: 55px; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .ant-select .ant-select-selection-item {
                display: flex;
                align-self: center;
                font-size: 18px; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .submit-button {
              background: #4A20B7;
              border-radius: 4px;
              cursor: pointer;
              width: 460px;
              height: 55px;
              border: none;
              font-weight: bold;
              font-size: 16px;
              line-height: 20px;
              color: white; }
            .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container {
              text-align: center;
              margin-top: 2rem; }
              .signup-container .main-content-container .form-container .signup-form-container .input-container .sign-in-text-container .sign-in-text {
                font-weight: 600;
                font-size: 16px;
                line-height: 20px;
                color: #a0a4a8; } }

.forgot-password-backdrop {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10; }

.forgot-password-modal {
  z-index: 10;
  background-color: white;
  width: 400px;
  height: 250px;
  padding: 25px;
  position: fixed;
  top: 40%;
  left: 40%; }
  .forgot-password-modal .title {
    font-style: normal;
    font-weight: bold;
    font-size: 26px;
    color: #3e3d44;
    margin-bottom: 15px; }
  .forgot-password-modal input {
    border: 1px solid #dbdbdb;
    box-sizing: border-box;
    border-radius: 4px;
    height: 55px;
    font-size: 18px; }
  .forgot-password-modal .ant-input:focus {
    outline: none;
    -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
    box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
    border: none; }
  .forgot-password-modal .ant-input:hover {
    outline: none;
    border: none;
    -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
    box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
  .forgot-password-modal .button-container {
    width: 100%;
    margin-top: 20px; }
    .forgot-password-modal .button-container .submit-button {
      width: 100%;
      cursor: pointer;
      background: #4A20B7;
      border-radius: 4px;
      height: 55px;
      border: none;
      font-weight: bold;
      font-size: 16px;
      line-height: 20px;
      color: white; }
    .forgot-password-modal .button-container .submit-button:focus {
      outline: none; }

.force-logout-modal {
  z-index: 10;
  background-color: white;
  width: 400px;
  height: 250px;
  padding: 25px;
  position: fixed;
  top: 40%;
  left: 40%;
  display: flex;
  flex-direction: column;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }
  .force-logout-modal .device-details {
    font-size: 18px;
    color: #3e3d44; }
  .force-logout-modal .button-container {
    width: 100%;
    margin-top: auto;
    display: flex;
    justify-content: space-between; }
    .force-logout-modal .button-container .submit-button {
      width: 40%;
      cursor: pointer;
      background: #4A20B7;
      border-radius: 4px;
      height: 55px;
      border: none;
      font-weight: bold;
      font-size: 16px;
      line-height: 20px;
      color: white; }
    .force-logout-modal .button-container .submit-button:focus {
      outline: none; }
    .force-logout-modal .button-container .cancel-button {
      font-size: 14px;
      cursor: pointer;
      font-weight: bold;
      background-color: #f1f1f1;
      border: none;
      width: 40%;
      padding: 16px;
      border-radius: 4px; }
    .force-logout-modal .button-container .cancel-button:outline {
      outline: none; }

@media (max-width: 768px) {
  .forgot-password-modal {
    width: 90%;
    top: 30%;
    left: 5%; } }

.patient-meeting-container {
  min-height: 100vh;
  overflow: auto; }
  .patient-meeting-container .spinner-wrapper {
    height: 100vh;
    width: 100vw; }

.calendar-invite-modal-container {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  height: 600px;
  min-height: 600px;
  max-height: 600px;
  width: 50%;
  border-radius: 6px;
  z-index: 11;
  background-color: white;
  display: flex;
  flex-direction: column; }
  .calendar-invite-modal-container .calendar-invite-modal-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .calendar-invite-modal-container .calendar-invite-modal-header .calendar-invite-modal-title {
      font-style: normal;
      font-weight: 500;
      font-size: 20px;
      line-height: 25px;
      color: #29292c;
      margin-left: 20px; }
    .calendar-invite-modal-container .calendar-invite-modal-header .close {
      cursor: pointer;
      font-size: 18px; }
    .calendar-invite-modal-container .calendar-invite-modal-header .svg-path {
      fill: #29292C; }
  .calendar-invite-modal-container .calendar-invite-main-modal {
    padding: 20px;
    overflow: auto;
    flex: 1;
    scrollbar-color: slategrey white;
    scrollbar-width: thin; }
    .calendar-invite-modal-container .calendar-invite-main-modal::-webkit-scrollbar {
      width: 4px; }
    .calendar-invite-modal-container .calendar-invite-main-modal::-webkit-scrollbar-thumb {
      background-color: darkgrey; }
    .calendar-invite-modal-container .calendar-invite-main-modal::-webkit-scrollbar-track {
      background-color: white; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .form-labels {
      font-style: normal;
      font-weight: 500;
      font-size: 18px;
      line-height: 23px;
      color: #67676E; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .form-labels:first-child {
      margin-top: 0; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .form-inputs {
      margin-top: 1rem;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .form-inputs .input {
        margin-bottom: 1.2rem;
        border: 1px solid #dbdbdb;
        background: #F4F6F5;
        padding: 16px;
        box-sizing: border-box;
        border-radius: 4px;
        height: 55px;
        font-size: 14px;
        font-weight: 500;
        color: #52575C; }
        .calendar-invite-modal-container .calendar-invite-main-modal .form .form-inputs .input::placeholder {
          font-size: 14px;
          color: #828282;
          font-weight: 600; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .form-inputs .input:focus {
        outline: none;
        -webkit-box-shadow: none;
        box-shadow: none; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .note {
      margin-top: 1rem;
      border-radius: 4px;
      font-size: 14px;
      color: #52575C;
      border: none; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .note .note-textarea {
        width: 100%;
        height: 100px;
        border-radius: 4px;
        background: #f8f8f8;
        padding: 1.25rem;
        border: 1px solid #dbdbdb;
        scrollbar-color: slategrey white;
        scrollbar-width: thin; }
        .calendar-invite-modal-container .calendar-invite-main-modal .form .note .note-textarea::-webkit-scrollbar {
          width: 4px; }
        .calendar-invite-modal-container .calendar-invite-main-modal .form .note .note-textarea::-webkit-scrollbar-thumb {
          background-color: darkgrey; }
        .calendar-invite-modal-container .calendar-invite-main-modal .form .note .note-textarea::-webkit-scrollbar-track {
          background-color: white; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .note .note-textarea:focus {
        outline: none; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container {
      margin-bottom: 1.2rem;
      display: flex;
      flex-wrap: wrap;
      background: #F4F6F5;
      height: 40px;
      overflow: auto;
      scrollbar-color: slategrey white;
      scrollbar-width: thin;
      justify-content: center;
      align-content: space-between;
      padding: 6px 20px; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container::-webkit-scrollbar {
        width: 4px; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container::-webkit-scrollbar-track {
        background-color: white; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container .tag-input {
        width: 30%;
        max-width: 50%;
        border-radius: 52px;
        height: 27px;
        color: #EA0089;
        font-size: 12px;
        border: 0.8px solid #EA0089; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container .tag-input:focus {
        outline: none;
        border: 0.8px solid #EA0089;
        -webkit-box-shadow: 0 0 0 2px #EA0089;
        box-shadow: none; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container .ant-tag {
        border: 0.8px solid #EA0089;
        border-radius: 52px;
        height: 27px;
        color: #EA0089; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container .site-tag-plus {
        font-size: 12px;
        display: flex;
        align-items: center; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .tag-container .edit-tag {
        font-size: 12px;
        display: flex;
        align-items: center; }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .date-container {
      margin-bottom: 1.2rem; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .date-container .date-header {
        margin-bottom: 10px; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .date-container .ant-picker {
        background: #F4F6F5; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .date-container .ant-picker-focused {
        outline-color: rgba(234, 0, 137, 0.8);
        border: 0.8px solid rgba(234, 0, 137, 0.8);
        box-shadow: none; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .date-container .ant-picker:hover {
        border: 0.8px solid rgba(234, 0, 137, 0.8); }
    .calendar-invite-modal-container .calendar-invite-main-modal .form .timezone-container .ant-select {
      width: 100%;
      margin-bottom: 1.2rem;
      border: 1px solid #dbdbdb;
      background: #F4F6F5;
      box-sizing: border-box;
      border-radius: 4px;
      height: 55px;
      font-size: 14px;
      color: #52575C; }
      .calendar-invite-modal-container .calendar-invite-main-modal .form .timezone-container .ant-select .ant-select-selector {
        border: none;
        height: 100%;
        background-color: transparent; }
        .calendar-invite-modal-container .calendar-invite-main-modal .form .timezone-container .ant-select .ant-select-selector .ant-select-selection-item {
          padding-top: 10px;
          padding-bottom: 10px; }
  .calendar-invite-modal-container .calendar-invite-modal-footer {
    padding: 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .calendar-invite-modal-container .calendar-invite-modal-footer .buttons {
      display: flex;
      justify-content: flex-start;
      flex-direction: row-reverse; }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons button {
        border: none;
        cursor: pointer; }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .send-link-btn {
        padding: 0 8px;
        height: 42px;
        background-color: white;
        border-radius: 4px;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        color: #EA0089;
        border: 1px solid #EA0089; }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .cancel-btn {
        height: 42px;
        padding: 0 8px;
        background: rgba(125, 136, 142, 0.2);
        border-radius: 4px;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 18px;
        color: #25282b; }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .send-link-btn:hover {
        background-color: rgba(250, 250, 250, 0.8); }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .cancel-btn:hover {
        background: rgba(125, 136, 142, 0.8); }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .send-link-btn:focus {
        outline-color: rgba(234, 0, 137, 0.8); }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons .cancel-btn:focus {
        outline-color: rgba(125, 136, 142, 0.8); }
      .calendar-invite-modal-container .calendar-invite-modal-footer .buttons button:last-child {
        margin-right: 8px; }

.unsupported-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 15px; }
  .unsupported-container .unsupported-content {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: white;
    padding: 25px; }
    .unsupported-container .unsupported-content .image {
      margin-bottom: 20px; }
    .unsupported-container .unsupported-content .title {
      font-size: 30px;
      color: #D7615F;
      margin-bottom: 20px; }
    .unsupported-container .unsupported-content .subtitle {
      font-size: 18px;
      color: #29292C;
      margin-bottom: 20px; }
    .unsupported-container .unsupported-content .copy-button {
      height: 55px;
      width: 335px;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: #EA0089;
      color: white;
      font-weight: 600;
      font-size: 16px;
      border-radius: 4px;
      cursor: pointer; }
      .unsupported-container .unsupported-content .copy-button .copy-img {
        margin-right: 10px; }

@media (max-width: 768px) {
  .unsupported-container {
    background-color: #F5F5F5; }
    .unsupported-container .unsupported-content .image {
      margin-bottom: 30px; }
    .unsupported-container .unsupported-content .title {
      font-size: 21px;
      margin-bottom: 20px; }
    .unsupported-container .unsupported-content .subtitle {
      font-size: 14px;
      margin-bottom: 20px; }
    .unsupported-container .unsupported-content .copy-button {
      width: 100%;
      cursor: pointer; }
      .unsupported-container .unsupported-content .copy-button .copy-img {
        margin-right: 10px; } }

.patient-leftsidebar {
  height: 100vh;
  width: 72px;
  background-color: #424242;
  display: flex;
  flex-direction: column;
  padding: 20px;
  align-items: center;
  box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.25); }
  .patient-leftsidebar .call-feature-svg {
    fill: white;
    width: 100%;
    height: 100%; }
  .patient-leftsidebar .logo-container .logo {
    width: 40px;
    height: 40px; }
  .patient-leftsidebar .icon-div {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    align-items: center; }
    .patient-leftsidebar .icon-div .icon-container {
      cursor: pointer;
      width: 32px;
      height: 32px; }
    .patient-leftsidebar .icon-div .icon-container:not(:last-child) {
      margin-bottom: 18px; }

.patient-leftsidebar.white {
  background-color: #ffffff; }
  .patient-leftsidebar.white .call-feature-svg {
    fill: #757575; }

.backdrop {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10; }

.dashboard-queue {
  width: 100%;
  flex: 1;
  overflow: hidden;
  scrollbar-color: slategrey #FBFCFB;
  scrollbar-width: thin;
  padding: 10px; }
  .dashboard-queue::-webkit-scrollbar {
    width: 4px; }
  .dashboard-queue::-webkit-scrollbar-thumb {
    background-color: darkgrey; }
  .dashboard-queue::-webkit-scrollbar-track {
    background-color: #FBFCFB; }
  .dashboard-queue .patient-queue-empty {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    color: #52575C;
    text-align: center;
    height: 100%; }
    .dashboard-queue .patient-queue-empty .empty-image {
      margin-bottom: 15px; }
  .dashboard-queue .queue-element {
    display: flex;
    padding: 10px;
    background-color: white;
    align-items: center;
    height: 66px;
    width: 100%;
    border-radius: 120px;
    box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.08);
    margin-bottom: 12px; }
    .dashboard-queue .queue-element .options {
      display: none;
      cursor: pointer;
      margin-left: auto;
      margin-right: 20px; }
    .dashboard-queue .queue-element .queue-details {
      display: flex;
      font-weight: 500;
      font-size: 14px;
      line-height: 18px;
      flex-direction: column;
      justify-content: space-around;
      margin: 10px 0px;
      flex: 1;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
      .dashboard-queue .queue-element .queue-details .queue-name {
        color: #29292C;
        margin-bottom: 0px; }
      .dashboard-queue .queue-element .queue-details .queue-waiting {
        color: #F5A623;
        margin-bottom: 0px; }
    .dashboard-queue .queue-element .avatar-container {
      position: relative; }
      .dashboard-queue .queue-element .avatar-container .chat-bubble-notification {
        height: 10px;
        width: 10px;
        position: absolute;
        border-radius: 50%;
        background-color: #33BC28;
        border: 1px solid white;
        bottom: 0px;
        right: 15px; }
      .dashboard-queue .queue-element .avatar-container .avatar {
        height: 50px;
        width: 50px;
        border-radius: 25px;
        margin-right: 10px;
        object-fit: cover; }
    .dashboard-queue .queue-element .chat-icon-container {
      display: none; }
    .dashboard-queue .queue-element .startCall {
      display: none; }
  .dashboard-queue .queue-element:hover {
    background-color: #EA0089; }
    .dashboard-queue .queue-element:hover .queue-details {
      display: none; }
    .dashboard-queue .queue-element:hover .startCall {
      display: block;
      width: 150px;
      border: none;
      height: 34px;
      background: #EA0089;
      cursor: pointer;
      color: white;
      border: 0.3px solid #EA0089;
      box-shadow: -2px 0px 20px #C70074, 2px 6px 10px rgba(199, 0, 116, 0.08);
      box-sizing: border-box;
      border-radius: 19px;
      font-size: 14px;
      font-weight: 500; }
    .dashboard-queue .queue-element:hover .startCall:hover {
      background-color: rgba(234, 0, 137, 0.8); }
    .dashboard-queue .queue-element:hover .startCall:focus {
      outline: none; }
    .dashboard-queue .queue-element:hover .chat-icon-container {
      cursor: pointer;
      height: 34px;
      width: 30px;
      margin-left: 5px;
      display: flex;
      justify-content: center; }
    .dashboard-queue .queue-element:hover .svg-path {
      fill: white; }
    .dashboard-queue .queue-element:hover .options {
      display: block; }

.dashboard-queue:hover {
  overflow-y: auto; }

.teleconsent-modal {
  width: 90%;
  border-radius: 6px;
  background-color: #fff; }
  @media (min-width: 767px) {
    .teleconsent-modal {
      width: 670px; } }
  .teleconsent-modal .modal-header {
    background-color: #4A20B7;
    border-radius: 6px 6px 0 0;
    padding: 10px 30px; }
    .teleconsent-modal .modal-header .modal-title {
      margin: 0;
      color: #fff; }
    .teleconsent-modal .modal-header .close {
      font-size: 30px;
      color: #fff;
      line-height: 24px; }
  .teleconsent-modal .modal-body {
    padding: 30px 0; }

.footer {
  width: 100%;
  height: 60px;
  background-color: white;
  border-top: 3px solid #FF5E00;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #BBBEC7;
  font-size: 11px; }

.share-teleconsent-modal {
  width: 90%;
  border-radius: 6px;
  background-color: #fff;
  height: 600px;
  min-height: 600px;
  max-height: 600px; }
  @media (min-width: 991px) {
    .share-teleconsent-modal {
      width: 870px; } }
  @media (max-width: 768px) {
    .share-teleconsent-modal {
      width: 350px; } }
  .share-teleconsent-modal h6 {
    color: #52575C;
    margin-bottom: 20px; }
  .share-teleconsent-modal h4 {
    font-size: 22px;
    line-height: 28px;
    color: #52575C;
    font-weight: 600;
    margin-bottom: 40px; }
  .share-teleconsent-modal .modal-body {
    padding: 16px 40px;
    overflow: auto;
    color: #52575C;
    flex: 1;
    height: 100%;
    width: 100%;
    scrollbar-color: slategrey white;
    scrollbar-width: thin; }
    .share-teleconsent-modal .modal-body::-webkit-scrollbar {
      width: 4px; }
    .share-teleconsent-modal .modal-body::-webkit-scrollbar-thumb {
      background-color: darkgrey; }
    .share-teleconsent-modal .modal-body::-webkit-scrollbar-track {
      background-color: white; }
  .share-teleconsent-modal .termsPoints {
    background: #F8F8F8;
    border-radius: 4px;
    padding: 40px;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 30px; }
    .share-teleconsent-modal .termsPoints ul {
      list-style: disc;
      margin: 0;
      padding: 0; }
    .share-teleconsent-modal .termsPoints li {
      margin-bottom: 30px; }
  .share-teleconsent-modal .sign-form {
    font-size: 22px;
    font-weight: 600;
    line-height: 28px;
    padding-bottom: 20px;
    margin-bottom: 30px;
    border-bottom: solid 1px #52575C; }
  .share-teleconsent-modal .patient-signin-form {
    width: 370px;
    margin-bottom: 60px; }
    .share-teleconsent-modal .patient-signin-form label {
      font-size: 14px;
      margin-bottom: 23px;
      display: block; }
    .share-teleconsent-modal .patient-signin-form .signature-preview-image {
      width: 370px;
      height: 151px;
      border-radius: 4px; }
    .share-teleconsent-modal .patient-signin-form .signature-container .canvas-element {
      width: 372px;
      height: 151px;
      border-radius: 4px;
      background-color: #D4D6D3; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-reset {
      cursor: pointer;
      width: 98px;
      height: 48px;
      border: 1px solid #EB5757;
      box-sizing: border-box;
      border-radius: 4px;
      font-weight: bold;
      font-size: 16px;
      text-align: center;
      color: #EB5757;
      margin-right: 5px; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-reset:focus {
      outline: none; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-cancel {
      cursor: pointer;
      width: 98px;
      height: 48px;
      border: 1px solid #33BC28;
      box-sizing: border-box;
      border-radius: 4px;
      font-weight: bold;
      font-size: 16px;
      text-align: center;
      color: #33BC28;
      margin-right: 5px; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-cancel:focus {
      outline: none; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-confirm {
      cursor: pointer;
      width: 156px;
      height: 48px;
      background: #EA0089;
      border-radius: 4px;
      font-weight: bold;
      font-size: 16px;
      text-align: center;
      color: #FFFFFF;
      border: none; }
    .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-confirm:focus {
      outline: none; }
    .share-teleconsent-modal .patient-signin-form .blue-accordion .ant-collapse-item {
      background: #4A20B7; }
    .share-teleconsent-modal .patient-signin-form .blue-accordion.ant-collapse > .ant-collapse-item > .ant-collapse-header {
      background: #4A20B7;
      color: #fff;
      font-weight: 600;
      font-size: 16px;
      border: none;
      display: flex;
      justify-content: center; }
    .share-teleconsent-modal .patient-signin-form .blue-accordion .ant-collapse-content {
      background: #4A20B7;
      border: none;
      color: #fff; }
    .share-teleconsent-modal .patient-signin-form .ant-collapse-item {
      text-align: center;
      border-radius: 4px 4px 0 0; }
      .share-teleconsent-modal .patient-signin-form .ant-collapse-item ant-collapse-header {
        display: inline-flex;
        justify-content: center;
        color: #fff; }
    .share-teleconsent-modal .patient-signin-form .ant-collapse-content-box div {
      display: flex;
      align-items: center;
      cursor: pointer;
      margin-bottom: 20px; }
    .share-teleconsent-modal .patient-signin-form .ant-collapse-content {
      text-align: left; }
      .share-teleconsent-modal .patient-signin-form .ant-collapse-content img {
        margin-right: 20px;
        width: 20px; }
  .share-teleconsent-modal .finalizeDocument {
    border-top: solid 1px #52575C;
    padding-top: 40px;
    text-align: center; }
    .share-teleconsent-modal .finalizeDocument .btn-orange {
      background: #EA0089;
      border-radius: 4px;
      font-size: 16px;
      width: 372px;
      height: 48px;
      color: #fff;
      border: none;
      cursor: pointer;
      margin-bottom: 22px; }
    .share-teleconsent-modal .finalizeDocument .btn-orange:focus {
      outline: none; }
  .share-teleconsent-modal .ant-collapse-icon-position-right > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow {
    right: 30px;
    color: #fff; }
    .share-teleconsent-modal .ant-collapse-icon-position-right > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow:after {
      content: "";
      border: solid #fff;
      border-width: 0px 1px 1px 0;
      display: inline-block;
      padding: 0;
      transform: rotate(45deg);
      -webkit-transform: rotate(45deg);
      height: 8px;
      width: 8px; }
    .share-teleconsent-modal .ant-collapse-icon-position-right > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow svg {
      display: none; }
  @media (max-width: 768px) {
    .share-teleconsent-modal .modal-body {
      overflow: scroll;
      -webkit-overflow-scrolling: touch; }
    .share-teleconsent-modal .patient-signin-form {
      width: 100%; }
      .share-teleconsent-modal .patient-signin-form .signature-preview-image {
        width: 100%; }
      .share-teleconsent-modal .patient-signin-form .signature-container .canvas-element {
        width: 100%; }
      .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-reset {
        width: 98px;
        margin-bottom: 10px; }
      .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-cancel {
        width: 98px;
        margin-bottom: 10px; }
      .share-teleconsent-modal .patient-signin-form .signature-container .signature-button-container .signature-confirm {
        width: 156px; }
    .share-teleconsent-modal .finalizeDocument {
      padding-top: 40px; }
      .share-teleconsent-modal .finalizeDocument .btn-orange {
        width: 100%; } }

.payment-meeting-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .payment-meeting-backdrop .payment-container {
    z-index: 5;
    border-radius: 4px;
    background-color: #343434;
    width: 432px;
    height: 362px;
    display: flex;
    flex-direction: column; }
    .payment-meeting-backdrop .payment-container .payment-modal-header {
      display: flex;
      height: 55px;
      justify-content: space-between;
      padding: 16px;
      font-weight: 600;
      font-size: 18px;
      line-height: 18px;
      color: #ffffff;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
      .payment-meeting-backdrop .payment-container .payment-modal-header .close:focus {
        outline: none; }
      .payment-meeting-backdrop .payment-container .payment-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .payment-meeting-backdrop .payment-container .payment-content {
      padding: 16px;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center; }
      .payment-meeting-backdrop .payment-container .payment-content .payment {
        font-size: 20px;
        font-weight: 500;
        margin-bottom: 30px;
        color: #ffffff; }
      .payment-meeting-backdrop .payment-container .payment-content .payment-input {
        background: #F8F8F8;
        border-radius: 4px;
        border: none;
        margin-bottom: 30px;
        padding: 16px;
        font-weight: 500;
        box-sizing: border-box;
        color: #52575C;
        font-size: 14px;
        width: 60%; }
        .payment-meeting-backdrop .payment-container .payment-content .payment-input::placeholder {
          font-size: 14px;
          color: #C6C6C6;
          font-weight: 500; }
      .payment-meeting-backdrop .payment-container .payment-content .payment-input:focus {
        outline: none; }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button {
        font-weight: bold;
        font-size: 14px;
        line-height: 18px;
        background: #EA0089;
        width: 60%;
        padding: 16px;
        border-radius: 4px;
        color: #FFFFFF;
        cursor: pointer;
        border: none;
        margin-bottom: 30px; }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button:focus {
        outline-color: rgba(234, 0, 137, 0.8); }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button-cancel {
        background-color: transparent;
        font-weight: bold;
        font-size: 14px;
        cursor: pointer;
        color: #e1e1e1;
        border: none;
        width: 60%;
        padding: 16px;
        border-radius: 4px; }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button-cancel:hover {
        background-color: rgba(60, 60, 60, 0.8); }
      .payment-meeting-backdrop .payment-container .payment-content .feature-button-cancel:focus {
        outline-color: rgba(60, 60, 60, 0.8); }

.payment-meeting-backdrop.white .payment-container {
  background-color: white; }
  .payment-meeting-backdrop.white .payment-container .payment-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .payment-meeting-backdrop.white .payment-container .payment-content .payment {
    color: #52575C; }
  .payment-meeting-backdrop.white .payment-container .payment-content .payment-input {
    background: #F4F6F5;
    color: #52575C; }
    .payment-meeting-backdrop.white .payment-container .payment-content .payment-input::placeholder {
      color: #C6C6C6; }
  .payment-meeting-backdrop.white .payment-container .payment-content .feature-button-cancel {
    color: #52575C; }
  .payment-meeting-backdrop.white .payment-container .payment-content .feature-button-cancel:hover {
    background-color: rgba(250, 250, 250, 0.8); }
  .payment-meeting-backdrop.white .payment-container .payment-content .feature-button-cancel:focus {
    outline-color: rgba(250, 250, 250, 0.8); }

.file-meeting-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .file-meeting-backdrop .file-container {
    z-index: 5;
    border-radius: 4px;
    background-color: #343434;
    width: 600px;
    height: 500px;
    display: flex;
    flex-direction: column; }
    .file-meeting-backdrop .file-container .file-modal-header {
      display: flex;
      height: 55px;
      justify-content: space-between;
      padding: 16px;
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #ffffff;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
      .file-meeting-backdrop .file-container .file-modal-header .close:focus {
        outline: none; }
      .file-meeting-backdrop .file-container .file-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .file-meeting-backdrop .file-container .file-content {
      height: 445px;
      flex: 1;
      padding: 16px;
      display: flex;
      flex-direction: column;
      align-items: center;
      overflow: auto;
      scrollbar-color: slategrey white;
      scrollbar-width: thin; }
      .file-meeting-backdrop .file-container .file-content::-webkit-scrollbar {
        width: 4px; }
      .file-meeting-backdrop .file-container .file-content::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .file-meeting-backdrop .file-container .file-content::-webkit-scrollbar-track {
        background-color: white; }
      .file-meeting-backdrop .file-container .file-content .text-content {
        color: #FFFFFF;
        font-size: 18px;
        font-weight: 500;
        margin-bottom: 30px; }
      .file-meeting-backdrop .file-container .file-content .feature-button {
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        background: #EA0089;
        width: 253px;
        height: 42px;
        border-radius: 4px;
        color: #FFFFFF;
        cursor: pointer;
        border: none;
        margin-bottom: 20px; }
      .file-meeting-backdrop .file-container .file-content .feature-button:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .file-meeting-backdrop .file-container .file-content .feature-button:focus {
        outline-color: rgba(234, 0, 137, 0.8); }
      .file-meeting-backdrop .file-container .file-content .feature-button-cancel {
        font-weight: 600;
        font-size: 14px;
        background: transparent;
        width: 253px;
        height: 42px;
        border-radius: 4px;
        cursor: pointer;
        border: none;
        color: #EA0089; }
      .file-meeting-backdrop .file-container .file-content .feature-image {
        margin-bottom: 20px; }
      .file-meeting-backdrop .file-container .file-content .feature-button-cancel:hover {
        background-color: rgba(60, 60, 60, 0.8); }
      .file-meeting-backdrop .file-container .file-content .feature-button-cancel:focus {
        outline-color: rgba(60, 60, 60, 0.8); }
      .file-meeting-backdrop .file-container .file-content .list-container {
        flex-basis: 60%;
        width: 100%;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 15px;
        margin-bottom: 20px;
        scrollbar-color: slategrey white;
        scrollbar-width: thin; }
        .file-meeting-backdrop .file-container .file-content .list-container::-webkit-scrollbar {
          width: 4px; }
        .file-meeting-backdrop .file-container .file-content .list-container::-webkit-scrollbar-thumb {
          background-color: darkgrey; }
        .file-meeting-backdrop .file-container .file-content .list-container::-webkit-scrollbar-track {
          background-color: white; }
        .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox {
          margin-left: 0px;
          height: 66px;
          width: 100%;
          margin-bottom: 5px;
          display: flex;
          align-items: center; }
          .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox .details {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            height: 100%; }
            .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox .details .avatar {
              height: 40px;
              width: 40px;
              border-radius: 20px;
              margin-right: 10px;
              margin-left: 10px;
              object-fit: cover; }
            .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox .details .element-details {
              font-weight: 600;
              font-size: 14px;
              color: #f1f1f1; }
          .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox .ant-checkbox:hover .ant-checkbox-inner {
            border-color: #4A20B7; }
          .file-meeting-backdrop .file-container .file-content .list-container .list-checkbox .ant-checkbox-checked .ant-checkbox-inner {
            background-color: #4A20B7;
            border-color: #4A20B7; }
      .file-meeting-backdrop .file-container .file-content .file-transfer-invite {
        color: #f1f1f1;
        font-size: 18px;
        font-weight: 500;
        margin-bottom: 10px; }
      .file-meeting-backdrop .file-container .file-content .button-container {
        display: flex;
        width: 100%;
        justify-content: center;
        font-weight: bold;
        font-size: 14px; }
        .file-meeting-backdrop .file-container .file-content .button-container .invite-btn {
          border: none;
          width: 130px;
          height: 48px;
          background: #EA0089;
          border-radius: 4px;
          color: #FFFFFF;
          cursor: pointer; }
        .file-meeting-backdrop .file-container .file-content .button-container .cancel {
          color: #EA0089;
          background: transparent; }
        .file-meeting-backdrop .file-container .file-content .button-container .invite-btn:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .file-meeting-backdrop .file-container .file-content .button-container .invite-btn:focus {
          outline: none; }
        .file-meeting-backdrop .file-container .file-content .button-container .cancel:hover {
          background-color: rgba(60, 60, 60, 0.8); }
      .file-meeting-backdrop .file-container .file-content .drop-zone-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        height: 100%; }
      .file-meeting-backdrop .file-container .file-content .drop-zone-container:focus {
        outline: none; }

.file-meeting-backdrop.white .file-container {
  background-color: white; }
  .file-meeting-backdrop.white .file-container .file-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
    .file-meeting-backdrop.white .file-container .file-modal-header .close {
      background-color: transparent; }
  .file-meeting-backdrop.white .file-container .file-content .text-content {
    color: #555555; }
  .file-meeting-backdrop.white .file-container .file-content .feature-button-cancel:hover {
    background-color: rgba(250, 250, 250, 0.8); }
  .file-meeting-backdrop.white .file-container .file-content .feature-button-cancel:focus {
    outline-color: rgba(255, 255, 255, 0.8); }
  .file-meeting-backdrop.white .file-container .file-content .list-container .list-checkbox .details .element-details {
    color: #29292C; }
  .file-meeting-backdrop.white .file-container .file-content .file-transfer-invite {
    color: #555555; }
  .file-meeting-backdrop.white .file-container .file-content .button-container .cancel:hover {
    background-color: rgba(250, 250, 250, 0.8); }

.call-modal {
  position: fixed;
  z-index: 2;
  border-radius: 6px;
  background: #303030;
  box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.14);
  width: 616px;
  height: 300px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  .call-modal .caller {
    display: flex;
    align-items: flex-start;
    height: 184px; }
    .call-modal .caller .patient-image {
      height: 184px;
      width: 184px;
      margin-right: 24px;
      object-fit: cover; }
    .call-modal .caller .caller-details {
      flex: 1;
      height: 100%;
      display: flex;
      flex-direction: column;
      overflow: hidden; }
      .call-modal .caller .caller-details .details-row-1 {
        margin-bottom: 13px;
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: flex-start; }
        .call-modal .caller .caller-details .details-row-1 .caller-name {
          display: flex;
          flex: 1;
          min-width: 0px; }
          .call-modal .caller .caller-details .details-row-1 .caller-name .name {
            max-width: 80%;
            display: inline-block;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            font-weight: 600;
            font-size: 22px;
            color: #ffffff;
            margin-bottom: 0px;
            margin-right: 5px; }
        .call-modal .caller .caller-details .details-row-1 .close {
          background-color: transparent;
          border: none;
          cursor: pointer;
          font-size: 20px;
          color: #A0A4A8; }
        .call-modal .caller .caller-details .details-row-1 .close:focus {
          outline: none; }
      .call-modal .caller .caller-details .details-row-2 {
        margin-bottom: 13px; }
        .call-modal .caller .caller-details .details-row-2 .pink-dot {
          border-radius: 50%;
          background-color: #E9595B;
          margin-right: 10px;
          height: 12px;
          width: 12px;
          display: inline-block; }
        .call-modal .caller .caller-details .details-row-2 .waiting {
          font-weight: 600;
          font-size: 16px;
          color: #ffffff;
          margin-right: 5px; }
        .call-modal .caller .caller-details .details-row-2 .room-name {
          font-size: 16px;
          font-weight: 500;
          color: #ffffff; }
      .call-modal .caller .caller-details .details-row-3 {
        margin-bottom: 13px;
        font-weight: 500;
        font-size: 16px;
        color: #ffffff; }
      .call-modal .caller .caller-details .details-row-4 {
        background: #424242;
        border-radius: 4px;
        padding: 10px;
        flex: 1;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        color: white;
        font-size: 14px;
        font-weight: 500; }
        .call-modal .caller .caller-details .details-row-4 .patient-specs {
          width: 50%;
          display: flex; }
          .call-modal .caller .caller-details .details-row-4 .patient-specs .spec-def {
            margin-left: 15px; }
  .call-modal .button-container {
    display: flex;
    width: 100%;
    justify-content: space-between;
    font-weight: 600;
    font-size: 14px;
    line-height: 18px; }
    .call-modal .button-container .btn-text {
      margin-left: 10px; }
    .call-modal .button-container .btn.chat {
      border: none;
      width: 130px;
      height: 48px;
      background: #424242;
      border-radius: 4px;
      color: #FFFFFF; }
    .call-modal .button-container .btn.audio {
      width: 130px;
      border: none;
      height: 48px;
      background: #424242;
      border-radius: 4px;
      color: #FFFFFF; }
    .call-modal .button-container .btn.more {
      width: 130px;
      height: 48px;
      background: #424242;
      border-radius: 4px;
      border: none;
      color: #ffffff; }
    .call-modal .button-container .btn.remove {
      width: 130px;
      height: 48px;
      border: none;
      background: #424242;
      box-sizing: border-box;
      border-radius: 4px;
      color: #E9595B; }
    .call-modal .button-container .btn {
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center; }
    .call-modal .button-container .audio:hover, .call-modal .button-container .chat:hover {
      background-color: rgba(66, 66, 66, 0.8); }
    .call-modal .button-container .more:hover {
      background: rgba(66, 66, 66, 0.8); }
    .call-modal .button-container .remove:hover {
      background-color: rgba(66, 66, 66, 0.8); }
    .call-modal .button-container .btn:focus {
      outline: none; }
  .call-modal .ant-dropdown .ant-dropdown-menu {
    background-color: #424242; }
    .call-modal .ant-dropdown .ant-dropdown-menu .more-menu-img {
      margin-right: 5px; }
    .call-modal .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item {
      color: white; }
    .call-modal .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item:hover {
      background-color: #646464; }
  .call-modal .svg-path {
    fill: #ffffff; }

.call-modal.white {
  background: #FFFFFF;
  box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.14); }
  .call-modal.white .caller .caller-details .details-row-1 .caller-name .name {
    color: #29292C; }
  .call-modal.white .caller .caller-details .details-row-2 .waiting {
    color: #25282B; }
  .call-modal.white .caller .caller-details .details-row-2 .room-name {
    color: #A0A4A8; }
  .call-modal.white .caller .caller-details .details-row-3 {
    color: #25282B; }
  .call-modal.white .caller .caller-details .details-row-4 {
    background: #F1F1F1;
    color: #25282B; }
  .call-modal.white .button-container .btn.chat {
    background: #4A20B7;
    color: #FFFFFF; }
  .call-modal.white .button-container .btn.audio {
    background: #4A20B7;
    color: #FFFFFF; }
  .call-modal.white .button-container .btn.more {
    background: #F1F1F1;
    color: #25282B; }
  .call-modal.white .button-container .btn.remove {
    background: #FFFFFF;
    border: 1px solid #E9595B;
    color: #E9595B; }
  .call-modal.white .button-container .audio:hover, .call-modal.white .button-container .chat:hover {
    background-color: rgba(74, 32, 183, 0.8); }
  .call-modal.white .button-container .more:hover {
    background: rgba(241, 241, 241, 0.8); }
  .call-modal.white .button-container .remove:hover {
    background-color: rgba(245, 245, 245, 0.8); }
  .call-modal.white .ant-dropdown .ant-dropdown-menu {
    background-color: #ffffff; }
    .call-modal.white .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item {
      color: #67676E; }
    .call-modal.white .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item:hover {
      background-color: #f1f1f1; }
  .call-modal.white .svg-path {
    fill: #25282B; }

.call-modal-tooltip {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 30px solid #303030;
  position: fixed;
  z-index: 2; }

.call-modal-tooltip.white {
  border-right: 30px solid white; }

.invert {
  -moz-transform: scaleX(-1);
  /* Gecko */
  -o-transform: scaleX(-1);
  /* Opera */
  -webkit-transform: scaleX(-1);
  /* Webkit */
  transform: scaleX(-1);
  /* Standard */ }

.meeting-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .meeting-backdrop .call-merge-container {
    z-index: 5;
    border-radius: 4px;
    background-color: #343434;
    width: 500px;
    height: 366px;
    display: flex;
    flex-direction: column; }
    .meeting-backdrop .call-merge-container .call-merge-modal-header {
      display: flex;
      height: 50px;
      justify-content: space-between;
      padding: 16px;
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #FFFFFF;
      border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
      .meeting-backdrop .call-merge-container .call-merge-modal-header .close:focus {
        outline: none; }
      .meeting-backdrop .call-merge-container .call-merge-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .meeting-backdrop .call-merge-container .call-merge-content {
      height: 450px;
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
      .meeting-backdrop .call-merge-container .call-merge-content .options .disabled-option {
        cursor: not-allowed !important; }
      .meeting-backdrop .call-merge-container .call-merge-content .options .call-merge-option {
        cursor: pointer;
        font-size: 18px;
        color: #f1f1f1;
        height: 50px;
        padding-left: 20px;
        padding-right: 20px;
        display: flex;
        align-items: center; }
        .meeting-backdrop .call-merge-container .call-merge-content .options .call-merge-option .iconImg {
          margin-right: 10px;
          width: 24px;
          height: 24px; }
      .meeting-backdrop .call-merge-container .call-merge-content .options .selected {
        background: rgba(74, 32, 183, 0.04);
        color: #4A20B7; }
      .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer {
        display: flex;
        justify-content: flex-end;
        padding: 16px; }
        .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer .confirm-button {
          width: 173px;
          height: 42px;
          background: #EA0089;
          border-radius: 4px;
          font-weight: 600;
          font-size: 14px;
          color: #FFFFFF;
          border: none;
          margin-left: 10px; }
        .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer .confirm-button:focus {
          outline: none; }
        .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer .confirm-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer .cancel-button {
          width: 173px;
          height: 42px;
          background: transparent;
          border: 1px solid #f1f1f1;
          box-sizing: border-box;
          border-radius: 4px;
          font-weight: 600;
          font-size: 14px;
          color: #f1f1f1; }
        .meeting-backdrop .call-merge-container .call-merge-content .buttonContainer .cancel-button:focus {
          outline: none; }

.meeting-backdrop.white .call-merge-container {
  background-color: white; }
  .meeting-backdrop.white .call-merge-container .call-merge-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .meeting-backdrop.white .call-merge-container .call-merge-content .options .call-merge-option {
    color: #67676E; }
  .meeting-backdrop.white .call-merge-container .call-merge-content .options .selected {
    background: rgba(74, 32, 183, 0.04); }
  .meeting-backdrop.white .call-merge-container .call-merge-content .buttonContainer .cancel-button {
    border: 1px solid #67676E;
    color: #67676E; }

.call-queue {
  width: 100%;
  height: 100%; }
  .call-queue .title {
    padding: 20px 0px 0px 22px;
    font-weight: 500;
    font-size: 12px;
    color: #ffffff;
    margin-bottom: 10px; }
  .call-queue .incallqueue-container {
    width: 100%;
    max-height: 45%;
    padding: 0px 22px;
    overflow: auto;
    scrollbar-color: slategrey #FBFCFB;
    scrollbar-width: thin; }
    .call-queue .incallqueue-container::-webkit-scrollbar {
      width: 4px; }
    .call-queue .incallqueue-container::-webkit-scrollbar-thumb {
      background-color: #c1c4c9; }
    .call-queue .incallqueue-container::-webkit-scrollbar-track {
      background-color: transparent; }
    .call-queue .incallqueue-container .incall-queue-element {
      display: flex;
      align-items: center;
      border-bottom: 1px solid #4D4D4D;
      height: 56px;
      width: 100%;
      overflow: hidden; }
      .call-queue .incallqueue-container .incall-queue-element .avatar-container .avatar {
        height: 25px;
        width: 25px;
        border-radius: 50%;
        margin-right: 10px;
        object-fit: cover; }
      .call-queue .incallqueue-container .incall-queue-element .patient-name {
        flex: 1;
        min-width: 25%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        margin-right: 10px;
        color: white;
        font-size: 12px;
        font-weight: 500; }
      .call-queue .incallqueue-container .incall-queue-element .end-call-button {
        width: 90px;
        border: none;
        height: 28px;
        cursor: pointer;
        color: white;
        background: #303030;
        border-radius: 19px;
        font-size: 12px;
        font-weight: 500; }
      .call-queue .incallqueue-container .incall-queue-element .end-call-button:hover {
        background-color: rgba(30, 30, 30, 0.8); }
      .call-queue .incallqueue-container .incall-queue-element .end-call-button:focus {
        outline: none; }
      .call-queue .incallqueue-container .incall-queue-element .control-container {
        margin-left: 8px;
        width: 60px;
        display: flex; }
        .call-queue .incallqueue-container .incall-queue-element .control-container .control-mic {
          margin-right: 20px; }
  .call-queue .waiting-patient-container {
    width: 100%;
    max-height: 45%;
    overflow: auto;
    scrollbar-color: slategrey #FBFCFB;
    scrollbar-width: thin; }
    .call-queue .waiting-patient-container::-webkit-scrollbar {
      width: 4px; }
    .call-queue .waiting-patient-container::-webkit-scrollbar-thumb {
      background-color: #c1c4c9; }
    .call-queue .waiting-patient-container::-webkit-scrollbar-track {
      background-color: transparent; }
    .call-queue .waiting-patient-container .waiting-queue-element {
      display: flex;
      align-items: center;
      border-bottom: 1px solid #424242;
      height: 56px;
      width: 100%;
      overflow: hidden;
      background-color: #303030;
      padding: 18px 22px; }
      .call-queue .waiting-patient-container .waiting-queue-element .avatar-container {
        position: relative; }
        .call-queue .waiting-patient-container .waiting-queue-element .avatar-container .chat-bubble-notification {
          height: 8px;
          width: 8px;
          position: absolute;
          border-radius: 50%;
          background-color: #33BC28;
          border: 1px solid white;
          bottom: 0px;
          right: 10px; }
        .call-queue .waiting-patient-container .waiting-queue-element .avatar-container .avatar {
          height: 25px;
          width: 25px;
          border-radius: 50%;
          margin-right: 10px;
          object-fit: cover; }
      .call-queue .waiting-patient-container .waiting-queue-element .queue-details {
        flex: 1;
        min-width: 35%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        font-weight: 500;
        font-size: 12px;
        margin: 10px 0px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }
        .call-queue .waiting-patient-container .waiting-queue-element .queue-details .queue-name {
          color: #ffffff;
          margin-bottom: 0px; }
        .call-queue .waiting-patient-container .waiting-queue-element .queue-details .queue-waiting {
          color: #F5A623;
          margin-bottom: 0px; }
      .call-queue .waiting-patient-container .waiting-queue-element .startCall {
        width: 90px;
        border: none;
        height: 34px;
        cursor: pointer;
        color: white;
        background: #424242;
        border-radius: 19px;
        font-size: 12px;
        font-weight: 500;
        margin-left: 5px; }
      .call-queue .waiting-patient-container .waiting-queue-element .startCall:hover {
        color: #33BC28;
        border: 0.3px solid #33BC28; }
      .call-queue .waiting-patient-container .waiting-queue-element .startCall:focus {
        outline: none; }
      .call-queue .waiting-patient-container .waiting-queue-element .chaticon-container {
        cursor: pointer;
        margin-left: 20px; }
      .call-queue .waiting-patient-container .waiting-queue-element .more-options {
        cursor: pointer;
        margin-left: 20px; }
      .call-queue .waiting-patient-container .waiting-queue-element .svg-path {
        fill: white; }

.call-queue.white .title {
  color: #29292C; }

.call-queue.white .incallqueue-container .incall-queue-element {
  border-bottom: 1px solid #f1f1f1; }
  .call-queue.white .incallqueue-container .incall-queue-element .patient-name {
    color: #29292C; }
  .call-queue.white .incallqueue-container .incall-queue-element .end-call-button {
    color: #29292C;
    background: #f1f1f1; }
  .call-queue.white .incallqueue-container .incall-queue-element .end-call-button:hover {
    background-color: rgba(220, 220, 220, 0.8); }

.call-queue.white .waiting-queue-element {
  border-bottom: 1px solid white;
  background-color: #f1f1f1; }
  .call-queue.white .waiting-queue-element .queue-details .queue-name {
    color: #29292C; }
  .call-queue.white .waiting-queue-element .startCall {
    color: #29292C;
    background: white; }
  .call-queue.white .waiting-queue-element .svg-path {
    fill: #29292C; }

.snapshot-container {
  height: 100%;
  display: flex;
  flex-direction: column; }
  .snapshot-container .preview-container {
    flex: 1;
    min-height: 0px;
    overflow: auto;
    scrollbar-color: slategrey white;
    scrollbar-width: thin;
    padding: 10px; }
    .snapshot-container .preview-container::-webkit-scrollbar {
      width: 4px; }
    .snapshot-container .preview-container::-webkit-scrollbar-thumb {
      background-color: #c1c4c9; }
    .snapshot-container .preview-container::-webkit-scrollbar-track {
      background-color: transparent; }
    .snapshot-container .preview-container .preview-image {
      width: 100%;
      margin-bottom: 10px; }
  .snapshot-container .button-container {
    background-color: #303030;
    width: 100%;
    padding: 24px 10px;
    display: flex;
    flex-direction: column;
    align-items: center; }
    .snapshot-container .button-container .capture-button {
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 200px;
      height: 36px;
      background-color: #EA0089;
      font-weight: 500;
      font-size: 15px;
      color: #ffffff;
      border: none;
      border-radius: 4px;
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); }
      .snapshot-container .button-container .capture-button .button-text {
        margin-left: 5px;
        width: 70%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden; }
    .snapshot-container .button-container .capture-button:not(:last-child) {
      margin-bottom: 15px; }
    .snapshot-container .button-container .capture-button:focus {
      outline: none; }
    .snapshot-container .button-container .call-feature-svg {
      fill: #ffffff; }
  .snapshot-container .empty-snapshot {
    flex: 1;
    width: 100%;
    min-height: 0px;
    display: flex;
    flex-direction: column;
    padding: 50px 10px;
    align-items: center; }
    .snapshot-container .empty-snapshot .text-content {
      margin-top: 20px;
      width: 100%;
      font-size: 16px;
      color: #9E9E9E;
      text-align: center; }

.snapshot-container.white .button-container {
  background-color: #f1f1f1; }

.meeting-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .meeting-backdrop .group-call-container {
    z-index: 5;
    border-radius: 4px;
    background-color: #343434;
    width: 600px;
    height: 500px;
    display: flex;
    flex-direction: column; }
    .meeting-backdrop .group-call-container .group-modal-header {
      display: flex;
      height: 55px;
      justify-content: space-between;
      padding: 16px;
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #FFFFFF;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
      .meeting-backdrop .group-call-container .group-modal-header .close:focus {
        outline: none; }
      .meeting-backdrop .group-call-container .group-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .meeting-backdrop .group-call-container .group-call-content {
      height: 100%;
      padding: 16px;
      display: flex;
      flex-direction: column;
      align-items: center; }
      .meeting-backdrop .group-call-container .group-call-content .group-call-invite {
        font-size: 20px;
        font-weight: 500;
        margin-bottom: 10px;
        color: #f1f1f1; }
      .meeting-backdrop .group-call-container .group-call-content .list-container {
        flex-basis: 60%;
        width: 100%;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 15px;
        margin-bottom: 20px;
        scrollbar-color: slategrey white;
        scrollbar-width: thin; }
        .meeting-backdrop .group-call-container .group-call-content .list-container::-webkit-scrollbar {
          width: 4px; }
        .meeting-backdrop .group-call-container .group-call-content .list-container::-webkit-scrollbar-thumb {
          background-color: darkgrey; }
        .meeting-backdrop .group-call-container .group-call-content .list-container::-webkit-scrollbar-track {
          background-color: white; }
        .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox {
          margin-left: 0px;
          height: 66px;
          width: 100%;
          margin-bottom: 5px;
          display: flex;
          align-items: center; }
          .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox .details {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            height: 100%; }
            .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox .details .avatar {
              height: 40px;
              width: 40px;
              border-radius: 20px;
              margin-right: 10px;
              margin-left: 10px;
              object-fit: cover; }
            .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox .details .element-details {
              font-weight: 500;
              font-size: 14px;
              color: #f1f1f1; }
          .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox .ant-checkbox:hover .ant-checkbox-inner {
            border-color: #4A20B7; }
          .meeting-backdrop .group-call-container .group-call-content .list-container .list-checkbox .ant-checkbox-checked .ant-checkbox-inner {
            background-color: #4A20B7;
            border-color: #4A20B7; }
      .meeting-backdrop .group-call-container .group-call-content .button-container {
        display: flex;
        width: 100%;
        justify-content: center;
        font-weight: 600;
        font-size: 14px; }
        .meeting-backdrop .group-call-container .group-call-content .button-container .invite-btn {
          border: none;
          width: 173px;
          height: 42px;
          background: #EA0089;
          border-radius: 4px;
          color: #FFFFFF;
          cursor: pointer; }
        .meeting-backdrop .group-call-container .group-call-content .button-container .invite-btn:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .meeting-backdrop .group-call-container .group-call-content .button-container .invite-btn:focus {
          outline: none; }

.meeting-backdrop.white .group-call-container {
  background-color: white; }
  .meeting-backdrop.white .group-call-container .group-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .meeting-backdrop.white .group-call-container .group-call-content .group-call-invite {
    color: #52575C; }
  .meeting-backdrop.white .group-call-container .group-call-content .list-container .list-checkbox .details .element-details {
    color: #29292C; }

.screen-meeting-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .screen-meeting-backdrop .screen-share-container {
    z-index: 5;
    border-radius: 4px;
    background-color: #343434;
    width: 364px;
    max-height: 500px;
    min-height: 257px;
    display: flex;
    flex-direction: column; }
    .screen-meeting-backdrop .screen-share-container .screen-share-modal-header {
      display: flex;
      height: 55px;
      justify-content: space-between;
      padding: 16px;
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #ffffff;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
      .screen-meeting-backdrop .screen-share-container .screen-share-modal-header .close:focus {
        outline: none; }
      .screen-meeting-backdrop .screen-share-container .screen-share-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .screen-meeting-backdrop .screen-share-container .sharescreen-content {
      flex: 1;
      padding: 16px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      overflow: auto;
      scrollbar-color: slategrey white;
      scrollbar-width: thin; }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content::-webkit-scrollbar {
        width: 4px; }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content::-webkit-scrollbar-track {
        background-color: white; }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content .feature-button {
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        background: #EA0089;
        border-radius: 4px;
        color: #FFFFFF;
        cursor: pointer;
        border: none;
        height: 42px;
        width: 203px;
        margin-bottom: 20px; }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content .feature-button:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .screen-meeting-backdrop .screen-share-container .sharescreen-content .feature-button:focus {
        outline-color: rgba(234, 0, 137, 0.8); }

.screen-meeting-backdrop.white .screen-share-container {
  background-color: white; }
  .screen-meeting-backdrop.white .screen-share-container .screen-share-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.layout-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .layout-backdrop .layout-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 598px;
    height: 315px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .layout-backdrop .layout-modal .layout-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .layout-backdrop .layout-modal .layout-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .layout-backdrop .layout-modal .layout-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .layout-backdrop .layout-modal .layout-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 50px; }
      .layout-backdrop .layout-modal .layout-content .layout-select {
        font-size: 16px;
        color: #CBCBCB;
        display: flex;
        justify-content: space-evenly; }
        .layout-backdrop .layout-modal .layout-content .layout-select .selected {
          color: #ffffff;
          cursor: pointer; }
        .layout-backdrop .layout-modal .layout-content .layout-select .normal {
          cursor: pointer; }
        .layout-backdrop .layout-modal .layout-content .layout-select .disabled {
          cursor: not-allowed; }
      .layout-backdrop .layout-modal .layout-content .button-container {
        margin-top: auto;
        width: 100%;
        display: flex;
        justify-content: flex-end; }
        .layout-backdrop .layout-modal .layout-content .button-container .apply-button {
          cursor: pointer;
          background-color: #EA0089;
          border-radius: 4px;
          border: none;
          color: #ffffff;
          font-weight: 600;
          font-size: 12px;
          height: 36px;
          width: 91px; }
        .layout-backdrop .layout-modal .layout-content .button-container .apply-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .layout-backdrop .layout-modal .layout-content .button-container .apply-button:focus {
          outline: none; }
  .layout-backdrop .layout-modal.white {
    background-color: #ffffff; }
    .layout-backdrop .layout-modal.white .layout-header {
      color: #9E9E9E; }
      .layout-backdrop .layout-modal.white .layout-header .title {
        color: #29292C; }
    .layout-backdrop .layout-modal.white .layout-content .subtitle {
      color: #757575; }
    .layout-backdrop .layout-modal.white .layout-content .layout-select {
      color: #CBCBCB; }
      .layout-backdrop .layout-modal.white .layout-content .layout-select .selected {
        color: #757575;
        cursor: pointer; }

@media screen and (max-width: 768px) {
  .layout-backdrop .layout-modal {
    width: 90%; } }

.quickjoin-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .quickjoin-backdrop .quickjoin-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 600px;
    height: 374px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .quickjoin-backdrop .quickjoin-modal .quickjoin-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .quickjoin-backdrop .quickjoin-modal .quickjoin-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .quickjoin-backdrop .quickjoin-modal .quickjoin-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .quickjoin-backdrop .quickjoin-modal .quickjoin-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 20px; }
      .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link {
        height: 56px;
        width: 100%;
        margin-bottom: 15px;
        background-color: #535353;
        border-bottom: 1px solid #FD7779;
        padding: 0px 15px;
        display: flex;
        border-radius: 4px;
        align-items: center;
        justify-content: space-between; }
        .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link .link-container {
          width: 90%; }
          .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link .link-container .link-text {
            font-size: 12px;
            color: #FD7779; }
          .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link .link-container .link {
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 16px;
            color: #ffffff; }
        .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link .icon-container {
          cursor: pointer;
          display: flex;
          align-items: center; }
        .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-link .svg-path {
          fill: #ffffff; }
      .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-qr {
        display: flex; }
        .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-qr .qr-container {
          margin-right: 20px; }
        .quickjoin-backdrop .quickjoin-modal .quickjoin-content .quickjoin-qr .text-container {
          display: flex;
          flex-direction: column;
          justify-content: center;
          font-size: 12px;
          color: #c7c7c7; }
  .quickjoin-backdrop .quickjoin-modal.white {
    background-color: #ffffff; }
    .quickjoin-backdrop .quickjoin-modal.white .quickjoin-header .title {
      color: #29292C; }
    .quickjoin-backdrop .quickjoin-modal.white .quickjoin-content .subtitle {
      color: #757575; }
    .quickjoin-backdrop .quickjoin-modal.white .quickjoin-content .quickjoin-link {
      background-color: #E8E8E8; }
      .quickjoin-backdrop .quickjoin-modal.white .quickjoin-content .quickjoin-link .link {
        font-size: 16px;
        color: #29292C; }
      .quickjoin-backdrop .quickjoin-modal.white .quickjoin-content .quickjoin-link .svg-path {
        fill: #6A6A6A; }
    .quickjoin-backdrop .quickjoin-modal.white .quickjoin-content .quickjoin-qr .text-container {
      color: #757575; }

.sharelink-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .sharelink-backdrop .sharelink-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 600px;
    height: 338px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .sharelink-backdrop .sharelink-modal .sharelink-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .sharelink-backdrop .sharelink-modal .sharelink-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .sharelink-backdrop .sharelink-modal .sharelink-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .sharelink-backdrop .sharelink-modal .sharelink-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 20px; }
      .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-link {
        height: 56px;
        width: 100%;
        margin-bottom: 15px;
        background-color: #535353;
        border-bottom: 1px solid #FD7779;
        padding: 0px 15px;
        display: flex;
        border-radius: 4px;
        align-items: center;
        justify-content: space-between; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-link .link-text {
          font-size: 12px;
          color: #FD7779; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-link .link {
          font-size: 16px;
          color: #ffffff; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-link .icon-container {
          cursor: pointer;
          display: flex;
          align-items: center; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-link .svg-path {
          fill: #ffffff; }
      .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-qr {
        display: flex; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-qr .qr-container {
          margin-right: 20px; }
        .sharelink-backdrop .sharelink-modal .sharelink-content .sharelink-qr .text-container {
          display: flex;
          flex-direction: column;
          justify-content: center;
          font-size: 12px;
          color: #c7c7c7; }
    .sharelink-backdrop .sharelink-modal .sharelink-footer {
      font-size: 16px;
      font-weight: 500;
      color: #ffffff; }
      .sharelink-backdrop .sharelink-modal .sharelink-footer .icon-container {
        margin-top: 15px;
        display: flex; }
        .sharelink-backdrop .sharelink-modal .sharelink-footer .icon-container .invite-icons {
          height: 50px;
          width: 50px;
          margin-right: 40px;
          display: flex;
          justify-content: center;
          align-items: center;
          box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.08);
          border-radius: 8px;
          background-color: #535353;
          cursor: pointer; }
        .sharelink-backdrop .sharelink-modal .sharelink-footer .icon-container .svg-path {
          fill: #f8f8f8; }
  .sharelink-backdrop .sharelink-modal.white {
    background-color: #ffffff; }
    .sharelink-backdrop .sharelink-modal.white .sharelink-header .title {
      color: #29292C; }
    .sharelink-backdrop .sharelink-modal.white .sharelink-content .subtitle {
      color: #757575; }
    .sharelink-backdrop .sharelink-modal.white .sharelink-content .sharelink-link {
      background-color: #E8E8E8; }
      .sharelink-backdrop .sharelink-modal.white .sharelink-content .sharelink-link .link {
        color: #29292C; }
      .sharelink-backdrop .sharelink-modal.white .sharelink-content .sharelink-link .svg-path {
        fill: #6A6A6A; }
    .sharelink-backdrop .sharelink-modal.white .sharelink-footer {
      color: #29292C; }
      .sharelink-backdrop .sharelink-modal.white .sharelink-footer .icon-container .invite-icons {
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.08);
        background-color: #ffffff; }
      .sharelink-backdrop .sharelink-modal.white .sharelink-footer .icon-container .svg-path {
        fill: #757575; }

.send-email-modal-container {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  height: 335px;
  width: 600px;
  background-color: white;
  border-radius: 6px;
  z-index: 11; }
  .send-email-modal-container .send-email-modal-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .send-email-modal-container .send-email-modal-header .send-email-modal-title {
      font-style: normal;
      font-weight: 500;
      font-size: 20px;
      line-height: 25px;
      color: #29292c;
      margin-left: 20px; }
    .send-email-modal-container .send-email-modal-header .close {
      cursor: pointer;
      font-size: 18px; }
    .send-email-modal-container .send-email-modal-header .svg-path {
      fill: #29292C; }
  .send-email-modal-container .send-email-main-modal {
    padding: 20px; }
    .send-email-modal-container .send-email-main-modal .form input {
      margin-bottom: 1.2rem;
      border: 1px solid #dbdbdb;
      box-sizing: border-box;
      border-radius: 4px;
      height: 55px;
      font-size: 18px;
      background-color: #f5f5f5; }
    .send-email-modal-container .send-email-main-modal .form .ant-input:focus {
      -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
      box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
  .send-email-modal-container .send-email-modal-footer {
    padding: 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .send-email-modal-container .send-email-modal-footer .buttons {
      display: flex;
      justify-content: flex-start;
      flex-direction: row-reverse; }
      .send-email-modal-container .send-email-modal-footer .buttons button {
        border: none;
        cursor: pointer; }
      .send-email-modal-container .send-email-modal-footer .buttons .send-link-btn {
        padding: 0 8px;
        height: 42px;
        background-color: #EA0089;
        border-radius: 4px;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        color: #ffffff; }
      .send-email-modal-container .send-email-modal-footer .buttons .cancel-btn {
        height: 42px;
        padding: 0 8px;
        background: rgba(125, 136, 142, 0.2);
        border-radius: 4px;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        color: #25282b; }
      .send-email-modal-container .send-email-modal-footer .buttons .send-link-btn:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .send-email-modal-container .send-email-modal-footer .buttons .send-link-btn:focus {
        outline: none; }
      .send-email-modal-container .send-email-modal-footer .buttons .cancel-btn:hover {
        background: rgba(125, 136, 142, 0.8); }
      .send-email-modal-container .send-email-modal-footer .buttons button:last-child {
        margin-right: 8px; }

.send-sms-modal-container {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  height: 560px;
  width: 440px;
  background-color: white;
  border-radius: 6px;
  z-index: 11;
  display: flex;
  flex-direction: column; }
  .send-sms-modal-container .send-sms-modal-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .send-sms-modal-container .send-sms-modal-header .send-sms-modal-header-title {
      display: flex;
      align-items: center; }
      .send-sms-modal-container .send-sms-modal-header .send-sms-modal-header-title .send-sms-modal-title {
        font-style: normal;
        font-weight: 500;
        font-size: 20px;
        line-height: 25px;
        color: #29292c;
        margin-left: 20px; }
    .send-sms-modal-container .send-sms-modal-header .close {
      cursor: pointer;
      font-size: 18px; }
    .send-sms-modal-container .send-sms-modal-header .svg-path {
      fill: #29292C; }
  .send-sms-modal-container .send-sms-main-modal {
    padding: 20px;
    flex: 1; }
    .send-sms-modal-container .send-sms-main-modal .form-header {
      font-weight: 500;
      font-size: 18px;
      color: #67676E;
      margin-bottom: 15px; }
    .send-sms-modal-container .send-sms-main-modal .form-field {
      margin-bottom: 40px; }
    .send-sms-modal-container .send-sms-main-modal .input-field {
      margin-bottom: 1.2rem;
      border: 1px solid #dbdbdb;
      box-sizing: border-box;
      border-radius: 4px;
      height: 40px;
      width: 100%;
      font-size: 18px;
      background-color: #f5f5f5; }
    .send-sms-modal-container .send-sms-main-modal input::placeholder {
      font-size: 14px;
      color: rgba(103, 103, 110, 0.6); }
    .send-sms-modal-container .send-sms-main-modal .input-field:focus {
      -webkit-box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8);
      box-shadow: 0 0 0 2px rgba(74, 32, 183, 0.8); }
  .send-sms-modal-container .send-sms-modal-footer {
    padding: 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }
    .send-sms-modal-container .send-sms-modal-footer .buttons {
      display: flex;
      justify-content: flex-start;
      flex-direction: row-reverse; }
      .send-sms-modal-container .send-sms-modal-footer .buttons button {
        border: none;
        cursor: pointer; }
      .send-sms-modal-container .send-sms-modal-footer .buttons .send-link-btn {
        padding: 0 8px;
        height: 42px;
        background-color: #EA0089;
        border-radius: 4px;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        color: #ffffff; }
      .send-sms-modal-container .send-sms-modal-footer .buttons .cancel-btn {
        height: 42px;
        padding: 0 8px;
        background: rgba(125, 136, 142, 0.2);
        border-radius: 4px;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        color: #25282b; }
      .send-sms-modal-container .send-sms-modal-footer .buttons .send-link-btn:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .send-sms-modal-container .send-sms-modal-footer .buttons .send-link-btn:focus {
        outline: none; }
      .send-sms-modal-container .send-sms-modal-footer .buttons .cancel-btn:hover {
        background: rgba(125, 136, 142, 0.8); }
      .send-sms-modal-container .send-sms-modal-footer .buttons button:last-child {
        margin-right: 8px; }

.layout-container {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }
  .layout-container > .spinner-wrapper {
    width: 100vw;
    height: 100vh; }
  .layout-container .doctor-header {
    width: 100%;
    height: 80px;
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: white;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12);
    padding: 20px 50px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .layout-container .doctor-header .logo-container {
      height: 100%;
      cursor: pointer; }
      .layout-container .doctor-header .logo-container .logo-image {
        width: 130px;
        height: 100%; }
    .layout-container .doctor-header .link-container .link {
      font-weight: 600;
      font-size: 14px;
      color: #484848;
      margin-right: 30px;
      margin-bottom: 10px; }
    .layout-container .doctor-header .link-container .link.active {
      border-bottom: 3px solid #FF5E00; }
    .layout-container .doctor-header .action-container {
      display: flex;
      align-items: center; }
      .layout-container .doctor-header .action-container .action-img {
        margin-right: 25px; }
      .layout-container .doctor-header .action-container .dropdown {
        font-size: 12px;
        color: #505050;
        display: flex;
        align-items: center;
        cursor: pointer; }
        .layout-container .doctor-header .action-container .dropdown .dropdown-name {
          margin-right: 10px; }
      .layout-container .doctor-header .action-container .lang-select {
        margin-right: 25px; }
        .layout-container .doctor-header .action-container .lang-select .lang-flag-container {
          width: 20px;
          height: 20px; }
    .layout-container .doctor-header .header-menu-container {
      width: 200px;
      border: 1px solid #D3D4D9;
      box-sizing: border-box;
      box-shadow: 0px 4px 13px rgba(0, 0, 0, 0.13); }
      .layout-container .doctor-header .header-menu-container .settings-dropdown-link {
        color: #2B2D36;
        font-size: 14px; }

.recording-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .recording-backdrop .recording-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 600px;
    height: 236px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .recording-backdrop .recording-modal .recording-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .recording-backdrop .recording-modal .recording-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .recording-backdrop .recording-modal .recording-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .recording-backdrop .recording-modal .recording-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 20px; }
      .recording-backdrop .recording-modal .recording-content .button-container {
        margin-top: auto;
        width: 100%;
        display: flex;
        justify-content: flex-end; }
        .recording-backdrop .recording-modal .recording-content .button-container .record-button {
          cursor: pointer;
          background-color: #EA0089;
          border-radius: 4px;
          border: none;
          color: #ffffff;
          font-weight: 600;
          font-size: 12px;
          height: 36px;
          width: 91px; }
        .recording-backdrop .recording-modal .recording-content .button-container .record-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .recording-backdrop .recording-modal .recording-content .button-container .record-button:focus {
          outline: none; }
  .recording-backdrop .recording-modal.white {
    background-color: #ffffff; }
    .recording-backdrop .recording-modal.white .recording-header .title {
      color: #29292C; }
    .recording-backdrop .recording-modal.white .recording-content .subtitle {
      color: #757575; }

.meeting-history {
  flex: 1;
  width: 100%;
  padding: 50px;
  background-color: #F7F6F4;
  overflow: auto; }
  .meeting-history .history-holder {
    background: #FFFFFF;
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.12);
    border-radius: 2px;
    padding: 30px; }
    .meeting-history .history-holder .history-header {
      color: #25282B;
      font-weight: 500;
      font-size: 40px;
      line-height: 50px;
      margin-bottom: 30px; }
    .meeting-history .history-holder .action-link-pink {
      font-size: 14px;
      text-decoration-line: underline;
      color: #EA0086;
      cursor: pointer; }
    .meeting-history .history-holder .action-link {
      font-size: 14px;
      text-decoration-line: underline;
      color: #63A1FF;
      cursor: pointer; }
    .meeting-history .history-holder .disabled-action-link {
      font-size: 14px;
      text-decoration-line: underline;
      color: #000000;
      cursor: not-allowed; }
  .meeting-history .history-table table .ant-table-thead > tr > th {
    background-color: transparent;
    font-size: 14px;
    color: #67676E;
    font-weight: 500;
    border: none; }
  .meeting-history .history-table table .ant-table-tbody tr:nth-child(odd) td {
    background-color: #F9FAF7; }
  .meeting-history .history-table table .ant-table-tbody > tr > td {
    border: none;
    color: #29292C;
    font-weight: 14px; }
  .meeting-history .history-table .ant-table-pagination.ant-pagination {
    margin: 30px auto;
    float: none;
    text-align: center; }
  .meeting-history .history-table .ant-pagination-item-active {
    background: #EA0089;
    color: #fff;
    border: none; }
    .meeting-history .history-table .ant-pagination-item-active a {
      color: #fff; }

.history-teleconsent-backdrop {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2; }
  .history-teleconsent-backdrop .history-teleconsent {
    width: 90%;
    border-radius: 6px;
    background-color: #fff;
    height: 600px;
    min-height: 600px;
    max-height: 600px;
    padding: 16px 40px;
    overflow: auto;
    color: #52575C;
    scrollbar-color: slategrey white;
    scrollbar-width: thin; }
    @media (min-width: 991px) {
      .history-teleconsent-backdrop .history-teleconsent {
        width: 870px; } }
    @media (max-width: 768px) {
      .history-teleconsent-backdrop .history-teleconsent {
        width: 350px; } }
    .history-teleconsent-backdrop .history-teleconsent::-webkit-scrollbar {
      width: 4px; }
    .history-teleconsent-backdrop .history-teleconsent::-webkit-scrollbar-thumb {
      background-color: darkgrey; }
    .history-teleconsent-backdrop .history-teleconsent::-webkit-scrollbar-track {
      background-color: white; }
    .history-teleconsent-backdrop .history-teleconsent h6 {
      color: #52575C;
      margin-bottom: 20px;
      font-size: 18px;
      font-weight: 600; }
    .history-teleconsent-backdrop .history-teleconsent h4 {
      font-size: 22px;
      line-height: 28px;
      color: #52575C;
      font-weight: 600;
      margin-bottom: 40px; }
    .history-teleconsent-backdrop .history-teleconsent .sign-form {
      font-size: 22px;
      font-weight: 600;
      line-height: 28px;
      padding-bottom: 20px;
      margin-bottom: 30px;
      border-bottom: solid 1px #52575C; }
    .history-teleconsent-backdrop .history-teleconsent .termsPoints {
      background: #F8F8F8;
      border-radius: 4px;
      padding: 40px;
      font-weight: 600;
      font-size: 14px;
      line-height: 18px;
      margin-bottom: 30px; }
      .history-teleconsent-backdrop .history-teleconsent .termsPoints ul {
        list-style: disc;
        margin: 0;
        padding: 0; }
      .history-teleconsent-backdrop .history-teleconsent .termsPoints li {
        margin-bottom: 30px; }
    .history-teleconsent-backdrop .history-teleconsent .patient-signin-form {
      width: 370px;
      margin-bottom: 60px; }
      .history-teleconsent-backdrop .history-teleconsent .patient-signin-form label {
        font-size: 14px;
        margin-bottom: 23px;
        display: block; }
      .history-teleconsent-backdrop .history-teleconsent .patient-signin-form .signature-preview-image {
        width: 370px;
        height: 151px;
        border-radius: 4px; }
    .history-teleconsent-backdrop .history-teleconsent .button-container {
      width: 100%;
      display: flex; }
      .history-teleconsent-backdrop .history-teleconsent .button-container .download-button {
        margin-left: auto;
        cursor: pointer;
        background-color: #EA0089;
        border: none;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 600;
        color: #ffffff;
        width: 166px;
        height: 42px; }

.history-detail-backdrop {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2; }
  .history-detail-backdrop .history-detail {
    border-radius: 6px;
    background-color: #fff;
    height: 600px;
    min-height: 600px;
    max-height: 600px;
    padding: 40px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    scrollbar-color: slategrey white;
    scrollbar-width: thin; }
    @media (min-width: 991px) {
      .history-detail-backdrop .history-detail {
        width: 870px; } }
    @media (max-width: 768px) {
      .history-detail-backdrop .history-detail {
        width: 350px; } }
    .history-detail-backdrop .history-detail::-webkit-scrollbar {
      width: 4px; }
    .history-detail-backdrop .history-detail::-webkit-scrollbar-thumb {
      background-color: darkgrey; }
    .history-detail-backdrop .history-detail::-webkit-scrollbar-track {
      background-color: white; }
    .history-detail-backdrop .history-detail .detail-header {
      display: flex;
      justify-content: space-between;
      color: #67676E; }
      .history-detail-backdrop .history-detail .detail-header .title {
        font-size: 20px;
        font-weight: 500;
        color: #25282B; }
    .history-detail-backdrop .history-detail .detail-data {
      padding-top: 50px;
      flex: 1; }
      .history-detail-backdrop .history-detail .detail-data .detail-row {
        width: 100%;
        display: flex;
        margin-bottom: 40px;
        align-items: center; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .detail-label {
          width: 185px;
          font-size: 16px;
          font-weight: 500;
          color: #606060; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .detail-value {
          flex: 1;
          display: flex;
          flex-wrap: wrap;
          font-size: 18px;
          font-weight: 500;
          color: #343434; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .detail-participant {
          padding: 10px 30px;
          color: #343434;
          font-weight: 500;
          font-size: 18px;
          border-radius: 70px;
          background-color: #F8F8F8;
          margin-right: 10px;
          margin-bottom: 10px; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .detail-label.underline {
          text-decoration-line: underline; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .snapshot-detail-container {
          width: 100%;
          display: flex;
          flex-wrap: wrap; }
          .history-detail-backdrop .history-detail .detail-data .detail-row .snapshot-detail-container .preview-image {
            width: 180px;
            height: 180px;
            object-fit: contain;
            margin-right: 10px;
            margin-bottom: 10px; }
        .history-detail-backdrop .history-detail .detail-data .detail-row .download-teleconsent {
          padding: 10px 30px;
          color: #343434;
          font-weight: 500;
          font-size: 18px;
          border-radius: 70px;
          background-color: #F8F8F8;
          cursor: pointer; }

.history-snapshot-backdrop {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2; }
  .history-snapshot-backdrop .history-snapshot {
    border-radius: 6px;
    background-color: #fff;
    height: 600px;
    min-height: 600px;
    max-height: 600px;
    padding: 40px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    scrollbar-color: slategrey white;
    scrollbar-width: thin; }
    @media (min-width: 991px) {
      .history-snapshot-backdrop .history-snapshot {
        width: 870px; } }
    @media (max-width: 768px) {
      .history-snapshot-backdrop .history-snapshot {
        width: 350px; } }
    .history-snapshot-backdrop .history-snapshot::-webkit-scrollbar {
      width: 4px; }
    .history-snapshot-backdrop .history-snapshot::-webkit-scrollbar-thumb {
      background-color: darkgrey; }
    .history-snapshot-backdrop .history-snapshot::-webkit-scrollbar-track {
      background-color: white; }
    .history-snapshot-backdrop .history-snapshot .snapshot-header {
      display: flex;
      justify-content: space-between;
      color: #67676E; }
      .history-snapshot-backdrop .history-snapshot .snapshot-header .title {
        font-size: 20px;
        font-weight: 500;
        color: #25282B; }
    .history-snapshot-backdrop .history-snapshot .snapshot-preview {
      flex: 1;
      display: flex;
      flex-wrap: wrap; }
      .history-snapshot-backdrop .history-snapshot .snapshot-preview .preview-image {
        width: 180px;
        height: 180px;
        object-fit: contain;
        margin-right: 10px;
        margin-bottom: 10px; }
    .history-snapshot-backdrop .history-snapshot .button-container {
      width: 100%;
      display: flex; }
      .history-snapshot-backdrop .history-snapshot .button-container .download-button {
        margin-left: auto;
        cursor: pointer;
        background-color: #EA0089;
        border: none;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 600;
        color: #ffffff;
        width: 166px;
        height: 42px; }

.upgrade-call-container {
  flex: 1;
  width: 100%;
  padding: 50px;
  background-color: #F9F9F9;
  display: flex;
  flex-direction: column;
  align-items: center; }
  .upgrade-call-container .welcome-header {
    margin-bottom: 20px; }
    .upgrade-call-container .welcome-header .title {
      font-size: 34px;
      color: #404040; }
  .upgrade-call-container .d-flex {
    display: flex; }
  .upgrade-call-container .upgrade-tab .ant-tabs {
    overflow: visible; }
    .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-nav {
      margin: 0; }
      .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-nav .ant-tabs-nav-list .ant-tabs-tab {
        background: #fff;
        width: 150px;
        height: 45px;
        margin: 0 0 0 0;
        border: solid 1px #ddd;
        box-shadow: 0 0px 5px #ddd;
        border-radius: 4px 4px 0 0;
        font-size: 14px;
        font-weight: 500;
        color: #7D888E;
        display: flex;
        justify-content: center; }
        .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-nav .ant-tabs-nav-list .ant-tabs-tab i {
          font-style: normal;
          font-weight: 500;
          font-size: 11px;
          color: #F5A623;
          margin-left: 8px; }
      .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-nav .ant-tabs-nav-list .ant-tabs-tab-active {
        color: #EA0089; }
    .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-content-holder {
      box-shadow: 0 0px 5px #ddd;
      padding: 40px;
      border: solid 1px #ddd;
      border-top: none;
      background-color: white; }
    .upgrade-call-container .upgrade-tab .ant-tabs .ant-tabs-ink-bar {
      background: #fff;
      border-left: solid 1px #ddd;
      border-right: solid 1px #ddd;
      height: 3px;
      box-sizing: border-box;
      transition: none !important; }

.divider {
  border-top: solid 1px #ddd;
  font-size: 14px;
  justify-content: center;
  display: flex;
  align-items: center;
  color: #67676E;
  font-weight: 500;
  height: 0px;
  margin: 20px 30px 40px 0; }
  .divider span {
    background: #fff;
    display: inline-block;
    padding: 0 12px; }

.card {
  background: #FFFFFF;
  border: 1px solid #C5C9CF;
  border-radius: 4px;
  margin-right: 30px;
  height: 550px;
  width: 310px;
  display: flex;
  flex-direction: column; }
  .card.card-primary .card-header {
    background: #4A20B7; }
    .card.card-primary .card-header h6 {
      color: #fff; }
    .card.card-primary .card-header span {
      font-size: 12px;
      margin-left: 4px; }
  .card.card-primary .card-body ul li:before {
    background: #4A20B7;
    opacity: 1; }
  .card.card-primary .card-body .btn-warning {
    margin-top: 60px; }
  .card.card-light .card-header {
    background: #99A5AB; }
    .card.card-light .card-header h6 {
      color: #fff; }
    .card.card-light .card-header span {
      font-size: 12px;
      margin-left: 4px; }
  .card.card-light .card-body ul li:before {
    background: #7D888E;
    opacity: 1; }
  .card.card-light .btn-group {
    position: relative;
    margin-left: 20px;
    border: 1px solid rgba(125, 136, 142, 0.4);
    display: inline-block;
    border-radius: 4px; }
    .card.card-light .btn-group span {
      font-size: 15px;
      padding: 5px 15px; }
    .card.card-light .btn-group span.incerment {
      border-left: 1px solid rgba(125, 136, 142, 0.4);
      font-size: 20px;
      padding: 5px 0px; }
    .card.card-light .btn-group span.decrement {
      border-right: 1px solid rgba(125, 136, 142, 0.4);
      padding: 5px 0px; }
  .card.card-light .card-body .btn-warning {
    margin-top: 48px; }
  .card .card-header {
    background: rgba(125, 136, 142, 0.14);
    border-radius: 4px 4px 0 0;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    padding: 12px 20px;
    align-items: center;
    color: #7D888E;
    font-size: 13px; }
    .card .card-header h6 {
      margin: 0;
      font-size: 16px;
      font-weight: 500;
      color: #7D888E; }
  .card .card-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: space-between; }
    .card .card-body ul {
      list-style: none;
      margin: 0;
      padding: 0;
      color: #67676E; }
      .card .card-body ul li {
        position: relative; }
        .card .card-body ul li:before {
          content: "";
          width: 8px;
          left: 0;
          height: 8px;
          border-radius: 15px;
          -moz-border-radius: 15px;
          -webkit-border-radius: 15px;
          background-color: #7D888E;
          opacity: .2;
          position: absolute;
          display: inline-block;
          top: 50%;
          transform: translateY(-50%); }
        .card .card-body ul li a {
          font-size: 13px;
          position: relative;
          line-height: 16px;
          text-decoration-line: underline;
          color: #67676E;
          display: block;
          margin-bottom: 20px;
          padding-left: 20px; }
    .card .card-body .plan-button-container {
      margin-top: auto;
      display: flex;
      justify-content: center; }
    .card .card-body .freeplan-button {
      border-radius: 4px;
      border: 1px solid #EA0089;
      background-color: white;
      font-weight: 600;
      font-size: 14px;
      color: #EA0089;
      height: 42px;
      width: 190px; }
    .card .card-body .plan-button {
      border-radius: 4px;
      border: 1px solid #EA0089;
      background-color: #EA0089;
      font-weight: 600;
      font-size: 14px;
      color: white;
      height: 42px;
      width: 190px; }

.icon-sets {
  display: inline-flex;
  font-size: 13px;
  text-decoration-line: underline;
  color: #67676E; }
  .icon-sets .icons-list {
    color: #EA0089;
    position: relative;
    width: 36px;
    height: 36px;
    text-align: center;
    line-height: 35px;
    margin-right: 12px;
    text-decoration-line: none; }
    .icon-sets .icons-list span {
      font-size: 37px;
      position: absolute;
      left: 0;
      top: 0; }

.add-option {
  border-bottom: solid 1px rgba(197, 201, 207, 0.6);
  border-bottom: solid 1px rgba(197, 201, 207, 0.6);
  background-color: white;
  width: 100%;
  padding-bottom: 20px;
  cursor: pointer;
  margin-bottom: 20px; }
  .add-option span {
    font-size: 20px;
    margin-right: 5px; }

.patient-meeting-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .patient-meeting-modal .patient-meeting-modal-content {
    z-index: 5;
    border-radius: 4px;
    background-color: #434343;
    width: 600px;
    height: 500px;
    display: flex;
    flex-direction: column; }
    .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-header {
      display: flex;
      justify-content: space-between;
      padding: 16px;
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #ffffff;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      height: 50px; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-header .close:focus {
        outline: none; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-header .close {
        background-color: transparent;
        border: none;
        cursor: pointer; }
    .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message {
      padding: 16px;
      height: 450px;
      overflow: auto;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      scrollbar-color: slategrey white;
      scrollbar-width: thin; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message::-webkit-scrollbar {
        width: 4px; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message::-webkit-scrollbar-thumb {
        background-color: darkgrey; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message::-webkit-scrollbar-track {
        background-color: white; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message .text-content {
        color: #ffffff;
        font-size: 20px;
        font-weight: 500;
        margin-bottom: 30px; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message .feature-button {
        font-weight: 600;
        font-size: 14px;
        line-height: 18px;
        background: #EA0089;
        width: 60%;
        padding: 16px;
        border-radius: 4px;
        color: #FFFFFF;
        cursor: pointer;
        border: none;
        margin-bottom: 20px; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message .feature-button:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message .feature-button:focus {
        outline-color: rgba(234, 0, 137, 0.8); }

.patient-meeting-modal.white .patient-meeting-modal-content {
  background-color: white; }
  .patient-meeting-modal.white .patient-meeting-modal-content .patient-meeting-modal-header {
    color: #29292C;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  .patient-meeting-modal.white .patient-meeting-modal-content .patient-meeting-modal-message .text-content {
    color: #52575C; }

@media (max-width: 768px) {
  .patient-meeting-modal .patient-meeting-modal-content {
    width: 90%;
    height: 500px; }
    .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-header {
      height: 50px; }
    .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message {
      height: 450px;
      overflow: scroll;
      -webkit-overflow-scrolling: touch; }
      .patient-meeting-modal .patient-meeting-modal-content .patient-meeting-modal-message .feature-button {
        width: 75%; } }

.feedback-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .feedback-backdrop .feedback-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 600px;
    height: 325px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .feedback-backdrop .feedback-modal .feedback-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .feedback-backdrop .feedback-modal .feedback-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .feedback-backdrop .feedback-modal .feedback-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .feedback-backdrop .feedback-modal .feedback-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 20px; }
      .feedback-backdrop .feedback-modal .feedback-content .feedback-input {
        background-color: #535353;
        width: 100%;
        height: 56px;
        border: none;
        border-bottom: 1px solid #FD7779;
        resize: none;
        padding: 10px;
        color: #ffffff; }
      .feedback-backdrop .feedback-modal .feedback-content .feedback-input:focus {
        outline: none; }
      .feedback-backdrop .feedback-modal .feedback-content .button-container {
        margin-top: auto;
        width: 100%;
        display: flex;
        justify-content: flex-end; }
        .feedback-backdrop .feedback-modal .feedback-content .button-container .submit-button {
          cursor: pointer;
          background-color: #EA0089;
          border-radius: 4px;
          border: none;
          color: #ffffff;
          font-weight: 600;
          font-size: 12px;
          height: 36px;
          width: 91px; }
        .feedback-backdrop .feedback-modal .feedback-content .button-container .submit-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .feedback-backdrop .feedback-modal .feedback-content .button-container .submit-button:focus {
          outline: none; }
  .feedback-backdrop .feedback-modal.white {
    background-color: #ffffff; }
    .feedback-backdrop .feedback-modal.white .feedback-header {
      color: #9e9e9e; }
      .feedback-backdrop .feedback-modal.white .feedback-header .title {
        color: #29292C; }
    .feedback-backdrop .feedback-modal.white .feedback-content .subtitle {
      color: #757575; }
    .feedback-backdrop .feedback-modal.white .feedback-content .feedback-input {
      background-color: #E8E8E8;
      color: #000000; }

.lock-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .lock-backdrop .lock-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 598px;
    height: 276px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .lock-backdrop .lock-modal .lock-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .lock-backdrop .lock-modal .lock-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .lock-backdrop .lock-modal .lock-content {
      flex: 1;
      display: flex;
      flex-direction: column; }
      .lock-backdrop .lock-modal .lock-content .subtitle {
        font-size: 16px;
        color: #CBCBCB;
        margin-bottom: 15px; }
      .lock-backdrop .lock-modal .lock-content .note {
        font-size: 15px;
        color: #ffffff; }
      .lock-backdrop .lock-modal .lock-content .button-container {
        margin-top: auto;
        width: 100%;
        display: flex;
        justify-content: flex-end; }
        .lock-backdrop .lock-modal .lock-content .button-container .apply-button {
          cursor: pointer;
          background-color: #EA0089;
          border-radius: 4px;
          border: none;
          color: #ffffff;
          font-weight: 600;
          font-size: 12px;
          height: 36px;
          width: 91px; }
        .lock-backdrop .lock-modal .lock-content .button-container .apply-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
        .lock-backdrop .lock-modal .lock-content .button-container .apply-button:focus {
          outline: none; }
        .lock-backdrop .lock-modal .lock-content .button-container .cancel-button {
          cursor: pointer;
          background-color: transparent;
          border: none;
          color: #ffffff;
          font-weight: 600;
          font-size: 12px;
          height: 36px;
          width: 91px; }
        .lock-backdrop .lock-modal .lock-content .button-container .cancel-button:focus {
          outline: none; }
  .lock-backdrop .lock-modal.white {
    background-color: #ffffff; }
    .lock-backdrop .lock-modal.white .lock-header {
      color: #9E9E9E; }
      .lock-backdrop .lock-modal.white .lock-header .title {
        color: #29292C; }
    .lock-backdrop .lock-modal.white .lock-content .subtitle {
      color: #757575; }
    .lock-backdrop .lock-modal.white .lock-content .note {
      color: #29292C; }
    .lock-backdrop .lock-modal.white .lock-content .cancel-button {
      color: #29292C; }
    .lock-backdrop .lock-modal.white .lock-content .lock-select {
      color: #CBCBCB; }
      .lock-backdrop .lock-modal.white .lock-content .lock-select .selected {
        color: #757575;
        cursor: pointer; }

.notes-container {
  position: fixed;
  width: 420px;
  height: 352px;
  right: 0px;
  top: 35%;
  z-index: 2;
  background: #0B2238;
  border-radius: 8px 0px 0px 8px;
  display: flex;
  flex-direction: column; }
  .notes-container .notes-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 30px;
    border-bottom: 1px solid white; }
    .notes-container .notes-header .title {
      font-weight: 500;
      font-size: 20px;
      color: #FFFFFF; }
    .notes-container .notes-header .close {
      font-size: 20px;
      cursor: pointer;
      color: #FFFFFF;
      background-color: transparent;
      border: none; }
    .notes-container .notes-header .close {
      outline: none; }
  .notes-container .notes-content {
    flex: 1;
    padding: 16px 30px;
    font-size: 16px;
    color: #FFFFFF;
    background-color: #0B2238;
    overflow: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
    scrollbar-color: white #0B2238;
    scrollbar-width: thin; }
    .notes-container .notes-content::-webkit-scrollbar {
      width: 4px; }
    .notes-container .notes-content::-webkit-scrollbar-thumb {
      background-color: white; }
    .notes-container .notes-content::-webkit-scrollbar-track {
      background-color: #0B2238; }

.notes-icon {
  position: fixed;
  right: 0px;
  top: 45%;
  cursor: pointer;
  z-index: 2; }

.device-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .device-backdrop .device-modal {
    background-color: #424242;
    border-radius: 6px;
    width: 960px;
    height: 474px;
    padding: 24px;
    display: flex;
    flex-direction: column; }
    .device-backdrop .device-modal .device-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .device-backdrop .device-modal .device-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .device-backdrop .device-modal .device-content {
      flex: 1;
      display: flex; }
      .device-backdrop .device-modal .device-content .preview-webcam {
        width: 50%;
        height: 100%; }
        .device-backdrop .device-modal .device-content .preview-webcam .preview-video {
          object-fit: contain;
          height: 100%;
          width: 100%; }
      .device-backdrop .device-modal .device-content .control-container {
        width: 50%;
        height: 100%;
        padding: 20px;
        display: flex;
        flex-direction: column; }
        .device-backdrop .device-modal .device-content .control-container .control-header {
          margin-bottom: 15px;
          font-size: 12px;
          color: #ffffff; }
        .device-backdrop .device-modal .device-content .control-container .control-select {
          width: 100%;
          margin-bottom: 25px;
          color: #ffffff;
          font-size: 16px; }
          .device-backdrop .device-modal .device-content .control-container .control-select .ant-select-selector {
            padding: 0px;
            padding-right: 10px;
            background-color: transparent;
            border: none;
            border-bottom: 1px solid #C7C7C7;
            box-shadow: none; }
          .device-backdrop .device-modal .device-content .control-container .control-select .ant-select-arrow {
            color: #ffffff; }
        .device-backdrop .device-modal .device-content .control-container .button-container {
          margin-top: auto;
          width: 100%;
          display: flex;
          justify-content: flex-end; }
          .device-backdrop .device-modal .device-content .control-container .button-container .apply-button {
            cursor: pointer;
            background-color: #EA0089;
            border-radius: 4px;
            border: none;
            color: #ffffff;
            font-weight: 600;
            font-size: 12px;
            height: 36px;
            width: 91px; }
          .device-backdrop .device-modal .device-content .control-container .button-container .apply-button:hover {
            background-color: rgba(234, 0, 137, 0.8); }
          .device-backdrop .device-modal .device-content .control-container .button-container .apply-button:focus {
            outline: none; }
  .device-backdrop .device-modal.white {
    background-color: #ffffff; }
    .device-backdrop .device-modal.white .device-header .title {
      color: #29292C; }
    .device-backdrop .device-modal.white .device-content .control-container .control-header {
      color: #29292C; }
    .device-backdrop .device-modal.white .device-content .control-container .control-select {
      color: #29292C; }
      .device-backdrop .device-modal.white .device-content .control-container .control-select .ant-select-arrow {
        color: #757575; }

@media screen and (max-width: 768px) {
  .device-backdrop {
    width: 100%;
    height: 100%; }
    .device-backdrop .device-modal {
      width: 100%;
      height: 100%;
      overflow: scroll;
      -webkit-overflow-scrolling: touch; }
      .device-backdrop .device-modal .device-content {
        flex: 1;
        display: flex;
        flex-direction: column; }
        .device-backdrop .device-modal .device-content .preview-webcam {
          width: 100%; }
          .device-backdrop .device-modal .device-content .preview-webcam .preview-video {
            object-fit: contain;
            height: 100%;
            width: 100%; }
        .device-backdrop .device-modal .device-content .control-container {
          width: 100%;
          padding: 0px;
          flex-direction: column; } }

.meeting-container {
  position: relative;
  display: flex;
  height: 100vh; }
  .meeting-container .patient-rightbar {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2; }
    .meeting-container .patient-rightbar .icon-container {
      background-color: #424242;
      width: 60px;
      height: 72px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.25); }
    .meeting-container .patient-rightbar .call-feature-svg {
      fill: white; }
    .meeting-container .patient-rightbar .doctor-queue-container {
      width: 356px;
      height: 100vh;
      background-color: #424242;
      box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.25); }
      .meeting-container .patient-rightbar .doctor-queue-container .title {
        width: 100%;
        padding: 20px 22px 0px 22px;
        color: #ffffff;
        font-weight: 500;
        font-size: 12px;
        display: flex;
        justify-content: space-between;
        cursor: pointer;
        margin-bottom: 10px; }
      .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element {
        color: white;
        display: flex;
        justify-content: space-between;
        height: 56px;
        width: 100%;
        align-items: center;
        background-color: #303030;
        padding: 18px 22px; }
        .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element .avatar-container {
          display: flex;
          align-items: center;
          font-size: 12px;
          font-weight: 500;
          max-width: 50%; }
          .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element .avatar-container .avatar {
            height: 25px;
            width: 25px;
            border-radius: 50%;
            margin-right: 10px;
            object-fit: cover; }
        .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element .availability {
          background-color: #424242;
          color: #33BC28;
          border: 0.3px solid #33BC28;
          border-radius: 19px;
          padding: 6px 20px; }
        .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element .chaticon-container {
          cursor: pointer; }
          .meeting-container .patient-rightbar .doctor-queue-container .doctor-queue-element .chaticon-container .svg-path {
            fill: white; }
  .meeting-container .patient-rightbar.white .icon-container {
    background-color: #ffffff; }
  .meeting-container .patient-rightbar.white .call-feature-svg {
    fill: #757575; }
  .meeting-container .patient-rightbar.white .doctor-queue-container {
    background-color: #ffffff; }
    .meeting-container .patient-rightbar.white .doctor-queue-container .title {
      color: #29292C; }
    .meeting-container .patient-rightbar.white .doctor-queue-container .doctor-queue-element {
      color: #29292C;
      background-color: #f1f1f1;
      padding: 18px 22px; }
      .meeting-container .patient-rightbar.white .doctor-queue-container .doctor-queue-element .availability {
        background: #f1f1f1; }
      .meeting-container .patient-rightbar.white .doctor-queue-container .doctor-queue-element .chaticon-container .svg-path {
        fill: #757575; }
  .meeting-container .preview-wrapper {
    width: 100%;
    height: 100%;
    position: relative; }
    .meeting-container .preview-wrapper .preview-video {
      width: 100%;
      height: 100%;
      object-fit: cover; }
    .meeting-container .preview-wrapper .placeholder-image {
      width: 100%;
      height: 100%;
      background-color: #303030;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      font-size: 26px;
      font-weight: 600;
      color: #ffffff; }
      .meeting-container .preview-wrapper .placeholder-image .round-icon {
        margin-top: 20px;
        background-color: #168ACF;
        width: 230px;
        height: 230px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 100px; }
    .meeting-container .preview-wrapper .button-container {
      bottom: 30px;
      position: absolute;
      width: 100%;
      display: flex;
      justify-content: center; }
      .meeting-container .preview-wrapper .button-container .control-button {
        margin-right: 30px;
        cursor: pointer; }
    .meeting-container .preview-wrapper .svg-path {
      fill: #ffffff; }
    .meeting-container .preview-wrapper .svg-circle {
      fill: #535353;
      fill-opacity: 0.8; }
  .meeting-container .preview-wrapper.white .placeholder-image {
    background-color: #f1f1f1;
    color: #29292C; }
    .meeting-container .preview-wrapper.white .placeholder-image .round-icon {
      background-color: #168ACF; }
  .meeting-container .preview-wrapper.white .svg-path {
    fill: #757575; }
  .meeting-container .preview-wrapper.white .svg-circle {
    fill: #ffffff;
    fill-opacity: 1; }

.call-container {
  background-color: black;
  width: 100%;
  height: 100%; }
  .call-container .call-publisher {
    position: relative; }
    .call-container .call-publisher > div {
      width: 100%;
      height: 100%; }
    .call-container .call-publisher .name-display {
      position: absolute;
      bottom: 10px;
      left: 10px;
      color: #f1f1f1;
      font-size: 14px;
      z-index: 1; }
  .call-container .call-subscriber {
    position: relative; }
    .call-container .call-subscriber .audio-icon {
      position: absolute;
      top: 10px;
      left: 10px;
      z-index: 1;
      width: 34px;
      height: 34px;
      overflow: hidden; }
    .call-container .call-subscriber .name-display {
      position: absolute;
      bottom: 10px;
      left: 10px;
      color: #f1f1f1;
      font-size: 14px;
      z-index: 1; }
    .call-container .call-subscriber > div {
      width: 100%;
      height: 100%; }
  .call-container .call-button-container {
    position: absolute;
    width: 100%;
    bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1; }
    .call-container .call-button-container .call-buttons {
      margin-right: 20px;
      cursor: pointer; }
  .call-container .svg-path {
    fill: #ffffff; }
  .call-container .svg-circle {
    fill: #757575;
    fill-opacity: 0.8; }

.call-container.white {
  background-color: #f1f1f1; }
  .call-container.white .svg-path {
    fill: #757575; }
  .call-container.white .svg-circle {
    fill: #ffffff;
    fill-opacity: 1; }

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

.vhangout {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap; }

.single {
  position: relative; }
  .single .call-publisher {
    position: absolute; }

.precall-container {
  background-color: #303030;
  min-height: 100vh;
  padding: 35px;
  display: flex;
  flex-direction: column;
  align-content: center; }
  .precall-container .header {
    text-align: center;
    color: white;
    margin-bottom: 30px; }
    .precall-container .header .title {
      font-size: 58px;
      font-weight: 300;
      margin-bottom: 5px; }
    .precall-container .header .subtitle {
      font-size: 16px; }
  .precall-container .main-content {
    color: white;
    display: flex;
    justify-content: center; }
    .precall-container .main-content .preview-card {
      width: 656px;
      background-color: #343434;
      border-radius: 4px;
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
      padding: 30px;
      position: relative; }
      .precall-container .main-content .preview-card .preview-video-container {
        height: 324px;
        width: 100%;
        margin-bottom: 35px;
        display: flex;
        justify-content: center;
        align-items: center; }
        .precall-container .main-content .preview-card .preview-video-container .preview-video {
          width: 100%;
          height: 100%;
          object-fit: contain; }
      .precall-container .main-content .preview-card .controls {
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 30px; }
        .precall-container .main-content .preview-card .controls .control-item {
          width: 30%;
          display: flex;
          flex-direction: column;
          align-items: center;
          height: 185px;
          justify-content: space-between; }
          .precall-container .main-content .preview-card .controls .control-item .name {
            font-size: 14px;
            text-transform: uppercase; }
          .precall-container .main-content .preview-card .controls .control-item .control-select {
            width: 100%;
            margin-bottom: 25px;
            color: #ffffff;
            font-size: 16px; }
            .precall-container .main-content .preview-card .controls .control-item .control-select .ant-select-selector {
              padding: 0px;
              padding-right: 10px;
              background-color: transparent;
              border: none;
              border-bottom: 1px solid #C7C7C7;
              box-shadow: none; }
            .precall-container .main-content .preview-card .controls .control-item .control-select .ant-select-arrow {
              color: #ffffff; }
          .precall-container .main-content .preview-card .controls .control-item .ant-switch.ant-switch-checked {
            background: #EA0089; }
          .precall-container .main-content .preview-card .controls .control-item .speaker-test {
            cursor: pointer; }
      .precall-container .main-content .preview-card .button-container {
        width: 100%;
        display: flex;
        justify-content: center;
        height: 54px; }
        .precall-container .main-content .preview-card .button-container .join-button {
          width: 100%;
          height: 100%;
          background-color: #EA0089;
          border-radius: 4px;
          border: none;
          font-weight: 600;
          font-size: 14px;
          color: white; }
        .precall-container .main-content .preview-card .button-container .join-button:focus {
          outline: none; }
        .precall-container .main-content .preview-card .button-container .join-button:hover {
          background-color: rgba(234, 0, 137, 0.8); }
      .precall-container .main-content .preview-card .input-container {
        width: 100%;
        margin-bottom: 20px; }
        .precall-container .main-content .preview-card .input-container input {
          width: 100%;
          height: 54px;
          background-color: #303030;
          border: none;
          border-radius: 4px;
          padding: 16px;
          font-size: 16px; }
          .precall-container .main-content .preview-card .input-container input::placeholder {
            font-size: 16px; }
        .precall-container .main-content .preview-card .input-container input:focus {
          border: 0.6px solid #EA0089;
          outline: none; }
    .precall-container .main-content .phone-mode-container {
      position: absolute;
      right: 100%;
      bottom: 20%;
      display: flex;
      flex-direction: column; }
      .precall-container .main-content .phone-mode-container .phone-image {
        align-self: flex-start; }
      .precall-container .main-content .phone-mode-container .phone-mode-content {
        width: 305px;
        padding: 20px;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        background-color: #343434; }
        .precall-container .main-content .phone-mode-container .phone-mode-content .title {
          font-size: 24px;
          margin-bottom: 20px; }
        .precall-container .main-content .phone-mode-container .phone-mode-content .subtitle {
          font-size: 16px;
          margin-bottom: 5px; }
        .precall-container .main-content .phone-mode-container .phone-mode-content .content {
          font-weight: 300;
          font-size: 14px;
          margin-bottom: 20px; }
        .precall-container .main-content .phone-mode-container .phone-mode-content .switch-content {
          font-weight: 300;
          font-size: 14px; }
          .precall-container .main-content .phone-mode-container .phone-mode-content .switch-content .ant-switch.ant-switch-checked {
            background: #EA0089; }
          .precall-container .main-content .phone-mode-container .phone-mode-content .switch-content .phone-switch {
            margin-left: 10px; }

@media screen and (max-width: 768px) {
  .precall-container {
    padding: 40px 20px; }
    .precall-container .header {
      margin-bottom: 30px; }
      .precall-container .header .title {
        font-size: 50px;
        margin-bottom: 5px; }
      .precall-container .header .subtitle {
        font-size: 14px; }
    .precall-container .main-content .preview-card {
      width: 100%;
      background-color: transparent;
      box-shadow: none;
      padding: 0px; }
      .precall-container .main-content .preview-card .preview-video-container {
        height: 233px;
        margin-bottom: 25px; }
      .precall-container .main-content .preview-card .controls {
        margin-bottom: 20px; }
        .precall-container .main-content .preview-card .controls .control-item .name {
          font-size: 12px; }
        .precall-container .main-content .preview-card .controls .control-item .ant-select {
          width: 100%; }
      .precall-container .main-content .preview-card .input-container {
        width: 100%;
        margin-bottom: 10px; }
        .precall-container .main-content .preview-card .input-container input {
          border: 0.6px solid #EA0089;
          box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); }
      .precall-container .main-content .preview-card .button-container {
        margin-bottom: 20px; }
    .precall-container .main-content .phone-mode-container {
      position: relative;
      right: 0px;
      bottom: 0px;
      width: 100%;
      padding: 15px;
      box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); }
      .precall-container .main-content .phone-mode-container .phone-image {
        position: absolute;
        right: 20px;
        top: 15px; }
      .precall-container .main-content .phone-mode-container .phone-mode-content {
        background-color: transparent;
        width: 100%;
        padding: 20px;
        box-shadow: none; } }

.patient-call-container {
  width: 100vw;
  height: 100vh;
  display: flex;
  overflow: hidden;
  position: relative; }

.expanded-mobile-drawer {
  position: absolute;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 2; }
  .expanded-mobile-drawer .drawer-content {
    height: 100%;
    width: 70%;
    z-index: 2;
    background-color: #424242;
    box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.2); }
    .expanded-mobile-drawer .drawer-content .drawer-header {
      padding: 20px;
      display: flex;
      justify-content: space-between;
      color: #ffffff; }
    .expanded-mobile-drawer .drawer-content .Doctor-queue-header {
      padding: 15px 20px;
      color: white;
      font-size: 14px;
      font-weight: 500; }
    .expanded-mobile-drawer .drawer-content .mobile-doctor-queue-element {
      color: white;
      display: flex;
      justify-content: space-between;
      height: 66px;
      width: 100%;
      align-items: center;
      background-color: #303030;
      padding: 0px 20px; }
      .expanded-mobile-drawer .drawer-content .mobile-doctor-queue-element .avatar-container .avatar {
        height: 25px;
        width: 25px;
        border-radius: 50%;
        margin-right: 10px;
        object-fit: cover; }
      .expanded-mobile-drawer .drawer-content .mobile-doctor-queue-element .doctor-details {
        display: flex;
        flex: 1;
        flex-direction: column;
        font-size: 14px;
        font-weight: 500; }
        .expanded-mobile-drawer .drawer-content .mobile-doctor-queue-element .doctor-details .availability {
          background-color: #424242;
          color: #33BC28;
          border: 0.3px solid #33BC28;
          border-radius: 19px;
          max-width: 50%; }
      .expanded-mobile-drawer .drawer-content .mobile-doctor-queue-element .chaticon-container {
        cursor: pointer; }
    .expanded-mobile-drawer .drawer-content .feature-icons-container {
      margin-top: 20px;
      padding: 0px 20px; }
      .expanded-mobile-drawer .drawer-content .feature-icons-container .line-break {
        margin-bottom: 35px;
        border-top: 1px solid rgba(255, 255, 255, 0.5); }
      .expanded-mobile-drawer .drawer-content .feature-icons-container .feature-icon {
        display: flex;
        align-items: center;
        margin-bottom: 30px;
        width: 100%; }
        .expanded-mobile-drawer .drawer-content .feature-icons-container .feature-icon span {
          font-weight: 500;
          font-size: 11px;
          color: #ffffff;
          margin-left: 10px; }
        .expanded-mobile-drawer .drawer-content .feature-icons-container .feature-icon .call-feature-svg {
          height: 24px;
          width: 24px;
          fill: white; }
    .expanded-mobile-drawer .drawer-content .svg-path {
      fill: white; }

.expanded-mobile-drawer.white .drawer-content {
  background-color: #ffffff; }
  .expanded-mobile-drawer.white .drawer-content .drawer-header {
    color: #29292C; }
  .expanded-mobile-drawer.white .drawer-content .Doctor-queue-header {
    color: #29292C; }
  .expanded-mobile-drawer.white .drawer-content .mobile-doctor-queue-element {
    color: #29292C;
    background-color: #f1f1f1; }
    .expanded-mobile-drawer.white .drawer-content .mobile-doctor-queue-element .doctor-details .availability {
      background-color: #f1f1f1; }
    .expanded-mobile-drawer.white .drawer-content .mobile-doctor-queue-element .chaticon-container {
      cursor: pointer; }
  .expanded-mobile-drawer.white .drawer-content .feature-icons-container .feature-icon span {
    color: #29292C; }
  .expanded-mobile-drawer.white .drawer-content .feature-icons-container .feature-icon .call-feature-svg {
    fill: #757575; }
  .expanded-mobile-drawer.white .drawer-content .svg-path {
    fill: #757575; }

.mobile-drawer-icon {
  position: absolute;
  left: 20px;
  top: 20px;
  z-index: 2; }
  .mobile-drawer-icon .svg-circle {
    fill: #4C4C4C;
    opacity: 0.7; }
  .mobile-drawer-icon .svg-path {
    fill: white; }

.mobile-drawer-icon.white .svg-circle {
  fill: #ffffff;
  opacity: 1; }

.mobile-drawer-icon.white .svg-path {
  fill: #757575; }

.checkout-form-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5; }
  .checkout-form-backdrop .checkout-form-modal {
    z-index: 5;
    border-radius: 4px;
    background-color: #434343;
    width: 500px;
    height: 260px;
    display: flex;
    flex-direction: column;
    padding: 20px; }
    .checkout-form-backdrop .checkout-form-modal .checkout-form-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #9E9E9E;
      margin-bottom: 30px; }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-header .title {
        font-weight: 500;
        font-size: 20px;
        color: #ffffff; }
    .checkout-form-backdrop .checkout-form-modal .checkout-form-content {
      display: flex;
      flex-direction: column;
      align-items: flex-end; }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-content .card-detail-label {
        width: 100%;
        margin-bottom: 30px;
        font-size: 18px;
        color: #ffffff; }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-content .card-element-container {
        width: 100%;
        margin-bottom: 30px; }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-content .pay-button {
        font-weight: bold;
        font-size: 14px;
        line-height: 18px;
        background: #EA0089;
        width: 150px;
        padding: 10px;
        border-radius: 4px;
        color: #FFFFFF;
        cursor: pointer;
        border: none;
        margin-bottom: 20px; }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-content .pay-button:hover {
        background-color: rgba(234, 0, 137, 0.8); }
      .checkout-form-backdrop .checkout-form-modal .checkout-form-content .pay-button:focus {
        outline: none; }
  .checkout-form-backdrop .checkout-form-modal.white {
    background-color: white; }
    .checkout-form-backdrop .checkout-form-modal.white .checkout-form-header .title {
      color: #29292C; }
    .checkout-form-backdrop .checkout-form-modal.white .checkout-form-content .card-detail-label {
      color: #757575; }

@media screen and (max-width: 768px) {
  .checkout-form-backdrop {
    padding: 15px; } }