.AsideNav {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: stretch;
  z-index: 100;
}
.AsideNav__Link {
  cursor: pointer;
}
.AsideNav__Nav {
  position: relative;
  width: 60px;
  padding: 20px 5px;
  background: #292929;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.AsideNav__Item {
  padding: 10px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: #16a085;
  cursor: pointer;
  border-radius: 5px;
  margin: 20px 0;
}
.AsideNav__Item--isCurrent {
  color: #16a085;
  background: #fff;
}
.AsideNav__Item svg {
  font-size: 2.5rem;
}
.AsideNav__Item span {
  font-size: 10px;
  font-weight: 700;
  text-align: center;
}
.AsideNav__Body {
  position: relative;
  width: 440px;
  background: #f1f3f7;
  overflow-y: scroll;
}
.AsideNav__Body--withoutScroll {
  overflow: hidden;
}

._Alert {
  background: #fff;
  padding: 10px 20px;
  border-left: 3px solid transparent;
  border-radius: 5px;
}
._Alert.-Error {
  border-color: #f35468;
}

._Button {
  text-decoration: none;
  color: inherit;
  display: inline-block;
  white-space: nowrap;
  padding: 0 20px;
  border-radius: 5px;
  vertical-align: middle;
  cursor: pointer;
  height: 2.25em;
  line-height: 2.25em;
  user-select: none;
  border: 1px solid #ececec;
  background: #fff;
/* Type */
/* Size */
}
._Button:focus {
  border-color: #16a085;
  box-shadow: 0 0 3px 1px #16a085;
}
._Button--Notice._Button {
  border-color: #379d79;
  background: #379d79;
  color: #fff;
}
._Button--Success._Button {
  border-color: #379d79;
  background: #379d79;
  color: #fff;
}
._Button--Warning._Button {
  border-color: #ecc63e;
  background: #ecc63e;
  color: #fff;
}
._Button--Danger._Button {
  border-color: #f35468;
  background: #f35468;
  color: #fff;
}
._Button--Ghost._Button {
  background: transparent;
  color: #5c5c5c;
}
._Button--Ghost._Button--Notice._Button {
  color: #379d79;
}
._Button--Ghost._Button--Success._Button {
  color: #379d79;
}
._Button--Ghost._Button--Warning._Button {
  color: #ecc63e;
}
._Button--Ghost._Button--Danger._Button {
  color: #f35468;
}
._Button--Bigger._Button {
  font-size: 1.1rem;
}
._Button--Biggest._Button {
  font-size: 1.3rem;
}
._Button--Smaller._Button {
  font-size: 0.9rem;
}
._Button--Smallest._Button {
  font-size: 0.8rem;
}

._AsyncButton--Pending::before {
  content: ' ';
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.2em;
  margin-right: 0.6em;
  border: 2px solid;
  border-left-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spin linear 2s infinite;
}
@-moz-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-o-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

._Badge {
  display: inline-block;
  font-size: 1rem;
  line-height: 1em;
  padding: 0.25em 0.5em;
  border-radius: 5px;
  color: #fff;
  white-space: nowrap;
/* Size */
}
._Badge--Notice._Badge {
  color: #fff;
  background: #379d79;
}
._Badge--Success._Badge {
  color: #fff;
  background: #379d79;
}
._Badge--Warning._Badge {
  color: #fff;
  background: #ecc63e;
}
._Badge--Danger._Badge {
  color: #fff;
  background: #f35468;
}
._Badge--Bigger._Badge {
  font-size: 1.1rem;
}
._Badge--Biggest._Badge {
  font-size: 1.3rem;
}
._Badge--Smaller._Badge {
  font-size: 0.9rem;
}
._Badge--Smallest._Badge {
  font-size: 0.8rem;
}

._Group {
  white-space: nowrap;
  display: inline-block;
}
._Group > ._Button:not(:last-child) {
  margin-right: 15px;
}
._Group > .Link:not(:last-child) {
  margin-right: 15px;
}

._Dialog {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  background: #fff;
  margin: auto;
  border-radius: 5px;
}
._Dialog__Header {
  font-size: 1.4em;
  padding: 20px;
  background: #16a085;
  color: #fff;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
._Dialog__Body {
  padding: 20px;
}
._Dialog__Footer {
  text-align: right;
  padding: 20px;
}
._Dialog__Overlay {
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px;
  background: rgba(0,0,0,0.7);
}
._Dialog--Notice ._Dialog__Header {
  background: #379d79;
}
._Dialog--Success ._Dialog__Header {
  background: #379d79;
}
._Dialog--Warning ._Dialog__Header {
  background: #ecc63e;
}
._Dialog--Danger ._Dialog__Header {
  background: #f35468;
}

._DropDown {
  height: 0;
  width: 0;
  color: #5c5c5c;
  font-weight: normal;
  position: relative;
  text-align: left;
}
._DropDown__Body {
  position: absolute;
  z-index: 1000;
  padding: 5px 0;
  background: #fff;
  border-radius: 5px;
  border: 1px solid #e0e3e9;
  max-height: 250px;
  overflow: auto;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
._DropDown--Bottom ._DropDown__Body {
  top: 0;
  transform: translate(-50%, 0);
}
._DropDown--LeftBottom ._DropDown__Body {
  right: 0;
  top: 0;
}
._DropDown--LeftTop ._DropDown__Body {
  right: 0;
  bottom: 0;
}
._DropDown__Overlay {
  position: fixed;
  z-index: 9;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
}

._Preloader {
  display: flex;
  height: 100%;
  color: #16a085;
}
._Preloader::before {
  content: ' ';
  display: block;
  margin: auto;
  text-align: center;
  width: 2.1em;
  height: 2.1em;
  border-width: 0.2em;
  border-style: solid;
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  animation: spin linear 2s infinite;
}
@-moz-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-o-keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

._Form__HiddenSubmit {
  display: none;
}

._Grid {
  margin: 10px 0;
}
._Grid--noHidden {
  overflow: visible;
}
._Grid__Row {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}
._Grid__Col {
  padding: 10px;
  flex: 1 0 0;
}
._Grid__Col--1 {
  width: 8.333333333333334%;
  flex: 0 0 8.333333333333334%;
}
._Grid__Col--ColOffset_1 {
  margin-left: 8.333333333333334%;
}
._Grid__Col--2 {
  width: 16.666666666666668%;
  flex: 0 0 16.666666666666668%;
}
._Grid__Col--ColOffset_2 {
  margin-left: 16.666666666666668%;
}
._Grid__Col--3 {
  width: 25%;
  flex: 0 0 25%;
}
._Grid__Col--ColOffset_3 {
  margin-left: 25%;
}
._Grid__Col--4 {
  width: 33.333333333333336%;
  flex: 0 0 33.333333333333336%;
}
._Grid__Col--ColOffset_4 {
  margin-left: 33.333333333333336%;
}
._Grid__Col--5 {
  width: 41.66666666666667%;
  flex: 0 0 41.66666666666667%;
}
._Grid__Col--ColOffset_5 {
  margin-left: 41.66666666666667%;
}
._Grid__Col--6 {
  width: 50%;
  flex: 0 0 50%;
}
._Grid__Col--ColOffset_6 {
  margin-left: 50%;
}
._Grid__Col--7 {
  width: 58.333333333333336%;
  flex: 0 0 58.333333333333336%;
}
._Grid__Col--ColOffset_7 {
  margin-left: 58.333333333333336%;
}
._Grid__Col--8 {
  width: 66.66666666666667%;
  flex: 0 0 66.66666666666667%;
}
._Grid__Col--ColOffset_8 {
  margin-left: 66.66666666666667%;
}
._Grid__Col--9 {
  width: 75%;
  flex: 0 0 75%;
}
._Grid__Col--ColOffset_9 {
  margin-left: 75%;
}
._Grid__Col--10 {
  width: 83.33333333333334%;
  flex: 0 0 83.33333333333334%;
}
._Grid__Col--ColOffset_10 {
  margin-left: 83.33333333333334%;
}
._Grid__Col--11 {
  width: 91.66666666666667%;
  flex: 0 0 91.66666666666667%;
}
._Grid__Col--ColOffset_11 {
  margin-left: 91.66666666666667%;
}
._Grid__Col--12 {
  width: 100%;
  flex: 0 0 100%;
}
._Grid__Col--ColOffset_12 {
  margin-left: 100%;
}
._Grid__Col--AlignStart {
  align-self: flex-start;
}
._Grid__Col--AlignEnd {
  align-self: flex-end;
}
._Grid__Col--AlignCenter {
  align-self: center;
}

._LoadingBar {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3px;
  overflow: hidden;
}
._LoadingBar__Progress {
  display: block;
  background: #f00;
  height: 100%;
  width: 0;
}
._LoadingBar.-Pending ._LoadingBar__Progress {
  width: 0;
  transition: none;
}
._LoadingBar.-Request ._LoadingBar__Progress {
  width: 70%;
  height: 100%;
  transition: width 2s;
}
._LoadingBar.-Done ._LoadingBar__Progress {
  width: 100%;
  transition: width 1s;
}

._Menu__Option {
  padding: 10px 20px;
}

._Modal {
  margin: auto;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  position: relative;
}
._Modal__Close {
  width: 2em;
  height: 2em;
  padding: 10px;
  color: #16a085;
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
}
._Modal__Header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 30px;
  border-bottom: 1px solid #ececec;
}
._Modal__Body {
  padding: 0;
}
._Modal__Overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px 50px;
  background: rgba(0,0,0,0.7);
  display: flex;
  overflow: auto;
}

._Nav {
  display: flex;
  flex-direction: row;
}
._Nav__Option {
  padding: 10px 20px;
  position: relative;
  cursor: pointer;
}
._Nav__Option--isActive {
  background: #16a085;
}

._Options__Option {
  padding: 5px 20px;
  white-space: nowrap;
  cursor: pointer;
}
._Options__Option:hover {
  background: #f1f3f7;
}
._Options__Option--Selected {
  background: #379d79;
  color: #fff;
}

._Pagination {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  border-radius: 5px;
/* Size */
}
._Pagination__Select {
  padding: 0 15px;
}
._Pagination__Previous {
  border-radius: 5px 0 0 5px;
}
._Pagination__Next {
  border-radius: 0 5px 5px 0;
}
._Pagination__Previous,
._Pagination__Next {
  height: 2.25em;
  line-height: 2.25em;
  padding: 0 15px;
  background: #fff;
  border: 1px solid #ececec;
  cursor: pointer;
  display: flex;
  align-items: center;
}
._Pagination__Previous svg,
._Pagination__Next svg {
  color: #899abe;
}
._Pagination__Previous--Disabled,
._Pagination__Next--Disabled {
  color: #e1eafb;
  box-shadow: none;
  border-color: #d7ebe4;
}
._Pagination__Previous--Disabled svg,
._Pagination__Next--Disabled svg {
  color: #e1eafb;
}
._Pagination--Bigger {
  font-size: 1.1rem;
}
._Pagination--Biggest {
  font-size: 1.3rem;
}
._Pagination--Smaller {
  font-size: 0.9rem;
}
._Pagination--Smallest {
  font-size: 0.8rem;
}

._Table {
  position: relative;
}
._Table__Table {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
  position: relative;
}
._Table__Header {
  display: table-header-group;
}
._Table__Column {
  display: table-cell;
  font-size: 0.9em;
  line-height: 0.9em;
  vertical-align: middle;
  border: 1px solid #ececec;
  color: #95a5a6;
}
._Table__Column:first-of-type {
  border-left: none;
}
._Table__Body {
  display: table-row-group;
}
._Table__Row {
  display: table-row;
}
._Table__Cell {
  display: table-cell;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: middle;
}

._Tabs__Control {
  background: #fff;
  display: flex;
  padding: 0 20px;
  border-bottom: 1px solid #ececec;
}
._Tabs__Title {
  padding: 10px 20px;
  cursor: pointer;
}
._Tabs__Title--Active {
  background: #16a085;
  color: #fff;
}
._Tabs__Tab {
  display: block;
}

._Toast {
  background: #fff;
  border-left: 3px solid #ececec;
  padding: 10px 20px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  margin-top: 20px;
}
._Toast__Title {
  font-size: 1.2em;
  color: #4a4a4a;
}
._Toast__Title :not(:last-child) {
  margin-bottom: 0.4em;
}
._Toast__Message {
  white-space: pre-line;
}
._Toast--Notice {
  border-color: #379d79;
}
._Toast--Success {
  border-color: #379d79;
}
._Toast--Warning {
  border-color: #ecc63e;
}
._Toast--Danger {
  border-color: #f35468;
}
._Toast__Overlay {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  position: absolute;
  top: 0;
  right: 20px;
}

.OnShiftStatus {
  box-sizing: border-box;
  border-radius: 50%;
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 10px;
  height: 10px;
  border: 1px solid #fff;
  box-shadow: 1px 1px 2px rgba(0,0,0,0.25);
  background: #999;
}
.OnShiftStatus--OnShift {
  background: #75cbae;
}

.UserAvatar {
  position: relative;
}
.UserAvatar__Photo {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
  border: 2px solid #fff;
  background-position: center center;
  background-size: cover;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 31px;
  background-color: #b8b8b8;
  color: #5c5c5c;
}
.UserAvatar__Photo img {
  max-width: 100%;
}
.UserAvatar:hover .UserAvatar__Upload {
  display: block;
}
.UserAvatar__Upload {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 12px;
  background: rgba(0,0,0,0.7);
  color: #fff;
}
.UserAvatar__Upload svg {
  display: block;
  margin: 0 auto;
  height: 10px;
  margin-top: 1px;
}

.BottomNav {
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  z-index: 1;
  display: flex;
  justify-content: space-around;
}
.BottomNav__Item {
  width: 55px;
  height: 55px;
  padding: 10px;
  box-sizing: border-box;
}
.BottomNav__Item svg {
  width: 100%;
  height: 100%;
}
.BottomNav__Item.active {
  color: #16a085;
}

.Outdated {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translate(-50%, 0);
  display: inline-block;
  background: #404040;
  font-size: 12px;
  color: #fff;
  z-index: 99999999999;
  white-space: nowrap;
  padding: 15px;
  border-radius: 5px;
}
.Outdated__Refresh {
  display: inline-block;
  color: #a4c6ff;
  font-weight: bold;
  cursor: pointer;
  margin-left: 20px;
}

.Link {
  color: #16a085;
  text-decoration: none;
}

.Notification__Preloader {
  margin: 20px 0;
  width: 450px;
}
.Notification__List {
  list-style-type: none;
  text-align: center;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
  background-color: #e1f3ec;
  padding: 0;
  margin: 0;
  background: #fff;
}
.Notification .List__Item {
  width: 450px;
  border-bottom: 1px solid #379d79;
  transition: all 1s ease-in-out;
}
.Notification .List__Item .Button {
  width: 40px;
  height: 40px;
}
.Notification .List__Item .Content {
  width: 100%;
  font-size: 11px;
  padding-left: 10px;
  text-align: center;
}
.Notification .List__Item .Content .FlexRowGroup {
  display: flex;
  justify-content: space-between;
}
.Notification .List__Item .Content .FlexRowGroup .FileName {
  width: 90%;
}
.Notification .List__Item .Content .FlexRowGroup .FileNameText {
  font-weight: bold;
  margin-top: 5px;
  margin-bottom: 5px;
  text-align: left;
}
.Notification .List__Item .Content .FlexRowGroup .Regular {
  color: #4a4a4a;
}
.Notification .List__Item .Content .FlexRowGroup .DownloadLink {
  color: #379d79;
  text-decoration-line: underline;
  cursor: pointer;
}
.Notification .List__Item .Content .FlexRowGroup .ProgressText {
  color: #808080;
  font-size: 9px;
  text-align: right;
  width: 110px;
}
.Notification .List__Item .Content .Text {
  color: #727f8c;
  font-weight: bold;
  margin: 5px auto;
  display: flex;
  justify-content: left;
  align-items: center;
  font-size: 9px;
}
.Notification .List__Item .Content .Controls {
  cursor: pointer;
}
.Notification .List__Item .Content .Controls,
.Notification .List__Item .Content .From {
  display: flex;
  align-items: flex-end;
}
.Notification .List__Item .Content .Controls svg,
.Notification .List__Item .Content .From svg {
  color: #379d79;
  margin: 0 5px;
}
.Notification .List__Item .Content .FileImport {
  width: 100%;
  height: 3px;
  border-radius: 3px;
}
.Notification .List__Item .Content .ImportSuccess {
  background: #16a085;
}
.Notification .List__Item .Content .ImportWarning {
  background: #ecc63e;
}
.Notification .List__Item .Content .ImportError {
  background: #f35468;
}
.Notification .List__Item .Content .ImportProgress {
  background: rgba(0,0,0,0.2);
}
.Notification .List__Item .Content .InformationBox {
  width: 90%;
  max-width: 380px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  box-sizing: border-box;
  border: 0.25px solid #a7a7a7;
  border-radius: 3px;
  display: flex;
}
.Notification .List__Item .Content .InfoBoxContentPad {
  padding-top: 5px;
  padding-left: 2px;
}
.Notification .List__Item .Content .InfoBoxHeader {
  font-size: 9px;
  font-weight: bold;
  padding: 0 2px 2px 2px;
  color: #000;
  text-align: left;
}
.Notification .List__Item .Content .InfoBoxContent {
  font-size: 9px;
  padding: 2px;
  color: #000;
  text-align: left;
}
.Notification .List__Item .Content .WarningBox {
  border-left: 4px solid #ecc63f;
  height: 72px;
}
.Notification .List__Item .Content .WarningBox .ButtonWrapper {
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: left;
}
.Notification .List__Item .Content .WarningBox .DownloadButton {
  width: 80px;
  height: 15px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  font-size: 9px;
  background: #2d2e2e;
  border-color: #2d2e2e;
  justify-content: center;
}
.Notification .List__Item .Content .ErrorBox {
  border-left: 4px solid #f35468;
  height: 40px;
}
.Notification .List__Item--group {
  display: flex;
  padding: 10px;
  text-decoration: none;
  text-align: left;
  font-size: 0.7em;
  opacity: 0.8;
  align-items: center;
}
.Notification .List__Item--group:hover {
  opacity: 1;
}
.Notification .List__Item--navigation {
  width: 450px;
  justify-items: center;
  transition: all 1s ease-in-out;
  display: none;
}
.Notification .List__Item--show {
  display: list-item;
  cursor: pointer;
}

.Notification {
  border-radius: 6px;
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.Notification__DropDown {
  position: absolute;
  top: 0;
  right: 20px;
  max-height: 100%;
  z-index: 1000;
  color: #5c5c5c;
  padding: 20px 0;
}
.Notification__Header {
  text-align: center;
  background: #fff;
  color: #379d79;
  padding: 10px 0;
  border-bottom: 1px solid #379d79;
  transition: all 1s ease-in-out;
}
.Notification__List {
  overflow-y: scroll;
}
.Notification__Bell::after {
  min-width: 20px;
  height: 20px;
  content: attr(notifications-count);
  background: #ecc63e;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  position: absolute;
  top: -10px;
  right: -10px;
  transition: 0.3s;
  opacity: 1;
  transform: scale(0);
  will-change: opacity, transform;
}
.Notification__Bell--show::after {
  opacity: 1;
  transform: scale(1);
}
.Notification__Bell--notify svg {
  animation: bell 1s ease-out;
  transform-origin: center top;
}
@-moz-keyframes bell {
  0% {
    transform: rotate(35deg);
  }
  12.5% {
    transform: rotate(-30deg);
  }
  25% {
    transform: rotate(25deg);
  }
  37.5% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(15deg);
  }
  62.5% {
    transform: rotate(-10deg);
  }
  75% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0);
  }
}
@-webkit-keyframes bell {
  0% {
    transform: rotate(35deg);
  }
  12.5% {
    transform: rotate(-30deg);
  }
  25% {
    transform: rotate(25deg);
  }
  37.5% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(15deg);
  }
  62.5% {
    transform: rotate(-10deg);
  }
  75% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0);
  }
}
@-o-keyframes bell {
  0% {
    transform: rotate(35deg);
  }
  12.5% {
    transform: rotate(-30deg);
  }
  25% {
    transform: rotate(25deg);
  }
  37.5% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(15deg);
  }
  62.5% {
    transform: rotate(-10deg);
  }
  75% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0);
  }
}
@keyframes bell {
  0% {
    transform: rotate(35deg);
  }
  12.5% {
    transform: rotate(-30deg);
  }
  25% {
    transform: rotate(25deg);
  }
  37.5% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(15deg);
  }
  62.5% {
    transform: rotate(-10deg);
  }
  75% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0);
  }
}

.Toaster {
  position: fixed;
  right: 20px;
  top: 70px;
  z-index: 1000;
  color: #5c5c5c;
}
.Toaster__Toast {
  background: #fff;
  padding: 10px;
  margin-bottom: 10px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  width: 300px;
  cursor: pointer;
  display: flex;
}
.Toaster__Toast > svg {
  color: #ecc63e;
  font-size: 24px;
  margin-right: 20px;
}
.Toaster__Title {
  font-weight: bold;
}

.LanguageSelect {
  margin-right: 10px;
  position: relative;
  font-weight: bold;
}
.LanguageSelect button {
  width: 43px;
  padding: 0 2px;
}
.LanguageSelect__Icons {
  position: relative;
  padding-left: 5px;
  font-size: 9px;
}
.LanguageSelect__Options {
  width: 100px;
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px 0;
  color: #16a085;
  left: 0px;
}
.LanguageSelect__Option {
  padding: 0 20px;
  line-height: 32px;
  cursor: pointer;
}
.LanguageSelect__Option--IsSelected {
  text-decoration: underline;
}
.VIpgJd-ZVi9od-ORHb-OEVmcd {
  display: none !important;
}
html,
body {
  top: 0px !important;
}

.Header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  background: #75cbad;
  color: #fff;
}
.Header__Background {
  display: none;
}
.Header__Background--isOpen {
  width: 100%;
  position: fixed;
  z-index: 9;
  background: rgba(0,0,0,0.7);
  height: 100vh;
  right: 0;
  display: block;
}
.Header__Burger {
  position: relative;
  align-items: center;
  padding: 20px;
  background: #75cbad;
  color: #fff;
  display: none;
  justify-content: space-between;
  flex-flow: row-reverse;
}
.Header__Burger .DateSlider {
  color: #fff;
}
.Header__Logo {
  text-transform: uppercase;
  font-size: 20px;
  margin-right: 20px;
}
.Header__Logo img {
  width: 200px;
}
.Header__Flex {
  display: flex;
  align-items: center;
}
.Header__User {
  display: inline-flex;
  margin-right: 20px;
  font-size: 18px;
  align-items: center;
  color: #fff;
}
.Header__User .UserAvatar {
  margin-right: 5px;
}
.Header ._Group {
  margin-right: 40px;
}
.App--isTablet .Header,
.App--isMobile .Header {
  z-index: 90;
  position: fixed;
  top: 0;
  left: 0;
  flex-direction: column;
  padding: 0;
  width: 290px;
  height: 100%;
  justify-content: start;
  align-items: flex-start;
  transform: translateX(-100%);
  transition: all 0.5s ease;
  background: #fff;
  border-right: 5px solid #16a085;
  border-bottom: 5px solid #16a085;
}
.App--isTablet .Header__Close,
.App--isMobile .Header__Close {
  padding: 16px 20px;
}
.App--isTablet .Header--isOpen,
.App--isMobile .Header--isOpen {
  transform: translateX(0);
}
.App--isTablet .Header__Burger,
.App--isMobile .Header__Burger {
  display: flex;
  z-index: 8;
}
.App--isTablet .Header__Burger--Button,
.App--isMobile .Header__Burger--Button {
  margin: 0 auto 0 0;
}
.App--isTablet .Header__Notification,
.App--isMobile .Header__Notification {
  margin-left: 10px;
}
.App--isTablet .Header__Burger .DateSlider,
.App--isMobile .Header__Burger .DateSlider {
  flex: 1;
  justify-content: center;
}
.App--isTablet .Header__Burger .DateSlider__Current,
.App--isMobile .Header__Burger .DateSlider__Current {
  margin-right: 0;
}
.App--isTablet .Header__Logo,
.App--isMobile .Header__Logo {
  width: 100%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #75cbad;
  margin-right: 0;
}
.App--isTablet .Header__Logo img,
.App--isMobile .Header__Logo img {
  width: 150px;
  padding: 0 30px;
}
.App--isTablet .Header__Flex,
.App--isMobile .Header__Flex {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  justify-content: start;
}
.App--isTablet .Header__Flex ._Group,
.App--isMobile .Header__Flex ._Group {
  display: flex;
  flex-flow: column;
}
.App--isTablet .Header__Flex >._Button,
.App--isMobile .Header__Flex >._Button {
  position: absolute;
  bottom: 15px;
  right: 15px;
}
.App--isTablet .Header__User,
.App--isMobile .Header__User {
  color: #75cbad;
  position: absolute;
  bottom: 15px;
  left: 15px;
  max-width: 70%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.App--isTablet .Header ._Group,
.App--isMobile .Header ._Group {
  margin-right: 0;
  padding: 20px;
}
.App--isTablet .Header ._Group button,
.App--isMobile .Header ._Group button {
  margin-bottom: 5%;
  background: none;
  border: none;
  font-size: 20px;
  color: #379d79;
}
.App--isTablet .Header ._Group ._Button--Warning,
.App--isMobile .Header ._Group ._Button--Warning {
  background: none;
  border: none;
  color: #ecc63e;
}

.DatePicker {
  position: relative;
  display: flex;
  justify-content: space-between;
  font-weight: 700;
  font-size: 14px;
}
.DatePicker__DropDown {
  position: absolute;
  z-index: 1000;
  left: 0px;
  color: #5c5c5c;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.--isMobile .DatePicker {
  color: #379d79;
  font-size: 11px;
}
.--isMobile .DatePicker__DropDown {
  width: 280px;
}
.--isMobile .DatePicker .react-calendar {
  padding: 10px;
}
.--isMobile .DatePicker .react-calendar__navigation__arrow {
  padding: 0 5px;
}
.--isMobile .DatePicker .react-calendar__month-view__weekdays__weekday abbr {
  padding: 5px;
}
.highlight--CurrentWeek {
  background: #379d79 !important;
  color: #fff;
}
.highlight--CurrentWeek abbr {
  background: #379d79 !important;
  color: #fff;
}
.highlight--Hovered {
  background: #75cbad !important;
  color: #fff;
}
.highlight--Hovered abbr {
  background: #75cbad !important;
  color: #fff;
}
.highlight--Current abbr {
  background: #379d79 !important;
  color: #fff;
}
.react-calendar__tile {
  position: relative;
}
.week-hover-trigger {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.DateSlider {
  white-space: nowrap;
  display: flex;
  align-items: center;
  font-size: 24px;
  font-weight: 600;
  margin: 0 5px;
  color: #16a085;
}
.DateSlider__Current {
  margin-right: 20px;
}
.DateSlider__Current--withPointer {
  cursor: pointer;
}
.DateSlider__Nav {
  display: flex;
  align-self: center;
  padding: 0 10px;
  cursor: pointer;
}
.DateSlider--isMobile {
  color: #16a085;
  font-size: 18px;
}
.DateSlider--isDisabled.DateSlider--isMobile {
  color: #4a4a4a !important;
}
.DateSlider--isDisabled {
  color: #5c5c5c;
}

.Submenu {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.Submenu__Options {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
}
.Submenu__Options ._Button {
  font-size: 14px !important;
  text-align: left;
}

.Caching {
  position: absolute;
  top: 0;
  width: 10%;
  height: 3px;
  background: #16a085;
  transition: width 2s ease-in;
}

._Form__HiddenButton {
  display: none;
}
._Form__Field {
  display: block;
}
._Form__Field--Inline {
  display: flex;
  align-items: center;
}
._Form__Field--Inline ._Form__Label {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}
._Form__Input {
  flex-shrink: 0;
}
._Form__Input--withoutLegend {
  width: 100%;
}
._Form__View {
  color: #4a4a4a;
}
._Form__Wrapper {
  width: 100%;
  display: flex;
  align-items: center;
}
._Form__Legend {
  margin-left: 15px;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._TextInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
}
._TextInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._TextInput input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
._TextInput input:focus {
  outline: none;
}
._TextInput input:disabled {
  background: #ecf0f1;
}
._TextInput__Wrapper {
  display: flex;
  align-items: center;
  height: 100%;
}
._TextInput__Postfix {
  display: inline-block;
  color: #899abe;
  padding-right: 10px;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._NumberInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
}
._NumberInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._NumberInput input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
._NumberInput input:focus {
  outline: none;
}
._NumberInput input:disabled {
  background: #ecf0f1;
}
._NumberInput__Wrapper {
  display: flex;
  align-items: center;
  height: 100%;
}
._NumberInput__Postfix {
  display: inline-block;
  color: #899abe;
  padding-right: 10px;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._TextareaInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
  height: 100%;
}
._TextareaInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._TextareaInput textarea {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
  resize: none;
}
._TextareaInput textarea:focus {
  outline: none;
}
._TextareaInput textarea:disabled {
  background: #ecf0f1;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._SelectInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
  line-height: 1;
}
._SelectInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._SelectInput select {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  font-size: 1rem;
  vertical-align: middle;
  width: 100%;
  height: 100%;
}
._SelectInput select:focus {
  outline: none;
}
._SelectInput select:disabled {
  background: #ecf0f1;
}
._SelectInput--Bigger {
  font-size: 1.1em;
}
._SelectInput--Biggest {
  font-size: 1.3em;
}
._SelectInput--Smaller {
  font-size: 0.9em;
}
._SelectInput--Smallest {
  font-size: 0.8em;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._CheckboxInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
  border: none;
  border-radius: 3px;
}
._CheckboxInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._CheckboxInput__Input {
  width: 100%;
  height: 100%;
  border: 1px solid #ececec;
  padding: 0.2em;
}
._CheckboxInput__Input--Checked {
  background: #379d79;
  color: #fff;
  border: 1px solid #379d79;
}
._CheckboxInput svg {
  display: block;
  width: 100%;
  height: 100%;
}
._CheckboxInput input {
  display: none;
}
._CheckboxInput.-isChecked::before {
  content: ' ';
  display: block;
  width: 50%;
  height: 100%;
  border: 2px solid #fff;
  border-top: 0;
  border-left: 0;
  margin: 0 auto;
  box-sizing: border-box;
  transform: rotate(35deg);
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._RadioInput {
  position: relative;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._TabsInput {
  position: relative;
}
._TabsInput__Input {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
  display: inline-flex;
  line-height: 2.25em;
  border: none;
}
._TabsInput__Input._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._TabsInput__Option {
  padding: 0 10px;
  cursor: pointer;
  border: 1px solid #ececec;
  margin-left: -1px;
}
._TabsInput__Option:first-child {
  border-radius: 5px 0 0 5px;
}
._TabsInput__Option:last-child {
  border-radius: 0 5px 5px 0;
}
._TabsInput__Option--isActive {
  position: relative;
  border: 1px solid #16a085;
  color: #16a085;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._TextInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
}
._TextInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._TextInput input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
._TextInput input:focus {
  outline: none;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._FileInput {
  text-align: center;
}
._FileInput__Input {
  display: none;
}
._FileInput__Image {
  display: flex;
  justify-content: space-between;
}
._FileInput__DropZone {
  width: 100%;
  border: 1px dashed;
  margin-bottom: 20px;
}
._FileInput__DropZone--isHighlight {
  color: #16a085;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._ImageUploadInput {
  cursor: pointer;
}
._ImageUploadInput__Input {
  display: none;
}
._ImageUploadInput__Image {
  position: relative;
  display: flex;
  align-items: center;
}
._ImageUploadInput__Image img {
  display: block;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
}
._ImageUploadInput__NoImage {
  margin: auto;
}
._ImageUploadInput:hover ._ImageUploadInput__PlaceholderText {
  display: flex;
}
._ImageUploadInput__PlaceholderText {
  display: none;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0,0,0,0.5);
  color: #fff;
  padding: 10px;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._DateInput {
  position: relative;
}
._DateInput ._TextInput {
  display: block;
}
._DateInput select {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  width: 100%;
  height: 100%;
}
._DateInput select:focus {
  outline: none;
}
._DateInput__DropDown {
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
._DateInput .react-calendar {
  padding: 20px;
}
._DateInput .react-calendar__navigation {
  margin-bottom: 10px;
}
._DateInput .react-calendar__navigation__arrow {
  background: transparent;
  border: none;
  font-size: 1.6em;
}
._DateInput .react-calendar__navigation__label {
  background: transparent;
  border: none;
  font-size: 1.2em;
  text-transform: uppercase;
}
._DateInput .react-calendar__month-view__weekdays__weekday {
  font-weight: bold;
  text-align: center;
}
._DateInput .react-calendar__month-view__weekdays__weekday abbr {
  display: inline-block;
  padding: 10px;
  border-bottom: none;
}
._DateInput .react-calendar__tile {
  background: transparent;
  border: none;
  width: auto;
}
._DateInput .react-calendar__tile abbr {
  display: inline-block;
  padding: 5px;
  line-height: 1em;
  width: 1em;
  height: 1em;
  border-radius: 50%;
}
._DateInput .react-calendar__tile--active abbr {
  background: #16a085;
  color: #fff;
}

._Input {
  display: inline-block;
  vertical-align: middle;
}
._Input--Block {
  width: 100%;
}
.-Bigger ._Input,
._Input.-Bigger {
  font-size: 1.1em;
}
.-Biggest ._Input,
._Input.-Biggest {
  font-size: 1.3em;
}
.-Smaller ._Input,
._Input.-Smaller {
  font-size: 0.9em;
}
.-Smallest ._Input,
._Input.-Smallest {
  font-size: 0.8em;
}
._PercentInput {
  color: #2c3e50;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  height: 2.25em;
}
._PercentInput._Input--isFocused {
  box-shadow: 0 0 5px #16a085;
}
._PercentInput__Input {
  display: flex;
  height: 100%;
  align-items: center;
}
._PercentInput input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
._PercentInput input:focus {
  outline: none;
}
._PercentInput__Ico {
  margin-right: 5px;
  color: #899abe;
}

._ToggleInput__Input {
  display: block;
  width: 2.4em;
  background: #f35468;
  padding: 3px;
  padding-right: 1em;
  border-radius: 1em;
  transition: padding 0.5s, background 0.5s;
  cursor: pointer;
}
._ToggleInput__Input::before {
  content: ' ';
  display: block;
  width: 1em;
  height: 1em;
  border-radius: 1em;
  background: #fff;
}
._ToggleInput__Input--True {
  background: #379d79;
  padding: 0.25em;
  padding-left: 1.15em;
}
._ToggleInput__Input--isDisabled {
  background: #f1f3f7;
}
._ToggleInput input {
  display: none;
}
._ToggleInput--Bigger {
  font-size: 1.1rem;
}
._ToggleInput--Biggest {
  font-size: 1.3rem;
}
._ToggleInput--Smaller {
  font-size: 0.9rem;
}
._ToggleInput--Smallest {
  font-size: 0.8rem;
}

.--isMobile .BreakCompliance._Modal {
  max-height: 90%;
  min-height: auto;
}
.BreakCompliance {
  width: 300px;
  max-height: 90%;
  display: flex;
  flex-direction: column;
}
.BreakCompliance._Modal {
  border-radius: 20px;
}
.BreakCompliance ._Modal__Header {
  display: block;
  color: #5c5c5c;
  font-size: 12px;
  font-weight: normal;
  padding-top: 25px;
}
.BreakCompliance ._Modal__Header p {
  margin: 0;
  margin-top: 10px;
}
.BreakCompliance ._Modal__Body {
  overflow-y: scroll;
}
.BreakCompliance ._Modal__Footer {
  padding: 30px 20px;
  border-top: 1px solid #ececec;
}
.BreakCompliance ._Modal__Footer ._Button {
  width: 100%;
  height: 50px;
  justify-content: center;
}
.BreakCompliance__Logo {
  text-align: center;
}
.BreakCompliance__Logo img {
  width: 100px;
}
.BreakCompliance__Break {
  display: block;
  margin: 10px 0;
  font-size: 16px;
}
.BreakCompliance__Break h4 {
  margin: 0;
}
.BreakCompliance__Break ._Form__Field {
  margin: 5px 0;
}
.BreakCompliance__Break ._Form__Label {
  font-weight: normal;
  white-space: normal;
  line-height: 1.2;
  font-size: inherit;
}
.BreakCompliance__Break ._Form__Input {
  width: auto;
}
.BreakCompliance__Break ._Form__Error {
  margin-top: 5px !important;
}
.BreakCompliance__Footer ._TextareaInput {
  width: 100%;
  height: 54px;
  font-size: 12px;
}
.BreakCompliance__Footer ._TextareaInput textarea {
  padding: 5px 10px;
  min-height: auto;
}

.ModalPrivacyPolicy {
  width: 500px;
  height: 460px;
  box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
}
.ModalPrivacyPolicy ._Modal__Body {
  height: 400px;
}
@media (max-width: 600px) {
  .ModalPrivacyPolicy ._Modal__Body {
    height: 90%;
  }
}
.ModalPrivacyPolicy__Body {
  line-height: 1.5;
}
.ModalPrivacyPolicy__Body div {
  margin-bottom: 10px;
}
.ModalPrivacyPolicy__Body--20px {
  font-size: 20px;
}
.ModalPrivacyPolicy__Body--18px {
  font-size: 18px;
}
.ModalPrivacyPolicy__Body--16px {
  font-size: 16px;
}
.ModalPrivacyPolicy__Checkbox {
  display: flex;
  align-items: center;
}
.ModalPrivacyPolicy__Checkbox ._Form__Field {
  margin-right: 10px;
}
.ModalPrivacyPolicy__Checkbox span {
  font-weight: 700;
}

.Login ._Modal__Footer ._Preloader {
  width: 100%;
}
.Login--SSO ._Modal__Footer {
  justify-content: center;
}
.Login--SSO ._Modal__Footer ._Button {
  padding: 0 25px;
  border-radius: 10px;
}
.Login__Edit {
  width: 14px;
  height: 14px;
  padding: 6px;
  cursor: pointer;
}
.Login__Companies {
  margin: 20px 0;
}
.Login__Company {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  font-weight: 600;
  padding: 10px 0;
  margin: 10px 0;
  text-align: center;
  cursor: pointer;
}
.Login ._Form__View {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.Login._Modal {
  min-width: auto;
  width: 350px;
}
.Login ._Modal__Header {
  padding: 40px 55px 10px 55px;
}
.Login ._Modal__Header img {
  width: 80%;
  margin: 0 10%;
}
.Login ._Modal__Header::after {
  height: 0;
}
.Login ._Modal__Body {
  padding: 10px 42px;
}
.Login ._Modal__Footer {
  padding: 0 42px 42px 42px;
}
.--isMobile .Login--SSO ._Modal__Footer {
  justify-content: center;
}

.Breadcrumbs {
  display: flex;
  width: 100%;
  align-items: center;
  font-size: 18px;
  font-weight: 600;
}
.Breadcrumbs svg {
  display: inline-block;
  vertical-align: bottom;
  margin: 0 5px;
}
.Breadcrumbs__Links {
  display: flex;
  flex-shrink: 0;
  height: 100%;
  align-items: center;
}
.Breadcrumbs__Link {
  text-decoration: none;
  color: inherit;
  color: #16a085;
/*
		max-width: 300px
		*/
  min-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.Breadcrumbs__Title {
  display: flex;
  width: 100%;
  align-items: center;
  position: relative;
  color: #4a4a4a;
}

.Search {
  margin-left: 20px;
  display: inline-flex;
  background: #fff;
  border: 1px solid #16a085;
  border-radius: 5px;
}
.Search__Input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  height: 32px;
  width: 300px;
  padding: 0 10px;
}
.Search__Input:focus {
  outline: none;
}
.Search__Input::placeholder {
  color: #e1eafb;
}
.Search__Button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: normal;
  text-align: inherit;
  display: block;
  width: 100px;
  height: 32px;
  text-align: center;
  background: #16a085;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
}
.Search__ResetWrapper {
  width: 34px;
}
.Search__Reset {
  color: #f35468;
  padding: 9px 10px;
  font-size: 14px;
  cursor: pointer;
}
.Search__Reset svg {
  display: block;
}

.Module {
  position: relative;
  background: #fff;
  display: grid;
  grid-template-rows: 54px 1fr;
  height: 100%;
}
.Module--withoutBackground {
  background: transparent;
}
.Module--withSubHeader {
  grid-template-rows: 93px 1fr;
}
.Module--withAside {
  grid-template-rows: 54px 1fr auto;
}
.Module--withSubHeader.Module--withAside {
  grid-template-rows: 93px 1fr auto;
}
.Module__Wrapper {
  overflow-y: scroll;
  overflow-x: hidden;
}
.Module__Header {
  height: 54px;
  max-width: 100%;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #e1f3ec;
}
.Module__Header ._Badge {
  display: inline-block;
  vertical-align: bottom;
  margin-left: 20px;
  flex-shrink: 0;
}
.Module__Subheader {
  display: flex;
  justify-content: space-between;
  background: #16a085;
  padding: 5px 30px;
  width: 100vw;
}
.Module__Controls {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center;
}
.Module__Controls .NavTabs {
  min-width: 148px;
  margin: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}
.Module__Controls .NavTabs__Tab {
  max-height: 34px;
  white-space: nowrap;
}
.Module__Controls .NavTab {
  height: 34px;
}
.Module__Ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 70%;
  flex-shrink: 2;
}
.Module__Body {
  padding: 0;
}
.Module__Body--hasHorizontalScroll {
  overflow-x: auto;
}
.Module__Body--isFullHeight {
  height: 100%;
}
.Module__Body--hasPadding {
  padding: 0 30px;
}
.Module__Body--isNarrow {
  max-width: 1366px;
  padding: 0 30px;
  margin: 0 auto;
}
.Module__Footer {
  padding: 10px 30px;
  padding-right: 100px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}
.Module__Footer--isNarrow {
  width: 1000px;
  margin: 0 auto;
}
.Module--isMobile .Module__Header {
  padding: 10px 10px;
}
.Module--isMobile .Module__Header .Breadcrumbs {
  width: auto;
  flex-grow: 1;
}
.Module--isMobile .Module__Header .Search {
  margin-left: 15px;
  margin-right: 10px;
}
.Module--isMobile .Module__Header .Search__Input {
  width: 120px;
}
.Module--isMobile .Module__Body--hasPadding {
  padding: 0 15px;
}
.Module--isMobile .Module__Controls {
  padding: 10px 0;
  height: 100%;
}
.Module--isMobile .Module__Footer {
  flex-direction: row;
}
.Module__CurrentAsideOverflow {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 70px;
  background: rgba(0,0,0,0.5);
}
.Module__CurrentAside {
  position: absolute;
  right: 20px;
  top: 20px;
  bottom: 20px;
  width: 520px;
}
.Module__CurrentAsideBody {
  background: #f0f0f0;
  min-height: 50px;
  max-height: 100%;
  overflow-y: scroll;
}
.Module .DateSlider__Current {
  flex-wrap: nowrap;
  margin-right: 0;
}
.--isTablet .App--withSidebar .Module--withTableSidebar {
  min-width: calc(100vw - 60px);
}

.NavTabs {
  border: 2px solid #75cbad;
  border-radius: 5px;
}
.NavTabs__Tab {
  text-decoration: none;
  color: inherit;
  display: inline-block;
  padding: 8px 20px;
  font-weight: bold;
  border-color: inherit;
  border-style: solid;
  border-width: 0 1px 0 1px;
  color: #75cbad;
}
.NavTabs__Tab:first-child {
  border-left: none;
}
.NavTabs__Tab:last-child {
  border-right: none;
}
.NavTabs__Tab.active {
  background: #75cbad;
  color: #fff;
}

.ScheduleGrid {
  display: flex;
}
.ScheduleGrid--withDivider {
  border-top: 2px solid #379d79;
}
.ScheduleGrid ._Table.GridWeek,
.ScheduleGrid ._Table.GridDay,
.ScheduleGrid .DayGrid {
  flex-basis: 1201px;
  flex-shrink: 0;
}
.Popup__Content {
  overflow-y: auto;
  word-wrap: break-word;
  max-height: 400px;
  box-shadow: 0 4px 4px rgba(0,0,0,0.25);
}
.Popup__Content h3 {
  font-size: 14px;
  padding: 0;
}
.Popup__Content h4 {
  word-break: normal;
  width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.WeekColumn {
  min-width: 280px;
}
.WeekColumn__Title {
  font-size: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 15px;
}
.WeekColumn__Title span {
  font-size: 10px;
}
.WeekColumn ._Table {
  width: 100%;
  table-layout: fixed;
}
.WeekColumn ._Table__Column {
  padding: 0;
  height: 50px;
  text-align: center;
  border-left: none;
  border-right: none;
}
.WeekColumn ._Table__Cell {
  padding: 0;
  height: 48px;
  border-bottom: 1px solid #ececec;
  text-align: center;
  font-size: 18px;
  color: #16a085;
}
.WeekColumn__Cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 15px;
}
.WeekColumn__Performance {
  display: flex;
  align-items: center;
}
.WeekColumn__Performance svg {
  margin-right: 6px;
}
.WeekColumn__Hours {
  display: flex;
  align-items: center;
  width: 30px;
  font-size: 11px;
  color: #5c5c5c;
}
.WeekColumn__Icon {
  font-size: 12px;
  color: #999;
}
.WeekColumn__Icon--Success {
  color: #379d79;
}
.WeekColumn__Icon--Warning {
  color: #ecc63e;
}
.WeekColumn__Icon--Danger {
  color: #f35468;
}
.--isTablet .WeekColumn {
  width: 280px;
}

.ShiftBreak {
  margin: 5px 0;
}
.ShiftBreak__isPaid--isPaid {
  color: #16a085;
}
.ShiftBreak__Remove {
  color: #f35468;
  cursor: pointer;
}
.ShiftBreak__Controls {
  margin-top: 10px;
  text-align: right;
}
.ShiftBreak--isView {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  border: 1px solid #d1d1d1;
}
.ShiftBreak--isView span {
  display: block;
  padding: 10px 5px;
}
.ShiftBreak--isView span:first-child {
  width: 100%;
  padding: 10px 20px;
}
.ShiftBreak--isView span:last-child {
  width: 100%;
  padding: 10px 20px;
  text-align: right;
}

.ShiftBreaks {
  max-width: 600px;
}
.ShiftBreaks h3 {
  font-size: 14px;
  padding: 0;
}
.ShiftBreaks__Error span {
  color: #f35468;
}

.ShiftInfo {
  margin: 5px 0;
}
.ShiftInfo__Body {
  padding: 5px 10px;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  border: 1px solid #d1d1d1;
}
.ShiftInfo__Row {
  display: flex;
  padding: 5px 10px;
}
.ShiftInfo__Row span {
  padding-right: 5px;
}
.ShiftInfo__Row span:first-child {
  width: 45px;
}

.Unavailable__Data {
  padding: 10px 15px;
  border: 1px solid #ececec;
}

.Shift {
  position: relative;
  height: 47px;
  cursor: pointer;
  background-color: #379d79;
  color: #fff;
  border: 4px solid transparent;
  background-clip: padding-box;
  overflow: hidden;
}
.Shift__IsAutomated {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 5px;
  top: 4px;
  width: 15px;
  height: 15px;
  border: 2px solid rgba(255,255,255,0.5);
  color: rgba(255,255,255,0.5);
  border-radius: 50%;
  font-weight: bold;
  font-size: 11px;
  line-height: 13px;
}
.Shift__IsAutomated span {
  display: block;
  flex-shrink: 0;
  flex-grow: 0;
}
.Shift__Body {
  padding: 6px 10px;
}
.Shift--isCurrent {
  border: 4px solid #75cbad;
}
.Shift--lessPerformed {
  background-color: #ecc63e;
}
.Shift--topPerformed {
  background-color: #379d79;
}
.Shift--middlePerformed {
  background-color: #75cbad;
}
.Shift--NonSelling {
  background-image: repeating-linear-gradient(45deg, #5c5c5c, #5c5c5c 5px, #4a4a4a 5px, #4a4a4a 10px) !important;
}
.Shift--isNew {
  background-color: #379d79 !important;
}
.Shift__Note {
  position: absolute;
  border-top: 1.2em solid #fff;
  border-right: 1.2em solid transparent;
  left: 0;
  top: 0;
}
.Shift__Note::before {
  content: '';
  position: absolute;
  border-top: 1em solid #ecc63e;
  border-right: 1em solid transparent;
  left: 0;
  top: -1.2em;
}
.Shift__Note--danger::before {
  border-top: 1em solid #f35468;
}
.Shift__Data {
  position: relative;
}
.Shift__Break {
  margin-left: -4px;
  position: absolute;
  top: 0;
  height: 40px;
  background: #45c698;
  box-shadow: 0 4px 4px rgba(0,0,0,0.25);
}
.Shift__Break--isUnPaid {
  background-color: #5c5c5c;
  background-image: repeating-linear-gradient(135deg, rgba(251,242,242,0.18) 8px, rgba(251,242,242,0.18) 9px, transparent 10px, transparent 15px);
}
.Shift__Info {
  font-size: 0.8em;
  font-weight: bold;
  white-space: nowrap;
}
.Shift__Store {
  margin-right: 10px;
}
.Shift__Time {
  font-size: 0.9em;
  line-height: 1.4rem;
  white-space: nowrap;
}
.Shift__TimeIcons {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  height: 20px;
  bottom: 0px;
  gap: 4px;
  right: 0px;
  padding: 4px;
}
.Shift__Overtime {
  position: absolute;
  right: -4px;
  top: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 6 6%27%3E%3Cpath d=%27M7,1 l-2,-2 M0,0 l6,6 M-1,5 l2,2%27 stroke=%27%23000%27 stroke-width=%271%27 stroke-opacity=%270.25%27 /%3E%3C/svg%3E");
  background-size: 10px 10px;
  height: 100%;
}
.Shift__Pending {
  position: absolute;
  height: 40px;
  width: 40px;
  right: 0;
  top: 0;
  padding: 0;
  color: #fff;
}
.Shift__Actions {
  position: absolute;
  right: 0;
  top: 0;
  display: none;
}
.Shift__Actions._Preloader {
  color: transparent;
}
.Shift__Actions--showShiftActions .Shift__Note {
  display: none;
}
.Shift__Action {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 32.5px;
  height: 40px;
  background: #858585;
  color: rgba(0,0,0,0.5);
  text-transform: uppercase;
  font-size: 9px;
}
.Shift__Action:hover svg {
  color: #fff;
}
.Shift__Action svg {
  font-size: 18px;
  margin-bottom: 2px;
}
.Shift__Action--Remove {
  background: #ff7a7a;
}
.Shift__Action--Add {
  background: #fee99e;
}
.Shift__Action--Edit {
  background: #e1f3ec;
}
.Shift__Action--Paste {
  background: #dacea6;
}
.Shift__Action--Unavailable {
  background: #46b3fc;
}
@media (min-width: 600px) {
  .Shift:hover .Shift__Actions {
    display: flex;
  }
}
.Shift--Regular .Shift__Type {
  opacity: 0;
}
.Shift--PTO {
  background-color: #5c5c5c;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 6 6%27%3E%3Cpath d=%27M7,1 l-2,-2 M0,0 l6,6 M-1,5 l2,2%27 stroke=%27%23000%27 stroke-width=%271%27 stroke-opacity=%270.25%27 /%3E%3C/svg%3E");
  background-size: 10px 10px;
}
.Shift--FromOtherStore {
  background-color: #5c5c5c;
  background-size: 10px 10px;
}
.Shift--FromOtherStore .Shift__Break {
  background-color: #505050;
}
.Shift--Warning {
  background-color: #ecc63e;
}
.Shift--Excess {
  background-color: #5c5c5c;
}
.Shift--DayOff {
  background-color: #c4c4c4;
  background-size: 10px 10px;
}
.NoteModal {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
}
.--isMobile .Shift__IsAutomated,
.--isTablet .Shift__IsAutomated {
  width: 14px;
  height: 14px;
  top: 21px;
  right: 3px;
  font-size: 9px;
}
.--isMobile .Shift__TimeIcons,
.--isTablet .Shift__TimeIcons {
  top: 0px;
}
.--isTablet .Shift__Action {
  width: 28.5px;
}

.SecondaryShift {
  height: 47px;
  background-color: #46b3fc;
  color: #fff;
  padding: 3px 10px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.SecondaryShift__IsRepeated {
  position: absolute;
  right: 13px;
  top: 15px;
  font-size: 16px;
  opacity: 0.6;
}
.SecondaryShift__Icon {
  font-size: 20px;
}
.SecondaryShift--isBefore {
  justify-content: flex-end;
}
.SecondaryShift--isAfter {
  justify-content: flex-start;
}
.SecondaryShift--PTO {
  background: #fbc5c5;
}

.ActualShift {
  height: 47px;
  background-color: #fff;
  border: 4px solid #75cbad;
  color: #75cbad;
  padding: 6px 10px;
}
.ActualShift--lessPerformed {
  border-color: #d9ae15;
  color: #d9ae15;
}
.ActualShift--topPerformed {
  border-color: #2c7e61;
  color: #2c7e61;
}
.ActualShift--middlePerformed {
  border-color: #47b991;
  color: #47b991;
}
.ActualShift--FromOtherStore {
  border-color: #7d7d7d;
  color: #7d7d7d;
}
.ActualShift__Data {
  position: relative;
  white-space: nowrap;
}
.ActualShift__Store {
  margin-right: 10px;
  font-size: 0.8em;
  font-weight: bold;
}
.ActualShift__Time {
  font-size: 0.9em;
  line-height: 1.4rem;
}

.GridDay__Droppable,
.GridDay__Draggable {
  width: 100%;
  height: 100%;
}
.GridDay__DayAction {
  height: 100%;
  flex-basis: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.3);
  color: #fff;
}
.GridDay__DayGrid {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
}
.GridDay__DayGrid > div {
  width: 4.166666666666667%;
}
.GridDay--isWorkingHour {
  position: relative;
}
.GridDay--isWorkingHour::before {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px solid #16a085;
}
.GridDay .Shift,
.GridDay .ActualShift {
  position: absolute;
}
.GridDay._Table {
  position: relative;
}
.GridDay ._Table {
  border-spacing: 5px;
}
.GridDay ._Table__Table {
  border-collapse: collapse;
}
.GridDay ._Table__Row:nth-child(odd) {
  background: #f1f3f7;
}
.GridDay ._Table__Row:nth-child(even) {
  background: #f8f8f8;
}
.GridDay ._Table__Column {
  width: calc(100% / 24);
  height: 50px;
  border: 1px solid #ececec;
  text-align: center;
  padding: 0;
  background: #fff;
}
.GridDay ._Table__Column:first-child {
  width: 0;
  border: none;
}
.GridDay ._Table__Cell {
  padding: 0;
  width: calc(100% / 24);
  height: 48px;
  border-left: 1px solid #ececec;
  border-right: 1px solid #ececec;
  vertical-align: middle;
}
.GridDay ._Table__Cell:first-child {
  position: absolute;
  width: 100%;
  vertical-align: top;
}

.FourWeekGrid__Day {
  width: 100%;
  height: 100%;
}
.FourWeekGrid__Date {
  font-size: 22px;
  margin-bottom: 10px;
  padding: 10px;
}
.FourWeekGrid__Padding {
  width: 30px !important;
  padding: 0 !important;
}
.FourWeekGrid ._Table__Column {
  text-transform: uppercase;
}
.FourWeekGrid ._Table__Cell {
  height: auto !important;
}
.FourWeekGrid .SecondaryShift {
  position: static;
}
.ScheduleGridTable .Shift {
  position: relative;
}
.ScheduleGridTable._Table {
  table-layout: fixed;
  position: relative;
}
.ScheduleGridTable ._Table__Table {
  border-collapse: collapse;
}
.ScheduleGridTable ._Table__Column {
  height: 48px;
  border: 1px solid #ececec;
  text-align: center;
  color: #379d79;
  font-size: 18px;
}
.ScheduleGridTable ._Table__Column:nth-child(odd) {
  background: #f8f8f8;
}
.ScheduleGridTable ._Table__Cell {
  height: 48px;
  padding: 0;
  border: 1px solid #ececec;
  vertical-align: middle;
}
.ScheduleGridTable ._Table__Cell:nth-child(odd) {
  background: #f8f8f8;
}
.--isTablet .FourWeekGrid ._Table__Column {
  font-size: 16px;
  padding: 15px 10px;
  width: 150px;
}

.StoreSelect {
  position: relative;
  display: inline-block;
  width: 200px;
  font-size: 14px;
}
@media (max-width: 800px) {
  .StoreSelect {
    width: 150px;
  }
}
.StoreSelect__Select {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: 34px;
  border-radius: 5px;
  background: #fff;
  border: 1px solid #16a085;
  text-transform: capitalize;
  cursor: pointer;
  white-space: nowrap;
}
.StoreSelect__Select span {
  overflow: hidden;
  text-overflow: ellipsis;
}
.StoreSelect__Select svg {
  position: absolute;
  right: 10px;
}
.StoreSelect__DropDown {
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  text-align: left;
}
.StoreSelect__Input {
  border-bottom: 1px solid #ececec;
}
.StoreSelect__Input input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  width: 100%;
  padding: 0 10px;
}
.StoreSelect__Input input:focus {
  outline: none;
}
.StoreSelect__Locations {
  width: 200px;
  max-height: 200px;
  overflow-y: auto;
  padding: 10px 0;
}
.StoreSelect__Location {
  padding: 10px 20px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.StoreSelect__Location--isSelected {
  background: #16a085;
  color: #fff;
}
.StoreSelect__Location:not(.StoreSelect__Location--isSelected):hover {
  background: #e1f3ec;
}
.StoreSelect__Error {
  padding: 5px 20px;
  margin-top: 10px;
  background: #f35468;
  color: #fff;
}

.TimeOffRequestBalance {
  line-height: 1.5em;
}
.TimeOffRequestBalance--Regular {
  font-weight: 600;
  color: #899abe;
  text-transform: capitalize;
}
.TimeOffRequestBalance--Summary {
  font-weight: 700;
  color: #5c5c5c;
}
.TimeOffRequestBalance--Error span {
  color: #f35468;
}

.TimeInput {
  display: block;
  position: relative;
}
.TimeInput svg {
  color: #505050;
}
.TimeInput--Disabled ._TextInput__Wrapper {
  background: #ecf0f1;
}
.TimeInput--isTimeMissing input {
  color: #c53d3d;
}
.TimeInput--isTimeMissing svg {
  color: #c53d3d;
}
.TimeInput--isTimeMissing ._TextInput {
  border: 1.75px solid #c53d3d;
}
.TimeInput ._DropDown {
  position: absolute;
  right: 20px;
}
.TimeInput ._DropDown--LeftBottom {
  bottom: 0;
}
.TimeInput ._DropDown--LeftTop {
  top: 0;
}
.TimeInput ._DropDown__Body {
  display: flex;
  flex-flow: wrap;
  width: 200px;
}
.TimeInput ._DropDown__Footer {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.TimeInput ._DropDown__Icon {
  flex: 1 1;
  text-align: center;
  color: #505050;
  padding-top: 10px;
  padding-bottom: 5px;
  cursor: pointer;
}
.TimeInput ._DropDown__Block {
  flex: 1 1;
  height: 140px;
  width: 60px;
  overflow: overlay;
  display: grid;
  align-items: center;
  text-align: center;
}
.TimeInput ._DropDown__Block:nth-child(n+3) {
  align-content: center;
}
.TimeInput ._DropDown__Block:not(:last-child) {
  border-right: 1px solid rgba(204,204,204,0.314);
}
.TimeInput ._DropDown__Block .Filter__Option {
  display: grid;
  height: 100%;
  align-items: center;
  white-space: nowrap;
  cursor: pointer;
}
.TimeInput ._DropDown__Block .Filter__Option--Checked {
  color: #fff;
  background: #16a085;
}
.TimeInput ._DropDown__Block .Filter__Option:hover {
  color: #fff;
  background: #75cbad;
}
.TimeInput ._DropDown__Block .Filter__Option ._RadioInput {
  display: none;
}
.TimeInput ._DropDown--Bottom ._DropDown__Body {
  top: -50px;
  left: -50px;
}
.TimeInput ::-webkit-scrollbar {
  width: 0;
}

.ModalTimeOffRequest {
  width: 460px;
}
.ModalTimeOffRequest__Inline {
  display: flex;
}
.ModalTimeOffRequest__Inline--withError ._TextInput {
  border: 1px solid #f35468;
}
.ModalTimeOffRequest__Inline > :not(:last-child) {
  margin-right: 10px;
}
.ModalTimeOffRequest__RightCalendar ._DateInput__DropDown {
  right: 0;
}
.ModalTimeOffRequest__Label {
  line-height: 2.3em;
  font-weight: 600;
  color: #899abe;
}
.ModalTimeOffRequest__Error {
  margin-bottom: 15px;
}
.ModalTimeOffRequest__Error span {
  color: #f35468;
}
.ModalTimeOffRequest ._Form__Field--Inline {
  flex-wrap: wrap;
}
.ModalTimeOffRequest ._Form__Wrapper {
  flex: 1 1;
}
.ModalTimeOffRequest ._Form__Error {
  flex: 1 0 100%;
}
.ModalTimeOffRequest .StoreSelect {
  position: unset;
  display: inline;
  width: 100%;
  font-size: unset;
}
.ModalTimeOffRequest .StoreSelect__Select {
  padding: 0 10px;
  height: 30px;
  border: 1px solid #d1d1d1;
}
.ModalTimeOffRequest .StoreSelect__Locations {
  width: 300px;
}

.ScheduleStatus {
  position: relative;
  margin-left: 10px;
  width: 140px;
}
.ScheduleStatus--isMobile {
  width: 34px;
}
.ScheduleStatus__Tooltip {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px;
  background: #fff;
}
.ScheduleStatus__Change {
  position: absolute;
  right: 5px;
  color: #5c5c5c;
}
.ScheduleStatus__Lock {
  position: absolute;
  right: 0;
  padding: 5px;
  color: #5c5c5c;
}
.ScheduleStatus__TooltipContainer {
  width: 100%;
}
.ScheduleStatus__Body {
  width: 100%;
  height: 34px;
  display: flex;
  padding: 0 7px;
  border-radius: 10px;
  align-items: center;
}
.ScheduleStatus__Status {
  position: relative;
  width: 140px;
  height: 34px;
  color: #fff;
  font-weight: bold;
  font-size: 10px;
  white-space: nowrap;
  display: flex;
  align-items: stretch;
}
.ScheduleStatus__Status span {
  margin-left: 5px;
  font-size: 14px;
}
.ScheduleStatus__Status .ScheduleStatus__Icon {
  width: 20px;
  height: 20px;
  padding: 3px;
  flex-shrink: 0;
  border-radius: 50%;
}
.ScheduleStatus__Status .ScheduleStatus__Icon svg {
  color: #fff;
  width: 14px;
  height: 14px;
  display: block;
}
.ScheduleStatus__Status--isShort {
  width: 34px;
  justify-content: center;
}
.ScheduleStatus__Status--canChange {
  cursor: pointer;
}
.ScheduleStatus__Status--Draft .ScheduleStatus__Body {
  background: rgba(244,102,103,0.22);
  color: #f46667;
}
.ScheduleStatus__Status--Draft .ScheduleStatus__Icon {
  background: #f46667;
}
.ScheduleStatus__Status--Pending .ScheduleStatus__Body {
  background: #fff2c5;
  color: #ecc63e;
}
.ScheduleStatus__Status--Pending .ScheduleStatus__Icon {
  background: #ecc63e;
}
.ScheduleStatus__Status--Approved .ScheduleStatus__Body {
  background: #c3e4d7;
  color: #16a085;
}
.ScheduleStatus__Status--Approved .ScheduleStatus__Icon {
  background: #16a085;
}
.ScheduleStatus__Statuses {
  position: absolute;
  right: -5px;
  top: -5px;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px 5px 0 5px;
}
.ScheduleStatus__Statuses .ScheduleStatus__Status {
  margin: 5px 0;
}
.ScheduleStatus__Legend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 28px;
  margin-bottom: 5px;
  padding: 0 5px;
  font-size: 10px;
  cursor: pointer;
}

.MobileListShift .ScheduleStatus__Status {
  width: 100px;
}
.MobileListShift .ScheduleStatus__Lock {
  display: none !important;
}
.MobileListShift__Angle {
  position: absolute;
  color: #16a085;
  right: 5px;
  top: 0;
  height: 100%;
  width: 12px;
  font-size: 24px;
}
.MobileListShift__Off {
  margin: 5px 18px;
  font-size: 24px;
  color: #899abe;
}
.MobileListShift__Off .MobileListShift__Angle {
  top: 10px;
}
.MobileListShift__Date {
  display: flex;
  justify-content: space-between;
  padding: 8px 20px;
  background: #16a085;
  color: #fff;
  font-size: 22px;
}
.MobileListShift__Date .ScheduleStatus__Body {
  height: 100%;
}
.MobileListShift__Date .ScheduleStatus__Status {
  height: 26px;
  width: 110px;
}
.MobileListShift__Section {
  position: relative;
  margin: 5px 18px;
  background: #f0f0f0;
  border-radius: 4px;
}
.MobileListShift__Block {
  display: flex;
  align-items: center;
  padding: 8px;
  font-size: 16px;
}
.MobileListShift__Block ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.MobileListShift__Block svg {
  width: 20px;
  height: 20px;
  margin-right: 15px;
  flex-shrink: 0;
}
.MobileListShift__Block--Store {
  font-weight: 700;
  color: #16a085;
}
.MobileListShift__Block--Store svg {
  color: #f35468;
}
.MobileListShift__Block--Time {
  font-size: 22px;
}
.MobileListShift__Block--Time span:first-of-type {
  width: 90px;
  padding-right: 5px;
}
.MobileListShift__Block--Time span:last-of-type {
  width: auto;
}
.MobileListShift__Block--Time svg {
  color: #16a085;
}
.MobileListShift__Block--isExpanded {
  height: auto;
}
.MobileListShift--withShiftSwap .MobileListShift__Section {
  margin: 5px 13px;
}
.MobileListShift--withShiftSwap .MobileListShift__Block {
  padding: 6px;
}
.MobileListShift--withShiftSwap .MobileListShift__Block--Time {
  font-size: 18px;
}
.MobileListShift--withShiftSwap .MobileListShift__Badge {
  position: absolute;
  display: flex;
  right: 30px;
  top: 0;
  height: 100%;
}
.MobileListShift--withShiftSwap .MobileListShift__Badge ._Badge {
  align-self: center;
}

.MobileScheduleList__Module .Module__Wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-y: hidden;
  overflow-x: hidden;
  height: fit-content;
  min-height: calc(100vh - 110px);
  background: #fff;
}
.MobileScheduleList__Module .Module__Body {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.MobileScheduleList__Module .Module__Controls {
  width: 100%;
  justify-content: space-between;
}
.MobileScheduleList__Module .Module__Controls ._Button {
  background: #75cbad;
  border-color: #75cbad;
  color: #fff;
  text-transform: uppercase;
  margin-right: 5px;
}
.MobileScheduleList__Module .Module__Controls .NavTabs {
  margin-left: 11px;
}

.MobileDayShift {
  margin: 0 15px 15px 15px;
}
.MobileDayShift .ScheduleStatus__Status {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 100px;
}
.MobileDayShift .ScheduleStatus__Lock {
  display: none !important;
}
.MobileDayShift__Off {
  padding: 0 20px;
  margin-bottom: 15px;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}
.MobileDayShift__Section {
  position: relative;
  height: 80px;
  padding: 0 20px;
  border-radius: 5px;
  border: 2px solid #ecf1f0;
  background: #fff;
  align-content: center;
}
.MobileDayShift__Block {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 23px;
  color: #1d1d1d;
}
.MobileDayShift__Block svg {
  width: 12.5px;
  height: 12.5px;
  margin-right: 7.5px;
  flex-shrink: 0;
}
.MobileDayShift__Block--Store {
  font-weight: 700;
  width: 200px;
}
.MobileDayShift__Block--Store span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.MobileDayShift__Block--Store svg {
  color: #5c5c5c;
}
.MobileDayShift__Block--Time span:first-of-type {
  width: 90px;
  padding-right: 5px;
}
.MobileDayShift__Block--Time span:last-of-type {
  width: auto;
}
.MobileDayShift__Block--Time svg {
  color: #16a085;
}

._ConfirmationDialog {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  background: #fff;
  margin: auto;
  border-radius: 5px;
  min-width: 335px;
}
._ConfirmationDialog ._Dialog__Header {
  font-size: 1.4em;
  padding: 20px;
  background: #379d79;
  color: #fff;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
._ConfirmationDialog ._Dialog__Body {
  padding: 40px 20px 20px;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
}
._ConfirmationDialog ._Dialog__Footer {
  text-align: center;
  padding: 0 0 20px;
}
._ConfirmationDialog ._Dialog__Footer ._Button {
  font-size: 20px;
  font-weight: 600;
  padding: 5px 20px;
}
._ConfirmationDialog ._Dialog__Overlay {
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px;
  background: rgba(0,0,0,0.7);
}
._ConfirmationDialog--Notice ._Dialog__Header {
  background: #379d79;
}
._ConfirmationDialog--Success ._Dialog__Header {
  background: #379d79;
}
._ConfirmationDialog--Warning ._Dialog__Header {
  background: #ecc63e;
}
._ConfirmationDialog--Danger ._Dialog__Header {
  background: #f35468;
}
._Dialog__Overlay--isSidebar {
  max-width: 500px;
  left: calc(100vw - 500px) !important;
}
._Dialog__Overlay--isCustom ._Dialog__Header {
  display: flex;
  justify-content: center;
  background: #fff;
  color: #5c5c5c;
  font-weight: bold;
  margin: 0 20px;
  border-bottom: 1px solid #f0f0f0;
}
.--isMobile ._Dialog__Overlay--isCustom ._Dialog__Body {
  padding: 20px 20px 20px;
  font-size: 14px;
}
.--isMobile ._Dialog__Overlay--isCustom ._Dialog__Footer ._Button {
  font-size: 16px;
}

.ShiftControl {
  display: block !important;
  text-align: center;
  margin-bottom: 15px;
}
.ShiftControl__Groups {
  display: flex;
  gap: 10px;
  flex-direction: row;
  justify-content: center;
  padding: 0 20px;
}
.ShiftControl ._Button {
  padding: 5px 40px;
  font-size: 16px;
  font-weight: 600;
  flex: 1;
  justify-content: center;
  border-radius: 34px;
}

.SwappingShift {
  position: relative;
  height: 80px;
  border-radius: 5px;
  align-content: center;
}
.SwappingShift svg {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  flex-shrink: 0;
}
.SwappingShift__Block {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 23px;
  color: #1d1d1d;
}
.SwappingShift__Block svg {
  width: 12.5px;
  height: 12.5px;
  margin-right: 7.5px;
  flex-shrink: 0;
}
.SwappingShift__Block--Store {
  font-weight: 700;
  width: 200px;
}
.SwappingShift__Block--Store span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.SwappingShift__Block--Store svg {
  color: #5c5c5c;
}
.SwappingShift__Block--Time span:first-of-type {
  width: 90px;
  padding-right: 5px;
}
.SwappingShift__Block--Time span:last-of-type {
  width: auto;
}
.SwappingShift__Block--Time svg {
  color: #16a085;
}

.StoreHeader {
  background: #f0f0f0;
  display: flex;
  padding: 8px 20px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #16a085;
}
.StoreHeader__Name {
  color: #1d1d1d;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}
.StoreHeader__Name span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  width: 300px;
}
.StoreHeader__Toggle {
  color: #16a085;
  cursor: pointer;
}
.StoreHeader__Toggle svg {
  width: 2em;
  height: 2em;
}
.--isMobile .StoreHeader__Name span {
  width: 75vw;
}

.SwappingShiftBlock {
  position: relative;
  display: flex;
  flex-direction: row;
  padding: 15px;
}
.SwappingShiftBlock__Shift {
  flex: 1 0 50%;
  border-right: 1px solid #aaa;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.SwappingShiftBlock__Shift--Title {
  color: #5c5c5c;
  font-size: 12px;
  font-weight: 600;
}
.SwappingShiftBlock__Shift--Date {
  display: flex;
  flex-direction: column;
  color: #1d1d1d;
  font-size: 16px;
  font-weight: 700;
}
.SwappingShiftBlock__Shift--Store {
  width: calc(50vw - 20px);
  color: #1d1d1d;
  font-size: 14px;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.SwappingShiftBlock__Request {
  flex: 1 0 50%;
  text-align: center;
  display: flex;
  align-items: center;
  padding: 20px;
}
.SwappingShiftBlock__Request--Text {
  color: #1d1d1d;
  font-size: 16px;
  font-weight: 700;
}
.SwappingShiftBlock__Request--Text span {
  color: #16a085;
}
.SwappingShiftBlock__Request--Disabled {
  color: #aaa;
}
.SwappingShiftBlock__Arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 7.5px 5px 7.5px 0px;
  background: #fff;
}
.SwappingShiftBlock__Arrow svg {
  color: #16a085;
  width: 22px;
  height: 22px;
}

.SwapShift__Header {
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  background: #fff;
  color: #3d3d3d;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  font-size: 16px;
  font-weight: 400;
  padding: 0 20px;
}
.SwapShift__Header span {
  display: flex;
  align-items: center;
  gap: 3px;
}
.SwapShift__Declined {
  background: #f398a3;
  color: #fff;
}
.SwapShift__Controls {
  display: flex;
  gap: 10px;
  flex-direction: row;
  justify-content: center;
  padding: 0 20px;
  margin-bottom: 15px;
}
.SwapShift__Controls ._Button {
  padding: 5px 40px;
  font-size: 16px;
  font-weight: 600;
  flex: 1;
  justify-content: center;
  border-radius: 34px;
}
.SwapShift__Date {
  background: #75cbad;
  color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 30px;
  font-size: 14px;
  font-weight: 700;
}
.SwapShift__Shifts .SwappingShift {
  margin: 0;
}
.SwapShift__Shift {
  display: flex;
  background: #fff;
  border-bottom: 1px solid #ecf1f0;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
}
.SwapShift ._CheckboxInput {
  width: 24px !important;
  height: 24px;
  border-radius: 50%;
}
.SwapShift ._CheckboxInput svg {
  width: 12px;
  height: 12px;
}
.SwapShift ._CheckboxInput__Input {
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.SwapShift ._CheckboxInput--Disabled {
  background-color: #b7ccc5;
}
.SwapShift__Footer {
  width: 100%;
  margin-top: 15px;
}

.WorkingOnDateShift__Section {
  position: relative;
  height: 80px;
  padding: 0 20px;
  background: #fff;
  border-bottom: 1px solid #ecf1f0;
  align-content: center;
}
.WorkingOnDateShift__Block {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 23px;
  color: #1d1d1d;
}
.WorkingOnDateShift__Block svg {
  width: 12.5px;
  height: 12.5px;
  margin-right: 7.5px;
  flex-shrink: 0;
}
.WorkingOnDateShift__Block--Store {
  font-weight: 700;
}
.WorkingOnDateShift__Block--Store svg {
  color: #5c5c5c;
}
.WorkingOnDateShift__Block--Time span:first-of-type {
  width: 90px;
  padding-right: 5px;
}
.WorkingOnDateShift__Block--Time span:last-of-type {
  width: auto;
}
.WorkingOnDateShift__Block--Time svg {
  color: #16a085;
}

.EmployeesWorkingOnDate__Title {
  background: #fff;
  color: #3d3d3d;
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  letter-spacing: 0.1px;
  padding: 0 20px;
}
.EmployeesWorkingOnDate__OthersShifts {
  max-height: 44px;
  transition: max-height 1s ease-out;
  overflow: hidden;
}
.EmployeesWorkingOnDate__OthersShifts--Open {
  max-height: 100000px;
  transition: max-height 1s ease-in;
}
.EmployeesWorkingOnDate__OthersShifts--Row {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f0f0f0;
  padding: 8px 20px;
  border-bottom: 1px solid #16a085;
  height: 44px;
}
.EmployeesWorkingOnDate__OthersShifts--Row span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #1d1d1d;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}
.EmployeesWorkingOnDate__OthersShifts--Row svg {
  font-size: 27px;
}

.MobileScheduleDay__Header {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid #d1d1d1;
  margin-bottom: 15px;
}
.MobileScheduleDay__Back {
  padding: 15px 10px;
  flex-shrink: 0;
}
.MobileScheduleDay__Back svg {
  width: 20px;
  height: 20px;
  color: #5c5c5c;
}
.MobileScheduleDay__Title {
  flex: 1;
  margin-right: 40px;
  color: #5c5c5c;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 0.13px;
}
.MobileScheduleDay .Module__Wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-y: hidden;
  overflow-x: hidden;
  height: fit-content;
  min-height: calc(100vh - 110px);
  background: #fff;
}
.MobileScheduleDay .Module__Body {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.MobileScheduleDay .Module__Top {
  display: none;
}

.--isTablet .Module__BrowserSchedule .DateSlider {
  font-size: 20px;
}
.--isTablet .Module__BrowserSchedule .ScheduleGrid ._Table {
  overflow-x: auto;
}
.--isTablet .Module__BrowserSchedule .GridDay ._Table__Column {
  width: 30px;
}

.ShiftEditBreaks {
  border-top: 1px solid #ececec;
  margin-top: 10px;
}
.ShiftEditBreaks ._Group {
  padding: 20px 0 5px 0;
}
.ShiftEditBreaks__Add {
  text-align: right;
  padding-top: 10px;
}
.BreakAddGrid {
  border: 1px solid #d1d1d1;
  padding: 10px 20px 20px 20px;
}
.BreakAddGrid ._Grid__Col {
  padding: 0 10px;
}
.BreakAddGrid ._Form__Field {
  margin: 0;
}

.ShiftEdit {
  width: 450px;
}
.ShiftEdit ._SelectInput select option:disabled {
  background: #ecf0f1;
}
.ShiftEdit__Error {
  width: 100%;
  margin: 0 10px;
  padding: 5px 20px;
  text-align: left;
  background: #f35468;
  color: #fff;
}
.--isMobile .ShiftEdit ._Modal__Footer {
  justify-content: space-between;
}

.Select {
  position: relative;
  display: flex;
  align-items: center;
  padding: 10px 0;
  width: 100%;
  font-size: 13px;
}
.Select__Label {
  flex: 0 0 90px;
  font-weight: 600;
  color: #16a085;
}
.Select__Select {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 10px;
  width: 100%;
  height: 30px;
  background: #fff;
  border: 1.75px solid #a1a1a1;
  text-transform: capitalize;
  cursor: pointer;
  white-space: nowrap;
}
.Select__Select span {
  overflow: hidden;
  text-overflow: ellipsis;
}
.Select__Select svg {
  position: absolute;
  right: 10px;
}
.Select__DropDown {
  position: absolute;
  top: 40px;
  left: 90px;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  text-align: left;
}
.Select__Input {
  display: flex;
  border-bottom: 1px solid #ececec;
}
.Select__Input input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  width: 100%;
  padding: 0 10px;
}
.Select__Input input:focus {
  outline: none;
}
.Select__Input ._Preloader {
  padding: 5px;
  font-size: 10px;
}
.Select__Items {
  width: 318px;
  max-height: 200px;
  overflow-y: auto;
  padding: 10px 0;
}
.Select__Item {
  padding: 10px 20px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.Select__Item--isSelected {
  background: #16a085;
  color: #fff;
}
.Select__Item:not(.Select__Item--isSelected):hover {
  background: #e1f3ec;
}
.Select__Error {
  position: absolute;
  bottom: -5px;
  left: 95px;
  font-size: 10px;
  color: #f35468;
}

.OpenShiftAssign {
  width: 450px;
}
.OpenShiftAssign__Error {
  width: 100%;
  margin: 0 10px;
  padding: 5px 20px;
  text-align: left;
  background: #f35468;
  color: #fff;
}
.OpenShiftAssign .Select__Select {
  border: 1px solid #d1d1d1;
  border-radius: 5px;
}
.--isMobile .OpenShiftAssign ._Modal__Footer {
  justify-content: space-between;
}

.ShiftSchedule {
  display: flex;
}
.ShiftSchedule__Day {
  margin-right: 15px;
}

.UnavailableEdit {
  width: 450px;
}
.UnavailableEdit__UnavailabeType {
  display: flex;
  justify-content: center;
}
.UnavailableEdit__UnavailabeType ._TabsInput__Input {
  color: #16a085;
}
.UnavailableEdit__Inline {
  display: flex;
}
.UnavailableEdit__Inline--withError ._TextInput {
  border: 1px solid #f35468;
}
.UnavailableEdit__Inline--withError ._TextInput input:disabled {
  border-radius: 5px;
}
.UnavailableEdit__Inline > :not(:last-child) {
  margin-right: 10px;
}
.UnavailableEdit__Error {
  margin-bottom: 10px;
}
.UnavailableEdit__Error span {
  color: #f35468;
}
.--isMobile .UnavailableEdit ._Modal__Footer {
  justify-content: space-between;
}

.CoverageChecker--withMargin {
  margin-left: 15px;
}
.CoverageChecker--Warning {
  cursor: pointer;
}
.CoverageChecker--Warning .CoverageChecker__Body {
  background: #f35468;
}
.CoverageChecker__Body {
  height: 34px;
  width: 34px;
  border-radius: 50%;
  background: #75cbad;
  display: flex;
  align-items: center;
  justify-content: center;
}
.CoverageChecker__Body ._Preloader {
  color: #fff;
  font-size: 10px;
}
.CoverageChecker__Text {
  color: #fff;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.CoverageChecker__Tooltip {
  font-size: 11px;
  background: #fff;
  padding: 5px 10px;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  margin-left: 28px;
  margin-top: -28px;
}
.CoverageChecker__TooltipTitle {
  text-align: center;
  font-size: 12px;
  padding-bottom: 5px;
  line-height: 14px;
  color: #16a085;
  font-weight: bold;
  border-bottom: 1px solid #ececec;
  margin-bottom: 5px;
}
.CoverageChecker__Check {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding-bottom: 7px;
}
.CoverageChecker__Check > span {
  margin-right: 10px;
}
.CoverageChecker__Week {
  display: flex;
  align-items: flex-end;
}
.CoverageChecker__Day {
  margin: 0 1px;
  text-align: center;
  font-size: 8px;
}
.CoverageChecker__Day div {
  width: 10px;
  height: 10px;
  background: #379d79;
}
.CoverageChecker__Day--hasError div {
  background: #f35468;
}

.NavSelect {
  width: 100px;
  margin-left: 15px;
  position: relative;
  font-weight: 600;
}
.NavSelect svg {
  position: absolute;
  right: 10px;
  top: 11px;
}
.NavSelect__Value {
  background: #fff;
  line-height: 32px;
  padding: 0 20px;
  border: 1px solid #16a085;
  border-radius: 5px;
  cursor: pointer;
}
.NavSelect__Options {
  width: 100px;
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px 0;
}
.NavSelect__Option {
  padding: 0 20px;
  line-height: 32px;
  cursor: pointer;
}
.NavSelect__Option:hover {
  background: #e1f3ec;
  color: currentColor;
}
.--isTablet .NavSelect {
  width: 80px;
  margin-left: 7.5px;
}
.--isTablet .NavSelect__Options {
  width: 80px;
}
.--isTablet .NavSelect__Value,
.--isTablet .NavSelect__Option {
  padding: 0 10px;
}

.Options__Option {
  display: flex;
  padding: 10px 0;
}
.Options__Option:not(:last-child) {
  border-bottom: 1px solid #ececec;
}
.Options__Input {
  margin-right: 15px;
}
.Options__Title {
  font-weight: bold;
  line-height: 20px;
}
.Options__Description {
  font-size: 10px;
}

.WeekSelect__Header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  height: 32px;
}
.WeekSelect__Slider {
  width: 18px;
  cursor: pointer;
}
.WeekSelect__Weeks {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  height: 10em;
}
.WeekSelect__Week {
  width: 270px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.WeekSelect__Week .span {
  font-size: 14px;
}
.WeekSelect__Empty {
  color: #16a085;
  height: 100%;
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  align-items: center;
}
.WeekSelect__Empty svg {
  width: inherit;
  height: 50%;
  align-self: center;
}
.WeekSelect .Options__Options {
  max-width: 400px;
  border-right: 1px solid #ececec;
  padding-right: 15px;
  margin-right: 15px;
}
.WeekSelect ._Modal__Body {
  display: flex;
}
.--isMobile .WeekSelect {
  display: flex;
  flex-direction: column;
  width: auto !important;
  max-height: 80% !important;
  min-height: auto !important;
}
.--isMobile .WeekSelect ._Modal__Body {
  flex-grow: 1;
}
.--isMobile .WeekSelect ._Modal__Footer {
  padding: 10px 20px;
  justify-content: center;
}

.ModalGenerate__Employee {
  display: block;
  margin: 5px 0;
  cursor: pointer;
}
.--isMobile .ModalGenerate {
  width: 85% !important;
  max-height: 80% !important;
  min-height: auto !important;
  display: flex;
  flex-direction: column;
}
.--isMobile .ModalGenerate ._Modal__Body {
  flex-grow: 1;
}
.--isMobile .ModalGenerate ._Modal__Footer {
  padding: 10px 20px;
  justify-content: center;
}

.ModalGenerate__Employee {
  display: block;
  margin: 5px 0;
  cursor: pointer;
}
.--isMobile .ModalGenerate {
  width: 85% !important;
  max-height: 80% !important;
  min-height: auto !important;
  display: flex;
  flex-direction: column;
}
.--isMobile .ModalGenerate ._Modal__Body {
  flex-grow: 1;
}
.--isMobile .ModalGenerate ._Modal__Footer {
  padding: 10px 20px;
  justify-content: center;
}

.PrintShift {
  padding: 6px 3px;
  background-color: #379d79;
  width: 100%;
  height: 43px;
  color: #fff;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.PrintShift__Info {
  height: 14px;
}
.PrintShift--isPlain {
  background: none !important;
  color: #5c5c5c;
  border: 1px solid #ececec;
}
.PrintShift--Regular .PrintShift__Type,
.PrintShift--FromOtherStore .PrintShift__Type {
  display: none;
}
.PrintShift--lessPerformed {
  background-color: #ecc63e;
}
.PrintShift--topPerformed {
  background-color: #379d79;
}
.PrintShift--middlePerformed {
  background-color: #75cbad;
}
.PrintShift--PTO {
  background-color: #5c5c5c;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 6 6%27%3E%3Cpath d=%27M7,1 l-2,-2 M0,0 l6,6 M-1,5 l2,2%27 stroke=%27%23000%27 stroke-width=%271%27 stroke-opacity=%270.25%27 /%3E%3C/svg%3E");
  background-size: 10px 10px;
  text-align: center;
}
.PrintShift--DayOff,
.PrintShift--Unavailability {
  display: none;
}
.PrintShift--FromOtherStore {
  background-color: #5c5c5c;
  background-size: 10px 10px;
}

.PrintShiftArray--Split {
  display: flex;
  flex-direction: column;
  border: 1px solid transparent;
  gap: 2px;
}
.PrintShiftArray--Split .PrintShift {
  padding: 1.5px 3px;
  width: 100%;
  height: 21px;
  font-size: 8px;
}
.PrintShiftArray--Split .PrintShift__Info {
  height: 8px;
}

@media print {
  .PrintSchedule hr {
    page-break-after: always;
  }
}
.PrintSchedule__Employee {
  padding: 0 10px;
}
.PrintSchedule__Date {
  font-size: 18px;
  font-weight: bold;
  color: #5c5c5c;
}
.PrintSchedule ._Table__Header {
  background: transparent;
}
.PrintSchedule ._Table__Column {
  padding: 10px 15px;
  border: none;
  border-bottom: 1px solid #ececec;
  text-align: center;
  color: #5c5c5c;
}
.PrintSchedule ._Table__Cell {
  height: 49px;
  padding: 2px;
  border: 1px solid #ececec;
}

.MobileControl {
  position: relative;
  margin-left: 10px;
}
.MobileControl__Button {
  background: #b8b8b8;
  color: #fff;
  height: 34px;
  width: 34px;
  padding: 7px;
  border-radius: 5px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.MobileControl__Button--Disabled {
  background: #ecf0f1;
}
.MobileControl__Button svg {
  width: 20px;
  height: 20px;
}
.MobileControl__Overlay {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(117,203,173,0.3);
  background: rgba(0,0,0,0.35);
}
.MobileControl__DropDown {
  position: absolute;
  right: 0;
  top: 0;
  background: #fff;
  z-index: 1001;
  border-radius: 5px;
}
.MobileControl__Close {
  position: absolute;
  width: 14px;
  height: 14px;
  left: 10px;
  top: 10px;
  cursor: pointer;
}
.MobileControl__Logo {
  display: block;
  width: 50px;
  margin: 15px auto;
}
.MobileControl ._Menu__Option {
  margin: 0 10px;
  padding: 15px 15px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.MobileControl ._Menu__Option:not(:first-child) {
  border-top: 1px solid #ececec;
}
.MobileControl ._Menu__Option svg {
  height: 22px;
  min-width: 22px;
}

.EfficiencySlider {
  background: #fff;
  width: 140px;
  font-size: 10px;
  display: flex;
  align-items: center;
  border-radius: 10px;
  margin-right: 10px;
  border: 1px solid #16a085;
}
.EfficiencySlider__Side {
  padding: 0 5px;
  text-align: center;
  font-size: 14px;
  margin-top: 11px;
  font-weight: bold;
}
.EfficiencySlider__Body {
  width: 100%;
}
.EfficiencySlider__Title {
  text-align: center;
  padding: 5px 0;
}
.rc-slider {
  position: relative;
  width: 100%;
  height: 12px;
  padding: 0;
  border-radius: 6px;
  touch-action: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.rc-slider-rail {
  position: absolute;
  width: 100%;
  height: 4px;
  background-color: #16a085;
}
.rc-slider-handle {
  position: absolute;
  width: 14px;
  height: 14px;
  margin-top: -6px;
  background-color: #16a085;
  border: 2px solid #fff;
  border-radius: 50%;
  cursor: pointer;
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: pan-x;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.rc-slider-track {
  position: absolute;
  height: 4px;
  background-color: #ecf0f1;
}
.rc-slider-mark {
  position: absolute;
  top: 10px;
  left: 0;
  width: 100%;
  font-size: 12px;
}
.rc-slider-mark-text {
  position: absolute;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
}
.rc-slider-dot {
  position: absolute;
  bottom: 6px;
  width: 1px;
  height: 8px;
  vertical-align: middle;
  background-color: #ecf0f1;
  cursor: pointer;
}

.ModalAddTemplate {
  width: 460px;
}
.ModalAddTemplate__Subheader {
  font-size: 15px;
  line-height: 20px;
}
.ModalAddTemplate__Subheader div {
  padding-bottom: 20px;
}

.FilesDropDone {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 45px 125px;
  font-size: 18px;
}
.FilesDropDone svg {
  margin-bottom: 20px;
}
.FilesDropDone svg .cls-1 {
  fill: #379d79;
}
.FilesDropDone svg .cls-2 {
  fill: #e1f3ec;
}

.SupplementOverwrite {
  width: 460px;
}
.SupplementOverwrite__title {
  display: flex;
  justify-content: center;
  font-weight: bold;
  font-size: 18px;
}
.SupplementOverwrite__description {
  display: flex;
  margin-left: 24px;
}
.SupplementOverwrite__Fields {
  display: flex;
  gap: 20px;
  justify-content: space-around;
  margin: 10px 0;
}
.SupplementOverwrite ._Modal__Body {
  overflow-y: initial;
}

.NoEntries {
  text-align: center;
  padding: 10px;
  line-height: 30px;
}

.StoreSearch {
  position: relative;
  width: 100%;
  height: 46px;
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 5px;
  font-size: 16px;
}
.StoreSearch__ClearIcon,
.StoreSearch__SearchIcon {
  position: absolute;
  font-size: 20px;
  height: 100%;
  top: 0px;
  cursor: pointer;
}
.StoreSearch--Disabled {
  cursor: default;
}
.StoreSearch__SearchIcon {
  color: #d9d9d9;
  left: 7.5px;
}
.StoreSearch__ClearIcon {
  right: 10px;
  color: #aaa;
}
.StoreSearch input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 35px;
}
.StoreSearch input:focus {
  outline: none;
}

.WeeksPicker {
  position: relative;
  width: 100%;
}
.WeeksPicker__Wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.WeeksPicker__Label {
  font-size: 16px;
  font-weight: 600;
  color: #4a4a4a;
}
.WeeksPicker__Select {
  border-radius: 6px;
  border: 1px solid #d1d1d1;
  height: 46px;
  display: flex;
  justify-content: space-between;
  padding: 0 20px;
  align-items: center;
  width: 300px;
  cursor: pointer;
}
.WeeksPicker__Select--Selected {
  color: #16a085;
}
.WeeksPicker__Select span {
  font-size: 16px;
  font-weight: 600;
}
.WeeksPicker__DropDown {
  width: 300px;
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 10px 0;
  right: 0px;
  top: 55px;
}
.WeeksPicker__MonthSlider {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.WeeksPicker__MonthSlider svg {
  cursor: pointer;
}
.WeeksPicker__MonthSlider svg.--disabled {
  color: transparent;
  cursor: initial;
}
.WeeksPicker__AvailableWeeks {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  height: 15em;
}
.WeeksPicker__AvailableWeek {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 20px;
  border-bottom: 1px solid #899abe;
  padding: 5px 0px;
}
.WeeksPicker__Range {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.WeeksPicker__Range span {
  font-size: 16px;
  font-weight: 600;
  margin-left: 10px;
}
.WeeksPicker__Empty {
  color: #16a085;
  height: 100%;
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  align-items: center;
}
.WeeksPicker__Empty svg {
  width: inherit;
  height: 50%;
  align-self: center;
}

.ModalBulkApproval {
  width: 700px;
  max-width: 95vw;
}
.ModalBulkApproval__Header {
  display: flex;
  width: 100%;
  justify-content: center;
  font-size: 20px;
  color: #000;
}
.ModalBulkApproval__Subheader {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  margin: 10px auto;
}
.ModalBulkApproval__TableHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ModalBulkApproval__Checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 15px;
}
.ModalBulkApproval__CheckboxLable {
  color: #000;
  font-size: 15px;
  font-weight: 600;
  line-height: 100%;
}
.ModalBulkApproval__Info {
  color: #16a085;
  font-size: 15px;
  font-weight: 700;
  line-height: 100%;
}
.ModalBulkApproval__Clear {
  padding: 10px;
  color: #f35468;
  font-size: 15px;
  font-weight: 700;
  line-height: 100%;
  cursor: pointer;
}
.ModalBulkApproval__Control {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ModalBulkApproval__Control--Disabled {
  color: #aaa;
  cursor: default;
}
.ModalBulkApproval__Button {
  width: 175px;
  justify-content: center;
}
.ModalBulkApproval__Table {
  max-height: 350px;
  overflow: auto;
  margin-bottom: 15px;
}
.ModalBulkApproval__Table ._Table__Row ._Table__Cell {
  padding: 10px 15px;
}
.ModalBulkApproval__Table ._Table__Row ._Table__Cell:last-child {
  text-align: right;
}
.ModalBulkApproval__Table ._Table__Column {
  padding: 10px 15px;
}
.ModalBulkApproval__Table ._Table__Column:last-child {
  text-align: right;
}
.ModalBulkApproval__Form ._Form__Label {
  color: #4a4a4a;
  font-size: 15px;
  padding: 0px;
}
.ModalBulkApproval__Form ._SelectInput {
  height: 46px;
  padding: 0 10px;
}
.ModalBulkApproval__Form ._SelectInput select {
  font-size: 15px;
}

.SelectDemandMetric {
  display: inline-flex;
  margin-bottom: 10px;
}
.SelectDemandMetric__Option {
  padding: 3px 5px;
  border: 1px solid #ececec;
  border-radius: 5px;
  margin-right: 5px;
  cursor: pointer;
}
.SelectDemandMetric__Option--isActive {
  background: #e1f3ec;
  cursor: default;
}

.Widget {
  position: relative;
  padding: 23px 30px;
  box-shadow: -10px 10px 20px 0 rgba(30,30,30,0.05);
}
.Widget__Wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.Widget__Value {
  font-size: 1.9em;
  line-height: 1.4em;
  color: #379d79;
}
.Widget__Title {
  line-height: 1.4em;
  color: #5c5c5c;
}
.Widget__Title .Card--Accent {
  color: inherit;
}
.Widget__Adds {
  line-height: 24px;
}
.Widget__Ico {
  height: 100%;
  display: flex;
  font-size: 2em;
}
.Widget__Ico svg {
  display: block;
  margin: auto;
}
.Widget--Danger {
  color: #f35468;
}
.Widget--Warning {
  color: #ecc63e;
}

.Graph {
  display: flex;
  flex-direction: column;
}
.Graph__Legend {
  margin-bottom: 50px;
}
.Graph__Legend h4 {
  font-size: 1.1em;
  color: #4a4a4a;
  font-weight: 400;
  margin: 0 0 10px 0;
}
.Graph__Legend ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: space-around;
  width: 100%;
}
.Graph__Legend ul li {
  text-align: center;
}
.Graph__Legend svg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.Graph__Title {
  text-align: center;
  font-size: 1.7em;
  font-weight: lighter;
}
.Graph__Body {
  height: 230px;
}

.KPI {
  padding: 0 20px;
  padding-top: 15px;
  position: relative;
}
.KPI__Divider {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 10px;
  background: #16a085;
}
.KPI__DividerClick {
  position: absolute;
  z-index: 1;
  top: -5px;
  left: 50%;
  width: 50px;
  margin-left: -25px;
  height: 20px;
  background: #e1f3ec;
  border: 1px solid #ececec;
  border-radius: 3px;
  color: #16a085;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.KPI__Header {
  line-height: 48px;
}
.KPI__Title {
  font-size: 1.3em;
  font-weight: bold;
  color: #16a085;
}
.KPI__Body {
  padding-bottom: 5px;
}
.App--isMobile .KPI > ._Grid > ._Grid__Row {
  flex-flow: column;
}
.--isTablet .KPI ._Grid__Col--3 .Widget {
  padding: 20px 5px;
}
.--isTablet .KPI ._Grid__Col--3 .Widget__Ico {
  right: 10px;
}
.--isTablet .KPI ._Grid__Col--3 .Widget__Value {
  font-size: 1.25em;
}
.--isTablet .KPI ._Grid__Col--3 .Widget__Title {
  max-width: 70%;
  font-size: 0.75em;
}

._Dialog {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  background: #fff;
  margin: auto;
  border-radius: 5px;
}
._Dialog__Header {
  font-size: 1.4em;
  padding: 20px;
  background: #379d79;
  color: #fff;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}
._Dialog__Body {
  padding: 10px 20px;
}
._Dialog__Footer {
  text-align: right;
  padding: 0 20px 20px 0;
}
._Dialog__Overlay {
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px;
  background: rgba(0,0,0,0.7);
}
._Dialog__Overlay--Notice ._Dialog__Header {
  background: #379d79;
}
._Dialog__Overlay--Success ._Dialog__Header {
  background: #379d79;
}
._Dialog__Overlay--Warning ._Dialog__Header {
  background: #ecc63e;
}
._Dialog__Overlay--Danger ._Dialog__Header {
  background: #f35468;
}

.DayGrid {
  position: relative;
}
.DayGrid__Grid {
  position: absolute;
  top: 51px;
  bottom: -14px;
  left: 0;
  right: 0;
}
.DayGrid__Row {
  position: relative;
  height: 48px;
}
.DayGrid__Row--isEditable {
  cursor: pointer;
}
.DayGrid__Row--isEditable:hover {
  background: #e1f3ec;
}
.DayGrid__Row ._Preloader {
  width: 100%;
}
.DayGrid__Shift {
  z-index: 1;
}
.DayGrid__Shift .Shift__Body {
  padding: 6px 20px;
  height: 48px;
  cursor: inherit;
}
.DayGrid__Shift:hover .DayGrid__ResizeHandle {
  display: inline-block;
}
.DayGrid__ResizeHandle {
  display: none;
}
.DayGrid__ResizeHandle div {
  background: rgba(0,0,0,0.4);
  border-radius: 3px;
  width: 10px !important;
  height: 30px !important;
  top: 9px !important;
}
.DayGrid--isDragging .DayGrid__Row {
  background: transparent !important;
}
.DayGrid--isDragging .DayGrid__ResizeHandle {
  display: none !important;
}
.DayGrid__GridTable {
  border-spacing: 5px;
}
.DayGrid__GridTable ._Table__Table {
  border-collapse: collapse;
}
.DayGrid__GridTable ._Table__Row:nth-child(odd) {
  background: #f1f3f7;
}
.DayGrid__GridTable ._Table__Row:nth-child(even) {
  background: #f8f8f8;
}
.DayGrid__GridTable ._Table__Column {
  width: 50px;
  height: 50px;
  border: 1px solid #ececec;
  text-align: center;
  padding: 0;
  background: #fff;
  position: static;
}
.DayGrid__GridTable ._Table__Column:first-child {
  width: 0;
  border: none;
}
.DayGrid__GridTable ._Table__Column.DayGrid__WorkingHours::after {
  content: '';
  position: absolute;
  display: block;
  height: 2.5px;
  background: #379d79;
  bottom: 0;
}
.DayGrid__GridTable ._Table__Column.DayGrid__WorkingHours--Hour::after {
  width: 50px;
}
.DayGrid__GridTable ._Table__Column.DayGrid__WorkingHours--HalfHourStart::after {
  width: 25px;
  margin-left: 25px;
}
.DayGrid__GridTable ._Table__Column.DayGrid__WorkingHours--HalfHourEnd::after {
  width: 25px;
}
.DayGrid__GridTable ._Table__Cell {
  padding: 0;
  width: 50px;
  height: 48px;
  border-left: 1px solid #ececec;
  border-right: 1px solid #ececec;
  vertical-align: middle;
}
.DayGrid__GridTable ._Table__Cell:first-child {
  position: absolute;
  width: 100%;
  vertical-align: top;
}
.DayGrid__GridTable ._Table__Cell .ActualShift,
.DayGrid__GridTable ._Table__Cell .SecondaryShift {
  position: absolute;
  overflow: hidden;
}
.DayGrid ._Table__Header {
  position: sticky;
  z-index: 2;
  top: 0;
}

.Filter {
  display: inline-flex;
  align-items: center;
  position: relative;
}
.Filter__Title {
  margin-right: 10px;
}
.Filter svg {
  font-size: 16px;
  cursor: pointer;
}
.Filter__Option {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  white-space: nowrap;
}
.Filter__Option ._Input {
  margin-right: 10px;
}
.Filter--Active svg {
  color: #16a085;
}
._DropDown ._Button {
  margin: 10px 20px;
}

.EmployeeHours {
  display: flex;
  align-items: center;
}
.EmployeeHours svg {
  margin-right: 5px;
  color: #16a085;
}
.EmployeeHours__Tooltip {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px;
  background: #fff;
}
.EmployeeHours__Icon--Danger svg {
  color: #f35468;
}
.EmployeeHours__Icon--Warning svg {
  color: #ecc63e;
}
.EmployeeHours__Hours {
  display: flex;
  align-items: center;
  line-height: 16px;
  width: 30px;
}
.EmployeeHours__Hours svg {
  margin-right: 5px;
  color: #16a085;
}
.EmployeeHours__Hours--Danger svg {
  color: #f35468;
}
.EmployeeHours__Hours--Warning svg {
  color: #ecc63e;
}
.EmployeeHours__Hours--Hidden svg {
  color: transparent;
}
.--isMobile .EmployeeHours svg {
  margin-right: 2.5px;
}

.Employee {
  position: relative;
  border-left: 5px solid #ecc63e;
  padding: 4px 0;
  width: 100%;
}
.Employee__User {
  display: flex;
}
.Employee__User .UserAvatar {
  margin-right: 5px;
}
.Employee__Location {
  position: absolute;
  left: -5px;
  top: 0;
  height: 100%;
  width: 5px;
  background: #ecc63e;
}
.Employee__Location--isPrimary {
  background: #379d79;
}
.Employee--isTemporaryEmployee .Employee__Position {
  color: #ecc63e;
}
.Employee--isTemporaryEmployee .Employee__Position::before {
  content: 'Temp\00a0';
}
.Employee__Body {
  padding-left: 5px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.Employee__RatingValue {
  font-size: 0.7em;
  font-weight: bold;
}
.Employee__Edit {
  margin-left: 10px;
}
.Employee__GrossProfitTooltip {
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  padding: 5px;
  background: #fff;
}
.Employee__GrossProfitTooltip--grossProfit {
  display: block;
  align-items: center;
  text-align: center;
  font-weight: bold;
}
.Employee__GrossProfitTooltip--grossProfit span {
  display: block;
  color: #16a085;
  font-size: 11px;
  font-weight: 500;
}
.Employee__Name {
  word-break: break-all;
  overflow: hidden;
  font-weight: bold;
  line-height: 1.4em;
  height: 1.4em;
}
.Employee__Position {
  align-items: center;
  word-break: break-all;
  overflow: hidden;
  line-height: 1.4em;
  height: 1.4em;
}
.Employee__Position ._Badge {
  margin-left: 10px;
}
.Employee__Performance {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.Employee__Performance--withGrossProfit {
  min-width: 45%;
}
.Employee__Performance--grossProfit {
  display: flex;
  align-items: center;
  font-weight: bold;
}
.Employee__Performance--grossProfit span {
  color: #16a085;
}
.Employee__Field {
  margin: 10px 5px;
}
.Employee__Label {
  font-size: 9px;
  font-weight: bold;
}
.Employee__Value {
  color: #16a085;
}
.Employee--Accent .Employee__Body {
  color: #4a4a4a;
}
.Employee--New .Employee__Control {
  color: #4a4a4a;
}
.--isMobile .Employee__User .UserAvatar__Photo {
  display: none;
}
.--isMobile .Employee__User .UserAvatar .OnShiftStatus {
  top: 3px;
  right: -8px;
}
.--isMobile .Employee__Body {
  padding-left: 10px !important;
}
.--isMobile .Employee__Name {
  position: relative;
  left: 8px;
}
.--isMobile .Employee__Position {
  position: relative;
  right: 5px;
}

.StaffOpenShifts {
  background: #d2edff !important;
  padding: 0 10px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
}
.StaffOpenShifts__Body {
  display: flex;
  height: 47px;
  align-items: center;
  gap: 20px;
}
.StaffOpenShifts__Title {
  display: flex;
  align-items: center;
  gap: 5px;
}
.StaffOpenShifts__Name {
  font-weight: bold;
  line-height: 1.4em;
  height: 1.4em;
}
.StaffOpenShifts__Controls svg {
  width: 17px;
  height: 17px;
}
.StaffOpenShifts__Hours {
  display: flex;
  padding-right: 18px;
  height: 47px;
  align-items: center;
  justify-content: center;
}
.StaffOpenShifts .OnShiftStatus {
  display: none;
}
.--isMobile .StaffOpenShifts .UserAvatar {
  display: none;
}

.Search {
  margin: 20px;
  display: inline-flex;
  background: #fff;
  border: 1px solid #16a085;
  border-radius: 5px;
}
.Search__Input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  height: 32px;
  width: 300px;
  padding: 0 10px;
}
.Search__Input:focus {
  outline: none;
}
.Search__Input::placeholder {
  color: #e1eafb;
}
.Search__Button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: normal;
  text-align: inherit;
  display: block;
  width: 100px;
  height: 32px;
  text-align: center;
  background: #16a085;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
}
.Search__ResetWrapper {
  width: 34px;
}
.Search__Reset {
  color: #f35468;
  padding: 9px 10px;
  font-size: 14px;
  cursor: pointer;
}
.Search__Reset svg {
  display: block;
}

.AssignEmployee {
  max-width: 1200px;
}
.AssignEmployee ._Form {
  overflow-x: scroll;
}
.AssignEmployee ._Table {
  min-height: 400px;
  min-width: 1000px;
}
.AssignEmployee ._Table__Cell {
  padding: 10px 15px;
}
.AssignEmployee ._Table__Cell ._CheckboxInput {
  cursor: pointer;
}
.--isMobile .AssignEmployee .Search__Input {
  width: 200px;
}

.Staff {
  flex-basis: 100%;
  min-width: 275px;
}
.Staff__Header {
  height: 51px;
  background: #fff;
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
  padding: 0 10px 0 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  z-index: 2;
  top: 0;
}
.Staff__Title {
  font-size: 18px;
  font-weight: bold;
  color: #16a085;
  display: flex;
  align-items: center;
  height: 100%;
}
.Staff__Title span {
  white-space: nowrap;
}
.Staff__AssignEmployee {
  display: flex;
  height: 100%;
  align-items: center;
  font-size: 24px;
  color: #16a085;
  border-right: 2px solid #ccc;
  padding-right: 12.5px;
  margin-right: 5px;
  cursor: pointer;
}
.Staff .Filter {
  font-size: 14px;
  color: #5c5c5c;
}
.Staff ._Table {
  width: 100%;
  table-layout: fixed;
}
.Staff ._Table ._Table__Table {
  table-layout: auto;
}
.Staff ._Table__Column {
  height: 48px;
}
.Staff ._Table__Cell {
  padding: 0;
  height: 48px;
  border-bottom: 1px solid #ececec;
}
.Staff__PerformanceSort {
  margin-left: 10px;
  font-size: 14px;
  min-width: 100px;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
}
.Staff__Item {
  border-bottom: 1px solid #ececec;
  height: 48px;
}
.Staff__Item:nth-child(odd) {
  background: #f1f3f7;
}
.Staff__Item:nth-child(even) {
  background: #f8f8f8;
}
.Staff__Aside {
  display: flex;
}
.Staff__Employee {
  background: inherit;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 18px;
  position: relative;
  cursor: pointer;
}
.Staff__Employee:hover:not(.Staff__Employee--DragDisabled) {
  cursor: grab;
}
.Staff__Employee--isDragging {
  border: 1px solid #ececec;
  background: #e1f3ec;
}
.Staff__Employee .Employee {
  height: 46px;
}
.Staff__Employee:hover--Active,
.Staff__Employee--showActions--Active {
  background: #e1f3ec;
}
.Staff__Employee:hover .Employee,
.Staff__Employee--showActions .Employee {
  color: #4a4a4a;
}
.Staff__Employee:hover .Staff__Actions,
.Staff__Employee--showActions .Staff__Actions {
  display: flex;
}
.Staff__Actions {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  display: none;
}
.Staff__Action {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 36px;
  background: #f35468;
  text-transform: uppercase;
  font-size: 8px;
  text-align: center;
}
.Staff__Action svg {
  font-size: 14px;
  margin-bottom: 2px;
}
.Staff__Overtime {
  text-align: center;
}
.Staff__Overtime svg {
  color: #f35468;
}
.Staff__Overtime span {
  display: block;
  font-size: 10px;
}
.Staff__Control {
  font-size: 1.4em;
  color: #f35468;
}
.Staff__Control--Add {
  color: #379d79;
}
.Staff__Control svg {
  display: block;
}
.Staff__Edit {
  display: inline-block;
  height: 16px;
  margin-left: 20px;
}
.Staff__DropDown {
  position: absolute !important;
  z-index: 10;
  right: -50%;
}
.Staff__DropDown ._DropDown__Body {
  min-width: 150px;
}
App:not(.App--isMobile) .Staff {
  position: sticky;
  left: 0;
  z-index: 2;
}
.--isMobile .Staff {
  min-width: 175px;
}

.Shift--OpenShift .Shift__Action {
  width: 40px;
  height: 40px;
}
.Shift--OpenShift .Shift__Action--Remove {
  background: #ff7a7a;
}
.Shift--OpenShift .Shift__Action--Assign {
  background: #e1f3ec;
}
.Shift--OpenShift .Shift__Break {
  background-color: #505050;
}
.Shift--Warning {
  background-color: #ecc63e;
}
.Shift--Excess {
  background-color: #5c5c5c;
}

.OpenShifts {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: flex-end;
}
.OpenShifts__Control {
  height: 47px;
}
.OpenShifts__Actions {
  height: 47px;
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
}
.OpenShifts__Action {
  flex: 1 0 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: #828282;
  cursor: pointer;
}
.OpenShifts__Action:hover {
  color: #5c5c5c;
}
.OpenShifts__Action svg {
  font-size: 22px;
}
.OpenShifts--dragginOver {
  display: flex;
  background: #e1f3ec;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.OpenShifts--dragginOver .OpenShifts__Placeholder {
  color: #fff;
}
.OpenShifts__Actions .OpenShifts__Action--Paste,
.OpenShifts__Actions .OpenShifts__Action--Create {
  display: none;
}
.OpenShifts__Actions:hover .OpenShifts__Action--Paste,
.OpenShifts__Actions:hover .OpenShifts__Action--Create {
  display: flex;
}
.OpenShifts__Info {
  position: relative;
  width: 100%;
}
.OpenShifts__Info .OpenShifts__Actions {
  opacity: 0;
}
.OpenShifts__Info:hover .OpenShifts__Actions {
  opacity: 1;
}
.OpenShifts__Info:hover .OpenShifts__Toggle {
  display: block;
}
.OpenShifts__AvailableShift {
  background: #b3b3b3;
  position: absolute;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 47px;
  top: -47px;
}
.OpenShifts__Title {
  font-size: 11px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
}
.OpenShifts__Toggle {
  position: absolute;
  display: none;
  bottom: -5px;
  left: 50%;
  height: 22px;
  width: 20px;
  margin-left: -10px;
  color: #f8f8f8;
  cursor: pointer;
  font-size: 18px;
}

.ShiftsArray--Split {
  display: flex;
  flex-direction: column;
  border: 1.5px solid transparent;
  gap: 2px;
}
.ShiftsArray--Split .Shift {
  height: 21px;
  border: 0;
}
.ShiftsArray--Split .Shift__Body {
  padding: 2px 7.5px;
  display: flex;
}
.ShiftsArray--Split .Shift__Note {
  border-top: 1em solid #fff;
  border-right: 1em solid transparent;
}
.ShiftsArray--Split .Shift__Info {
  font-size: 8px;
}
.ShiftsArray--Split .Shift__Time {
  font-size: 8px !important;
  line-height: 8px;
}
.ShiftsArray--Split .Shift__Action {
  width: 18px;
  height: 21px;
  font-size: 5.5px;
}
.ShiftsArray--Split .Shift__Action svg {
  font-size: 8px;
}
.ShiftsArray--Split .Shift__TimeIcons {
  padding: 2px 2.5px;
  font-size: 7px;
  align-items: end;
  gap: 2px;
}
.ShiftsArray--Split .Shift__IsAutomated {
  font-size: 7.5px;
  top: 1px;
  right: 2px;
  width: 10px;
  height: 10px;
}
.ShiftsArray--Split .Shift__Pending {
  padding: 2px;
  height: 18px;
  width: 18px;
  font-size: 7px;
}
.--isMobile .ShiftsArray .Shift__Action {
  width: 26px;
  font-size: 7px;
}
.--isMobile .ShiftsArray--Split .Shift__Body {
  padding: 2px 10px;
}
.--isMobile .ShiftsArray--Split .Shift__Action {
  width: 18px;
  font-size: 5.5px;
}
.--isMobile .ShiftsArray--Split .Shift__TimeIcons {
  align-items: start;
}
.--isMobile .ShiftsArray--Split .Shift__IsAutomated {
  font-size: 7.5px;
  right: 2px;
  top: 10px;
  width: 10px;
  height: 10px;
}

.TimeOffApproval {
  position: absolute;
  top: 0;
  width: 90%;
  height: 70%;
  margin: 7px;
  padding: 0 5px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: #9b9dae;
  color: #fff;
  border-radius: 5px;
  z-index: 1;
}
.TimeOffApproval__Preloader {
  font-size: 10px;
  color: #fff;
}
.TimeOffApproval__Icon {
  width: 25px;
  margin: 0 2px;
  border-radius: 5px;
}
.TimeOffApproval__Icon:hover {
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  cursor: pointer;
}
.TimeOffApproval__Icon svg {
  width: 100%;
  margin-top: 2px;
}
.TimeOffApproval__Icon--success {
  background: #379d79;
}
.TimeOffApproval__Icon--danger {
  background: #f35468;
}
.TimeOffApproval__Icon--info {
  width: 13px;
}
.TimeOffApproval__Info {
  font-size: 9px;
}
.TimeOffApproval__Inner {
  display: flex;
  align-items: center;
  gap: 7px;
}
.TimeOffApproval__Inner--groupRequest {
  gap: 10px;
}
.TimeOffApproval__Inner--singleRequest {
  width: 100%;
}
.TimeOffApproval__Popup.Popup__Content {
  max-width: 250px;
  overflow-y: auto;
  word-wrap: break-word;
  box-shadow: 0 4px 4px rgba(0,0,0,0.25);
}
.TimeOffApproval__Popup.Popup__Content--group {
  max-width: 450px;
}
.TimeOffApproval__Popup .Popup__Content__Inner {
  margin: 12px 5px 0px 5px;
  border: 1px solid #d1d1d1;
}
.TimeOffApproval__Popup .Popup__Content__Inner p {
  margin: 5px;
  font-size: 12px;
}

.GridWeek__Droppable,
.GridWeek__Draggable {
  min-width: 100%;
  min-height: 100%;
}
.GridWeek__Day {
  width: 100%;
  height: 100%;
}
.GridWeek__Day--dragginOver {
  height: 60px;
}
.GridWeek__Day--OpenShifts .Shift {
  background-color: #b3b3b3 !important;
}
@media (min-width: 600px) {
  .GridWeek__Day--notHistorical:not(.GridWeek__Day--dragging):hover {
    cursor: pointer;
    background: #e1f3ec;
  }
}
@media (min-width: 600px) {
  .GridWeek__Day:hover .GridWeek__DayActions {
    display: flex;
  }
  .GridWeek__Day:hover .GridWeek__DayAction {
    display: flex;
  }
}
.GridWeek__DayActions {
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.GridWeek__DayActions--showDayActions {
  background: #e1f3ec;
}
.GridWeek__DayActions--showDayActions .GridWeek__DayAction {
  display: flex;
}
.GridWeek__DayAction {
  flex-basis: 100%;
  flex-direction: column;
  display: none;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  background: #e1f3ec;
  text-transform: uppercase;
  font-size: 11px;
  cursor: pointer;
}
.GridWeek__DayAction svg {
  font-size: 22px;
  margin-bottom: 2px;
}
.GridWeek__DayAction:hover {
  color: #fff;
}
.GridWeek__DayAction--Copy {
  background: #c4c4c4;
}
.GridWeek__DayAction--Unavailable {
  background: #46b3fc;
}
.GridWeek .Shift {
  position: relative;
}
.GridWeek._Table {
  position: relative;
}
.GridWeek._Table--withOpenShifts ._Table__Row:first-child {
  background: #d2edff;
}
.GridWeek ._Table__Table {
  border-collapse: collapse;
  min-width: 961px;
}
.GridWeek ._Table__Header {
  position: sticky;
  z-index: 2;
  top: 0;
}
.GridWeek ._Table__Row:nth-child(odd) {
  background: #f1f3f7;
}
.GridWeek ._Table__Row:nth-child(even) {
  background: #f8f8f8;
}
.GridWeek ._Table__Column {
  background: #fff;
  height: 50px;
  border: 1px solid #ececec;
  border-top: none;
  border-bottom: none;
  text-align: center;
  color: #5c5c5c;
  font-size: 18px;
  padding: 0;
  z-index: 1;
  top: 0;
}
.GridWeek ._Table__Column::before {
  content: '';
  position: absolute;
  width: 100%;
  left: 0;
  height: 1px;
  background: #ececec;
  top: 0;
}
.GridWeek ._Table__Column::after {
  bottom: 0;
}
.GridWeek ._Table__Column:hover {
  background: rgba(0,0,0,0.1);
}
.GridWeek ._Table__Column--today span:first-child {
  color: #75cbad;
}
.GridWeek ._Table__Column--today span:last-child {
  border-radius: 50%;
  background-color: #75cbad;
  color: #e1f3ec;
  justify-content: center;
  display: flex;
  min-height: 25px;
  width: 25px;
  align-items: center;
}
.GridWeek ._Table__Column--link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  line-height: 18px;
}
.GridWeek ._Table__Column--check {
  color: #f35468;
}
.GridWeek ._Table__Column--enableOverFlow {
  overflow: visible;
}
.GridWeek ._Table__Cell {
  height: 48px;
  padding: 0;
  border: 1px solid #ececec;
  vertical-align: middle;
  position: relative;
}
.App--isMobile .GridWeek {
  overflow-x: auto;
}
.--isTablet .GridWeek ._Table__Column {
  position: relative;
  width: 150px;
}

.NotSetRole__Body {
  height: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.NotSetRole__Body p {
  font-size: 18px;
}
.NotSetRole__Body b {
  cursor: pointer;
}

.Avatar svg {
  background: #e1f3ec;
  color: #75cbad;
}
.Avatar img {
  max-width: 100%;
}

.CompanyUser {
  margin-bottom: 20px;
  width: 100%;
  font-size: 15px;
  color: #4a4a4a;
}
.CompanyUser__Name {
  font-size: 18px;
  font-weight: 600;
  margin: 10px 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.CompanyUser__Title {
  margin: 10px 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.LocationUnassignModal ._Modal__Header {
  background: #f35468;
  color: #fff;
  font-weight: normal;
}
.LocationUnassignModal ._Modal__Body {
  font-size: 14px;
  text-align: center;
}
.LocationUnassignModal ._Modal__Footer {
  flex-direction: row;
  justify-content: space-evenly !important;
  padding: 10px 10px 20px;
}
.LocationUnassignModal ._Modal__Footer ._Group ._Button {
  text-transform: uppercase;
}
.LocationUnassignModal ._Modal__Close {
  background: #fff;
  color: #f35468;
  right: 8px;
  top: 8px;
  padding: 4px;
}

.Locations:nth-child(odd) {
  background: #f1f3f7;
}
.Locations:nth-child(even) {
  background: #f8f8f8;
}
.Location {
  margin-top: 5px;
}
.Location ._Form__Label {
  min-width: 50px;
}
.Location ._Form__Field {
  padding: 2.5px 5px;
}
.Location__Header {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}
.Location__Header--Group {
  justify-content: space-between;
}
.Location__Footer {
  display: flex;
  justify-content: center;
  align-items: center;
}
.Location__Footer--Group ._Button:not(._Button--Danger) {
  margin-left: 50px;
}
.Location__Type {
  font-size: 15px;
  font-weight: 600;
  color: #4a4a4a;
}
.Location__Button {
  cursor: pointer;
}
.Location__Button--Danger svg {
  color: #f35468;
}
.Location__Button--Success svg {
  color: #379d79;
}
.Location__Button span {
  font-size: 8px;
  vertical-align: middle;
}
.Location__Button svg {
  font-size: 20px;
  margin-left: 5px;
  vertical-align: middle;
}
.--isTablet .Location__Footer--Group ._Button {
  font-size: 0.8rem;
}
.--isTablet .Location__Footer--Group ._Button:not(._Button--Danger) {
  margin-left: 10px;
}

.Profile__Info ._Form__Field--Inline {
  width: 100%;
  overflow: hidden;
}
.Profile__Info ._Form__View {
  max-width: 80%;
  word-wrap: break-word;
}
.--isTablet .App--withSidebar .ProfileModule {
  min-width: calc(100vw - 60px);
}

.PulseSearch {
  position: relative;
  height: 30px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  background: #fff;
  border-radius: 20px;
}
.PulseSearch__Icon--Search,
.PulseSearch__Icon--Clear {
  position: absolute;
  cursor: pointer;
  height: 100%;
  top: 0px;
}
.PulseSearch__Icon--Search {
  color: #d9d9d9;
  font-size: 18px;
  left: 7.5px;
}
.PulseSearch__Icon--Clear {
  font-size: 14px;
  right: 10px;
}
.PulseSearch input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 30px;
}
.PulseSearch input:focus {
  outline: none;
}

.InfiniteScroll__Footer {
  height: 75px;
  padding: 20px 0;
}

.PulseEmployees {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 7.5px;
  border-bottom: 1px solid #ececec;
}
.PulseEmployees:nth-child(odd) {
  background: #f1f3f7;
}
.PulseEmployees:nth-child(even) {
  background: #f8f8f8;
}
.PulseEmployees__User {
  display: flex;
  margin-right: 2px;
  flex: 1 1 150px;
}
.PulseEmployees__User .UserAvatar {
  flex-shrink: 0;
  margin-right: 5px;
  height: 100%;
}
.PulseEmployees__Data {
  display: flex;
  justify-content: flex-end;
}
.PulseEmployees__Title {
  display: grid;
}
.PulseEmployees svg {
  height: 2em;
  width: 2em;
  color: #7e7e7e;
}
.PulseEmployees span {
  font-size: 10px;
  word-break: break-all;
  line-height: 1.2em;
  height: 1.2em;
  font-weight: bold;
}
.PulseEmployees__Name {
  text-transform: capitalize;
  word-break: break-all;
  overflow: hidden;
  font-weight: bold;
  line-height: 1.4em;
  height: 1.4em;
}
.PulseEmployees__Scheduled {
  color: #7e7e7e;
  word-break: break-all;
  overflow: hidden;
  font-weight: bold;
  display: flex;
  align-items: center;
}
.PulseEmployees__Scheduled span {
  color: #7e7e7e;
  font-size: 12px;
  line-height: 1.2em;
  height: auto;
  margin-left: 2px;
}
.PulseEmployees__Scheduled svg {
  height: 14px;
  width: 14px;
}
.PulseEmployees__HoursBar {
  display: flex;
  align-items: center;
  margin-right: 5px;
}
.PulseEmployees__HoursBar span {
  white-space: nowrap;
  height: 12px;
  margin-left: 5px;
}
.PulseEmployees__ScheduledBar {
  height: 12px;
  width: 90px;
  background-color: #d9d9d9;
  color: #000;
}
.PulseEmployees__ActualBar {
  height: 12px;
  position: relative;
}
.PulseEmployees__ActualBar > span {
  position: absolute;
  font-weight: 700;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
}
.PulseEmployees__ScheduledHours {
  width: 26px;
}
.PulseEmployees__Breaks {
  position: relative;
  text-align: center;
  margin-right: 5px;
}
.PulseEmployees__PunchData {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 60px;
}
.PulseEmployees__PunchData > span {
  font-size: 8px;
}
.PulseEmployees__PunchData--Warning {
  color: #e8cd6a;
}
.PulseEmployees__PunchData--Danger {
  color: #f87878;
}
.PulseEmployees__PunchData--Success {
  color: #75cbad;
}
.PulseEmployees .PulseEmployees__Icon {
  position: relative;
  top: 1px;
}
.PulseEmployees .PulseEmployees__Icon--Danger svg {
  color: #f35468;
}
.PulseEmployees .PulseEmployees__Icon--Warning svg {
  color: #ecc63e;
}
.PulseEmployees .PulseEmployees__Icon--Success svg {
  color: #379d79;
}
.PulseEmployees .PulseEmployees__Icon--Notice svg {
  color: #b8b8b8;
}
.PulseEmployees .PulseEmployees__IconCounter {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  transform: translateX(-50%) translateY(-50%);
  border-radius: 100%;
  background-color: #fff;
  font-size: 8px;
  font-weight: bold;
}
.PulseEmployees .PulseEmployees__NoWrap {
  white-space: nowrap;
}
.--isMobile .PulseEmployees__Name {
  overflow-x: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.--isMobile .PulseEmployees__Scheduled {
  overflow-x: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.--isMobile .PulseEmployees__HoursBar {
  margin-right: 3px;
}
.--isMobile .PulseEmployees__HoursBar span {
  margin-left: 2px;
}
.--isMobile .PulseEmployees__ScheduledBar {
  width: 45px;
}

.PulseStore__Header {
  user-select: none;
  display: flex;
  justify-content: space-between;
  padding: 0 7.5px;
  align-items: center;
  background: #52aa8b;
  height: 30px;
  flex: 1 1 250px;
  cursor: pointer;
  font-weight: 700;
  color: #fff;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.25);
}
.PulseStore__Header--isOpenedLate {
  background: #ecc63e;
}
.PulseStore__Header--isOpensLater {
  background: #808080;
}
.PulseStore__Header--isNotOpen {
  background: #f35468;
}
.PulseStore__Header--isClosed {
  background: #808080;
}
.PulseStore__Title {
  width: 100%;
  overflow: hidden;
}
.PulseStore__Label {
  width: 140px;
  font-size: 11px;
  display: grid;
  justify-items: right;
}
.PulseStore__SubHeader {
  font-size: 8px;
}
.PulseStore__Toggle {
  cursor: pointer;
  display: flex;
  flex: 0 0 2.5em;
}
.PulseStore__Toggle svg {
  width: 2.5em;
  height: 2.5em;
  color: #fff;
}
.PulseStore__Body {
  padding: 2px 0;
  background: #fff;
}
.PulseStore__StoreName {
  cursor: pointer;
}
.--isMobile .PulseStore__Title span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  width: 60vw;
}
.--isMobile .PulseStore__Header {
  height: 32px;
}

.PulseDatePicker {
  position: relative;
  display: flex;
  justify-content: space-between;
  min-width: 115px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  height: 30px;
  background: #fff;
  align-items: center;
  text-align: center;
  padding: 0 10px;
  margin-right: 10px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 14px;
}
.PulseDatePicker--Icon {
  cursor: pointer;
}
.PulseDatePicker--Icon--Calendar {
  border: 1px solid #4a4a4a;
  border-radius: 20px;
  font-size: 12px;
  margin-left: 5px;
}
.PulseDatePicker--Disabled svg {
  color: #e1eafb;
}
.PulseDatePicker--Disabled .PulseDatePicker--Calendar {
  border: 1px solid #d7ebe4;
}
.PulseDatePicker svg {
  padding: 2px;
  flex: 0 0 12px;
}
.PulseDatePicker p {
  flex: none;
}
.PulseDatePicker__DropDown {
  position: absolute;
  z-index: 1000;
  left: 0px;
  top: 35px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.PulseDatePicker__Date {
  display: flex;
  cursor: pointer;
  align-items: center;
  gap: 2px;
}
.--isMobile .PulseDatePicker__DropDown {
  width: 280px;
}
.--isMobile .PulseDatePicker .react-calendar {
  padding: 10px;
}
.--isMobile .PulseDatePicker .react-calendar__navigation__arrow {
  padding: 0 5px;
}
.--isMobile .PulseDatePicker .react-calendar__month-view__weekdays__weekday abbr {
  padding: 5px;
}

.PulseFilter {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 700;
  line-height: 18px;
}
.PulseFilter--isFiltered {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 10px;
  height: 10px;
  background: #f35468;
  border-radius: 100%;
}
.PulseFilter__Icon {
  position: relative;
  cursor: pointer;
  font-size: 17px;
  margin-top: 5px;
  margin-right: 10px;
}
.PulseFilter__DropDown {
  position: absolute;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  z-index: 1000;
  left: -15px;
  top: 35px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  width: 225px;
}
.PulseFilter__Header {
  display: flex;
  justify-content: space-between;
  padding: 10px 20px;
  border-bottom: 1px solid #d9d9d9;
}
.PulseFilter__Clear {
  cursor: pointer;
  color: #59af90;
}
.PulseFilter__Footer {
  display: flex;
  padding: 10px 20px;
  border-top: 1px solid #d9d9d9;
  justify-content: center;
  margin-top: 10px;
}
.PulseFilter__Apply {
  color: #59af90;
  cursor: pointer;
}
.PulseFilterSelect__Title {
  padding: 10px 20px 5px;
  font-size: 15px;
  line-height: 15px;
  font-weight: 600;
}
.PulseFilterSelect__Option {
  display: block;
  padding: 3px 20px;
  white-space: nowrap;
  font-size: 15px;
  line-height: 15px;
  font-weight: 300;
  cursor: pointer;
}
.PulseFilterSelect__Option ._CheckboxInput {
  width: 1em !important;
  height: 1em !important;
  margin-right: 5px;
}
.PulseFilterSelect__Option ._CheckboxInput__Input {
  border-radius: 20px;
}
.PulseFilterSelect__Option ._CheckboxInput__Input--Checked {
  color: #59af90;
  background: #59af90;
}

.Pulse {
  display: flex;
  flex-direction: column;
  padding-bottom: 0 !important;
  overflow: hidden;
}
.Pulse img {
  width: 100%;
}
.Pulse__Header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 15px;
  background: #e1f3ec;
}
.Pulse__Header--Left {
  display: flex;
}
.Pulse__Controls {
  font-size: 17px;
  display: flex;
  align-items: center;
  margin-top: 5px;
}
.Pulse__Controls--Icon {
  margin-left: 10px;
}
.Pulse__Controls--Refresh {
  background: #fff;
  padding: 10px 15px;
  color: #000;
  font-weight: 600;
  font-size: 14px;
  border-radius: 3px;
  border: 2px solid #d9d9d9;
}
.Pulse__Controls svg {
  cursor: pointer;
}
.Pulse .InfiniteScroll {
  overflow: auto;
}
.Pulse .InfiniteScroll__Body {
  min-height: 300px;
}
.--isTablet .Pulse {
  height: initial;
}

.Popup {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
}
.Popup:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.Popup__Content {
  background-color: #fff;
  padding: 2px 16px 14px 16px;
  border-radius: 15px;
}
.Popup__Content__Item {
  color: #379d79;
}
.Popup__Content__Text {
  margin-bottom: 10px;
  display: block;
  max-width: 250px;
  margin: 0 auto;
  font-size: $font-size;
  line-height: $line-height;
}
.Popup__Content svg {
  color: #f35468;
  margin-right: 10px;
}

.TimeClockBreaks {
  position: relative;
  max-width: 150px;
}
.TimeClockBreaks__Tooltip {
  width: 200px;
  background: #fff;
  padding: 5px;
}
.TimeClockBreaks__Automation {
  position: absolute;
  top: -2px;
  left: -5px;
}

.TimeClockEmployee {
  margin-bottom: 25px;
  position: relative;
}
.TimeClockEmployee ._AsyncButton {
  height: 25px;
  color: rgba(0,0,0,0.5);
}
.TimeClockEmployee ._AsyncButton svg {
  font-size: 1em;
}
.TimeClockEmployee__Header {
  width: 100%;
  background: #fbfbfb;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 5px;
  padding: 5px 0;
  display: flex;
  position: absolute;
  top: 0;
}
.TimeClockEmployee__ExportHistory {
  display: flex;
  gap: 5px;
  font-weight: 600;
  font-size: 12px;
  cursor: pointer;
}
.TimeClockEmployee__ExportHistory svg {
  color: #379d79;
}
.TimeClockEmployee__Date {
  display: flex;
  flex-direction: column;
}
.TimeClockEmployee__DateName {
  font-size: 10px;
  line-height: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.TimeClockEmployee__User {
  display: flex;
  flex: 1 1;
  padding-left: 20px;
  align-items: center;
}
.TimeClockEmployee__User .OnShiftStatus {
  display: none;
}
.TimeClockEmployee__Name {
  height: 20px;
  font-weight: 700;
  font-size: 15px;
  line-height: 24px;
  display: flex;
  align-items: center;
  color: #000;
}
.TimeClockEmployee__Position {
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  display: flex;
  align-items: center;
  color: #000;
}
.TimeClockEmployee__Info {
  margin: 10px;
}
.TimeClockEmployee__Approve {
  padding: 5px 15px;
}
.TimeClockEmployee__Cell--Danger {
  color: #f35468;
}
.TimeClockEmployee .UserAvatar {
  margin-right: 5px;
}
.TimeClockEmployee ._Table {
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 5px;
  background: #fff;
}
.TimeClockEmployee ._Table__Column {
  padding: 15px 10px;
  color: #000;
  font-size: 0.9em;
  background: rgba(255,255,255,0);
  align-items: center;
  text-align: center;
  position: relative;
  top: auto;
  z-index: auto;
  white-space: nowrap;
}
.TimeClockEmployee ._Table:not(:first-child)::before {
  content: none;
}
.TimeClockEmployee ._Table__Body {
  background: rgba(217,217,217,0.05);
}
.TimeClockEmployee ._Table__Row {
  border-bottom: 0;
}
.TimeClockEmployee ._Table__Row:nth-child(even) ._Table__Cell {
  background: #f8f8f8;
}
.TimeClockEmployee ._Table__Row:nth-child(odd) ._Table__Cell {
  background: #f1f3f7;
}
.TimeClockEmployee ._Table__Row:last-child ._Table__Cell:first-child {
  border-bottom-left-radius: 5px;
}
.TimeClockEmployee ._Table__Row:last-child ._Table__Cell:last-child {
  border-bottom-right-radius: 5px;
}
.TimeClockEmployee ._Table__Cell {
  align-items: center;
  text-align: center;
  color: rgba(0,0,0,0.5);
  padding: 10px 5px;
}
.TimeClockEmployee ._Table__Cell:last-child {
  text-align: right;
}
.TimeClockEmployee ._Table--withoutPointer ._Table__Row {
  cursor: default !important;
}
.TimeClockEmployee__StoreNameTooltip {
  position: relative;
  bottom: 20px;
  right: 10px;
}
.TimeClockEmployee .TimeClockEmployee__TimeOut {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
}
.TimeClockEmployee .TimeClockEmployee__AutoClockOut {
  padding-top: 2px;
  color: #838383;
}
.TimeClockEmployee .TimeClockEmployee__AutoClockOut--Danger {
  color: #f35468;
}
.TimeClockEmployee .TimeClockEmployee__ScheduleReview {
  margin-right: 15px;
}
.TimeClockEmployee .TimeClockEmployee__Icon {
  height: 25px;
  justify-content: center;
  border-color: #e0e3e9;
  background: #f1f3f7;
}
.TimeClockEmployee .TimeClockEmployee__Icon svg {
  font-size: 1em;
  color: rgba(0,0,0,0.5);
}
.TimeClockEmployee .TimeClockEmployee__Icon--Warning {
  border-color: #ecc63e;
  background: #ecc63e;
}
.TimeClockEmployee .TimeClockEmployee__Icon--Danger {
  border-color: #f35468;
  background: #f35468;
}
.--isTablet .TimeClockEmployee__Table ._AsyncButton--Pending::before {
  margin: 0;
}

.TimeClockFilters {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px;
}
.TimeClockFilters__Fields {
  display: flex;
}
.TimeClockFilters__Fields > div {
  margin-right: 10px;
  position: relative;
}
.TimeClockFilters__Field {
  margin: 0 10px 0 0;
  width: 150px;
}
.TimeClockFilters__Field--calendar {
  width: 150px;
}
.TimeClockFilters__Field--calendar span {
  position: absolute;
  top: 17px;
  left: 5px;
  z-index: 1;
}
.TimeClockFilters__Field--calendar ._TextInput__Wrapper {
  margin: 0 0 0 20px;
}
.TimeClockFilters__Field--calendar .nav-date {
  position: absolute;
  right: 0;
  top: 17px;
}
.TimeClockFilters__Field--search input {
  width: 85%;
}
.TimeClockFilters__Field--search svg {
  position: absolute;
  right: 5px;
  top: 19px;
  color: rgba(0,0,0,0.5);
}
.TimeClockFilters__Field--select select {
  padding: 0 0 0 5px;
}
.TimeClockFilters__Button {
  margin: 0 10px 0 0;
}
.App--withSidebar .TimeClockFilters__Field--calendar svg {
  margin: 0;
}
.App--withSidebar .TimeClockFilters__Field--calendar ._TextInput__Wrapper {
  margin: 0 0 0 15px;
}
.--isTablet .TimeClockFilters__Field--calendar {
  width: 200px;
}

.EditTimecard__IconWrapper {
  position: absolute;
  display: flex;
  right: -15px;
  top: 22px;
  width: 20px;
}
.EditTimecard__Icon {
  height: 17px;
  width: 100%;
}
.EditTimeCard {
  width: 500px;
  box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
  border-radius: 15px;
}
.EditTimeCard h2 {
  color: #5c5c5c;
  position: relative;
}
.EditTimeCard__ShiftBreaks {
  position: relative;
}
.EditTimeCard__Error {
  position: absolute;
  bottom: 0px;
  left: 95px;
  font-size: 10px;
  color: #f35468;
  background: none;
}
.EditTimeCard ._Modal__Header {
  color: #5c5c5c;
  padding: 30px 20px 0 60px;
}
.EditTimeCard ._Modal__Header svg {
  cursor: pointer;
}
.EditTimeCard ._Modal__Header::after {
  height: 0;
}
.EditTimeCard ._Modal__Body {
  min-height: 370px;
  padding-top: 30px;
  padding-right: 70px;
}
.EditTimeCard ._Form__Label {
  flex: 1 0 80px;
  color: #16a085;
}
.EditTimeCard ._Form ._TextInput,
.EditTimeCard ._Form ._TextareaInput,
.EditTimeCard ._Form ._SelectInput {
  border: 1.75px solid #a1a1a1;
  border-radius: 0;
}
.EditTimeCard ._Form .TimeInput--MissingTime ._TextInput {
  color: #c53d3d;
  border: 1.75px solid #c53d3d;
}
.EditTimeCard ._Form .TimeInput--withIssues ._TextInput {
  color: #c53d3d;
}
.EditTimeCard .TimeInput__Label {
  flex: 1 0 80px;
  color: #16a085;
}
.EditTimeCard ._Button--Grey {
  background: #d1d1d1;
  border-color: #d1d1d1;
}
.EditTimeCard ._Grid__Row {
  position: relative;
}
.EditTimeCard ._Grid__Col {
  padding: 5px 10px;
}

.ModalPayroll {
  width: 500px;
  box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
}
.ModalPayroll__Subheader {
  font-size: 14px;
}
.ModalPayroll ._Form {
  display: flex;
}
.ModalPayroll ._Form__Label {
  color: #5c5c5c;
  font-weight: bold;
}

.ModalAddPunch {
  width: 500px;
  box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
  border-radius: 15px;
}
.ModalAddPunch__CalendarIcon {
  position: absolute;
  top: 22.5px;
  right: 20px;
  z-index: 1;
}
.ModalAddPunch__IconWrapper {
  position: absolute;
  right: -15px;
  top: 22px;
}
.ModalAddPunch__IconWrapper__Icon {
  height: 17px;
  width: 100%;
}
.ModalAddPunch h2 {
  color: #5c5c5c;
  position: relative;
}
.ModalAddPunch__ShiftBreaks {
  position: relative;
}
.ModalAddPunch__Error {
  position: absolute;
  bottom: 0px;
  left: 95px;
  font-size: 10px;
  color: #f35468;
  background: none;
}
.ModalAddPunch ._Modal__Header {
  color: #5c5c5c;
  padding: 30px 20px 0 60px;
}
.ModalAddPunch ._Modal__Header svg {
  cursor: pointer;
}
.ModalAddPunch ._Modal__Header::after {
  height: 0;
}
.ModalAddPunch ._Modal__Body {
  min-height: 370px;
  padding-right: 70px;
  padding-top: 30px;
}
.ModalAddPunch ._Form__Error {
  position: absolute;
  bottom: -5px;
  left: 85px;
  font-size: 10px;
  color: #f35468;
  background: none;
}
.ModalAddPunch ._Form__Label {
  flex: 1 0 80px;
  color: #16a085;
}
.ModalAddPunch ._Form ._TextInput,
.ModalAddPunch ._Form ._TextareaInput,
.ModalAddPunch ._Form select {
  border: 1.75px solid #a1a1a1;
  border-radius: 0;
}
.ModalAddPunch ._Form select {
  padding: 0 5px;
}
.ModalAddPunch ._Form ._SelectInput {
  border: none;
}
.ModalAddPunch ._Form .TimeInput--MissingTime ._TextInput {
  color: #c53d3d;
  border: 1.75px solid #c53d3d;
}
.ModalAddPunch .TimeInput__Label {
  flex: 1 0 80px;
  color: #16a085;
}
.ModalAddPunch ._Button--Grey {
  background: #d1d1d1;
  border-color: #d1d1d1;
}
.ModalAddPunch ._Grid__Row {
  position: relative;
}
.ModalAddPunch ._Grid__Col {
  padding: 5px 10px;
}

.ModalPayrollLockdown {
  width: 390px;
  box-shadow: 4px 4px 4px rgba(0,0,0,0.25);
}
.ModalPayrollLockdown__Subheader div {
  margin-bottom: 10px;
}
.ModalPayrollLockdown__Date {
  display: flex;
  justify-content: center;
  align-items: center;
}
.ModalPayrollLockdown__DateLabel {
  margin-right: 10px;
  color: #16a085;
  font-weight: 700;
}
.ModalPayrollLockdown ._Modal__Body {
  height: 260px;
}
.ModalPayrollLockdown .Calendar ._DateInput__DropDown {
  top: -60px;
  left: -155px;
}

.DateFilter {
  width: 115px;
  height: 50%;
  margin-right: 20px;
}
.DateFilter ._TextInput {
  height: 35px;
  border: 1px solid #16a085;
}
.DateFilter input {
  font-size: 13px;
}
.TimeCards__Placeholder {
  text-align: center;
  margin: 0 100px;
}
.TimeCards__Placeholder img {
  width: 100px;
}
.TimeCards__TableHeader {
  margin: 25px 0;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 5px;
  background: #fbfbfb;
  position: sticky;
  z-index: 2;
  top: 0;
}
.TimeCards__TableHeader ._Table__Header {
  background: transparent;
}
.TimeCards__TableHeader ._Table__Column {
  padding: 15px 0;
  color: #000;
  font-size: 1.1em;
  align-items: center;
  text-align: center;
  background: transparent;
}
.TimeCards__TableHeader ._Table__Column:not(:first-child)::before {
  content: none;
}
.TimeCards__Buttons {
  margin-left: 15px;
}
.TimeCards__Buttons svg {
  margin-right: 5px;
}
.TimeCards .Module__Wrapper {
  padding: 0 15px;
}
.--isTablet .TimeCards {
  width: fit-content;
}
.--isTablet .TimeCards .Module__Wrapper {
  overflow-x: scroll;
}
.--isTablet .TimeCards .Module__Body {
  width: fit-content;
}
.UnlockPayroll {
  width: 500px;
  line-height: 20px;
  font-size: 14px;
}

.ShiftEndAutoClockOut {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 50px;
  background: rgba(217,217,217,0.9);
  width: 100%;
  height: 100%;
  overflow: auto;
}
.ShiftEndAutoClockOut__Head {
  margin: 30px 0;
  font-size: 24px;
  line-height: 34px;
  color: #4e4e4e;
  font-weight: 700;
  text-align: center;
}
.ShiftEndAutoClockOut > ._Button {
  display: block;
  width: 100%;
  height: auto;
  font-size: 20px;
  background-color: #75cbad;
  border-color: #75cbad;
  border-radius: 20px;
  margin-bottom: 20px;
  line-height: 60px;
}
.ShiftEndAutoClockOut__EndOfShift {
  position: absolute;
  bottom: 4px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 14px;
  color: #fff;
  font-style: italic;
  line-height: 1em;
}
.ShiftEndAutoClockOut ._Form {
  width: 100%;
}
.ShiftEndAutoClockOut ._Form ._TextInput {
  height: 50px;
  width: 100%;
  font-size: 20px;
}
.ShiftEndAutoClockOut ._Form ._Group {
  width: 100%;
  text-align: right;
}
.--isMobile .ShiftEndAutoClockOut {
  padding: 50px;
}

.AsideModule {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.AsideModule__Body {
  height: 100%;
  padding: 0 20px;
}
.AsideModule__Body > ._Group {
  display: block;
  width: 100%;
  margin: 40px 0;
  padding: 0 20px;
}
.AsideModule__Body > ._Group ._Button {
  display: block;
  width: 100%;
  text-align: center;
}
.AsideModule__Footer {
  padding: 30px 40px;
}
.AsideModule__Footer > ._Button {
  display: block;
  width: 100%;
  text-align: center;
}
.AsideModule__Header {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 25px;
  font-size: 20px;
  font-weight: 700;
}
.AsideModule__Title {
  background: #fff;
  padding: 15px 15px 0 15px;
  border-radius: 25px 25px 0 0;
  color: #16a085;
}
.AsideModule__Subtitle {
  width: 90%;
  padding: 30px;
  background: #fff;
  border-radius: 25px;
  text-align: center;
}
.AsideModule__Section {
  margin: 20px 0;
}
.AsideModule__SectionTitle {
  font-weight: 700;
  font-size: 15px;
  color: #999;
  padding: 10px 0;
}
.AsideModule__SectionBody {
  position: relative;
  background: #fff;
  border-radius: 25px;
  padding: 15px;
  margin-bottom: 15px;
}
.AsideModule__Badge {
  flex: 1;
  text-align: end;
  margin-right: 10px;
  margin-bottom: 2.5px;
}
.AsideModule__Row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px;
  margin: 0 10px;
  min-height: 34px;
  cursor: pointer;
}
.AsideModule__Row:not(:last-child) {
  border-bottom: 1px solid #ececec;
}
.AsideModule__Row .Right {
  display: block;
}
.AsideModule__RowChevron {
  font-size: 20px;
  color: #899abe;
}
.AsideModule__RowIcon {
  font-size: 20px;
  color: #f35468;
  margin-right: 5px;
}
.AsideModule__RowTitle {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 2px;
}
.AsideModule__RowTitle--Success {
  color: #379d79;
  font-weight: 700;
}
.AsideModule__RowTitle--Warning {
  color: #ecc63e;
  font-weight: 700;
}
.AsideModule__RowTitle--Danger {
  color: #f35468;
  font-weight: 700;
}
.AsideModule__RowBody {
  font-size: 10px;
}
.--isMobile .AsideModule__Row {
  margin: 0px;
}
.--isMobile .AsideModule__RowTitle {
  font-size: 15px;
}
.--isMobile .AsideModule .__Badge {
  margin-right: 5px;
}

.FingerprintScan__Async {
  display: grid;
  grid-template-rows: 1fr auto 1fr;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 50px;
  width: 100%;
  height: 100%;
  background: rgba(225,243,236,0.9);
  color: #16a085;
  text-align: center;
}
.FingerprintScan__Header {
  font-size: 32px;
  line-height: 1.4em;
}
.FingerprintScan__Icon {
  font-size: 220px;
}
.FingerprintScan__Footer {
  font-size: 32px;
}

.GetDeviceAccess {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0;
}

.EarlyClockInPrevention {
  position: absolute;
  top: 130px;
  left: 0;
  padding: 25px;
  background: #fff;
  border-radius: 25px;
  z-index: 1;
  box-shadow: 0 0 4px 4px rgba(0,0,0,0.25);
}
.EarlyClockInPrevention__Header {
  font-size: 20px;
  font-weight: 700;
}
.EarlyClockInPrevention__Body {
  padding: 20px 0;
}
.EarlyClockInPrevention__Button {
  width: 150px;
  justify-content: center;
}

.ShiftConsentForm {
  position: absolute;
  top: 130px;
  left: 0;
  padding: 40px 20px 25px 25px;
  background: #fff;
  border-radius: 25px;
  z-index: 1;
  box-shadow: 0 0 4px 4px rgba(0,0,0,0.25);
  font-weight: 700;
}
@media (max-width: 360px) {
  .ShiftConsentForm {
    padding: 40px 0 25px 0;
    position: fixed;
    bottom: 0;
  }
  .ShiftConsentForm__Wrapper {
    padding: 0 8px;
    height: 100%;
    overflow-y: scroll;
  }
}
.ShiftConsentForm__Header {
  font-size: 14px;
  text-align: start;
  padding: 5px 0;
}
.ShiftConsentForm__Body {
  padding: 20px 0;
}
.ShiftConsentForm__ToggleHeader {
  display: flex;
  justify-content: end;
  padding: 0 0 10px 0;
  font-size: 12px;
}
.ShiftConsentForm__Row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 40px;
}
@media (max-width: 360px) {
  .ShiftConsentForm__Row {
    flex-direction: column;
    border-bottom: 1px solid #ececec;
    padding-top: 8px;
  }
  .ShiftConsentForm__Row span:first-child {
    flex: 1 !important;
  }
  .ShiftConsentForm__Row span:nth-child(2) {
    flex: 1 !important;
  }
}
.ShiftConsentForm__Row span {
  text-align: left;
}
.ShiftConsentForm__Row span:first-child {
  flex: 1 0 55px;
}
.ShiftConsentForm__Row span:nth-child(2) {
  flex: 1 1 100%;
}
.ShiftConsentForm__Label {
  display: flex;
  align-items: center;
  margin-right: 5px;
  text-align: left;
  color: #899abe;
  text-wrap: nowrap;
}
.ShiftConsentForm__BreakLabel {
  color: #5c5c5c;
}
.ShiftConsentForm__Fields {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ShiftConsentForm__Icon {
  position: absolute;
  right: 35px;
}
.ShiftConsentForm__Toggle {
  display: flex;
}
.ShiftConsentForm__Info {
  display: flex;
  align-items: center;
  padding-bottom: 20px;
  text-align: start;
  font-size: 10px;
}
.ShiftConsentForm__InfoIcon img {
  width: 50px;
}
.ShiftConsentForm__InfoText {
  margin-left: 10px;
}
.ShiftConsentForm__Back {
  position: absolute;
  cursor: pointer;
  top: 15px;
  left: 15px;
}
.ShiftConsentForm__Back svg {
  height: 20px;
  width: 20px;
}

.Success {
  display: flex;
  align-items: center;
  width: 340px;
}
.Success__Text {
  color: #379d79;
  font-size: 20px;
}

.BreakForm {
  margin: 20px 0 0 30px;
}
.BreakForm__Header {
  display: flex;
  text-align: left;
  flex-direction: column;
  color: #000;
}
.BreakForm__Header div {
  margin-bottom: 20px;
}
.BreakForm__Label {
  display: flex;
  align-items: center;
  text-align: left;
  color: #899abe;
}
.BreakForm__BreakLabel {
  color: #000;
}
.BreakForm__Fields {
  display: flex;
  align-items: center;
  gap: 10px;
}
.BreakForm__Icon {
  width: 20px;
}
.BreakForm__Controls {
  display: flex;
  justify-content: flex-end;
  padding-top: 10px;
  gap: 10px;
}
.BreakForm__Error {
  color: #f35468;
  font-size: 12px;
}
.BreakForm__Back {
  position: absolute;
  cursor: pointer;
  top: 15px;
  left: 15px;
}
.BreakForm__Back svg {
  height: 20px;
  width: 20px;
}

.ProceedToEndShift__Back {
  position: absolute;
  top: 15px;
  left: 15px;
}
.ProceedToEndShift__Back svg {
  height: 20px;
  width: 20px;
}
.ProceedToEndShift__Header {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
}
.ProceedToEndShift__Body {
  text-align: left;
}
.ProceedToEndShift__Control {
  padding: 20px 0 0 0;
}
.ProceedToEndShift__Footer {
  font-size: 12px;
  color: #f35468;
}

.Wait__Back {
  position: absolute;
  top: 15px;
  left: 15px;
}
.Wait__Back svg {
  height: 20px;
  width: 20px;
}
.Wait__Header {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
}
.Wait__Body {
  text-align: left;
}
.Wait__Text {
  margin: 0 0 15px 0;
}
.Wait__Control {
  padding: 20px 0 0 0;
  gap: 20px;
}
.Wait__Button {
  background: #808080;
  border-color: #808080;
}
.Wait__Footer {
  font-size: 12px;
  color: #f35468;
}

.ProceedToEndBreak__Back {
  position: absolute;
  top: 15px;
  left: 15px;
}
.ProceedToEndBreak__Back svg {
  height: 20px;
  width: 20px;
}
.ProceedToEndBreak__Header {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
}
.ProceedToEndBreak__Body {
  text-align: left;
}
.ProceedToEndBreak__Control {
  padding: 20px 0 0 0;
}
.ProceedToEndBreak__Footer {
  font-size: 12px;
  color: #f35468;
}

.BreakConsentForm {
  position: absolute;
  top: 130px;
  left: 0;
  width: 395px;
  padding: 15px;
  background: #fff;
  border-radius: 25px;
  z-index: 1;
  box-shadow: 0 0 4px 4px rgba(0,0,0,0.25);
  font-weight: 700;
}
@media (max-width: 360px) {
  .BreakConsentForm {
    position: fixed;
    bottom: 0;
    width: auto;
    padding: 40px 0 25px 0;
  }
  .BreakConsentForm .BreakForm {
    padding: 0 10px;
    margin: 0;
    height: 100%;
    overflow-y: auto;
  }
  .BreakConsentForm .BreakForm__Fields {
    flex-direction: column;
    gap: 0;
  }
}
.BreakConsentForm__Header {
  font-size: 16px;
  line-height: 1.3;
}
.BreakConsentForm__Body {
  padding: 20px 0;
}
.BreakConsentForm__ToggleHeader {
  display: flex;
  justify-content: end;
  padding: 0 0 10px 0;
}
.BreakConsentForm__Row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 45px;
}
.BreakConsentForm__Button {
  width: 150px;
  justify-content: center;
}

.TimeClockMobileHeader {
  position: relative;
  background: #fff;
  border-radius: 25px;
  padding: 20px;
  text-align: center;
  margin-top: 60px;
  margin-bottom: 15px;
}
.TimeClockMobileHeader ._Preloader {
  height: 55px;
}
.TimeClockMobileHeader ._Group {
  display: flex;
}
.TimeClockMobileHeader__Button {
  width: 100%;
  height: 55px !important;
  justify-content: center;
  font-size: 24px !important;
  border-radius: 10px !important;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.25) !important;
  flex-direction: column;
  line-height: 22px;
}
.TimeClockMobileHeader__Button span {
  display: block;
  font-size: 18px;
}
.TimeClockMobileHeader__Button--Warning {
  background: #ecc63e;
  border-color: #ecc63e;
}
.TimeClockMobileHeader__Button--Danger {
  background: #f35468;
  border-color: #f35468;
}
.TimeClockMobileHeader__Button--Notice {
  background: #b8b8b8;
  border-color: #b8b8b8;
  font-size: 18px;
}
.TimeClockMobileHeader__Button:disabled {
  background: #d6d6d6 !important;
  border-color: #adadad;
}
.TimeClockMobileHeader__Title {
  padding-top: 35px;
}
.TimeClockMobileHeader__Name {
  font-weight: 400;
  font-size: 24px;
  color: #000;
}
.TimeClockMobileHeader__Info {
  padding: 15px 0;
  color: #16a085;
  font-weight: 700;
  font-size: 15px;
}
.TimeClockMobileHeader__Info--danger {
  color: #f35468;
}
.TimeClockMobileHeader__Buttons {
  display: flex;
  white-space: nowrap;
  margin-top: 10px;
}
.TimeClockMobileHeader__Buttons ._Button:not(:last-child) {
  margin-right: 15px;
}
.TimeClockMobileHeader__Avatar {
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translate(-50%, 0);
}
.TimeClockMobileHeader__Avatar .UserAvatar__Photo {
  width: 85px;
  height: 85px;
  border: 5px solid #fff;
}
.TimeClockMobileHeader__Avatar .UserAvatar__Photo--noPhoto {
  font-size: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.TimeClockMobileHeader__Avatar .UserAvatar .OnShiftStatus {
  display: none;
}
.TimeClockMobileHeader__Hours {
  position: absolute;
  top: 10px;
  right: 20px;
}
.TimeClockMobileHeader__Date {
  position: absolute;
  top: 10px;
  left: 20px;
}
.TimeClockMobileHeader__Row {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  font-size: 15px;
  padding-bottom: 3px;
}
.TimeClockMobileHeader__Row span {
  padding: 2px 0;
  font-weight: 700;
  font-size: 7px;
  line-height: 3px;
  color: #16a085;
}

.TimeClockAuthorizeBrowser {
  margin-bottom: 15px;
  padding: 20px;
  padding-top: 30px;
  border-radius: 25px;
  background: #ecc63e;
  text-align: center;
  position: relative;
}
.TimeClockAuthorizeBrowser__Edit {
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
}
.TimeClockAuthorizeBrowser__Title {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}
.TimeClockAuthorizeBrowser__Controls {
  color: #fff;
}
.TimeClockAuthorizeBrowser__Controls ._Button:not(:last-child) {
  margin-right: 50px;
}
.TimeClockAuthorizeBrowser .StoreSelect {
  width: 300px;
  margin: 15px 0;
}
.TimeClockAuthorizeBrowser .StoreSelect__Select {
  border: none;
}
.TimeClockAuthorizeBrowser--Disabled {
  background-color: #c4c4c4;
}

.TimeClockAside {
  padding: 20px;
}
.TimeClockAside__Widget {
  width: 100%;
  height: 250px;
  margin-bottom: 15px;
  border-radius: 15px;
  background: #fff;
  border: none;
}
.TimeClockAside__Title {
  font-weight: 700;
  font-size: 15px;
  color: #999;
  padding: 10px 0;
}
.TimeClockAside__Block {
  position: relative;
  background: #fff;
  border-radius: 15px;
  padding: 15px;
  margin-bottom: 15px;
}
.TimeClockAside__Block ._Badge {
  width: 100px;
  text-align: center;
}
.--isMobile .TimeClockAside__Block {
  padding: 10px;
}
.--isMobile .TimeClockAside ._Badge {
  width: 90px;
}

.FingerprintWarning {
  position: absolute;
  top: 0;
  bottom: 0;
}
.FingerprintWarning__Header {
  background: #fff;
}

.Fingerprints {
  width: 100%;
}
.Fingerprints__BeginButton {
  display: flex;
  justify-content: center;
}
.Fingerprints__CancelButton {
  position: absolute;
  bottom: 30px;
  left: 125px;
}
.Fingerprints__CancelButton ._Button {
  display: grid;
  width: 300px;
}

.TimeClockAuthorizeBrowser {
  margin-bottom: 15px;
  padding: 20px;
  padding-top: 30px;
  border-radius: 25px;
  background: #ecc63e;
  text-align: center;
  position: relative;
}
.TimeClockAuthorizeBrowser__Edit {
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
}
.TimeClockAuthorizeBrowser__Title {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}
.TimeClockAuthorizeBrowser__Controls {
  color: #fff;
}
.TimeClockAuthorizeBrowser__Controls ._Button:not(:last-child) {
  margin-right: 50px;
}
.TimeClockAuthorizeBrowser .StoreSelect {
  width: 300px;
  margin: 15px 0;
}
.TimeClockAuthorizeBrowser .StoreSelect__Select {
  border: none;
}
.TimeClockAuthorizeBrowser--Disabled {
  background-color: #c4c4c4;
}

.TimeClockAside {
  padding: 20px;
}
.TimeClockAside__Widget {
  width: 100%;
  height: 250px;
  margin-bottom: 15px;
  border-radius: 15px;
  background: #fff;
  border: none;
}
.TimeClockAside__Title {
  font-weight: 700;
  font-size: 15px;
  color: #999;
  padding: 10px 0;
}
.TimeClockAside__Block {
  position: relative;
  background: #fff;
  border-radius: 15px;
  padding: 15px;
  margin-bottom: 15px;
}
.TimeClockAside__Block ._Badge {
  width: 100px;
  text-align: center;
}
.--isMobile .TimeClockAside__Block {
  padding: 10px;
}
.--isMobile .TimeClockAside ._Badge {
  width: 90px;
}

.FingerprintWarning {
  position: absolute;
  top: 0;
  bottom: 0;
}
.FingerprintWarning__Header {
  background: #fff;
}

.Fingerprints {
  width: 100%;
}
.Fingerprints__BeginButton {
  display: flex;
  justify-content: center;
}
.Fingerprints__CancelButton {
  position: absolute;
  bottom: 30px;
  left: 125px;
}
.Fingerprints__CancelButton ._Button {
  display: grid;
  width: 300px;
}

.Tabs {
  padding: 10px;
  display: flex;
  justify-content: center;
}
.Tabs__Tab {
  text-decoration: none;
  color: inherit;
  padding: 8px 20px;
  margin: 0 5px;
  font-weight: bold;
  color: #16a085;
  background: #fff;
  border-radius: 7px;
}
.Tabs__Tab:first-child {
  border-left: none;
}
.Tabs__Tab:last-child {
  border-right: none;
}
.Tabs__Tab.active {
  background: #16a085;
  color: #fff;
}

.Request {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
}
.Request__Info {
  display: flex;
}
.Request__Avatar img {
  width: 60px;
  border-radius: 50%;
}
.Request__Body {
  padding: 0 5px;
}
.Request__Name {
  margin-bottom: 2.5px;
  font-size: 18px;
  font-weight: 700;
}
.Request__Text {
  font-size: 12px;
  font-weight: 700;
  line-height: 14px;
}
.Request__Control ._Button {
  justify-content: center;
  width: 75px;
}
.Request__Pending {
  display: flex;
}
.Request__Delete {
  color: #f35468;
  display: flex;
  align-items: center;
  margin: 0 10px;
  cursor: pointer;
}
.DeleteTimeOffModal {
  max-width: 400px;
  position: fixed;
  right: 0;
  top: 243px;
  margin-right: 23px;
  border-radius: 20px !important;
}
.DeleteTimeOffModal ._Modal__Header {
  justify-content: center;
}
.DeleteTimeOffModal ._Modal__Body {
  font-size: 13px;
  font-weight: bold;
  margin: 10px;
  padding: 10px;
}
.DeleteTimeOffModal ._Modal__Footer ._Group ._Button {
  border-width: 5px;
  border-radius: 10px;
}
._Modal__Overlay {
  right: 0 !important;
}

.TeamRequestsSearch {
  position: relative;
  height: 30px;
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 5px;
}
.TeamRequestsSearch__ClearIcon,
.TeamRequestsSearch__SearchIcon {
  position: absolute;
  font-size: 18px;
  height: 100%;
  top: 0px;
  cursor: pointer;
}
.TeamRequestsSearch--Disabled {
  cursor: default;
}
.TeamRequestsSearch__SearchIcon {
  color: #d9d9d9;
  left: 7.5px;
}
.TeamRequestsSearch__ClearIcon {
  right: 10px;
  color: #aaa;
}
.TeamRequestsSearch input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 30px;
}
.TeamRequestsSearch input:focus {
  outline: none;
}

.TeamRequestsSort {
  position: relative;
  padding: 5px;
}
.TeamRequestsSort__Expand {
  cursor: pointer;
  border-bottom: 1px solid rgba(134,134,134,0.2);
  width: 100%;
  padding: 10px 0;
  display: flex;
}
.TeamRequestsSort__Label,
.TeamRequestsSort__Icons {
  color: #16a085;
  font-weight: bold;
  padding-left: 3px;
}
.TeamRequestsSort__Icons {
  position: relative;
  top: 1px;
}
.TeamRequestsSort__Option {
  padding: 10px;
  border-bottom: 1px solid rgba(134,134,134,0.2);
  cursor: pointer;
  line-height: 25px;
}
.TeamRequestsSort__Option--IsSelected {
  color: #16a085;
  font-weight: bold;
}

.Requests {
  margin: 10px 0;
  background: #fff;
  border-radius: 7px;
}
.Requests__Header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 10px 15px 15px;
  border-bottom: 1px solid rgba(134,134,134,0.2);
}
.Requests__HeaderText {
  font-size: 20px;
  font-weight: 700;
  color: #868686;
}
.Requests__Search {
  padding: 10px 5px 0 5px;
}
.Requests__NoData {
  padding: 15px 10px 15px 15px;
}



.TimeOffRequests {
  padding: 0 10px;
  height: 50%;
}
.TimeOffRequests__Title {
  padding: 25px 0;
  margin: 10px 0;
  text-align: center;
  font-weight: 700;
  font-size: 26px;
  border-radius: 7px;
  background: #fff;
}
.TimeOffRequests .Tabs__Tab {
  margin: 0;
  border-radius: 0;
}
.TimeOffRequests .Tabs__Tab:first-child {
  border-radius: 5px 0 0 5px;
}
.TimeOffRequests .Tabs__Tab:last-child {
  border-radius: 0 5px 5px 0;
}

.ShiftSwapRequests {
  margin-bottom: 10px;
  position: relative;
  background: #fff;
}
.ShiftSwapRequests__Header {
  padding: 5px 0;
  font-size: 14px;
}
.ShiftSwapRequests__Control {
  align-items: center;
  display: flex;
  gap: 10px;
  padding: 0 5px;
  margin-top: 5px;
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
}
.ShiftSwapRequests__Filter {
  display: flex;
  gap: 5px;
  border-right: 2px solid #d1d1d1;
  padding: 15px 20px 15px 5px;
}
.ShiftSwapRequests__Filter svg {
  color: #16a085;
}
.ShiftSwapRequests__Store {
  background: #f0f0f0;
  display: flex;
  padding: 8px 20px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #16a085;
}
.ShiftSwapRequests__StoreName {
  color: #1d1d1d;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
}
.ShiftSwapRequests__StoreName span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  width: 300px;
}
.ShiftSwapRequests__StoreToggle {
  color: #16a085;
  cursor: pointer;
}
.ShiftSwapRequests__StoreToggle svg {
  width: 2em;
  height: 2em;
}
.ShiftSwapRequests__Body {
  padding: 0 15px;
}
.ShiftSwapRequests .AsideModule__RowTitle {
  font-size: 18px;
  margin-bottom: 2.5px;
  line-height: 20px;
}
.ShiftSwapRequests .AsideModule__RowBody {
  display: flex;
  flex-direction: column;
}
.ShiftSwapRequests .AsideModule__RowBody span {
  font-size: 15px;
  font-weight: 600;
  line-height: 17px;
}
.ShiftSwapRequests .AsideModule__Row ._Badge {
  padding: 5px;
  text-align: center;
  width: 90px;
  margin: 0px 5px;
}
.ShiftSwapRequests__Cancel {
  background: #f87878;
  color: #fff;
  border-radius: 5px;
  font-size: 30px;
}
.ShiftSwapRequests__Badge {
  display: inline-block;
}
.--isMobile .ShiftSwapRequests__StoreName span {
  width: 75vw;
}
.--isMobile .ShiftSwapRequests .AsideModule__Row {
  padding: 5px 10px;
  margin: 4px 0;
  background: #fff;
  border-radius: 5px;
}
.--isMobile .ShiftSwapRequests .AsideModule__RowTitle {
  font-size: 17px;
}
.--isMobile .ShiftSwapRequests .AsideModule__RowBody span {
  font-size: 14px;
}
.--isMobile .ShiftSwapRequests .AsideModule__Row ._Badge {
  padding: 5px;
  width: 75px;
  margin: 0px;
}
.--isMobile .ShiftSwapRequests__Cancel {
  font-size: 25px;
}

.CheckboxButton {
  border: none;
}
.CheckboxButton svg {
  display: block;
  width: 100%;
  height: 100%;
}
.CheckboxButton input {
  display: none;
}
.CheckboxButton ._Button {
  border-radius: 20px;
  padding: 0px 25px;
  height: 40px;
}
.CheckboxButton__Icon {
  width: 14px;
  height: 14px;
  margin-right: 5px;
}
.CheckboxButton__Label {
  font-size: 16px;
  font-weight: 700;
}
.--isMobile .CheckboxButton ._Button {
  padding: 0px 15px;
}

.DateRangePicker {
  position: relative;
  padding: 20px;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
}
.DateRangePicker__Label {
  padding: 0 10px;
}
.DateRangePicker__Range {
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
}
.DateRangePicker__Range svg {
  width: 20px;
  height: 20px;
}
.DateRangePicker__DropDown {
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.DateRangePicker ._Button {
  justify-content: center;
}
.DateRangePicker ._Button--Fullwidth {
  width: 100%;
}
.DateRangePicker .react-calendar {
  padding: 20px;
}
.DateRangePicker .react-calendar__navigation {
  margin-bottom: 10px;
}
.DateRangePicker .react-calendar__navigation__arrow {
  background: transparent;
  border: none;
  font-size: 1.6em;
}
.DateRangePicker .react-calendar__navigation__label {
  background: transparent;
  border: none;
  font-size: 1.2em;
  text-transform: uppercase;
}
.DateRangePicker .react-calendar__month-view__weekdays__weekday {
  font-weight: bold;
  text-align: center;
}
.DateRangePicker .react-calendar__month-view__weekdays__weekday abbr {
  display: inline-block;
  padding: 10px;
  border-bottom: none;
}
.DateRangePicker .react-calendar__tile {
  background: transparent;
  border: none;
  width: auto;
}
.DateRangePicker .react-calendar__tile abbr {
  display: inline-block;
  padding: 5px;
  line-height: 1em;
  width: 1em;
  height: 1em;
  background: transparent;
}
.DateRangePicker .react-calendar__month-view__days__day.react-calendar__tile--active {
  background: #16a085;
}
.DateRangePicker .react-calendar__month-view__days__day.react-calendar__tile--active abbr {
  color: #fff;
}
.DateRangePicker .react-calendar__month-view__days__day.react-calendar__tile--hasActive {
  background: #16a085;
}
.DateRangePicker .react-calendar__month-view__days__day.react-calendar__tile--hasActive abbr {
  color: #fff;
}
.DateRangePicker .react-calendar__month-view__days__day.react-calendar__tile--hasActive.react-calendar__tile--rangeStart {
  border-radius: unset;
}
.DateRangePicker .showCalendarHover .react-calendar__tile--hover {
  background: #75cbad;
}
.DateRangePicker .showCalendarHover .react-calendar__tile--hover abbr {
  color: #fff;
}
.DateRangePicker .showCalendarHover .react-calendar__tile:hover {
  background: #16a085;
}
.DateRangePicker .showCalendarHover .react-calendar__tile:hover abbr {
  color: #fff;
}

.FilterModal {
  position: absolute;
  background: #fff;
  width: 100%;
  height: 100%;
  z-index: 9999;
  top: 0;
}
.FilterModal__Body {
  width: 100%;
  height: calc(100% - 100px);
  overflow: auto;
  padding-bottom: 80px;
}
.FilterModal__Footer {
  display: block;
  width: 440px;
  position: fixed;
  bottom: 0px;
  background: #fff;
  border-top: 2px solid #d1d1d1;
}
.--isMobile .FilterModal {
  height: 100%;
  top: 0px;
}
.--isMobile .FilterModal__Body {
  height: calc(100% - 80px);
  padding-bottom: 20px;
}
.--isMobile .FilterModal__Footer {
  width: 100%;
}

.GeneralFilter__Header {
  position: relative;
  display: flex;
  padding: 12px 20px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid rgba(134,134,134,0.2);
  margin-bottom: 10px;
}
.GeneralFilter__Title {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: #5c5c5c;
}
.GeneralFilter__Close {
  font-size: 24px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.GeneralFilter__Clear {
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  color: #f35468;
  cursor: pointer;
}
.GeneralFilter__Footer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.GeneralFilter__Footer ._Button {
  width: 250px;
  height: 42px;
  display: flex;
  justify-content: center;
  align-self: center;
  border-radius: 20px;
  font-size: 16px;
}
.GeneralFilter .FilterSection {
  padding: 0 15px;
}
.GeneralFilter .FilterSection__RequestTypes {
  display: flex;
  gap: 5px;
  flex-direction: row;
  flex-wrap: wrap;
}
.GeneralFilter .FilterSection__RequestTypes ._Form__Field {
  margin: 0;
}
.GeneralFilter .FilterSection__Favorite {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 10px;
  margin: 20px 0 10px 0;
  border-bottom: 1px solid rgba(134,134,134,0.2);
}
.GeneralFilter .FilterSection__Favorite span {
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
}
.GeneralFilter .FilterSection__FavoriteLink {
  display: flex;
  align-items: center;
  font-size: 14px;
  line-height: 22px;
  font-weight: 700;
  gap: 5px;
  cursor: pointer;
}
.GeneralFilter .FilterSection__FavoriteLink svg {
  color: #aaa;
}
.GeneralFilter .FilterSection__Date {
  padding: 14px 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(134,134,134,0.2);
}
.GeneralFilter .FilterSection__Date .DateRangePicker {
  display: flex;
  padding: 0;
}
.GeneralFilter .FilterSection__Date .DateRangePicker__Label,
.GeneralFilter .FilterSection__Date .DateRangePicker__Range {
  padding: 0;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
}
.GeneralFilter .FilterSection__Date .DateRangePicker__Range {
  font-weight: 700;
  color: #16a085;
}
.GeneralFilter .FilterSection__Date .DateRangePicker__DropDown {
  left: 0;
}
.GeneralFilter .FilterSection__Time {
  display: flex;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
  gap: 10px;
  align-items: center;
  padding: 5px 10px;
  margin-bottom: 15px;
  border-bottom: 1px solid rgba(134,134,134,0.2);
}
.GeneralFilter .FilterSection__TimeLabel {
  width: 200px;
}
.GeneralFilter .FilterSection__TimeIcon {
  flex: none;
  color: #16a085;
  width: 20px;
  height: 20px;
}
.GeneralFilter .FilterSection__Time ._TextInput {
  max-width: 125px;
  font-size: 14px;
  color: #16a085;
}
.GeneralFilter .FilterSection__ShiftTypes {
  display: flex;
  gap: 5px;
  flex-direction: row;
  flex-wrap: wrap;
}
.GeneralFilter .FilterSection__ShiftTypes ._Form__Field {
  margin: 0;
}
.GeneralFilter .FilterSection__ShiftTypes ._Form__Field .CheckboxButton ._Button {
  padding: 0px 40px;
}
.GeneralFilter .FilterSection ._Form__GroupHeader {
  margin: 10px 0;
}
.GeneralFilter .FilterSection ._Form__GroupTitle {
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}
.--isMobile .GeneralFilter .FilterSection__ShiftTypes {
  justify-content: space-evenly;
}
.--isMobile .GeneralFilter .FilterSection__ShiftTypes .CheckboxButton ._Button {
  padding: 0px 30px;
}

.StoresSearch {
  position: relative;
  height: 36px;
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 5px;
  padding: 5px 15px;
  margin: 0 15px;
}
.StoresSearch__ClearIcon,
.StoresSearch__SearchIcon {
  position: absolute;
  height: 100%;
  top: 0px;
  cursor: pointer;
}
.StoresSearch--Disabled {
  cursor: default;
}
.StoresSearch__SearchIcon {
  color: #d9d9d9;
  font-size: 18px;
  left: 7.5px;
}
.StoresSearch__ClearIcon {
  font-size: 24px;
  right: 10px;
  color: #aaa;
}
.StoresSearch input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 30px;
}
.StoresSearch input:focus {
  outline: none;
}

.FavoritesStores__Header {
  position: relative;
  display: flex;
  padding: 12px 20px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid rgba(134,134,134,0.2);
  margin-bottom: 10px;
}
.FavoritesStores__Title {
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: #5c5c5c;
}
.FavoritesStores__Close {
  font-size: 24px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.FavoritesStores__Clear {
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  color: #f35468;
  cursor: pointer;
}
.FavoritesStores__Icon {
  color: #379d79;
}
.FavoritesStores__Icon svg {
  width: 20px;
  height: 20px;
}
.FavoritesStores__Footer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.FavoritesStores__Footer ._Button {
  width: 250px;
  height: 42px;
  display: flex;
  justify-content: center;
  align-self: center;
  border-radius: 20px;
  font-size: 16px;
}
.FavoritesStores ._Table {
  margin-top: 10px;
}
.FavoritesStores ._Table__Column {
  padding: 1px;
}

.RequestsFilter__Control {
  display: flex;
  gap: 5px;
  border-right: 2px solid #d1d1d1;
  padding: 15px 20px 15px 5px;
  cursor: pointer;
}
.RequestsFilter__Control svg {
  color: #16a085;
}

.ShiftRequestsSearch {
  position: relative;
  height: 36px;
  background: #fff;
  border: 1px solid #aaa;
  border-radius: 5px;
  padding: 5px 15px;
  margin: 0 15px;
}
.ShiftRequestsSearch__ClearIcon,
.ShiftRequestsSearch__SearchIcon {
  position: absolute;
  height: 100%;
  top: 0px;
  cursor: pointer;
}
.ShiftRequestsSearch--Disabled {
  cursor: default;
}
.ShiftRequestsSearch__SearchIcon {
  color: #d9d9d9;
  font-size: 18px;
  left: 7.5px;
}
.ShiftRequestsSearch__ClearIcon {
  font-size: 24px;
  right: 10px;
  color: #aaa;
}
.ShiftRequestsSearch input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 24px 0 30px;
}
.ShiftRequestsSearch input:focus {
  outline: none;
}

.ShiftRequestsSort {
  padding: 5px;
}
.ShiftRequestsSort__Expand {
  width: 100%;
  padding: 10px 0;
  display: flex;
  align-items: center;
}
.ShiftRequestsSort__Expand svg {
  font-size: 20px;
}
.ShiftRequestsSort__Label,
.ShiftRequestsSort__Icons {
  color: #16a085;
  font-weight: bold;
  padding-left: 3px;
}
.ShiftRequestsSort__Icons {
  position: relative;
  top: 1px;
}
.ShiftRequestsSort__Label {
  display: flex;
  align-self: center;
}
.ShiftRequestsSort__Label svg {
  font-size: 16px;
}
.ShiftRequestsSort__DropDown {
  position: absolute;
  z-index: 1;
  background: #fff;
  width: 100%;
  left: 0;
  box-shadow: rgba(0,0,0,0.19) 0px 10px 20px, rgba(0,0,0,0.23) 0px 6px 6px;
}
.ShiftRequestsSort__Option {
  padding: 10px;
  border-bottom: 1px solid rgba(134,134,134,0.2);
  cursor: pointer;
  line-height: 25px;
}
.ShiftRequestsSort__Option--IsSelected {
  color: #16a085;
  font-weight: bold;
}

.AcceptRequest {
  position: absolute;
  background: #fff;
  width: 100%;
  height: 100%;
  z-index: 9999;
  top: 0;
}
.AcceptRequest__Header {
  border-bottom: 1px solid #ececec;
  background: #fff;
  display: flex;
  position: relative;
}
.AcceptRequest__Back {
  padding: 15px;
  font-size: 20px;
  position: absolute;
  cursor: pointer;
}
.AcceptRequest__Title {
  padding: 13px 45px;
  width: 100%;
  text-align: center;
  font-weight: 600;
  font-size: 22px;
}
.AcceptRequest__Body {
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.AcceptRequest__Description {
  display: flex;
  flex-direction: column;
}
.AcceptRequest__Description p {
  color: #000;
  margin: 10px 0;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}
.AcceptRequest__Description span {
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}
.AcceptRequest__SwapRequest {
  border-radius: 5px;
  border: 2px solid #ececec;
  background: #fff;
  padding: 13px 20px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.AcceptRequest__SwapRequest span {
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}
.AcceptRequest__SwapRequestTitle {
  color: #16a085;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}
.AcceptRequest__Controls {
  text-align: center;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
}
.AcceptRequest__Controls ._Button {
  padding: 0 50px;
  font-size: 16px;
  border-radius: 30px;
  height: 42px;
}
.CustomDropDialog ._Dialog__Body {
  padding: 25px 20px 20px !important;
  font-size: 17px !important;
}
.--isMobile .AcceptRequest {
  height: 100%;
  top: 0px;
}
.--isMobile .AcceptRequest__Back {
  padding: 13px;
}
.--isMobile .AcceptRequest__Title {
  padding: 10px 0;
  font-weight: 700;
  font-size: 21px;
}
.--isMobile .AcceptRequest__Description p {
  padding-top: 10px;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}
.--isMobile .AcceptRequest__Description span {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.--isMobile .CustomDropDialog ._Dialog__Body {
  font-size: 12px !important;
}
.--isMobile .CustomDropDialog ._Dialog__Footer ._Button {
  font-size: 15px !important;
}

.ShiftSwapShift {
  border-radius: 5px;
  padding: 10px;
}
.ShiftSwapShift__Body {
  padding: 15px;
  background: #f0f0f0;
}
.ShiftSwapShift--Right {
  text-align: right;
}
.ShiftSwapShift__Title {
  background: #75cbad;
  padding: 5px;
  color: #fff;
  font-weight: 700;
  font-size: 21px;
  line-height: 24px;
  margin-bottom: 10px;
}
.ShiftSwapShift__Date {
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  margin-bottom: 3px;
}
.ShiftSwapShift__Date svg {
  margin-right: 10px;
  color: #4a9d86;
}
.ShiftSwapShift__Name,
.ShiftSwapShift__Store {
  font-size: 20px;
  line-height: 24px;
  font-weight: 500;
  color: #4a9d86;
  margin-bottom: 0;
}
.ShiftSwapShift__Name svg,
.ShiftSwapShift__Store svg {
  margin-right: 10px;
  color: #5c5c5c;
}
.ShiftSwapShift__Store {
  margin-left: 30px;
}
.--isMobile .ShiftSwapShift__Title {
  font-weight: 600;
  font-size: 20px;
}
.--isMobile .ShiftSwapShift__Date,
.--isMobile .ShiftSwapShift__Name,
.--isMobile .ShiftSwapShift__Store {
  font-size: 19px;
  line-height: 22px;
}

.ShiftSwapRequest {
  height: 100%;
  background: #fff;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.ShiftSwapRequest__Header {
  color: #fff;
  background: #75cbad;
  display: flex;
  position: relative;
}
.ShiftSwapRequest__Body {
  background: #fff;
}
.ShiftSwapRequest__Back {
  padding: 15px;
  font-size: 20px;
  position: absolute;
}
.ShiftSwapRequest__Title {
  padding: 13px 45px;
  font-weight: 600;
  font-size: 22px;
}
.ShiftSwapRequest__SuggestedShiftsTitle {
  background: #75cbad;
  margin: 5px 10px 0px 10px;
  padding: 5px;
  color: #fff;
  font-weight: 700;
  font-size: 21px;
  line-height: 24px;
}
.ShiftSwapRequest__SuggestedShift {
  display: flex;
  background: #f0f0f0;
  margin: 10px 15px;
  align-items: center;
  justify-content: space-between;
  padding-right: 10px;
}
.ShiftSwapRequest__SuggestedShift .ShiftSwapShift {
  padding: 0px;
}
.ShiftSwapRequest__SuggestedShift ._CheckboxInput {
  width: 2em !important;
  height: 2em;
  border-radius: 50%;
}
.ShiftSwapRequest__SuggestedShift ._CheckboxInput__Input {
  border-radius: 50%;
}
.ShiftSwapRequest__Icon {
  text-align: center;
  color: #379d79;
  font-size: 24px;
  line-height: 24px;
}
.ShiftSwapRequest__Controls {
  text-align: center;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
}
.ShiftSwapRequest__Controls ._Button {
  padding: 0 20px;
}
.--isMobile .ShiftSwapRequest__Header {
  background: #16a085;
}
.--isMobile .ShiftSwapRequest__Back {
  padding: 13px;
}
.--isMobile .ShiftSwapRequest__Title {
  padding: 10px 0;
  text-align: center;
  font-weight: 700;
  font-size: 21px;
  width: 100%;
}
.--isMobile .ShiftSwapRequest__SuggestedShiftsTitle {
  font-weight: 600;
  font-size: 20px;
}

.MobileDropedShift__Section {
  position: relative;
  margin: 10px 18px;
  padding: 10px 7px;
  border-radius: 4px;
  border: 3px #ecf1f0 solid;
}
.MobileDropedShift__Block {
  display: flex;
  align-items: center;
  padding: 8px;
  font-size: 16px;
}
.MobileDropedShift__Block ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.MobileDropedShift__Block svg {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  flex-shrink: 0;
}
.MobileDropedShift__Block--Store {
  font-weight: 700;
  color: #000;
}
.MobileDropedShift__Block--Store svg {
  color: #5c5c5c;
}
.MobileDropedShift__Block--Time {
  font-size: 16px;
}
.MobileDropedShift__Block--Time span:first-of-type {
  width: 90px;
  padding-right: 5px;
}
.MobileDropedShift__Block--Time span:last-of-type {
  width: auto;
}
.MobileDropedShift__Block--Time svg {
  color: #16a085;
}
.MobileDropedShift--forCoworker .MobileDropedShift__Block--Store {
  color: #16a085;
}
.MobileDropedShift--forCoworker .MobileDropedShift__Block--Store svg {
  color: #5c5c5c;
}

.ShiftSwapRequest {
  height: 100%;
  background: #fff;
}
.ShiftSwapRequest__Header {
  color: #fff;
  background: #75cbad;
  display: flex;
  position: relative;
}
.ShiftSwapRequest__Body {
  background: #fff;
}
.ShiftSwapRequest__Back {
  padding: 15px;
  font-size: 20px;
  position: absolute;
}
.ShiftSwapRequest__Title {
  padding: 13px 45px;
  font-weight: 600;
  font-size: 22px;
}
.ShiftSwapRequest__Controls {
  text-align: center;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
}
.ShiftSwapRequest__Controls ._Button {
  padding: 0 25px;
  font-size: 16px;
  border-radius: 30px;
}
.--isMobile .ShiftSwapRequest__Header {
  background: #16a085;
}
.--isMobile .ShiftSwapRequest__Back {
  padding: 13px;
}
.--isMobile .ShiftSwapRequest__Title {
  padding: 10px 0;
  text-align: center;
  font-weight: 700;
  font-size: 21px;
  width: 100%;
}

.ShiftSwap {
  height: 100%;
  background: #fff;
  position: relative;
}
.ShiftSwap--isEmpty {
  background: #fff;
}
.ShiftSwap__Title {
  padding: 13px 10px;
  font-weight: 600;
  font-size: 22px;
  color: #fff;
  background: #75cbad;
}
.ShiftSwap__Placeholder {
  text-align: center;
  margin: 100px auto;
}
.ShiftSwap__Placeholder img {
  width: 50px;
}
.ShiftSwap__Placeholder p {
  font-size: 16px;
  font-weight: 600;
  color: #000;
  margin-top: 50px;
}
.ShiftSwap .Tabs__Tab {
  margin: 0;
  border-radius: 0;
  background: #f0f0f0;
  padding: 8px 10px;
  flex: 1;
  flex-basis: 100px;
  flex-shrink: 0;
  text-align: center;
}
.ShiftSwap .Tabs__Tab.active {
  background: #16a085;
}
.ShiftSwap .Tabs__Tab:first-child {
  border-radius: 5px 0 0 5px;
}
.ShiftSwap .Tabs__Tab:last-child {
  border-radius: 0 5px 5px 0;
}
.--isMobile .ShiftSwap__Title {
  padding: 10px 0;
  text-align: center;
  font-weight: 700;
  font-size: 21px;
  background: #16a085;
}

.PinIndicator {
  padding-left: 72px;
  height: 18px;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
}

.ForwardedMessage {
  padding-top: 5px;
}
.ForwardedMessage__Message {
  gap: 10px;
  position: relative;
  display: flex;
  padding: 0 0 0 10px;
  border-left: 5px solid #d1d1d1;
}
.ForwardedMessage__Message--Group {
  gap: 10px;
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ForwardedMessage__Message--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}
.ForwardedMessage__Message--Author {
  text-transform: capitalize;
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  line-height: 120%;
  margin: 0 8px 0 0;
  width: 310px;
}
.ForwardedMessage__Message--Text {
  overflow-wrap: break-word;
}
.ForwardedMessage__Message--postedAt {
  font-size: 12px;
}

.MessageTeam {
  position: relative;
  display: flex;
  gap: 20px;
  padding: 5px 20px;
}
.MessageTeam:hover .MessageTeam__Actions {
  visibility: visible;
}
.MessageTeam:hover .MessageTeam__MessageTime {
  visibility: visible;
}
.MessageTeam:hover {
  background: #e1f3ec;
}
.MessageTeam--bottom .MessageTeam__Group--Author,
.MessageTeam--middle .MessageTeam__Group--Author {
  display: none;
}
.MessageTeam--bottom .MessageTeam__Group--Meta,
.MessageTeam--middle .MessageTeam__Group--Meta {
  position: absolute;
  left: -60px;
  top: 5px;
  visibility: hidden;
}
.MessageTeam__Editing {
  padding: 15px 20px;
  background: #d1d1d1 !important;
  box-shadow: 0 0 11px 0 rgba(0,0,0,0.06), inset 0 1px 0 0 #16a085, inset 0 -1px 0 0 #16a085;
}
.MessageTeam__Editing:not(.MessageTeam--top,
.MessageTeam__Editing .MessageTeam--single) {
  padding-inline-start: 75px;
}
.MessageTeam__Meta {
  display: none;
}
.MessageTeam__Group {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}
.MessageTeam__Group--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  font-size: 11px;
}
.MessageTeam__Group--Author {
  text-transform: capitalize;
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  line-height: 120%;
  margin: 0 8px 0 0;
  color: #000;
}
.MessageTeam__Content {
  width: 100%;
  position: relative;
  color: #000;
  font-size: 15px;
  line-height: 22px;
}
.MessageTeam__Content .str-chat__message-mention {
  color: #16a085;
}
.MessageTeam__Failed {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 5px 0;
  padding: 0;
}
.MessageTeam__Content blockquote {
  margin: 0 0 0 5px;
  position: relative;
  padding-left: 10px;
}
.MessageTeam__Content blockquote::before {
  content: '\201C';
  position: absolute;
  opacity: 0.5;
  top: 2px;
  left: -5px;
}
.MessageTeam__Content .MessageTeam__Text p {
  margin: 0;
  white-space: pre-line;
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  background: none;
}
.MessageTeam__Content .MessageTeam__Text p a {
  display: inline-block;
}
.MessageTeam__Content .MessageTeam__Text p ul {
  margin: 0;
}
.MessageTeam__Content .MessageTeam__Text p code {
  padding: 2px;
  width: inherit;
  white-space: pre-wrap;
  word-break: break-all;
}
.MessageTeam__Content .MessageTeam__Text p pre {
  margin: 0 5px 0 0;
  padding: 10px;
}
.MessageTeam__repliesCountButton button {
  display: flex;
  padding: 5px 0;
  border: none;
  background: none;
  line-height: 15px;
  font-weight: 700;
  font-size: 14px;
  color: #16a085;
  cursor: pointer;
}
.MessageTeam__SavedForLaterMessage {
  display: flex;
  justify-content: end;
  font-size: 12px;
  position: absolute;
  right: 0;
  top: -17px;
}
.MessageTeam__SavedForLaterMessage svg {
  position: relative;
  top: 5px;
  right: 5px;
}
.MessageTeam__Saved {
  background: #e1f3ec;
  padding-top: 15px;
}
.MessageTeam__PinnedMessages {
  background: #f1f3f7;
}
.MessageTeam__Actions {
  position: absolute;
  top: 0;
  right: -5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 75px;
  height: 24px;
  z-index: 10;
  padding: 0 4px 0;
  visibility: hidden;
  border-radius: 15px;
  background: #fff;
  border: 1px solid #f0f0f0;
  box-shadow: 0 2px 1px 0 #d1d1d1;
}
.MessageTeam__Actions > span {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-align: center;
  cursor: pointer;
}
.MessageTeam__Actions > span svg {
  opacity: 0.5;
}
.MessageTeam__Actions > span:hover svg {
  opacity: 1;
  fill: #000;
}
.MessageTeam__Actions .str-chat__message-actions-box-button {
  display: flex;
  align-items: center;
  border: none;
  background: none;
}
.MessageTeam__Actions .str-chat__message-actions-box {
  bottom: initial;
  left: initial;
  visibility: hidden;
  right: 100%;
  top: -10px;
}
.MessageTeam__Actions .str-chat__message-actions-box--open {
  visibility: visible !important;
}
.str-chat-channel {
  height: 100%;
}
.str-chat__list {
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: none;
  width: 100%;
  height: 87%;
  max-height: 100%;
  box-shadow: none;
  border-radius: 0;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__list .TypingIndicatorInput {
  display: none;
}
.str-chat__list .str-chat__parent-message-li {
  padding: 12px 0;
  margin-block-end: 0;
}
.str-chat__list .str-chat__parent-message-li .str-chat__thread-start {
  display: none;
}
.str-chat__list .str-chat__message-list-scroll .str-chat__parent-message-li {
  border-block-end: 1px solid #dbdde1;
}
.str-chat__list-notifications {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 0.25rem;
  margin: 0.375rem;
  width: auto;
  background: transparent;
  box-shadow: none;
  border-radius: none;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
  top: -16px;
}
.str-chat__thread {
  height: 100%;
  background: #fff;
  width: 23% !important;
  min-width: 437px;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
}
.str-chat__thread .str-chat__main-panel-inner {
  height: auto;
}
.str-chat__thread-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  width: 100%;
}
.str-chat__thread-list .str-chat__message-team {
  padding: 10px;
}
.str-chat__thread-list .str-chat__message-team-actions {
  width: 60px;
  min-width: unset;
}
.str-chat__thread-list .str-chat__message-actions-box {
  top: initial;
  bottom: -10px;
}
.str-chat__ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.str-chat__li {
  padding-inline: 0;
}
.str-chat__li.Highlight {
  background-color: #e1f3ec;
  transition: all 0.5s ease-in-out;
}
.str-chat__li--top,
.str-chat__li--single {
  padding-block-start: 12px;
}
.str-chat__li--bottom,
.str-chat__li--single {
  padding-block-end: 12px;
}
.str-chat__message {
  margin-block-end: 0;
}
.str-chat__message .str-chat__message-mention {
  color: #16a085;
}
.str-chat__message--deleted {
  display: flex;
  justify-content: center;
}
.str-chat__message-team-status {
  display: none;
}
.quoted-message {
  align-items: center;
  padding-left: 5px;
  width: fit-content;
}
.quoted-message .str-chat__message-attachment img {
  padding-left: 0;
  border-left: 0;
}
.str-chat__event-component__channel-event {
  display: flex;
  margin: 24px 40px;
}
.str-chat__event-component__channel-event .str-chat__event-component__channel-event__content {
  margin-right: 8px;
}
.str-chat__event-component__channel-event .str-chat__event-component__channel-event__sentence {
  margin-right: 8px;
}
.str-chat__event-component__channel-event .str-chat__event-component__channel-event__date {
  margin-top: 4px;
}
.str-chat__message-reactions-container {
  margin-block-start: 8px;
}
.str-chat__message-reactions-container .str-chat__simple-reactions-list-item--last-number {
  display: unset;
}
.str-chat__message-reactions-container ul.str-chat__simple-reactions-list {
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 6px 6px 4px 6px;
}
.str-chat__message-reactions-container .str-chat__simple-reactions-list-item span {
  display: flex;
  align-items: center;
}
.str-chat__message-reactions-container .str-chat__simple-reactions-list-item {
  list-style-type: none;
}
.str-chat__message-reactions-container .emoji-mart-emoji-custom span {
  height: 15px !important;
  width: 15px !important;
}
.str-chat__reaction-selector {
  left: unset;
  top: -60px;
  right: 0;
  border: 1px solid #e9e9ea;
  border-radius: 999px;
}
.str-chat__reaction-selector .emoji-mart-emoji span {
  height: 24px !important;
  width: 24px !important;
}
.str-chat__message-reaction-selector {
  display: flex;
  justify-content: flex-end;
  position: absolute;
  inset-block-end: 100%;
}
.str-chat__reaction-selector .str-chat__message-reactions-options {
  background: #fff;
  color: #080707;
  box-shadow: 0 0 8px rgba(0,0,0,0.18);
  border-radius: 999px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__reaction-selector-tooltip {
  display: none;
}
.str-chat__message-reaction-selector .str-chat__message-reactions-options {
  list-style: none;
  display: flex;
  margin-block-end: 0.125rem;
  width: fit-content;
  column-gap: 0.25rem;
  padding: 0.5rem;
}
.str-chat__message-reaction-selector .str-chat__message-reactions-options .str-chat__message-reactions-option {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 40px;
  height: 40px;
  background: #fff;
  color: #080707;
  box-shadow: none;
  border-radius: 18px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__message-reaction-selector .str-chat__message-reactions-options .str-chat__message-reactions-option:hover {
  background-color: #e1f3ec;
}
.str-chat__reaction-selector .str-chat__message-reactions-options .str-chat__message-reactions-option.str-chat__message-reactions-option-selected {
  background-color: #e1f3ec;
}
.str-chat__message-reaction-selector .str-chat__message-reactions-options .str-chat__message-reactions-list-item__count {
  display: none;
}
.str-chat__message-team-actions {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 75px;
  height: 24px;
  z-index: 10;
  padding: 0 4px 0;
  visibility: hidden;
  border-radius: 100px;
  background: #fff;
  border: 1px solid #e0e0e0;
  box-shadow: 0 2px 1px 0 rgba(0,0,0,0.07);
}
.str-chat__message-team-actions > span {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-align: center;
}
.str-chat__message-team-actions .str-chat__message-actions-box-button {
  display: flex;
  align-items: center;
  border: none;
  background: none;
}
.str-chat__message-team-actions .str-chat__message-actions-box {
  bottom: initial;
  left: initial;
  visibility: hidden;
  right: 100%;
  top: -10px;
}
.str-chat__message-team-actions .str-chat__message-actions-box--open {
  visibility: visible !important;
}
.str-chat__message-actions-box {
  width: 150px;
  background: #fff;
  box-shadow: 0 0 8px rgba(0,0,0,0.18);
  border-radius: 14px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__message-actions-box .str-chat__message-actions-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  min-width: 10rem;
}
.str-chat__message-actions-box .str-chat__message-actions-list .str-chat__message-actions-list-item-button {
  margin: 0;
  cursor: pointer;
  width: 100%;
  text-align: start;
  padding: 6px 10px;
  background: transparent;
  box-shadow: none;
  border-radius: 0px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__message-actions-box .str-chat__message-actions-list .str-chat__message-actions-list-item-button:hover {
  background-color: #e1f3ec;
}
.str-chat__message-replies-count-button svg {
  display: none;
}
.str-chat__message-reactions-container {
  display: flex;
}
.str-chat__message-reactions-container .str-chat__message-reactions {
  overflow-y: hidden;
  overflow-x: auto;
  scrollbar-width: none;
  list-style: none;
  display: flex;
  margin-block-start: 0.125rem;
  margin-block-end: 0.125rem;
  column-gap: 0.125rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0;
  position: relative;
  background: transparent;
  box-shadow: none;
  border-radius: none;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__message-reactions-container .str-chat__message-reactions .str-chat__message-reaction {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.375rem;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  background: #f4f4f5;
  box-shadow: none;
  border-radius: 8px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__message-reactions-container .str-chat__message-reactions .str-chat__message-reaction button {
  background: none;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.str-chat__message-reactions-container .str-chat__message-reactions .str-chat__reaction-list--counter {
  display: none;
}
.str-chat__modal {
  background-color: rgba(0,0,0,0.2);
  backdrop-filter: blur(3px);
}
.str-chat__modal .str-chat__modal__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  width: 100%;
  background: #fff;
  box-shadow: none;
  border-radius: 14px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__modal--open {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  right: 3px;
  width: 100%;
  height: 100%;
  z-index: 100;
  max-width: 437px;
}
.str-chat__modal--open .str-chat__modal__close-button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  margin: 0.5rem;
}
.str-chat__modal--open .str-chat__modal__close-button svg {
  position: relative;
  top: 1px;
  padding-left: 6px;
}
.str-chat__message-reactions-details {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-height: 100%;
  height: 100%;
  min-height: 0;
}
.str-chat__message-reactions-details .str-chat__message-reactions-details-reaction-types {
  display: flex;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  gap: 1rem;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.str-chat__message-reactions-details .str-chat__message-reactions-details-reaction-types .str-chat__message-reactions-details-reaction-type {
  display: flex;
  align-items: center;
  padding: 0.25rem 0;
  flex-shrink: 0;
  cursor: pointer;
}
.str-chat__message-reactions-details .str-chat__message-reactions-details-reaction-types .str-chat__message-reactions-details-reaction-type--selected {
  border-block-end: solid #16a085;
}
.str-chat__message-reactions-details .str-chat__message-reactions-details-reaction-types .str-chat__message-reactions-details-reaction-type .str-chat__message-reaction-emoji--with-fallback {
  width: 18px;
  line-height: 18px;
}
.str-chat__message-reactions-details .str-chat__message-reaction-emoji-big {
  --str-chat__stream-emoji-size: 1em;
  align-self: center;
  font-size: 2rem;
}
.str-chat__message-reactions-details .str-chat__message-reactions-details-reacting-users {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-height: 100%;
  overflow-y: auto;
  min-height: 30vh;
}
.str-chat__attachment-preview-list {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem;
  width: 100%;
  background: #ececec;
  box-shadow: none;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__attachment-preview-list button.str-chat__attachment-preview-delete {
  padding: 0;
  padding: initial;
  background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
  background: initial;
  border: medium none currentColor;
  border: initial;
  border-radius: 999px;
  display: flex;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-delete {
  position: absolute;
  top: 2px;
  inset-inline-end: 2px;
  cursor: pointer;
  z-index: 1;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-delete svg {
  background-color: rgba(0,0,0,0.2);
  border-radius: 999px;
  width: 24px;
  height: 24px;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-delete svg path {
  fill: #fff;
}
.str-chat__attachment-preview-list .str-chat__attachment-list-scroll-container {
  overflow-y: hidden;
  overflow-x: auto;
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  column-gap: 0.5rem;
  border-radius: inherit;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-image {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 72px;
  width: 72px;
  min-width: 72px;
  overflow: hidden;
  background: transparent;
  box-shadow: none;
  border-radius: 14px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-thumbnail {
  object-fit: cover;
  height: 72px;
  width: 72px;
  word-break: break-all;
  overflow: hidden;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-image-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-thumbnail,
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-image-loading {
  border-radius: 14px;
  background-color: rgba(252,252,252,0.9);
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 72px;
  width: 200px;
  position: relative;
  padding: 0 1rem;
  column-gap: 0.5rem;
  background: transparent;
  box-shadow: none;
  border-radius: 18px;
  border-block-start: 1px solid #dbdde1;
  border-block-end: 1px solid #dbdde1;
  border-inline-start: 1px solid #dbdde1;
  border-inline-end: 1px solid #dbdde1;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-file-icon,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-file-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-file-icon svg,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-file-icon svg {
  height: 37px;
  width: initial;
}
.str-chat__attachment-list {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
  word-break: break-word;
}
.str-chat__attachment-list .str-chat__message-attachment {
  max-width: 100%;
}
.str-chat__attachment-list .str-chat__gallery {
  background: transparent;
  box-shadow: none;
  border-radius: 14px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__attachment-list .str-chat__gallery .str-chat__gallery-image {
  background-color: #e9eaed;
  border: 0;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item {
  background: #fff;
  box-shadow: none;
  border-radius: 16px;
  border-block-start: 1px solid rgba(0,0,0,0.1);
  border-block-end: 1px solid rgba(0,0,0,0.1);
  border-inline-start: 1px solid rgba(0,0,0,0.1);
  border-inline-end: 1px solid rgba(0,0,0,0.1);
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__file-icon {
  width: 34px;
}
.str-chat__attachment-list .str-chat__message-attachment-card--giphy .str-chat__message-attachment-card-react--header img {
  cursor: zoom-in;
  object-fit: contain;
  max-height: 100%;
  max-width: 100%;
}
.str-chat__attachment-list .str-chat__message-attachment-actions {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__attachment-list .str-chat__message-attachment-actions .str-chat__message-attachment-actions-form {
  display: flex;
  justify-content: stretch;
}
.str-chat__attachment-list .str-chat__message-attachment-actions .str-chat__message-attachment-actions-form .str-chat__message-attachment-actions-button {
  cursor: pointer;
  width: 100%;
  padding: 0.75rem 1rem;
  white-space: nowrap;
  background: #fff;
  box-shadow: none;
  border-radius: 0;
  border-block-start: #dbdde1 1px solid;
  border-block-end: #dbdde1 1px solid;
  border-inline-start: #dbdde1 1px solid;
  border-inline-end: #dbdde1 1px solid;
}
.str-chat__message-attachment--card--actions .str-chat__message-attachment-actions-button:hover {
  color: #16a085;
}
.str-chat__attachment-list .str-chat__message-attachment--video:not(.str-chat__message-attachment--card),
.str-chat__attachment-list .str-chat__message-attachment--image:not(.str-chat__message-attachment--card) {
  margin: 0.125rem;
}
.str-chat__attachment-list .str-chat__message-attachment--image,
.str-chat__attachment-list .str-chat__message-attachment-card--header,
.str-chat__attachment-list .str-chat__message-attachment--video {
  background: #e9eaed;
  box-shadow: none;
  border-radius: 14px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__attachment-list .str-chat__message-attachment--image,
.str-chat__attachment-list .str-chat__message-attachment--video,
.str-chat__attachment-list .str-chat__message-attachment-card--header {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.str-chat__base-image {
  color: transparent;
}
.str-chat__attachment-list .str-chat__message-attachment--image:not(.str-chat__message-attachment--card) > img {
  max-width: 300px;
  max-height: 300px;
  object-fit: cover;
  width: 100%;
  cursor: zoom-in;
}
.str-chat__message-attachment--card .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner,
.str-chat__message-attachment--image .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner,
.str-chat__message-attachment--gallery .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner {
  background-color: transparent;
  width: auto;
  width: initial;
  height: auto;
  height: initial;
  padding: 0;
}
.image-gallery {
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.image-gallery-content {
  position: relative;
  line-height: 0;
  top: 0;
}
.image-gallery-slide-wrapper {
  position: relative;
}
.image-gallery-slides {
  line-height: 0;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
  text-align: center;
}
.image-gallery-slide.center,
.image-gallery-slide.image-gallery-center {
  position: relative;
}
.image-gallery-content .image-gallery-slide {
  background-color: #e9eaed;
}
.str-chat__message-attachment--card .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner img,
.str-chat__message-attachment--image .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner img,
.str-chat__message-attachment--gallery .str-chat__modal--open .str-chat__modal__inner.str-chat-react__modal__inner img {
  max-width: none;
  max-width: initial;
  max-height: calc(100vh - 80px);
  cursor: default;
}
.image-gallery-content .image-gallery-slide .image-gallery-image {
  max-height: calc(100vh - 80px);
  max-width: none;
  max-width: initial;
  object-fit: contain;
}
.image-gallery-slide .image-gallery-image {
  width: 100%;
  object-fit: contain;
}
.image-gallery-slide {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.image-gallery-fullscreen-button {
  bottom: 0;
  right: 0;
  padding: 20px;
}
.image-gallery-icon {
  color: #fff;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  border: 0;
  cursor: pointer;
  outline: none;
  position: absolute;
  z-index: 4;
}
.image-gallery-fullscreen-button .image-gallery-svg {
  height: 28px;
  width: 28px;
}
.image-gallery-index {
  background: rgba(0,0,0,0.4);
  color: #fff;
  line-height: 1;
  padding: 10px 20px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 4;
}
.image-gallery-left-nav {
  left: 0;
}
.image-gallery-right-nav {
  right: 0;
}
.image-gallery-left-nav,
.image-gallery-right-nav {
  padding: 50px 10px;
  top: 50%;
  transform: translateY(-50%);
}
.image-gallery-left-nav .image-gallery-svg,
.image-gallery-right-nav .image-gallery-svg {
  height: 120px;
  width: 60px;
}
.str-chat__attachment-list .str-chat__message-attachment--gallery .str-chat__gallery {
  display: grid;
  grid-template-columns: 50% 50%;
  overflow: hidden;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  grid-gap: 0.125rem;
  gap: 0.125rem;
}
.str-chat__attachment-list .str-chat__message-attachment--gallery .str-chat__gallery .str-chat__gallery-image {
  padding: 0;
  margin: 0;
  position: relative;
}
.str-chat__attachment-list .str-chat__message-attachment--gallery .str-chat__gallery .str-chat__gallery-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: zoom-in;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  column-gap: 1rem;
  margin: 0.125rem;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  row-gap: 0.125rem;
  min-width: 0;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 0.5rem;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-file--item-first-row .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--text .str-chat__message-attachment-audio-widget--text-first-row .str-chat__message-attachment-audio-widget--title {
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
  min-width: 0;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-audio-widget--title,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-name,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-audio-widget--title {
  word-break: keep-all;
}
.str-chat__attachment-list .str-chat__message-attachment-file--item .str-chat__message-attachment-file--item-size,
.str-chat__attachment-list .str-chat__message-attachment-audio-widget .str-chat__message-attachment-file--item-size {
  color: #72767e;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-thumbnail,
.str-chat__attachment-preview-list .str-chat__attachment-preview-image .str-chat__attachment-preview-image-loading {
  border-radius: 14px;
  background-color: rgba(252,252,252,0.9);
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-metadata,
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-file-end,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-metadata,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-file-end {
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  min-width: 0;
  flex: 1 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-metadata .str-chat__attachment-preview-file-name,
.str-chat__attachment-preview-list .str-chat__attachment-preview-voice-recording .str-chat__attachment-preview-file-end .str-chat__attachment-preview-file-name,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-metadata .str-chat__attachment-preview-file-name,
.str-chat__attachment-preview-list .str-chat__attachment-preview-file .str-chat__attachment-preview-file-end .str-chat__attachment-preview-file-name {
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
  max-width: 100%;
}
.str-chat__loading-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #16a085;
  animation: spin 1s linear infinite;
}
.str-chat__attachment-list .str-chat__message-attachment-with-actions.str-chat__message-attachment--giphy .str-chat__message-attachment-card .str-chat__message-attachment-card--content {
  display: none;
}
.str-chat__message--system {
  width: 100%;
  text-align: center;
}
.str-chat__message-reactions-last-user {
  display: none;
}
.str-chat__textarea {
  height: auto;
  flex: 1 1;
}
.rfu-image-previewer {
  flex: none;
  margin-left: 12px;
}
.rfu-image-previewer__image {
  margin-bottom: 0;
}
.str-chat__edit-message-form {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 1.25rem;
  width: 100%;
  height: 100%;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  max-height: 100%;
}
.str-chat__edit-message-form textarea {
  width: 100%;
  resize: none;
  padding: 2px 10px;
  border: none;
  font-size: 15px;
  overflow: hidden;
  color: #000;
}
.str-chat__edit-message-form .rfu-thumbnail__wrapper {
  height: auto;
}
.str-chat__edit-message-form .rfu-thumbnail__wrapper .rfu-thumbnail__overlay {
  position: relative;
}
.str-chat__edit-message-form .rfu-thumbnail__wrapper .rfu-thumbnail__overlay button {
  border: none;
}
.str-chat__edit-message-form .rfu-thumbnail__wrapper .rfu-thumbnail__overlay button svg {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  border: none;
}
.str-chat__edit-message-form .rfu-thumbnail__wrapper .rfu-thumbnail__image {
  width: 100px;
}
.str-chat__edit-message-form .str-chat__message-input {
  padding-inline: 0;
}
.str-chat__edit-message-form .str-chat__file-input-container,
.str-chat__edit-message-form .str-chat__emoji-picker-button,
.str-chat__edit-message-form .str-chat__send-button {
  background: #16a085;
  color: var(--str-chat__message-send-color);
  box-shadow: var(--str-chat__message-send-box-shadow);
  border-radius: 8px;
  border-block-start: var(--str-chat__message-send-border-block-start);
  border-block-end: var(--str-chat__message-send-border-block-end);
  border-inline-start: var(--str-chat__message-send-border-inline-start);
  border-inline-end: var(--str-chat__message-send-border-inline-end);
  cursor: pointer;
}
.str-chat__edit-message-form .str-chat__send-button:disabled {
  background: #16a085;
}
.str-chat__edit-message-form .str-chat__message-textarea-with-emoji-picker {
  padding: 0;
}
.str-chat__edit-message-form .str-chat__message-textarea-container {
  overflow: hidden;
}
.str-chat__edit-message-form .str-chat__message-textarea-react-host {
  position: static;
  border: 1px solid rgba(0,0,0,0.2);
  overflow: hidden;
  background: #fff;
  box-shadow: none;
  border-radius: 8px;
}
.str-chat__edit-message-form .str-chat__message-textarea-react-host:focus-within {
  border-color: #16a085;
}
.str-chat__edit-message-form .str-chat__message-textarea-react-host .str-chat__suggestion-list-container {
  width: 100%;
  left: 0;
  bottom: 85%;
}
.str-chat__edit-message-form .str-chat__file-input-container {
  display: none;
}
.str-chat__edit-message-form .rfu-dropzone__notifier .rfu-dropzone__inner {
  display: none;
}
.str-chat__edit-message-form .str-chat__message-team-form-footer {
  display: flex;
  justify-content: end;
  padding-top: 10px;
}
.str-chat__edit-message-form .str-chat__message-team-form-footer button {
  border: none;
  background: transparent;
  padding: 2px 6px;
}
.str-chat__edit-message-form .str-chat__message-team-form-footer .str-chat__edit-message-send {
  font-weight: bold;
  color: #16a085;
}
.str-chat__edit-message-form .str-chat__message-team-form-footer .str-chat__edit-message-form-options {
  display: none;
}
.str-chat__message-reactions-container {
  margin-block-start: 8px;
}
.str-chat__message-reactions-container .str-chat__simple-reactions-list-item--last-number {
  display: unset;
}
.str-chat__message-reactions-container ul.str-chat__simple-reactions-list {
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 6px 6px 4px 6px;
}
.str-chat__message-reactions-container .str-chat__simple-reactions-list-item span {
  display: flex;
  align-items: center;
}
.str-chat__message-reactions-container .emoji-mart-emoji-custom span {
  height: 15px !important;
  width: 15px !important;
}
.str-chat__reaction-selector {
  left: unset;
  top: -60px;
  right: 0;
}
.str-chat__reaction-selector .emoji-mart-emoji span {
  height: 24px !important;
  width: 24px !important;
}
.str-chat__suggestion-list-container {
  position: absolute;
  bottom: 110px;
  width: 90%;
  padding: 6px 0;
  background: #fff;
  box-shadow: 0 0 8px rgba(0,0,0,0.15);
  border-radius: 8px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list {
  overflow-y: auto;
  max-height: 320px;
  display: flex;
  flex-direction: column;
  list-style: none;
  padding: unset;
  margin: unset;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list .rta__list-header {
  display: none;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list .str-chat__user-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.625rem;
  column-gap: 0.5rem;
  background: transparent;
  box-shadow: none;
  border-radius: 0px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list .rta__entity {
  border: none;
  background: transparent;
  display: flex;
  width: 100%;
  border-radius: 8px;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list .rta__entity--selected {
  background-color: #dbdde1;
}
.str-chat__suggestion-list-container .str-chat__suggestion-list .rta__entity--name {
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
  overflow-y: hidden;
}
.str-chat__avatar {
  position: relative;
}
.str-chat__avatar img {
  border-radius: 5px;
}
.str-chat__avatar .str-chat__avatar-fallback {
  text-align: center;
  background: #16a085;
  color: #fff;
  border-radius: 5px;
  text-transform: uppercase;
  height: inherit;
  width: inherit;
}
.str-chat__attachment-list {
  align-items: flex-start;
}
.str-chat__attachment-list .str-chat__message-attachment {
  max-width: 100%;
}
.str-chat__attachment-list .str-chat__message-attachment--card--actions {
  overflow: hidden;
}
.str-chat__attachment-list .str-chat__message-attachment-audio-widget {
  flex: 1 1;
  max-width: 300px;
}
.str-chat__attachment-list .str-chat__message-attachment-card--text {
  display: none;
}
.str-chat__channel-list-empty {
  font-weight: 700;
  text-align: center;
}
.str-chat__channel .str-chat__container {
  height: 100%;
}
.str-chat__channel .str-chat__container .str-chat__main-panel {
  height: 100%;
  flex-direction: column;
  width: 100%;
  min-width: 0;
}
.str-chat__message-notification {
  padding: 5px;
  background: #75cbad;
  box-shadow: none;
  border-radius: 8px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
  position: absolute;
  top: -20px;
}

.PinnedMessages {
  width: 23% !important;
  min-width: 437px;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
}
.PinnedMessages__Header {
  padding-inline-end: 10px;
}
.PinnedMessages__Message {
  background: #899abe;
}
.PinnedMessages__Title {
  font-weight: bold;
  color: #4a4a4a;
  white-space: nowrap;
  padding-right: 10px;
  overflow-y: hidden;
}
.PinnedMessages__List {
  padding-top: 20px;
}
.PinnedMessages__List .str-chat__message-simple__actions,
.PinnedMessages__List .str-chat__message-replies-count-button,
.PinnedMessages__List .str-chat__message-team-actions {
  display: none;
}

.NotificationSelection {
  display: flex;
  padding-left: 10px;
}
.NotificationSelection__Icons {
  display: flex;
  padding: 10px;
  font-size: 18px;
  border-radius: 5px;
  cursor: pointer;
  height: 45px;
  align-items: center;
  border: 1px solid #d1d1d1;
}
.NotificationSelection__Icons svg {
  fill: #fff;
}
.NotificationSelection__Title {
  font-weight: bold;
  font-size: 14px;
  padding: 5px 0px;
  color: #000;
}
.NotificationSelection__Description {
  font-size: 14px;
  padding: 1px 0px;
  width: 261px;
  text-overflow: ellipsis;
  padding-left: 52px;
  overflow-x: hidden;
  white-space: break-spaces;
  color: #000;
}
.NotificationSelection__Modal {
  max-width: 350px;
  position: fixed;
  right: 0;
  top: 320px;
  margin-right: 41px;
}
.NotificationSelection__Modal ._Modal__Body {
  font-size: 14px;
  font-weight: bold;
  margin: 10px;
  padding: 10px;
}
.NotificationSelection__Modal ._Modal__Footer {
  justify-content: space-evenly;
}
.NotificationSelection__Modal ._Modal__Footer ._Group ._Button {
  border-width: 5px;
  border-radius: 10px;
}
.NotificationSelection__Dropdown ._DropDown__Body {
  max-height: 460px !important;
  transform: translate(-80%, 0) !important;
  left: -27px;
  padding: 12px;
}
.NotificationSelection__Dropdown ._DropDown__Body ._Group .Filter__Option {
  color: #16a085;
  font-size: 14px;
  padding: 5px 20px !important;
  font-weight: 600;
  cursor: pointer;
}
.NotificationSelection__Dropdown ._DropDown__Body ._Group .Filter__Option ._CheckboxInput__Input {
  display: none;
}
.NotificationSelection__Dropdown ._DropDown__Body ._Group .Filter__Option ._CheckboxInput__Input--Checked {
  display: inline-block !important;
  color: #4a4a4a;
  border: none;
  background: none;
}
._DropDown__Overlay {
  z-index: 100 !important;
}

.TeamChannelHeader__Container {
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid #d1d1d1;
  background: #fff;
  position: sticky;
  top: 0;
}
.TeamChannelHeader__groupIcon {
  position: relative;
  top: 11px;
  padding-right: 8px;
  font-size: 22px;
}
.TeamChannelHeader__Block {
  display: flex;
  align-items: center;
  overflow-y: hidden;
  padding: 0 5px;
  flex-direction: column;
}
.TeamChannelHeader__Block--Name {
  display: flex;
  font-weight: bold;
  color: #000;
  font-size: 14px;
  text-transform: capitalize;
}
.TeamChannelHeader__Title {
  font-weight: bold;
  color: #000;
  white-space: nowrap;
  padding-right: 10px;
  overflow-y: hidden;
  font-size: 15px;
}
.TeamChannelHeader__Icons {
  display: flex;
  align-items: center;
}
.TeamChannelHeader__Icons svg {
  cursor: pointer;
  height: 34px;
  width: 18px;
}
.TeamChannelHeader__Name {
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
  width: 240px;
}
.TeamChannelHeader__VideoCallIcon {
  display: flex;
  padding: 10px;
  height: 45px;
  align-items: center;
  border-radius: 5px;
  cursor: pointer;
  border: 1px solid #d1d1d1;
}
.TeamChannelHeader__VideoCallIcon svg {
  fill: #fff;
}
.TeamChannelHeader__Group {
  display: flex;
  min-width: fit-content;
  flex-direction: column;
  cursor: pointer;
}
.TeamChannelHeader__Additional {
  position: relative;
  left: 27px;
  padding: 2px 3px;
}
.TeamChannelHeader__Additional svg {
  color: #16a085;
  padding-left: 5px;
  position: relative;
  top: 2px;
}

.GiphyIcon {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  height: 24px;
  width: 63px;
  margin-left: 8px;
  background: #16a085;
  border-radius: 12px;
}
.GiphyIcon__Text {
  font-weight: bold;
  font-size: 11px;
  color: #fff;
}
.GiphyIcon svg path {
  fill: #fff;
}

.EmojiPicker {
  position: absolute;
  bottom: 85px;
  right: 20px;
  width: 338px;
  z-index: 16;
}

.ThreadMessageInput__Wrapper {
  display: flex;
  flex-direction: column;
  padding: 15px 20px;
  width: 100%;
  align-items: center;
}
.ThreadMessageInput__Form {
  display: flex;
  align-items: center;
  background: #ececec;
}
.ThreadMessageInput__Input {
  border: 1px solid #d1d1d1;
  border-radius: 8px;
  width: 100%;
  overflow: hidden;
}
.ThreadMessageInput__Input:focus-within {
  border-color: #16a085;
}
.ThreadMessageInput__Input textarea {
  border-radius: 8px;
  background: #ececec;
  font-size: 15px !important;
  min-height: 50px;
  max-height: 200px;
  overflow: hidden;
  overflow-y: auto;
  width: 100%;
  resize: none;
  padding: 16px 10px;
  border: none;
  color: #000;
}
.ThreadMessageInput__Input--Attachment {
  display: flex;
  cursor: pointer;
  position: relative;
  right: 10px;
  top: 1px;
}
.ThreadMessageInput__Input--Attachment svg {
  width: 30px;
  height: 16px;
}
.ThreadMessageInput__Input--Attachment svg path {
  fill-opacity: 0.2;
  fill: #000;
}
.ThreadMessageInput__Input--Attachment:hover path {
  fill: #16a085;
  fill-opacity: 1;
}
.ThreadMessageInput__Input--sendButton {
  display: flex;
  position: relative;
  right: 8px;
  border: none;
}
.ThreadMessageInput__Input--sendButton ._Button {
  padding: 7px;
}
.ThreadMessageInput__Input--sendButton ._Button--Disabled {
  background-color: transparent !important;
  border-color: transparent;
}
.ThreadMessageInput__Input--sendButton ._Button:focus {
  box-shadow: none;
  border-color: none;
}
.ThreadMessageInput__Input--sendButton ._Button:disabled {
  background: transparent;
}
.ThreadMessageInput__Input--sendButton ._Button:disabled path {
  color: #4a4a4a;
  opacity: 0.6;
}
.ThreadMessageInput__Input--sendButton svg {
  width: 20px !important;
  height: 20px !important;
  position: relative;
  left: 1px;
}

.ChannelEmpty__Container {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  padding: 20px;
}
.ChannelEmpty__Avatars {
  display: flex;
}
.ChannelEmpty__Avatars div:first-child {
  z-index: 3;
}
.ChannelEmpty__Avatars div:nth-child(2) {
  position: relative;
  right: 32px;
  z-index: 2;
}
.ChannelEmpty__Avatars div:nth-child(3) {
  position: relative;
  right: 64px;
  z-index: 1;
}
.ChannelEmpty__Avatars .str-chat__avatar {
  margin-right: 0;
}
.ChannelEmpty__MainDescription {
  margin-bottom: 10px;
}
.ChannelEmpty__SecondaryDescription {
  margin: 0;
}
.ChannelEmpty__MainDescription {
  font-weight: 700;
  font-size: 18px;
  line-height: 120%;
  color: #000;
}
.ChannelEmpty__MainDescription .ChannelEmpty__UserName {
  color: #16a085;
}
.ChannelEmpty__SecondaryDescription {
  font-size: 14px;
  line-height: 120%;
}
.ChannelEmpty__Icons svg {
  position: relative;
  top: 3px;
}

.TeamMessageInput__Wrapper {
  display: flex;
  align-items: center;
  padding: 15px 20px;
  flex-direction: column;
  position: fixed;
  width: 437px;
  bottom: 1px;
}
.TeamMessageInput__JoinGroup {
  display: flex;
  align-items: center;
  flex-direction: column;
  position: fixed;
  width: 437px;
  bottom: 20px;
  border-top: 1px solid #d1d1d1;
}
.TeamMessageInput__GroupName {
  padding: 10px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
  font-weight: 700;
  color: #000;
  font-size: 15px;
  width: 90%;
  text-align: center;
}
.TeamMessageInput__GroupName svg {
  position: relative;
  top: 2px;
  padding-right: 3px;
}
.TeamMessageInput__Input {
  border: 1px solid #d1d1d1;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
}
.TeamMessageInput__Input:focus-within {
  border-color: #16a085;
}
.TeamMessageInput__Top {
  min-height: 43px;
  width: 100%;
  background: #fff;
}
.TeamMessageInput__selectedGif {
  padding: 2px 5px;
  position: relative;
  background: #ececec;
}
.TeamMessageInput__selectedGif img {
  width: 100px;
  height: 100px;
}
.TeamMessageInput__selectedGif svg {
  color: #fff;
  position: absolute;
  top: 2px;
  left: 80px;
  background-color: rgba(0,0,0,0.2);
  border-radius: 999px;
  border: none;
  display: flex;
  cursor: pointer;
  width: 24px;
  height: 24px;
}
.TeamMessageInput__Bottom {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 40px;
  background: #ececec;
  padding-left: 10px;
}
.TeamMessageInput__Bottom--button {
  display: flex;
  justify-content: flex-end;
  position: absolute;
  right: 26px;
  bottom: 21px;
}
.TeamMessageInput__Bottom--Add {
  padding-right: 7px;
}
.TeamMessageInput__Bottom--Add svg {
  display: flex;
  cursor: pointer;
  color: #4a4a4a;
  padding: 6px;
  border-radius: 50px;
  background: #d1d1d1;
}
.TeamMessageInput__Bottom--Add svg path {
  fill: #4a4a4a;
  opacity: 0.5;
}
.TeamMessageInput__Bottom--Attachment {
  cursor: pointer;
}
.TeamMessageInput__Bottom--Attachment svg {
  width: 30px;
  height: 16px;
  position: relative;
  top: 1px;
  padding-left: 4px;
}
.TeamMessageInput__Bottom--Attachment svg path {
  fill-opacity: 0.5;
  fill: #000;
}
.TeamMessageInput__Bottom--Attachment:hover path {
  fill: #16a085;
  fill-opacity: 1;
}
.TeamMessageInput__Bottom--sendButton {
  display: flex;
  align-items: center;
  padding: 7px;
  margin: 0px 4px;
  background: #16a085;
  border: none;
  border-radius: 5px;
  justify-content: flex-end;
}
.TeamMessageInput__Bottom--sendButton:disabled {
  background: transparent;
}
.TeamMessageInput__Bottom--sendButton:disabled path {
  fill: #4a4a4a;
  opacity: 0.6;
}
.TeamMessageInput__Bottom--sendButton svg {
  width: 20px !important;
  height: 20px !important;
  position: relative;
  left: 1px;
}
.TeamMessageInput__Bottom--sendButton svg path {
  fill: #fff;
}
.TeamMessageInput__Form {
  display: flex;
  align-items: center;
  background: #ececec;
}
.TeamMessageInput__Form--Textarea {
  width: 100%;
}
.TeamMessageInput__Form textarea {
  width: 100%;
  resize: none;
  padding: 12px;
  border: none;
  font-size: 15px;
  overflow-y: auto;
  min-height: 50px;
  max-height: 200px;
  line-height: 1.5;
  background: #ececec;
  color: #000;
}
.TeamMessageInput__Dropzone {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 5;
  background-color: #e1f3ec;
  backdrop-filter: #e1f3ec;
}
.TeamMessageInput__Dropzone--notAccepted {
  background-color: #f35468;
}
.TeamMessageInput__Gif {
  position: relative;
  bottom: 400px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  background: #fff;
  left: 110px;
  width: 250px;
}
.TeamMessageInput__Gif--Input {
  padding: 10px;
  position: sticky;
  top: 0;
  background: #fff;
  border-bottom: 1px solid #d1d1d1;
}
.TeamMessageInput__Gif--Default {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  overflow-y: scroll;
  max-height: 400px;
}
.TeamMessageInput__Gif input {
  font-family: inherit;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  height: 34px;
  padding: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 20px 0 20px;
  border: 1px solid;
}
.TeamMessageInput__Gif input:focus {
  outline: none;
}
.TeamMessageInput__Gif--noData img {
  width: 100%;
}
.TeamMessageInput__ClearIcon,
.TeamMessageInput__SearchIcon {
  position: absolute;
  cursor: pointer;
}
.TeamMessageInput__ClearIcon--Disabled,
.TeamMessageInput__SearchIcon--Disabled {
  cursor: default;
}
.TeamMessageInput__SearchIcon {
  left: 15px;
  top: 13px;
}
.TeamMessageInput__ClearIcon {
  right: 17px;
  top: 13px;
}
.AttachmentList__Options {
  width: 150px;
  position: relative;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  left: 23px;
  bottom: 10px;
}
.AttachmentList__Options ._Group {
  width: 100%;
}
.AttachmentList__Option {
  line-height: 32px;
  cursor: pointer;
  display: flex;
}
.AttachmentList__Option span {
  padding: 0 10px;
}
.AttachmentList__Option:hover {
  background: #e1f3ec;
}
.--isMobile .TeamMessageInput__Wrapper {
  bottom: 52px;
}
.--isMobile .TeamMessageInput__JoinGroup {
  bottom: 70px;
}
.--isTablet .str-chat__list {
  height: 92%;
}

.TypingIndicatorInput {
  position: relative;
  top: 14px;
  display: flex;
  align-items: center;
}
.TypingIndicatorInput .Dot {
  color: 1px solid #4a4a4a;
  opacity: 0.5;
}
.TypingIndicatorInput .Dots .Dot {
  background: #000;
}
.TypingIndicatorInput .Dots .Dot:nth-child(2) {
  animation-delay: -0.9s;
  opacity: 0.5;
}
.TypingIndicatorInput .Dots .Dot:nth-child(3) {
  animation-delay: -0.8s;
  opacity: 0.2;
}
.TypingIndicatorInput .Dots {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.TypingIndicatorInput .Dot {
  width: 5px;
  height: 5px;
  margin-right: 2px;
  border-radius: 50%;
  animation: wave2 1.1s linear infinite;
}
.TypingIndicatorInput__Text {
  margin-left: 5px;
  font-size: 11px;
  line-height: 13px;
  color: 1px solid #4a4a4a;
}
@-moz-keyframes wave2 {
  0%, 60%, 100% {
    opacity: 1;
  }
  30% {
    opacity: 0.5;
  }
}
@-webkit-keyframes wave2 {
  0%, 60%, 100% {
    opacity: 1;
  }
  30% {
    opacity: 0.5;
  }
}
@-o-keyframes wave2 {
  0%, 60%, 100% {
    opacity: 1;
  }
  30% {
    opacity: 0.5;
  }
}
@keyframes wave2 {
  0%, 60%, 100% {
    opacity: 1;
  }
  30% {
    opacity: 0.5;
  }
}

.CustomThreadHeader {
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  padding: 0 20px;
  padding-inline-end: 10px;
  justify-content: space-between;
  border-bottom: 1px solid #d1d1d1;
}
.CustomThreadHeader__Container {
  display: flex;
  align-items: center;
}
.CustomThreadHeader__Title {
  font-weight: bold;
  color: #000;
  white-space: nowrap;
  font-size: 18px;
}
.CustomThreadHeader__Subtitle {
  padding-left: 10px;
  white-space: nowrap;
}
.CustomThreadHeader button {
  border: none;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.CustomThreadHeader__Close {
  cursor: pointer;
  height: 34px;
  width: 18px;
}

.ChatDatePicker ._DateInput {
  position: unset;
}
.ChatDatePicker__DropDown {
  position: absolute;
  z-index: 1000;
  left: 0px;
  top: 40px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  margin: 0 30px;
}
.ChatDatePicker__DropDown .react-calendar button:disabled {
  color: #d1d1d1;
}

.DateSeparator {
  display: flex;
  align-items: center;
  padding: 10px 0;
  position: relative;
}
.DateSeparator__Date {
  width: 160px;
  display: flex;
  justify-content: center;
  padding: 4px 0px;
  border-radius: 15px;
  border: 1px solid #d1d1d1;
}
.DateSeparator__Select {
  cursor: pointer;
}
.DateSeparator__Select svg {
  position: relative;
  top: 2px;
  left: 5px;
}
.DateSeparator__Label {
  padding: 0 20px;
  line-height: 32px;
  border-bottom: 1px solid #ececec;
}
.DateSeparator__Options {
  width: 200px;
  position: absolute;
  z-index: 1000;
  border: 1px solid #ececec;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  top: 40px;
  background: #fff;
}
.DateSeparator__Option {
  padding: 0 20px;
  line-height: 32px;
  cursor: pointer;
}
.DateSeparator__Option:hover {
  background: #e1f3ec;
}
.DateSeparator::before,
.DateSeparator::after {
  flex: 1;
  content: '';
  padding: 0.7px 0px;
  background-color: #d1d1d1;
}

.UnreadMessageSeparator {
  display: flex;
  justify-content: end;
  align-items: center;
  font-size: 14px;
  font-weight: bold;
}
.UnreadMessageSeparator span {
  padding: 0 3px;
  color: #f35468;
}
.UnreadMessageSeparator::before {
  flex: 1;
  content: '';
  padding: 0.7px 0px;
  background-color: #f35468;
}

.AdminPanelHeader {
  border-bottom: 1px solid #d1d1d1;
  background: #fff;
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 20px;
  justify-content: space-between;
}
.AdminPanelHeader svg {
  cursor: pointer;
  height: 34px;
  width: 18px;
}
.AdminPanelHeader__Title {
  display: flex;
  align-items: center;
  min-width: fit-content;
  font-size: 18px;
  font-weight: bold;
  white-space: nowrap;
  color: #000;
}

.ChannelSearchResults {
  position: absolute;
  height: fit-content;
  width: 396px;
  z-index: 10;
  left: 20px;
  top: 60px;
  background: #fff;
  border: 1px solid #d1d1d1;
  box-shadow: 0 2px 4px rgba(0,0,0,0.06);
  border-radius: 8px;
  max-height: 287px;
  overflow-y: auto;
  color: #000;
  margin-top: 10px;
}
.ChannelSearchResults__Header {
  width: fit-content;
  display: flex;
  align-items: center;
  margin-left: 12px;
}
.ChannelSearchResults__Header i {
  margin-left: 12px;
}
.ChannelSearchResults__Container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 48px;
  padding: 0 12px;
  gap: 8px;
}
.ChannelSearchResults__Container--Highlighted,
.ChannelSearchResults__Container:hover {
  background: #e1f3ec;
}
.ChannelSearchResults__Container--Icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 28px;
  background: #16a085;
  border-radius: 24px;
  font-weight: 700;
  font-size: 14px;
  line-height: 120%;
  color: #fff;
}
.ChannelSearchResults__Container--Text {
  width: 100%;
  color: #000;
  font-weight: 500;
  font-size: 14px;
  line-height: 120%;
  cursor: pointer;
  white-space: nowrap;
  overflow-y: hidden;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
}

.SelectedChannel {
  gap: 10px;
  padding: 8px 5px;
  position: relative;
  display: flex;
  align-items: center;
  width: 396px;
  cursor: text;
}
.SelectedChannel__Avatar {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
}
.SelectedChannel__Icons {
  position: relative;
  top: 2px;
  left: 4px;
}

.ForwardMessage__Search {
  position: relative;
  display: flex;
  align-items: center;
  padding: 20px;
}
.ForwardMessage__Search--Input {
  display: flex;
  align-items: center;
  height: 40px;
  border-radius: 10px;
  border: 1px solid #d1d1d1;
  color: #000;
}
.ForwardMessage__Search--Input:focus-within {
  border-color: #16a085;
}
.ForwardMessage__Search--Input input {
  background: none;
  border: none;
  outline: none;
  font-size: 16px;
  width: 396px;
  padding-left: 10px;
  min-width: 0;
  font-weight: 600;
}
.ForwardMessage__Textarea {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 20px 20px 20px;
}
.ForwardMessage__Textarea textarea {
  border: 1px solid #d1d1d1;
  border-radius: 10px;
  width: 396px;
  resize: none;
  padding: 16px 10px;
  overflow: hidden;
  color: #000;
}
.ForwardMessage__Textarea textarea:focus-within {
  border-color: #16a085;
}
.ForwardMessage__SharedMessage {
  padding: 20px;
}
.ForwardMessage__Message {
  gap: 10px;
  position: relative;
  display: flex;
  padding: 0 0 0 10px;
  border-left: 5px solid #d1d1d1;
}
.ForwardMessage__Message--Group {
  gap: 10px;
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ForwardMessage__Message--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}
.ForwardMessage__Message--Author {
  text-transform: capitalize;
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  line-height: 120%;
  margin: 0 8px 0 0;
  width: 310px;
}
.ForwardMessage__Message--Text {
  overflow-wrap: break-word;
}
.ForwardMessage__Message--Footer {
  height: 82px;
  padding: 1rem 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.ForwardMessage__Message--Footer button {
  padding: 10px 20px;
  margin-right: 30px;
}
.ForwardMessage__Message--Footer ._Button--Disabled {
  background-color: #d1d1d1 !important;
}

.ForwardMessage {
  position: absolute;
  top: 0;
  z-index: 11;
  background: #fff;
  width: 100%;
  height: 90%;
}

.CustomMessageActionList button {
  margin: 0;
  cursor: pointer;
  width: 100%;
  text-align: start;
  padding: 6px 10px;
  background: transparent;
  box-shadow: none;
  border-radius: 0px;
  border-block-start: none;
  border-block-end: none;
  border-inline-start: none;
  border-inline-end: none;
}
.CustomMessageActionList button:hover {
  background-color: #e1f3ec;
}

.Channel__Container {
  height: 100%;
  width: 100%;
  min-width: 0;
  flex: 1;
}

@charset "UTF-8";
.str-video *,
.str-video *::before,
.str-video *::after {
  box-sizing: border-box;
}
.str-video {
  background-color: #272a30;
  color: #fff;
  height: 100dvh;
  width: 100%;
  display: flex;
  flex-direction: column;
  min-width: 0;
  max-width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
}
:root {
  --str-video__brand-color1: #005fff;
  --str-video__brand-color2: #69e5f6;
  --str-video__brand-color3: #00e2a1;
  --str-video__brand-color4: #ffd646;
  --str-video__brand-color5: #dc433b;
  --str_video__brand-color6: #b38af8;
  --str-video__base-color1: #e3e4e5;
  --str-video__base-color2: #979ca0;
  --str-video__base-color3: #4c535b;
  --str-video__base-color4: #000;
  --str-video__base-color5: #0c0d0e;
  --str-video__base-color6: #19232d;
  --str-video__base-color7: #101213;
  --str-video__backdrop1: rgba(0,0,0,0.5);
  --str-video__button-default-base: #19232d;
  --str-video__button-default-hover: #323b44;
  --str-video__button-default-pressed: #0c0d0e;
  --str-video__button-default-active: #19232d;
  --str-video__button-default-disabled: #1e262e;
  --str-video__button-primary-base: #19232d;
  --str-video__button-primary-hover: #4c8fff;
  --str-video__button-primary-pressed: #0c48ab;
  --str-video__button-primary-active: #005fff;
  --str-video__button-secondary-base: #19232d;
  --str-video__button-secondary-hover: #e96962;
  --str-video__button-secondary-pressed: #6a3233;
  --str-video__button-secondary-active: #dc433b;
  --str-video__button-tertiary-base: #dc433b;
  --str-video__button-tertiary-hover: #e96962;
  --str-video__button-tertiary-pressed: #6a3233;
  --str-video__button-tertiary-active: #31292f;
  --str-video__icon-default: #eff0f1;
  --str-video__icon-hover: #eff0f1;
  --str-video__icon-pressed: #656b72;
  --str-video__icon-active: #e3e4e5;
  --str-video__icon-alert: #e3e4e5;
  --str-video__icon-disabled: #7e8389;
  --str-video__alert-success: #00e2a1;
  --str-video__alert-caution: #ffd646;
  --str-video__alert-warning: #dc433b;
  --str-video__alert-success-background: rgba(0,226,161,0.5);
  --str-video__alert-caution-background: rgba(255,214,70,0.5);
  --str-video__alert-warning-background: rgba(220,67,59,0.5);
  --str-video__font-size-xxs: 0.625rem;
  --str-video__font-size-xs: 0.75rem;
  --str-video__font-size-sm: 0.875rem;
  --str-video__font-size-md: 1rem;
  --str-video__font-size-lg: 1.125rem;
  --str-video__font-size-xl: 1.25rem;
  --str-video__font-size-xxl: 1.5rem;
  --str-video__border-radius-xxs: 4px;
  --str-video__border-radius-xs: 8px;
  --str-video__border-radius-sm: 12px;
  --str-video__border-radius-md: 18px;
  --str-video__border-radius-lg: 24px;
  --str-video__border-radius-xl: 30px;
  --str-video__border-radius-xxl: 48px;
  --str-video__border-radius-circle: 999px;
  --str-video__spacing-xxs: 4px;
  --str-video__spacing-xs: 6px;
  --str-video__spacing-sm: 8px;
  --str-video__spacing-md: 12px;
  --str-video__spacing-lg: 16px;
  --str-video__spacing-xl: 20px;
  --str-video__primary-color: #005fff;
  --str-video__secondary-color: #669fff;
  --str-video__text-color1: #fff;
  --str-video__text-color2: #b4b7bb;
  --str-video__text-color3: #72767e;
  --str-video__text-color4: #f7f7f8;
  --str-video__info-color: #4ce68c;
  --str-video__info-color--accent: #20e070;
  --str-video__danger-color: #ff3742;
  --str-video__danger-color--accent: #ff000e;
  --str-video__background-color0: #000;
  --str-video__background-color1: #1c1e22;
  --str-video__background-color2: #272a30;
  --str-video__background-color3: #f4f4f5;
  --str-video__background-color4: #121416;
  --str-video__background-color5: #1d2938;
  --str-video__background-color6: #b4b7bb;
  --str-video__background-color7: #72767e;
  --str-video__overlay-color: rgba(39,42,48,0.75);
  --str-video__livestream-overlay-color: rgba(39,42,48,0.25);
  --str-video__livestream-overlay-color-hovered: rgba(39,42,48,0.5);
  --str-video__icon--call-accept: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHZpZXdCb3g9IjAgMCAxOSAxOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNy41MSAxMi4zODJDMTYuMjggMTIuMzgyIDE1LjA5IDEyLjE4MiAxMy45OCAxMS44MjJDMTMuNjMgMTEuNzAyIDEzLjI0IDExLjc5MiAxMi45NyAxMi4wNjJMMTEuNCAxNC4wMzJDOC41NyAxMi42ODIgNS45MiAxMC4xMzIgNC41MSA3LjIwMTk1TDYuNDYgNS41NDE5NUM2LjczIDUuMjYxOTUgNi44MSA0Ljg3MTk1IDYuNyA0LjUyMTk1QzYuMzMgMy40MTE5NSA2LjE0IDIuMjIxOTUgNi4xNCAwLjk5MTk1M0M2LjE0IDAuNDUxOTUzIDUuNjkgMC4wMDE5NTMxMyA1LjE1IDAuMDAxOTUzMTNIMS42OUMxLjE1IDAuMDAxOTUzMTIgMC41IDAuMjQxOTUzIDAuNSAwLjk5MTk1M0MwLjUgMTAuMjgyIDguMjMgMTguMDAyIDE3LjUxIDE4LjAwMkMxOC4yMiAxOC4wMDIgMTguNSAxNy4zNzIgMTguNSAxNi44MjJWMTMuMzcyQzE4LjUgMTIuODMyIDE4LjA1IDEyLjM4MiAxNy41MSAxMi4zODJaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K);
  --str-video__icon--call-end: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTQuNTgwMSAxNi4wMzA0TDYuNTgwMSAxNC40NDA0QzcuMDYwMSAxNC4wNjA0IDcuMzQwMSAxMy40ODA0IDcuMzQwMSAxMi44NzA0VjEwLjI3MDRDMTAuMzYwMSA5LjI5MDQgMTMuNjMwMSA5LjI4MDQgMTYuNjYwMSAxMC4yNzA0VjEyLjg4MDRDMTYuNjYwMSAxMy40OTA0IDE2Ljk0MDEgMTQuMDcwNCAxNy40MjAxIDE0LjQ1MDRMMTkuNDEwMSAxNi4wMzA0QzIwLjIxMDEgMTYuNjYwNCAyMS4zNTAxIDE2LjYwMDQgMjIuMDcwMSAxNS44ODA0TDIzLjI5MDEgMTQuNjYwNEMyNC4wOTAxIDEzLjg2MDQgMjQuMDkwMSAxMi41MzA0IDIzLjI0MDEgMTEuNzgwNEMxNi44MzAxIDYuMTIwNCA3LjE3MDEgNi4xMjA0IDAuNzYwMTAzIDExLjc4MDRDLTAuMDg5ODk3IDEyLjUzMDQgLTAuMDg5ODk3IDEzLjg2MDQgMC43MTAxMDMgMTQuNjYwNEwxLjkzMDEgMTUuODgwNEMyLjY0MDEgMTYuNjAwNCAzLjc4MDEgMTYuNjYwNCA0LjU4MDEgMTYuMDMwNFoiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--camera: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3IDEwLjVWN0MxNyA2LjQ1IDE2LjU1IDYgMTYgNkg0QzMuNDUgNiAzIDYuNDUgMyA3VjE3QzMgMTcuNTUgMy40NSAxOCA0IDE4SDE2QzE2LjU1IDE4IDE3IDE3LjU1IDE3IDE3VjEzLjVMMTkuMjkgMTUuNzlDMTkuOTIgMTYuNDIgMjEgMTUuOTcgMjEgMTUuMDhWOC45MUMyMSA4LjAyIDE5LjkyIDcuNTcgMTkuMjkgOC4yTDE3IDEwLjVaIiBmaWxsPSIjQjBCNEI3Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--camera-off: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIxLjI5MTUgMTQuNzY5OVY5LjQ3OTlDMjEuMjkxNSA4LjU4OTkgMjAuMjExNSA4LjEzOTkgMTkuNTgxNSA4Ljc2OTlMMTcuMjkxNSAxMS4wNjk5VjcuNTY5OUMxNy4yOTE1IDcuMDE5OSAxNi44NDE1IDYuNTY5OSAxNi4yOTE1IDYuNTY5OUgxMC42ODE1TDE5LjU5MTUgMTUuNDc5OUMyMC4yMTE1IDE2LjEwOTkgMjEuMjkxNSAxNS42NTk5IDIxLjI5MTUgMTQuNzY5OVpNMy4wMDE0OCAzLjEyOTlDMi42MTE0OCAzLjUxOTkgMi42MTE0OCA0LjE0OTkgMy4wMDE0OCA0LjUzOTlMNS4wMjE0OCA2LjU2OTlINC4yOTE0OEMzLjc0MTQ4IDYuNTY5OSAzLjI5MTQ4IDcuMDE5OSAzLjI5MTQ4IDcuNTY5OVYxNy41Njk5QzMuMjkxNDggMTguMTE5OSAzLjc0MTQ4IDE4LjU2OTkgNC4yOTE0OCAxOC41Njk5SDE2LjI5MTVDMTYuNTAxNSAxOC41Njk5IDE2LjY4MTUgMTguNDg5OSAxNi44NDE1IDE4LjM4OTlMMTkuMzIxNSAyMC44Njk5QzE5LjcxMTUgMjEuMjU5OSAyMC4zNDE1IDIxLjI1OTkgMjAuNzMxNSAyMC44Njk5QzIxLjEyMTUgMjAuNDc5OSAyMS4xMjE1IDE5Ljg0OTkgMjAuNzMxNSAxOS40NTk5TDQuNDExNDggMy4xMjk5QzQuMDIxNDggMi43Mzk5IDMuMzkxNDggMi43Mzk5IDMuMDAxNDggMy4xMjk5WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K);
  --str-video__icon--camera-add: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjMiIHZpZXdCb3g9IjAgMCAyMiAyMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1LjU4MzMgOS43MjU1OVY2LjUxNzI1QzE1LjU4MzMgNi4wMTMwOSAxNS4xNzA4IDUuNjAwNTkgMTQuNjY2NyA1LjYwMDU5SDMuNjY2NjdDMy4xNjI1IDUuNjAwNTkgMi43NSA2LjAxMzA5IDIuNzUgNi41MTcyNVYxNS42ODM5QzIuNzUgMTYuMTg4MSAzLjE2MjUgMTYuNjAwNiAzLjY2NjY3IDE2LjYwMDZIMTQuNjY2N0MxNS4xNzA4IDE2LjYwMDYgMTUuNTgzMyAxNi4xODgxIDE1LjU4MzMgMTUuNjgzOVYxMi40NzU2TDE3LjY4MjUgMTQuNTc0OEMxOC4yNiAxNS4xNTIzIDE5LjI1IDE0LjczOTggMTkuMjUgMTMuOTIzOVY4LjI2ODA5QzE5LjI1IDcuNDUyMjUgMTguMjYgNy4wMzk3NSAxNy42ODI1IDcuNjE3MjVMMTUuNTgzMyA5LjcyNTU5Wk0xMS45MTY3IDEyLjAxNzNIMTAuMDgzM1YxMy44NTA2QzEwLjA4MzMgMTQuMzU0OCA5LjY3MDgzIDE0Ljc2NzMgOS4xNjY2NyAxNC43NjczQzguNjYyNSAxNC43NjczIDguMjUgMTQuMzU0OCA4LjI1IDEzLjg1MDZWMTIuMDE3M0g2LjQxNjY3QzUuOTEyNSAxMi4wMTczIDUuNSAxMS42MDQ4IDUuNSAxMS4xMDA2QzUuNSAxMC41OTY0IDUuOTEyNSAxMC4xODM5IDYuNDE2NjcgMTAuMTgzOUg4LjI1VjguMzUwNTlDOC4yNSA3Ljg0NjQyIDguNjYyNSA3LjQzMzkyIDkuMTY2NjcgNy40MzM5MkM5LjY3MDgzIDcuNDMzOTIgMTAuMDgzMyA3Ljg0NjQyIDEwLjA4MzMgOC4zNTA1OVYxMC4xODM5SDExLjkxNjdDMTIuNDIwOCAxMC4xODM5IDEyLjgzMzMgMTAuNTk2NCAxMi44MzMzIDExLjEwMDZDMTIuODMzMyAxMS42MDQ4IDEyLjQyMDggMTIuMDE3MyAxMS45MTY3IDEyLjAxNzNaIiBmaWxsPSIjRkFGQUZBIi8+Cjwvc3ZnPgo=);
  --str-video__icon--caret: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--caret-down: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--caret-up: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--chat: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIwIDZIMTlWMTRDMTkgMTQuNTUgMTguNTUgMTUgMTggMTVINlYxNkM2IDE3LjEgNi45IDE4IDggMThIMThMMjIgMjJWOEMyMiA2LjkgMjEuMSA2IDIwIDZaTTE3IDExVjRDMTcgMi45IDE2LjEgMiAxNSAySDRDMi45IDIgMiAyLjkgMiA0VjE3TDYgMTNIMTVDMTYuMSAxMyAxNyAxMi4xIDE3IDExWiIgZmlsbD0iI0IwQjRCNyIvPgo8L2c+Cjwvc3ZnPgo=);
  --str-video__icon--chevron-down: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNDEgOC4yOTUwNEwxMiAxMi44NzVMMTYuNTkgOC4yOTUwNEwxOCA5LjcwNTA0TDEyIDE1LjcwNUw2IDkuNzA1MDRMNy40MSA4LjI5NTA0WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K);
  --str-video__icon--chevron-up: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNDEgMTUuNzA1TDEyIDExLjEyNUwxNi41OSAxNS43MDVMMTggMTQuMjk1TDEyIDguMjk1MDRMNiAxNC4yOTVMNy40MSAxNS43MDVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--chevron-right: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTYuOTk3NjcgMjEuMDE0OUM3LjQ4NzY3IDIxLjUwNDkgOC4yNzc2NyAyMS41MDQ5IDguNzY3NjcgMjEuMDE0OUwxNy4wNzc3IDEyLjcwNDlDMTcuNDY3NyAxMi4zMTQ5IDE3LjQ2NzcgMTEuNjg0OSAxNy4wNzc3IDExLjI5NDlMOC43Njc2NyAyLjk4NDkzQzguMjc3NjcgMi40OTQ5MyA3LjQ4NzY3IDIuNDk0OTMgNi45OTc2NyAyLjk4NDkzQzYuNTA3NjcgMy40NzQ5MyA2LjUwNzY3IDQuMjY0OTMgNi45OTc2NyA0Ljc1NDkzTDE0LjIzNzcgMTIuMDA0OUw2Ljk4NzY3IDE5LjI1NDlDNi41MDc2NyAxOS43MzQ5IDYuNTA3NjcgMjAuNTM0OSA2Ljk5NzY3IDIxLjAxNDlaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--call-latency: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyLjAwMjkgMTcuOTk4OEMxMi41NTUyIDE3Ljk5ODggMTMuMDAyOSAxNy41NTExIDEzLjAwMjkgMTYuOTk4OEMxMy4wMDI5IDE2LjQ0NjUgMTIuNTU1MiAxNS45OTg4IDEyLjAwMjkgMTUuOTk4OEMxMS40NTA2IDE1Ljk5ODggMTEuMDAyOSAxNi40NDY1IDExLjAwMjkgMTYuOTk4OEMxMS4wMDI5IDE3LjU1MTEgMTEuNDUwNiAxNy45OTg4IDEyLjAwMjkgMTcuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTcuMDAyOTMgMTIuOTk4OEM3LjU1NTIxIDEyLjk5ODggOC4wMDI5MyAxMi41NTExIDguMDAyOTMgMTEuOTk4OEM4LjAwMjkzIDExLjQ0NjUgNy41NTUyMSAxMC45OTg4IDcuMDAyOTMgMTAuOTk4OEM2LjQ1MDY0IDEwLjk5ODggNi4wMDI5MyAxMS40NDY1IDYuMDAyOTMgMTEuOTk4OEM2LjAwMjkzIDEyLjU1MTEgNi40NTA2NCAxMi45OTg4IDcuMDAyOTMgMTIuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTE3LjAwMjkgMTIuOTk4OEMxNy41NTUyIDEyLjk5ODggMTguMDAyOSAxMi41NTExIDE4LjAwMjkgMTEuOTk4OEMxOC4wMDI5IDExLjQ0NjUgMTcuNTU1MiAxMC45OTg4IDE3LjAwMjkgMTAuOTk4OEMxNi40NTA2IDEwLjk5ODggMTYuMDAyOSAxMS40NDY1IDE2LjAwMjkgMTEuOTk4OEMxNi4wMDI5IDEyLjU1MTEgMTYuNDUwNiAxMi45OTg4IDE3LjAwMjkgMTIuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTEyLjAwMjkgMi45OTg3OEMxMS40NTI5IDIuOTk4NzggMTEuMDAyOSAzLjQ0ODc4IDExLjAwMjkgMy45OTg3OFY1Ljk5ODc4QzExLjAwMjkgNi41NDg3OCAxMS40NTI5IDYuOTk4NzggMTIuMDAyOSA2Ljk5ODc4QzEyLjU1MjkgNi45OTg3OCAxMy4wMDI5IDYuNTQ4NzggMTMuMDAyOSA1Ljk5ODc4VjUuMDc4NzhDMTYuMzEyOSA1LjU1ODc4IDE4Ljg3MjkgOC4zMjg3OCAxOS4wMDI5IDExLjczODhDMTkuMTQyOSAxNS41ODg4IDE1Ljk3MjkgMTguOTM4OCAxMi4xMjI5IDE4Ljk5ODhDOC4xOTI5MyAxOS4wNTg4IDUuMDAyOTMgMTUuOTA4OCA1LjAwMjkzIDExLjk5ODhDNS4wMDI5MyAxMC4zMTg4IDUuNTkyOTMgOC43Nzg3OCA2LjU4MjkzIDcuNTc4NzhMMTEuMjkyOSAxMi4yOTg4QzExLjY4MjkgMTIuNjg4OCAxMi4zMTI5IDEyLjY4ODggMTIuNzAyOSAxMi4yOTg4QzEzLjA5MjkgMTEuOTA4OCAxMy4wOTI5IDExLjI3ODggMTIuNzAyOSAxMC44ODg4TDcuMjYyOTMgNS40NTg3OEM2Ljg4MjkzIDUuMDc4NzggNi4yNjI5MyA1LjA2ODc4IDUuODYyOTMgNS40Mzg3OEM0LjEwMjkzIDcuMDY4NzggMy4wMDI5MyA5LjM5ODc4IDMuMDAyOTMgMTEuOTk4OEMzLjAwMjkzIDE3LjAzODggNy4xNDI5MyAyMS4xMTg4IDEyLjIxMjkgMjAuOTk4OEMxNi45MTI5IDIwLjg4ODggMjAuODQyOSAxNi45ODg4IDIwLjk5MjkgMTIuMjg4OEMyMS4xNjI5IDcuMTg4NzggMTcuMDcyOSAyLjk5ODc4IDEyLjAwMjkgMi45OTg3OFoiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--close: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE4LjI5OTcgNS43MDk5N0MxNy45MDk3IDUuMzE5OTcgMTcuMjc5NyA1LjMxOTk3IDE2Ljg4OTcgNS43MDk5N0wxMS45OTk3IDEwLjU5TDcuMTA5NzMgNS42OTk5N0M2LjcxOTczIDUuMzA5OTcgNi4wODk3MyA1LjMwOTk3IDUuNjk5NzMgNS42OTk5N0M1LjMwOTczIDYuMDg5OTcgNS4zMDk3MyA2LjcxOTk3IDUuNjk5NzMgNy4xMDk5N0wxMC41ODk3IDEyTDUuNjk5NzMgMTYuODlDNS4zMDk3MyAxNy4yOCA1LjMwOTczIDE3LjkxIDUuNjk5NzMgMTguM0M2LjA4OTczIDE4LjY5IDYuNzE5NzMgMTguNjkgNy4xMDk3MyAxOC4zTDExLjk5OTcgMTMuNDFMMTYuODg5NyAxOC4zQzE3LjI3OTcgMTguNjkgMTcuOTA5NyAxOC42OSAxOC4yOTk3IDE4LjNDMTguNjg5NyAxNy45MSAxOC42ODk3IDE3LjI4IDE4LjI5OTcgMTYuODlMMTMuNDA5NyAxMkwxOC4yOTk3IDcuMTA5OTdDMTguNjc5NyA2LjcyOTk3IDE4LjY3OTcgNi4wODk5NyAxOC4yOTk3IDUuNzA5OTdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--connection-quality-poor: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuMjU0ODgzIDYuMjVDMC4yNTQ4ODMgMi45MzYyOSAyLjk0MTE3IDAuMjUgNi4yNTQ4OCAwLjI1SDMyLjI1NDlWMjYuMjVDMzIuMjU0OSAyOS41NjM3IDI5LjU2ODYgMzIuMjUgMjYuMjU0OSAzMi4yNUgwLjI1NDg4M1Y2LjI1WiIgZmlsbD0iIzBDMEQwRSIgZmlsbC1vcGFjaXR5PSIwLjY1Ii8+CjxwYXRoIGQ9Ik0xNi4yNTQ5IDIwLjI1TDE2LjI1NDkgMTUuMjUiIHN0cm9rZT0iI0UzRTRFNSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTExLjI1NDkgMjAuMjVMMTEuMjU0OSAxOC4yNSIgc3Ryb2tlPSIjREM0MzNCIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMjEuMjU0OSAyMC4yNUwyMS4yNTQ5IDEyLjI1IiBzdHJva2U9IiNFM0U0RTUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
  --str-video__icon--connection-quality-good: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuOTI0ODA1IDYuMjVDMC45MjQ4MDUgMi45MzYyOSAzLjYxMTEgMC4yNSA2LjkyNDggMC4yNUgzMi45MjQ4VjI2LjI1QzMyLjkyNDggMjkuNTYzNyAzMC4yMzg1IDMyLjI1IDI2LjkyNDggMzIuMjVIMC45MjQ4MDVWNi4yNVoiIGZpbGw9IiMwQzBEMEUiIGZpbGwtb3BhY2l0eT0iMC42NSIvPgo8cGF0aCBkPSJNMTYuOTI0OCAyMC4yNUwxNi45MjQ4IDE1LjI1IiBzdHJva2U9IiMwMEUyQTEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMS45MjQ4IDIwLjI1TDExLjkyNDggMTguMjUiIHN0cm9rZT0iIzAwRTJBMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIxLjkyNDggMjAuMjVMMjEuOTI0OCAxMi4yNSIgc3Ryb2tlPSIjRTNFNEU1IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K);
  --str-video__icon--connection-quality-excellent: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuMjU0ODgzIDYuMjVDMC4yNTQ4ODMgMi45MzYyOSAyLjk0MTE3IDAuMjUgNi4yNTQ4OCAwLjI1SDMyLjI1NDlWMjYuMjVDMzIuMjU0OSAyOS41NjM3IDI5LjU2ODYgMzIuMjUgMjYuMjU0OSAzMi4yNUgwLjI1NDg4M1Y2LjI1WiIgZmlsbD0iIzBDMEQwRSIgZmlsbC1vcGFjaXR5PSIwLjY1Ii8+CjxwYXRoIGQ9Ik0xNi4yNTQ5IDIwLjI1TDE2LjI1NDkgMTUuMjUiIHN0cm9rZT0iIzAwRTJBMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTExLjI1NDkgMjAuMjVMMTEuMjU0OSAxOC4yNSIgc3Ryb2tlPSIjMDBFMkExIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMjEuMjU0OSAyMC4yNUwyMS4yNTQ5IDEyLjI1IiBzdHJva2U9IiMwMEUyQTEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
  --str-video__icon--copy: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNSAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9ImNvcHlfYWxsIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE4Ljk2NDggMi40OTY1OEg5Ljk2NDg0QzguODY0ODQgMi40OTY1OCA3Ljk2NDg0IDMuMzk2NTggNy45NjQ4NCA0LjQ5NjU4VjE2LjQ5NjZDNy45NjQ4NCAxNy41OTY2IDguODY0ODQgMTguNDk2NiA5Ljk2NDg0IDE4LjQ5NjZIMTguOTY0OEMyMC4wNjQ4IDE4LjQ5NjYgMjAuOTY0OCAxNy41OTY2IDIwLjk2NDggMTYuNDk2NlY0LjQ5NjU4QzIwLjk2NDggMy4zOTY1OCAyMC4wNjQ4IDIuNDk2NTggMTguOTY0OCAyLjQ5NjU4Wk0xOC45NjQ4IDE2LjQ5NjZIOS45NjQ4NFY0LjQ5NjU4SDE4Ljk2NDhWMTYuNDk2NlpNMy45NjQ4NCAxNS40OTY2VjEzLjQ5NjZINS45NjQ4NFYxNS40OTY2SDMuOTY0ODRaTTMuOTY0ODQgOS45OTY1OEg1Ljk2NDg0VjExLjk5NjZIMy45NjQ4NFY5Ljk5NjU4Wk0xMC45NjQ4IDIwLjQ5NjZIMTIuOTY0OFYyMi40OTY2SDEwLjk2NDhWMjAuNDk2NlpNMy45NjQ4NCAxOC45OTY2VjE2Ljk5NjZINS45NjQ4NFYxOC45OTY2SDMuOTY0ODRaTTUuOTY0ODQgMjIuNDk2NkM0Ljg2NDg0IDIyLjQ5NjYgMy45NjQ4NCAyMS41OTY2IDMuOTY0ODQgMjAuNDk2Nkg1Ljk2NDg0VjIyLjQ5NjZaTTkuNDY0ODQgMjIuNDk2Nkg3LjQ2NDg0VjIwLjQ5NjZIOS40NjQ4NFYyMi40OTY2Wk0xNC40NjQ4IDIyLjQ5NjZWMjAuNDk2NkgxNi40NjQ4QzE2LjQ2NDggMjEuNTk2NiAxNS41NjQ4IDIyLjQ5NjYgMTQuNDY0OCAyMi40OTY2Wk01Ljk2NDg0IDYuNDk2NThWOC40OTY1OEgzLjk2NDg0QzMuOTY0ODQgNy4zOTY1OCA0Ljg2NDg0IDYuNDk2NTggNS45NjQ4NCA2LjQ5NjU4WiIgZmlsbD0iI0UzRTRFNSIvPgo8L2c+Cjwvc3ZnPgo=);
  --str-video__icon--download: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyOCAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3LjA2MDcgNi4zMzM1SDE2LjAwMDdWMy4wMDAxNkMxNi4wMDA3IDIuNjMzNSAxNS43MDA3IDIuMzMzNSAxNS4zMzQgMi4zMzM1SDEyLjY2NzNDMTIuMzAwNyAyLjMzMzUgMTIuMDAwNyAyLjYzMzUgMTIuMDAwNyAzLjAwMDE2VjYuMzMzNUgxMC45NDA3QzEwLjM0NzMgNi4zMzM1IDEwLjA0NzMgNy4wNTM1IDEwLjQ2NzMgNy40NzM1TDEzLjUyNzMgMTAuNTMzNUMxMy43ODczIDEwLjc5MzUgMTQuMjA3MyAxMC43OTM1IDE0LjQ2NzMgMTAuNTMzNUwxNy41MjczIDcuNDczNUMxNy45NDczIDcuMDUzNSAxNy42NTQgNi4zMzM1IDE3LjA2MDcgNi4zMzM1Wk05LjMzMzk4IDEzLjAwMDJDOS4zMzM5OCAxMy4zNjY4IDkuNjMzOTggMTMuNjY2OCAxMC4wMDA3IDEzLjY2NjhIMTguMDAwN0MxOC4zNjczIDEzLjY2NjggMTguNjY3MyAxMy4zNjY4IDE4LjY2NzMgMTMuMDAwMkMxOC42NjczIDEyLjYzMzUgMTguMzY3MyAxMi4zMzM1IDE4LjAwMDcgMTIuMzMzNUgxMC4wMDA3QzkuNjMzOTggMTIuMzMzNSA5LjMzMzk4IDEyLjYzMzUgOS4zMzM5OCAxMy4wMDAyWiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--developer: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9ImNvZGUiPgo8cGF0aCBpZD0iVmVjdG9yIiBkPSJNNy4yNDkwOSAxMy4yNUwzLjk5OTA5IDEwTDcuMjQ5MDkgNi43NTAwMkM3LjU3NDA5IDYuNDI1MDIgNy41NzQwOSA1LjkwODM1IDcuMjQ5MDkgNS41ODMzNUM2LjkyNDA5IDUuMjU4MzUgNi40MDc0MiA1LjI1ODM1IDYuMDgyNDIgNS41ODMzNUwyLjI1NzQyIDkuNDA4MzVDMS45MzI0MiA5LjczMzM1IDEuOTMyNDIgMTAuMjU4MyAyLjI1NzQyIDEwLjU4MzNMNi4wODI0MiAxNC40MTY3QzYuNDA3NDIgMTQuNzQxNyA2LjkyNDA5IDE0Ljc0MTcgNy4yNDkwOSAxNC40MTY3QzcuNTc0MDkgMTQuMDkxNyA3LjU3NDA5IDEzLjU3NSA3LjI0OTA5IDEzLjI1Wk0xMi43NDkxIDEzLjI1TDE1Ljk5OTEgMTBMMTIuNzQ5MSA2Ljc1MDAyQzEyLjQyNDEgNi40MjUwMiAxMi40MjQxIDUuOTA4MzUgMTIuNzQ5MSA1LjU4MzM1QzEzLjA3NDEgNS4yNTgzNSAxMy41OTA4IDUuMjU4MzUgMTMuOTE1OCA1LjU4MzM1TDE3Ljc0MDggOS40MDgzNUMxOC4wNjU4IDkuNzMzMzUgMTguMDY1OCAxMC4yNTgzIDE3Ljc0MDggMTAuNTgzM0wxMy45MTU4IDE0LjQxNjdDMTMuNTkwOCAxNC43NDE3IDEzLjA3NDEgMTQuNzQxNyAxMi43NDkxIDE0LjQxNjdDMTIuNDI0MSAxNC4wOTE3IDEyLjQyNDEgMTMuNTc1IDEyLjc0OTEgMTMuMjVaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--ellipsis: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYgMTBDNC45IDEwIDQgMTAuOSA0IDEyQzQgMTMuMSA0LjkgMTQgNiAxNEM3LjEgMTQgOCAxMy4xIDggMTJDOCAxMC45IDcuMSAxMCA2IDEwWk0xOCAxMEMxNi45IDEwIDE2IDEwLjkgMTYgMTJDMTYgMTMuMSAxNi45IDE0IDE4IDE0QzE5LjEgMTQgMjAgMTMuMSAyMCAxMkMyMCAxMC45IDE5LjEgMTAgMTggMTBaTTEyIDEwQzEwLjkgMTAgMTAgMTAuOSAxMCAxMkMxMCAxMy4xIDEwLjkgMTQgMTIgMTRDMTMuMSAxNCAxNCAxMy4xIDE0IDEyQzE0IDEwLjkgMTMuMSAxMCAxMiAxMFoiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--feedback: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNyAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjUwMDMgNy4xNjkzNkMxMy41MDAzIDcuNjI3NjkgMTMuODc1MyA4LjAwMjY5IDE0LjMzMzcgOC4wMDI2OUgxNi4wMDAzQzE2LjQ1ODcgOC4wMDI2OSAxNi44MzM3IDcuNjI3NjkgMTYuODMzNyA3LjE2OTM2QzE2LjgzMzcgNi43MTEwMyAxNi40NTg3IDYuMzM2MDMgMTYuMDAwMyA2LjMzNjAzSDE0LjMzMzdDMTMuODc1MyA2LjMzNjAzIDEzLjUwMDMgNi43MTEwMyAxMy41MDAzIDcuMTY5MzZaIiBmaWxsPSIjRTNFNEU1Ii8+CjxwYXRoIGQ9Ik0xMi4zMjUzIDExLjE4NkMxMi4wNTAzIDExLjU1MjcgMTIuMTI1MyAxMi4wNjEgMTIuNDkyIDEyLjMyNzdDMTIuOTMzNyAxMi42NTI3IDEzLjQwMDMgMTMuMDAyNyAxMy44NDIgMTMuMzM2QzE0LjIwODcgMTMuNjExIDE0LjcyNTMgMTMuNTM2IDE0Ljk5MiAxMy4xNjk0QzE0Ljk5MiAxMy4xNjEgMTUuMDAwMyAxMy4xNjEgMTUuMDAwMyAxMy4xNTI3QzE1LjI3NTMgMTIuNzg2IDE1LjIwMDMgMTIuMjY5NCAxNC44MzM3IDEyLjAwMjdDMTQuMzkyIDExLjY2OTQgMTMuOTI1MyAxMS4zMTk0IDEzLjQ5MiAxMC45OTQ0QzEzLjEyNTMgMTAuNzE5NCAxMi42MDg3IDEwLjgwMjcgMTIuMzMzNyAxMS4xNjk0QzEyLjMzMzcgMTEuMTc3NyAxMi4zMjUzIDExLjE4NiAxMi4zMjUzIDExLjE4NloiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTE1LjAwODcgMS4xNzc2OUMxNS4wMDg3IDEuMTY5MzYgMTUuMDAwMyAxLjE2OTM2IDE1LjAwMDMgMS4xNjEwM0MxNC43MjUzIDAuNzk0MzU5IDE0LjIwODcgMC43MTkzNTkgMTMuODUwMyAwLjk5NDM1OUMxMy40MDg3IDEuMzI3NjkgMTIuOTMzNyAxLjY3NzY5IDEyLjUwMDMgMi4wMTEwM0MxMi4xMzM3IDIuMjg2MDMgMTIuMDY3IDIuODAyNjkgMTIuMzQyIDMuMTYxMDNDMTIuMzQyIDMuMTY5MzYgMTIuMzUwMyAzLjE2OTM2IDEyLjM1MDMgMy4xNzc2OUMxMi42MjUzIDMuNTQ0MzYgMTMuMTMzNyAzLjYxOTM2IDEzLjUwMDMgMy4zNDQzNkMxMy45NDIgMy4wMTkzNiAxNC40MDg3IDIuNjYxMDMgMTQuODUwMyAyLjMyNzY5QzE1LjIwODcgMi4wNjEwMyAxNS4yNzUzIDEuNTQ0MzYgMTUuMDA4NyAxLjE3NzY5WiIgZmlsbD0iI0UzRTRFNSIvPgo8cGF0aCBkPSJNNS4xNjY5OSA0LjY2OTM2SDEuODMzNjZDMC45MTY5OTIgNC42NjkzNiAwLjE2Njk5MiA1LjQxOTM2IDAuMTY2OTkyIDYuMzM2MDNWOC4wMDI2OUMwLjE2Njk5MiA4LjkxOTM2IDAuOTE2OTkyIDkuNjY5MzYgMS44MzM2NiA5LjY2OTM2SDIuNjY2OTlWMTIuMTY5NEMyLjY2Njk5IDEyLjYyNzcgMy4wNDE5OSAxMy4wMDI3IDMuNTAwMzMgMTMuMDAyN0MzLjk1ODY2IDEzLjAwMjcgNC4zMzM2NiAxMi42Mjc3IDQuMzMzNjYgMTIuMTY5NFY5LjY2OTM2SDUuMTY2OTlMOS4zMzM2NiAxMi4xNjk0VjIuMTY5MzZMNS4xNjY5OSA0LjY2OTM2WiIgZmlsbD0iI0UzRTRFNSIvPgo8cGF0aCBkPSJNMTEuNDE3IDcuMTY5MzZDMTEuNDE3IDYuMDYxMDMgMTAuOTMzNyA1LjA2MTAzIDEwLjE2NyA0LjM3NzY5VjkuOTUyNjlDMTAuOTMzNyA5LjI3NzY5IDExLjQxNyA4LjI3NzY5IDExLjQxNyA3LjE2OTM2WiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--film-roll: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTMgNkMyLjQ1IDYgMiA2LjQ1IDIgN1YyMEMyIDIxLjEgMi45IDIyIDQgMjJIMTdDMTcuNTUgMjIgMTggMjEuNTUgMTggMjFDMTggMjAuNDUgMTcuNTUgMjAgMTcgMjBINUM0LjQ1IDIwIDQgMTkuNTUgNCAxOVY3QzQgNi40NSAzLjU1IDYgMyA2Wk0yMCAySDhDNi45IDIgNiAyLjkgNiA0VjE2QzYgMTcuMSA2LjkgMTggOCAxOEgyMEMyMS4xIDE4IDIyIDE3LjEgMjIgMTZWNEMyMiAyLjkgMjEuMSAyIDIwIDJaTTEyIDE0LjVWNS41TDE3LjQ3IDkuNkMxNy43NCA5LjggMTcuNzQgMTAuMiAxNy40NyAxMC40TDEyIDE0LjVaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--filter: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSI+CiAgICA8cGF0aCBkPSJNMSAzLjc1QS43NS43NSAwIDAgMSAxLjc1IDNoMTIuNWEuNzUuNzUgMCAwIDEgMCAxLjVIMS43NUEuNzUuNzUgMCAwIDEgMSAzLjc1em0yLjUgNEEuNzUuNzUgMCAwIDEgNC4yNSA3aDcuNWEuNzUuNzUgMCAwIDEgMCAxLjVoLTcuNWEuNzUuNzUgMCAwIDEtLjc1LS43NXpNNi43NSAxMWEuNzUuNzUgMCAwIDAgMCAxLjVoMi41YS43NS43NSAwIDAgMCAwLTEuNWgtMi41eiIgZmlsbD0iY3VycmVudENvbG9yIi8+XAo8L3N2Zz4K);
  --str-video__icon--folder: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMSAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9ImZvbGRlciI+CjxwYXRoIGlkPSJWZWN0b3IiIGQ9Ik05LjMyNjMgMy44MjQ5MkM5LjAwOTY0IDMuNTA4MjUgOC41ODQ2NCAzLjMzMzI1IDguMTQyOTcgMy4zMzMyNUgzLjgzNDY0QzIuOTE3OTcgMy4zMzMyNSAyLjE3NjMgNC4wODMyNSAyLjE3NjMgNC45OTk5MkwyLjE2Nzk3IDE0Ljk5OTlDMi4xNjc5NyAxNS45MTY2IDIuOTE3OTcgMTYuNjY2NiAzLjgzNDY0IDE2LjY2NjZIMTcuMTY4QzE4LjA4NDYgMTYuNjY2NiAxOC44MzQ2IDE1LjkxNjYgMTguODM0NiAxNC45OTk5VjYuNjY2NTlDMTguODM0NiA1Ljc0OTkyIDE4LjA4NDYgNC45OTk5MiAxNy4xNjggNC45OTk5MkgxMC41MDEzTDkuMzI2MyAzLjgyNDkyWiIgZmlsbD0iI0UzRTRFNSIvPgo8L2c+Cjwvc3ZnPgo=);
  --str-video__icon--fullscreen: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzNiAzNiIgd2lkdGg9IjM2IiBoZWlnaHQ9IjM2IiBmaWxsPSJ3aGl0ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0ibSAxMCwxNiAyLDAgMCwtNCA0LDAgMCwtMiBMIDEwLDEwIGwgMCw2IDAsMCB6Ii8+CjxwYXRoIGQ9Im0gMjAsMTAgMCwyIDQsMCAwLDQgMiwwIEwgMjYsMTAgbCAtNiwwIDAsMCB6Ii8+CjxwYXRoIGQ9Im0gMjQsMjQgLTQsMCAwLDIgTCAyNiwyNiBsIDAsLTYgLTIsMCAwLDQgMCwwIHoiLz4KPHBhdGggZD0iTSAxMiwyMCAxMCwyMCAxMCwyNiBsIDYsMCAwLC0yIC00LDAgMCwtNCAwLDAgeiIvPgo8L3N2Zz4=);
  --str-video__icon--grid: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTQgMTNIMTBDMTAuNTUgMTMgMTEgMTIuNTUgMTEgMTJWNEMxMSAzLjQ1IDEwLjU1IDMgMTAgM0g0QzMuNDUgMyAzIDMuNDUgMyA0VjEyQzMgMTIuNTUgMy40NSAxMyA0IDEzWk00IDIxSDEwQzEwLjU1IDIxIDExIDIwLjU1IDExIDIwVjE2QzExIDE1LjQ1IDEwLjU1IDE1IDEwIDE1SDRDMy40NSAxNSAzIDE1LjQ1IDMgMTZWMjBDMyAyMC41NSAzLjQ1IDIxIDQgMjFaTTE0IDIxSDIwQzIwLjU1IDIxIDIxIDIwLjU1IDIxIDIwVjEyQzIxIDExLjQ1IDIwLjU1IDExIDIwIDExSDE0QzEzLjQ1IDExIDEzIDExLjQ1IDEzIDEyVjIwQzEzIDIwLjU1IDEzLjQ1IDIxIDE0IDIxWk0xMyA0VjhDMTMgOC41NSAxMy40NSA5IDE0IDlIMjBDMjAuNTUgOSAyMSA4LjU1IDIxIDhWNEMyMSAzLjQ1IDIwLjU1IDMgMjAgM0gxNEMxMy40NSAzIDEzIDMuNDUgMTMgNFoiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--info-document: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjUgMjNINC41QzMuNCAyMyAyLjUgMjIuMSAyLjUgMjFWN0g0LjVWMjFIMTguNVYyM1pNMTUuNSAxSDguNUM3LjQgMSA2LjUxIDEuOSA2LjUxIDNMNi41IDE3QzYuNSAxOC4xIDcuMzkgMTkgOC40OSAxOUgxOS41QzIwLjYgMTkgMjEuNSAxOC4xIDIxLjUgMTdWN0wxNS41IDFaTTE5LjUgMTdIOC41VjNIMTQuNjdMMTkuNSA3LjgzVjE3WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTE0LjgwNjIgMTQuNTY5M0gxMi44MDYyTDEyLjgwNjIgOS41NjkzNEgxNC44MDYyTDE0LjgwNjIgMTQuNTY5M1oiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xNC44OTAxIDYuNTczMjRDMTQuODkwMSA3LjE3MTkxIDE0LjQwNDggNy42NTcyMyAxMy44MDYyIDcuNjU3MjNDMTMuMjA3NSA3LjY1NzIzIDEyLjcyMjIgNy4xNzE5MSAxMi43MjIyIDYuNTczMjRDMTIuNzIyMiA1Ljk3NDU3IDEzLjIwNzUgNS40ODkyNiAxMy44MDYyIDUuNDg5MjZDMTQuNDA0OCA1LjQ4OTI2IDE0Ljg5MDEgNS45NzQ1NyAxNC44OTAxIDYuNTczMjRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K);
  --str-video__icon--info-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iMjRweCIgZmlsbD0iI2ZmZmZmZiI+PHBhdGggZD0iTTAgMGgyNHYyNEgwVjB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTExIDdoMnYyaC0yem0wIDRoMnY2aC0yem0xLTlDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bTAgMThjLTQuNDEgMC04LTMuNTktOC04czMuNTktOCA4LTggOCAzLjU5IDggOC0zLjU5IDgtOCA4eiIvPjwvc3ZnPg==);
  --str-video__icon--layout: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNSAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IkxheW91dCI+CjxnIGlkPSJWZWN0b3IiPgo8cGF0aCBkPSJNMTEuNTI2NyAyMC42MTQzTDExLjUyNjcgMTQuNjE0M0MxMS41MjY3IDE0LjA2NDMgMTEuMDc2NyAxMy42MTQzIDEwLjUyNjcgMTMuNjE0M0w0LjUyNjY5IDEzLjYxNDNDMy45NzY2OSAxMy42MTQzIDMuNTI2NjkgMTQuMDY0MyAzLjUyNjY5IDE0LjYxNDNMMy41MjY2OSAyMC42MTQzQzMuNTI2NjkgMjEuMTY0MyAzLjk3NjY5IDIxLjYxNDMgNC41MjY2OSAyMS42MTQzTDEwLjUyNjcgMjEuNjE0M0MxMS4wNzY3IDIxLjYxNDMgMTEuNTI2NyAyMS4xNjQzIDExLjUyNjcgMjAuNjE0M1oiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTIxLjQ3MjYgMTQuNjE0M0wyMS40NzI2IDIwLjYxNDNDMjEuNDcyNiAyMS4xNjQzIDIxLjAyMjYgMjEuNjE0MyAyMC40NzI2IDIxLjYxNDNMMTQuNDcyNiAyMS42MTQzQzEzLjkyMjYgMjEuNjE0MyAxMy40NzI2IDIxLjE2NDMgMTMuNDcyNiAyMC42MTQzTDEzLjQ3MjYgMTQuNjE0M0MxMy40NzI2IDE0LjA2NDMgMTMuOTIyNiAxMy42MTQzIDE0LjQ3MjYgMTMuNjE0M0wyMC40NzI2IDEzLjYxNDNDMjEuMDIyNiAxMy42MTQzIDIxLjQ3MjYgMTQuMDY0MyAyMS40NzI2IDE0LjYxNDNaIiBmaWxsPSIjRTNFNEU1Ii8+CjxwYXRoIGQ9Ik0xMS41MjY3IDIwLjYxNDNMMTEuNTI2NyAxNC42MTQzQzExLjUyNjcgMTQuMDY0MyAxMS4wNzY3IDEzLjYxNDMgMTAuNTI2NyAxMy42MTQzTDQuNTI2NjkgMTMuNjE0M0MzLjk3NjY5IDEzLjYxNDMgMy41MjY2OSAxNC4wNjQzIDMuNTI2NjkgMTQuNjE0M0wzLjUyNjY5IDIwLjYxNDNDMy41MjY2OSAyMS4xNjQzIDMuOTc2NjkgMjEuNjE0MyA0LjUyNjY5IDIxLjYxNDNMMTAuNTI2NyAyMS42MTQzQzExLjA3NjcgMjEuNjE0MyAxMS41MjY3IDIxLjE2NDMgMTEuNTI2NyAyMC42MTQzWiIgZmlsbD0iI0UzRTRFNSIvPgo8cGF0aCBkPSJNMjEuNDcyNiAxNC42MTQzTDIxLjQ3MjYgMjAuNjE0M0MyMS40NzI2IDIxLjE2NDMgMjEuMDIyNiAyMS42MTQzIDIwLjQ3MjYgMjEuNjE0M0wxNC40NzI2IDIxLjYxNDNDMTMuOTIyNiAyMS42MTQzIDEzLjQ3MjYgMjEuMTY0MyAxMy40NzI2IDIwLjYxNDNMMTMuNDcyNiAxNC42MTQzQzEzLjQ3MjYgMTQuMDY0MyAxMy45MjI2IDEzLjYxNDMgMTQuNDcyNiAxMy42MTQzTDIwLjQ3MjYgMTMuNjE0M0MyMS4wMjI2IDEzLjYxNDMgMjEuNDcyNiAxNC4wNjQzIDIxLjQ3MjYgMTQuNjE0M1oiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTExLjUyNjcgMTAuNjU3N0wxMS41MjY3IDQuNjU3NjdDMTEuNTI2NyA0LjEwNzY3IDExLjA3NjcgMy42NTc2NyAxMC41MjY3IDMuNjU3NjdMNC41MjY2OSAzLjY1NzY3QzMuOTc2NjkgMy42NTc2NyAzLjUyNjY5IDQuMTA3NjcgMy41MjY2OSA0LjY1NzY3TDMuNTI2NjkgMTAuNjU3N0MzLjUyNjY5IDExLjIwNzcgMy45NzY2OSAxMS42NTc3IDQuNTI2NjkgMTEuNjU3N0wxMC41MjY3IDExLjY1NzdDMTEuMDc2NyAxMS42NTc3IDExLjUyNjcgMTEuMjA3NyAxMS41MjY3IDEwLjY1NzdaIiBmaWxsPSIjRTNFNEU1Ii8+CjxwYXRoIGQ9Ik0yMS40NzI3IDQuNjU3NjdMMjEuNDcyNyAxMC42NTc3QzIxLjQ3MjcgMTEuMjA3NyAyMS4wMjI3IDExLjY1NzcgMjAuNDcyNyAxMS42NTc3TDE0LjQ3MjcgMTEuNjU3N0MxMy45MjI3IDExLjY1NzcgMTMuNDcyNyAxMS4yMDc3IDEzLjQ3MjcgMTAuNjU3N0wxMy40NzI3IDQuNjU3NjdDMTMuNDcyNyA0LjEwNzY3IDEzLjkyMjcgMy42NTc2NyAxNC40NzI3IDMuNjU3NjdMMjAuNDcyNyAzLjY1NzY3QzIxLjAyMjcgMy42NTc2NyAyMS40NzI3IDQuMTA3NjcgMjEuNDcyNyA0LjY1NzY3WiIgZmlsbD0iI0UzRTRFNSIvPgo8L2c+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--layout-speaker-left: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IkxheW91dCI+CjxnIGlkPSJWZWN0b3IiPgo8cGF0aCBkPSJNMyAzLjk2OTMyTDMgMTcuMzAyN0MzIDE3Ljc2MSAzLjM3NSAxOC4xMzYgMy44MzMzMyAxOC4xMzZMMTAuNSAxOC4xMzZDMTAuOTU4MyAxOC4xMzYgMTEuMzMzMyAxNy43NjEgMTEuMzMzMyAxNy4zMDI3TDExLjMzMzMgMy45NjkzMkMxMS4zMzMzIDMuNTEwOTkgMTAuOTU4MyAzLjEzNTk5IDEwLjUgMy4xMzU5OUwzLjgzMzMzIDMuMTM1OTlDMy4zNzUgMy4xMzU5OSAzIDMuNTEwOTkgMyAzLjk2OTMyWk0xNy4xNjY3IDExLjQ2OTNMMTMuODMzMyAxMS40NjkzQzEzLjM3NSAxMS40NjkzIDEzIDExLjg0NDMgMTMgMTIuMzAyN0wxMyAxNy4zMDI3QzEzIDE3Ljc2MSAxMy4zNzUgMTguMTM2IDEzLjgzMzMgMTguMTM2TDE3LjE2NjcgMTguMTM2QzE3LjYyNSAxOC4xMzYgMTggMTcuNzYxIDE4IDE3LjMwMjdMMTggMTIuMzAyN0MxOCAxMS44NDQzIDE3LjYyNSAxMS40NjkzIDE3LjE2NjcgMTEuNDY5M1oiIGZpbGw9IiNCMEI0QjciLz4KPHBhdGggZD0iTTEzLjgzMzMgMy4xODEwMkwxNy4xNjY3IDMuMTgxMDJDMTcuNjI1IDMuMTgxMDIgMTggMy41NTYwMiAxOCA0LjAxNDM1TDE4IDkuMDE0MzVDMTggOS40NzI2OCAxNy42MjUgOS44NDc2OCAxNy4xNjY3IDkuODQ3NjhMMTMuODMzMyA5Ljg0NzY4QzEzLjM3NSA5Ljg0NzY4IDEzIDkuNDcyNjggMTMgOS4wMTQzNUwxMyA0LjAxNDM1QzEzIDMuNTU2MDIgMTMuMzc1IDMuMTgxMDIgMTMuODMzMyAzLjE4MTAyWiIgZmlsbD0iI0IwQjRCNyIvPgo8L2c+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--layout-speaker-top: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IkxheW91dCI+CjxnIGlkPSJWZWN0b3IiPgo8cGF0aCBkPSJNMTcuMTY2NyAzLjEzNTk4TDMuODMzMzMgMy4xMzU5OEMzLjM3NSAzLjEzNTk4IDMgMy41MTA5OCAzIDMuOTY5MzJMMyAxMC42MzZDMyAxMS4wOTQzIDMuMzc1IDExLjQ2OTMgMy44MzMzMyAxMS40NjkzTDE3LjE2NjcgMTEuNDY5M0MxNy42MjUgMTEuNDY5MyAxOCAxMS4wOTQzIDE4IDEwLjYzNkwxOCAzLjk2OTMyQzE4IDMuNTEwOTggMTcuNjI1IDMuMTM1OTggMTcuMTY2NyAzLjEzNTk4Wk05LjY2NjY3IDE3LjMwMjdMOS42NjY2NyAxMy45NjkzQzkuNjY2NjcgMTMuNTExIDkuMjkxNjcgMTMuMTM2IDguODMzMzMgMTMuMTM2TDMuODMzMzMgMTMuMTM2QzMuMzc1IDEzLjEzNiAzIDEzLjUxMSAzIDEzLjk2OTNMMyAxNy4zMDI3QzMgMTcuNzYxIDMuMzc1IDE4LjEzNiAzLjgzMzMzIDE4LjEzNkw4LjgzMzMzIDE4LjEzNkM5LjI5MTY3IDE4LjEzNiA5LjY2NjY3IDE3Ljc2MSA5LjY2NjY3IDE3LjMwMjdaIiBmaWxsPSIjMDA1RkZGIi8+CjxwYXRoIGQ9Ik0xNy45NTUgMTMuOTY5M0wxNy45NTUgMTcuMzAyN0MxNy45NTUgMTcuNzYxIDE3LjU4IDE4LjEzNiAxNy4xMjE2IDE4LjEzNkwxMi4xMjE2IDE4LjEzNkMxMS42NjMzIDE4LjEzNiAxMS4yODgzIDE3Ljc2MSAxMS4yODgzIDE3LjMwMjdMMTEuMjg4MyAxMy45NjkzQzExLjI4ODMgMTMuNTExIDExLjY2MzMgMTMuMTM2IDEyLjEyMTYgMTMuMTM2TDE3LjEyMTYgMTMuMTM2QzE3LjU4IDEzLjEzNiAxNy45NTUgMTMuNTExIDE3Ljk1NSAxMy45NjkzWiIgZmlsbD0iIzAwNUZGRiIvPgo8L2c+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--layout-speaker-bottom: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuMzMzMzMgMThIMTYuNjY2N0MxNy4xMjUgMTggMTcuNSAxNy42MjUgMTcuNSAxNy4xNjY3VjEwLjVDMTcuNSAxMC4wNDE3IDE3LjEyNSA5LjY2NjY3IDE2LjY2NjcgOS42NjY2N0gzLjMzMzMzQzIuODc1IDkuNjY2NjcgMi41IDEwLjA0MTcgMi41IDEwLjVWMTcuMTY2N0MyLjUgMTcuNjI1IDIuODc1IDE4IDMuMzMzMzMgMThaTTEwLjgzMzMgMy44MzMzNFY3LjE2NjY3QzEwLjgzMzMgNy42MjUgMTEuMjA4MyA4IDExLjY2NjcgOEgxNi42NjY3QzE3LjEyNSA4IDE3LjUgNy42MjUgMTcuNSA3LjE2NjY3VjMuODMzMzRDMTcuNSAzLjM3NSAxNy4xMjUgMyAxNi42NjY3IDNIMTEuNjY2N0MxMS4yMDgzIDMgMTAuODMzMyAzLjM3NSAxMC44MzMzIDMuODMzMzRaIiBmaWxsPSIjQjBCNEI3Ii8+CjxwYXRoIGQ9Ik0yLjU0NTAzIDcuMTY2NjdWMy44MzMzM0MyLjU0NTAzIDMuMzc1IDIuOTIwMDMgMyAzLjM3ODM2IDNIOC4zNzgzNkM4LjgzNjcgMyA5LjIxMTcgMy4zNzUgOS4yMTE3IDMuODMzMzNWNy4xNjY2N0M5LjIxMTcgNy42MjUgOC44MzY3IDggOC4zNzgzNiA4SDMuMzc4MzZDMi45MjAwMyA4IDIuNTQ1MDMgNy42MjUgMi41NDUwMyA3LjE2NjY3WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K);
  --str-video__icon--layout-speaker-right: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIxIDIwTDIxIDRDMjEgMy40NSAyMC41NSAzIDIwIDNMMTIgM0MxMS40NSAzIDExIDMuNDUgMTEgNEwxMSAyMEMxMSAyMC41NSAxMS40NSAyMSAxMiAyMUwyMCAyMUMyMC41NSAyMSAyMSAyMC41NSAyMSAyMFpNNCAxMUw4IDExQzguNTUgMTEgOSAxMC41NSA5IDEwTDkgNEM5IDMuNDUgOC41NSAzIDggM0w0IDNDMy40NSAzIDMgMy40NSAzIDRMMyAxMEMzIDEwLjU1IDMuNDUgMTEgNCAxMVoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTggMjAuOTQ2TDQgMjAuOTQ2QzMuNDUgMjAuOTQ2IDMgMjAuNDk2IDMgMTkuOTQ2TDMgMTMuOTQ2QzMgMTMuMzk2IDMuNDUgMTIuOTQ2IDQgMTIuOTQ2TDggMTIuOTQ2QzguNTUgMTIuOTQ2IDkgMTMuMzk2IDkgMTMuOTQ2TDkgMTkuOTQ2QzkgMjAuNDk2IDguNTUgMjAuOTQ2IDggMjAuOTQ2WiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--layout-speaker-one-on-one: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yLjk1NzAzIDIxLjA1ODNWMy4zOTY0OEMyLjk1NzAzIDIuODQ2NDggMy40MDcwMyAyLjM5NjQ4IDMuOTU3MDMgMi4zOTY0OEgyMC4wNDM2QzIwLjU5MzYgMi4zOTY0OCAyMS4wNDM2IDIuODQ2NDggMjEuMDQzNiAzLjM5NjQ4TDIxLjA0MzYgMjEuMDU4M0MyMS4wNDM2IDIxLjYwODMgMjAuNTkzNiAyMi4wNTgzIDIwLjA0MzYgMjIuMDU4M0gzLjk1NzAzQzMuNDA3MDMgMjIuMDU4MyAyLjk1NzAzIDIxLjYwODMgMi45NTcwMyAyMS4wNTgzWk0xOC4zMDA1IDQuMjI3NTRMMTQuMzAwNSA0LjIyNzU0QzEzLjc1MDUgNC4yMjc1NCAxMy4zMDA1IDQuNjc3NTQgMTMuMzAwNSA1LjIyNzU0VjExLjIyNzVDMTMuMzAwNSAxMS43Nzc1IDEzLjc1MDUgMTIuMjI3NSAxNC4zMDA1IDEyLjIyNzVIMTguMzAwNUMxOC44NTA1IDEyLjIyNzUgMTkuMzAwNSAxMS43Nzc1IDE5LjMwMDUgMTEuMjI3NVY1LjIyNzU0QzE5LjMwMDUgNC42Nzc1NCAxOC44NTA1IDQuMjI3NTQgMTguMzAwNSA0LjIyNzU0WiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--layout-speaker-live-stream: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNzYgMTcuMDc1QzYuNjcgMTUuOTk1IDYgMTQuNDk1IDYgMTIuODM1QzYgMTEuMTc1IDYuNjcgOS42NzQ5NSA3Ljc2IDguNTk0OTVMOS4xOCAxMC4wMTVDOC40NSAxMC43MzUgOCAxMS43MzUgOCAxMi44MzVDOCAxMy45MzUgOC40NSAxNC45MzUgOS4xNyAxNS42NjVMNy43NiAxNy4wNzVaTTE2LjI0IDE3LjA3NUMxNy4zMyAxNS45OTUgMTggMTQuNDk1IDE4IDEyLjgzNUMxOCAxMS4xNzUgMTcuMzMgOS42NzQ5NSAxNi4yNCA4LjU5NDk1TDE0LjgyIDEwLjAxNUMxNS41NSAxMC43MzUgMTYgMTEuNzM1IDE2IDEyLjgzNUMxNiAxMy45MzUgMTUuNTUgMTQuOTM1IDE0LjgzIDE1LjY2NUwxNi4yNCAxNy4wNzVaTTEyIDEwLjgzNUMxMC45IDEwLjgzNSAxMCAxMS43MzUgMTAgMTIuODM1QzEwIDEzLjkzNSAxMC45IDE0LjgzNSAxMiAxNC44MzVDMTMuMSAxNC44MzUgMTQgMTMuOTM1IDE0IDEyLjgzNUMxNCAxMS43MzUgMTMuMSAxMC44MzUgMTIgMTAuODM1Wk0yMCAxMi44MzVDMjAgMTUuMDQ1IDE5LjEgMTcuMDQ1IDE3LjY1IDE4LjQ4NUwxOS4wNyAxOS45MDVDMjAuODggMTguMDk1IDIyIDE1LjU5NSAyMiAxMi44MzVDMjIgMTAuMDc1IDIwLjg4IDcuNTc0OTUgMTkuMDcgNS43NjQ5NUwxNy42NSA3LjE4NDk1QzE5LjEgOC42MjQ5NSAyMCAxMC42MjUgMjAgMTIuODM1Wk02LjM1IDcuMTg0OTVMNC45MyA1Ljc2NDk1QzMuMTIgNy41NzQ5NSAyIDEwLjA3NSAyIDEyLjgzNUMyIDE1LjU5NSAzLjEyIDE4LjA5NSA0LjkzIDE5LjkwNUw2LjM1IDE4LjQ4NUM0LjkgMTcuMDQ1IDQgMTUuMDQ1IDQgMTIuODM1QzQgMTAuNjI1IDQuOSA4LjYyNDk1IDYuMzUgNy4xODQ5NVoiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--language: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTExLjk5IDJDNi40NyAyIDIgNi40OCAyIDEyQzIgMTcuNTIgNi40NyAyMiAxMS45OSAyMkMxNy41MiAyMiAyMiAxNy41MiAyMiAxMkMyMiA2LjQ4IDE3LjUyIDIgMTEuOTkgMlpNMTguOTIgOEgxNS45N0MxNS42NSA2Ljc1IDE1LjE5IDUuNTUgMTQuNTkgNC40NEMxNi40MyA1LjA3IDE3Ljk2IDYuMzUgMTguOTIgOFpNMTIgNC4wNEMxMi44MyA1LjI0IDEzLjQ4IDYuNTcgMTMuOTEgOEgxMC4wOUMxMC41MiA2LjU3IDExLjE3IDUuMjQgMTIgNC4wNFpNNC4yNiAxNEM0LjEgMTMuMzYgNCAxMi42OSA0IDEyQzQgMTEuMzEgNC4xIDEwLjY0IDQuMjYgMTBINy42NEM3LjU2IDEwLjY2IDcuNSAxMS4zMiA3LjUgMTJDNy41IDEyLjY4IDcuNTYgMTMuMzQgNy42NCAxNEg0LjI2Wk01LjA4IDE2SDguMDNDOC4zNSAxNy4yNSA4LjgxIDE4LjQ1IDkuNDEgMTkuNTZDNy41NyAxOC45MyA2LjA0IDE3LjY2IDUuMDggMTZaTTguMDMgOEg1LjA4QzYuMDQgNi4zNCA3LjU3IDUuMDcgOS40MSA0LjQ0QzguODEgNS41NSA4LjM1IDYuNzUgOC4wMyA4Wk0xMiAxOS45NkMxMS4xNyAxOC43NiAxMC41MiAxNy40MyAxMC4wOSAxNkgxMy45MUMxMy40OCAxNy40MyAxMi44MyAxOC43NiAxMiAxOS45NlpNMTQuMzQgMTRIOS42NkM5LjU3IDEzLjM0IDkuNSAxMi42OCA5LjUgMTJDOS41IDExLjMyIDkuNTcgMTAuNjUgOS42NiAxMEgxNC4zNEMxNC40MyAxMC42NSAxNC41IDExLjMyIDE0LjUgMTJDMTQuNSAxMi42OCAxNC40MyAxMy4zNCAxNC4zNCAxNFpNMTQuNTkgMTkuNTZDMTUuMTkgMTguNDUgMTUuNjUgMTcuMjUgMTUuOTcgMTZIMTguOTJDMTcuOTYgMTcuNjUgMTYuNDMgMTguOTMgMTQuNTkgMTkuNTZaTTE2LjM2IDE0QzE2LjQ0IDEzLjM0IDE2LjUgMTIuNjggMTYuNSAxMkMxNi41IDExLjMyIDE2LjQ0IDEwLjY2IDE2LjM2IDEwSDE5Ljc0QzE5LjkgMTAuNjQgMjAgMTEuMzEgMjAgMTJDMjAgMTIuNjkgMTkuOSAxMy4zNiAxOS43NCAxNEgxNi4zNloiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--livestream-viewers: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzg2OTdfMjU1NykiPgo8cGF0aCBkPSJNOC4zNzc0NCA0LjU2MjVDMTAuNzQ2MiA0LjU2MjUgMTIuODU4NyA1Ljg5Mzc1IDEzLjg4OTkgOEMxMi44NTg3IDEwLjEwNjIgMTAuNzQ2MiAxMS40Mzc1IDguMzc3NDQgMTEuNDM3NUM2LjAwODY5IDExLjQzNzUgMy44OTYxOSAxMC4xMDYyIDIuODY0OTQgOEMzLjg5NjE5IDUuODkzNzUgNi4wMDg2OSA0LjU2MjUgOC4zNzc0NCA0LjU2MjVaTTguMzc3NDQgMy4zMTI1QzUuMjUyNDQgMy4zMTI1IDIuNTgzNjkgNS4yNTYyNSAxLjUwMjQ0IDhDMi41ODM2OSAxMC43NDM4IDUuMjUyNDQgMTIuNjg3NSA4LjM3NzQ0IDEyLjY4NzVDMTEuNTAyNCAxMi42ODc1IDE0LjE3MTIgMTAuNzQzOCAxNS4yNTI0IDhDMTQuMTcxMiA1LjI1NjI1IDExLjUwMjQgMy4zMTI1IDguMzc3NDQgMy4zMTI1Wk04LjM3NzQ0IDYuNDM3NUM5LjIzOTk0IDYuNDM3NSA5LjkzOTk0IDcuMTM3NSA5LjkzOTk0IDhDOS45Mzk5NCA4Ljg2MjUgOS4yMzk5NCA5LjU2MjUgOC4zNzc0NCA5LjU2MjVDNy41MTQ5NCA5LjU2MjUgNi44MTQ5NCA4Ljg2MjUgNi44MTQ5NCA4QzYuODE0OTQgNy4xMzc1IDcuNTE0OTQgNi40Mzc1IDguMzc3NDQgNi40Mzc1Wk04LjM3NzQ0IDUuMTg3NUM2LjgyNzQ0IDUuMTg3NSA1LjU2NDk0IDYuNDUgNS41NjQ5NCA4QzUuNTY0OTQgOS41NSA2LjgyNzQ0IDEwLjgxMjUgOC4zNzc0NCAxMC44MTI1QzkuOTI3NDQgMTAuODEyNSAxMS4xODk5IDkuNTUgMTEuMTg5OSA4QzExLjE4OTkgNi40NSA5LjkyNzQ0IDUuMTg3NSA4LjM3NzQ0IDUuMTg3NVoiIGZpbGw9IiNGQ0ZDRkMiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF84Njk3XzI1NTciPgo8cmVjdCB4PSIwLjg3NzQ0MSIgeT0iMC41IiB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHJ4PSI0IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=);
  --str-video__icon--loading: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzEiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMSAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzAuOTIxMyAxNUMzMC45MjEzIDIzLjI4NDMgMjQuMjA1NiAzMCAxNS45MjEzIDMwQzEwLjcxNTQgMzAgNi4xMjg5OSAyNy4zNDggMy40MzkyMSAyMy4zMjE0TDUuMTAzNDkgMjIuMjExOUM3LjQzNDYzIDI1LjcwMTYgMTEuNDA5NiAyOCAxNS45MjEzIDI4QzIzLjEwMSAyOCAyOC45MjEzIDIyLjE3OTcgMjguOTIxMyAxNUMyOC45MjEzIDcuODIwMyAyMy4xMDEgMiAxNS45MjEzIDJMMTUuOTIxMyAwQzI0LjIwNTYgMCAzMC45MjEzIDYuNzE1NzMgMzAuOTIxMyAxNVoiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8xODYwXzExMDYyMykiLz4KICAgIDxkZWZzPgogICAgICAgIDxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8xODYwXzExMDYyMyIgeDE9IjMuNDM5MjEiIHkxPSIwIiB4Mj0iMy40MzkyMSIgeTI9IjMwIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgICAgICAgIDxzdG9wIGlkPSJzdG9wLXNlbWl0cmFuc3BhcmVudCIgc3RvcC1vcGFjaXR5PSIwLjAxIi8+CiAgICAgICAgICAgIDxzdG9wIGlkPSJzdG9wLW9wYXF1ZSIgb2Zmc2V0PSIxIiAvPgogICAgICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8L2RlZnM+Cjwvc3ZnPg==);
  --str-video__icon--logout: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNSAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuMDA2NTEgMi45MTY2N0g2LjUwNjUxQzYuODI3MzQgMi45MTY2NyA3LjA4OTg0IDIuNjU0MTcgNy4wODk4NCAyLjMzMzMzQzcuMDg5ODQgMi4wMTI1IDYuODI3MzQgMS43NSA2LjUwNjUxIDEuNzVIMy4wMDY1MUMyLjM2NDg0IDEuNzUgMS44Mzk4NCAyLjI3NSAxLjgzOTg0IDIuOTE2NjdWMTEuMDgzM0MxLjgzOTg0IDExLjcyNSAyLjM2NDg0IDEyLjI1IDMuMDA2NTEgMTIuMjVINi41MDY1MUM2LjgyNzM0IDEyLjI1IDcuMDg5ODQgMTEuOTg3NSA3LjA4OTg0IDExLjY2NjdDNy4wODk4NCAxMS4zNDU4IDYuODI3MzQgMTEuMDgzMyA2LjUwNjUxIDExLjA4MzNIMy4wMDY1MVYyLjkxNjY3WiIgZmlsbD0iI0UzRTRFNSIvPgo8cGF0aCBkPSJNMTIuMTM1NyA2Ljc5NTgzTDEwLjUwODIgNS4xNjgzM0MxMC4zMjE1IDQuOTgxNjcgMTAuMDA2NSA1LjExIDEwLjAwNjUgNS4zNzI1VjYuNDE2NjdINS45MjMxOEM1LjYwMjM0IDYuNDE2NjcgNS4zMzk4NCA2LjY3OTE3IDUuMzM5ODQgN0M1LjMzOTg0IDcuMzIwODMgNS42MDIzNCA3LjU4MzMzIDUuOTIzMTggNy41ODMzM0gxMC4wMDY1VjguNjI3NUMxMC4wMDY1IDguODkgMTAuMzIxNSA5LjAxODMzIDEwLjUwMjMgOC44MzE2N0wxMi4xMjk4IDcuMjA0MTdDMTIuMjQ2NSA3LjA5MzMzIDEyLjI0NjUgNi45MDY2NyAxMi4xMzU3IDYuNzk1ODNaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--login: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjMgNy44MDA1OUM5LjkxIDguMTkwNTkgOS45MSA4LjgxMDU5IDEwLjMgOS4yMDA1OUwxMi4yIDExLjEwMDZIM0MyLjQ1IDExLjEwMDYgMiAxMS41NTA2IDIgMTIuMTAwNkMyIDEyLjY1MDYgMi40NSAxMy4xMDA2IDMgMTMuMTAwNkgxMi4yTDEwLjMgMTUuMDAwNkM5LjkxIDE1LjM5MDYgOS45MSAxNi4wMTA2IDEwLjMgMTYuNDAwNkMxMC42OSAxNi43OTA2IDExLjMxIDE2Ljc5MDYgMTEuNyAxNi40MDA2TDE1LjI5IDEyLjgxMDZDMTUuNjggMTIuNDIwNiAxNS42OCAxMS43OTA2IDE1LjI5IDExLjQwMDZMMTEuNyA3LjgwMDU5QzExLjMxIDcuNDEwNTkgMTAuNjkgNy40MTA1OSAxMC4zIDcuODAwNTlaTTIwIDE5LjEwMDZIMTNDMTIuNDUgMTkuMTAwNiAxMiAxOS41NTA2IDEyIDIwLjEwMDZDMTIgMjAuNjUwNiAxMi40NSAyMS4xMDA2IDEzIDIxLjEwMDZIMjBDMjEuMSAyMS4xMDA2IDIyIDIwLjIwMDYgMjIgMTkuMTAwNlY1LjEwMDU5QzIyIDQuMDAwNTkgMjEuMSAzLjEwMDU5IDIwIDMuMTAwNTlIMTNDMTIuNDUgMy4xMDA1OSAxMiAzLjU1MDU5IDEyIDQuMTAwNTlDMTIgNC42NTA1OSAxMi40NSA1LjEwMDU5IDEzIDUuMTAwNTlIMjBWMTkuMTAwNloiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--magnifier-glass: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik04LjQ4NDkxIDcuODYwM0g3Ljk1NTk3TDcuNzY4NSA3LjY3OTUyQzguNTcxOTUgNi43NDIxNiA4Ljk4NzA2IDUuNDYzMzQgOC43NTk0MiA0LjEwNDE4QzguNDQ0NzMgMi4yNDI4NSA2Ljg5MTQgMC43NTY0NzQgNS4wMTY2OSAwLjUyODgzQzIuMTg0NTMgMC4xODA2NjkgLTAuMTk5MDMxIDIuNTY0MjMgMC4xNDkxMyA1LjM5NjM5QzAuMzc2Nzc0IDcuMjcxMSAxLjg2MzE1IDguODI0NDMgMy43MjQ0OCA5LjEzOTEyQzUuMDgzNjQgOS4zNjY3NiA2LjM2MjQ2IDguOTUxNjUgNy4yOTk4MiA4LjE0ODJMNy40ODA2IDguMzM1NjdWOC44NjQ2MUwxMC4zMjYxIDExLjcxMDJDMTAuNjAwNyAxMS45ODQ3IDExLjA0OTIgMTEuOTg0NyAxMS4zMjM4IDExLjcxMDJDMTEuNTk4MyAxMS40MzU2IDExLjU5ODMgMTAuOTg3IDExLjMyMzggMTAuNzEyNUw4LjQ4NDkxIDcuODYwM1pNNC40Njc2NiA3Ljg2MDNDMi44MDA1MSA3Ljg2MDMgMS40NTQ3MyA2LjUxNDUyIDEuNDU0NzMgNC44NDczNkMxLjQ1NDczIDMuMTgwMjEgMi44MDA1MSAxLjgzNDQzIDQuNDY3NjYgMS44MzQ0M0M2LjEzNDgyIDEuODM0NDMgNy40ODA2IDMuMTgwMjEgNy40ODA2IDQuODQ3MzZDNy40ODA2IDYuNTE0NTIgNi4xMzQ4MiA3Ljg2MDMgNC40Njc2NiA3Ljg2MDNaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K);
  --str-video__icon--mediation: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Im1lZGlhdGlvbiI+CjxwYXRoIGlkPSJWZWN0b3IiIGQ9Ik0xNS4wOTEyIDEwLjgzNDJIMTAuODc0NUMxMC41OTEyIDEzLjQxNzYgOC45OTEyIDE1LjYwMDkgNi43NTc4NiAxNi43MDkyQzYuNzMyODYgMTguMjE3NiA1LjM3NDUzIDE5LjQwMDkgMy43OTk1MyAxOS4xMjU5QzIuNzk5NTMgMTguOTUwOSAxLjk3NDUzIDE4LjEyNTkgMS43OTk1MyAxNy4xMjU5QzEuNTE2MiAxNS41NDI2IDIuNzI0NTMgMTQuMTY3NiA0LjI1Nzg2IDE0LjE2NzZDNS4wNDk1MyAxNC4xNjc2IDUuNzQxMiAxNC41NDI2IDYuMTk5NTMgMTUuMTE3NkM3Ljc4Mjg2IDE0LjI1OTIgOC45MTYyIDEyLjY5MjYgOS4xODI4NiAxMC44MzQySDYuNTk5NTNDNi4xOTk1MyAxMS45NTA5IDUuMDQ5NTMgMTIuNzAwOSAzLjc0OTUzIDEyLjQ1MDlDMi43NjYyIDEyLjI1OTIgMS45NzQ1MyAxMS40NTA5IDEuNzkxMiAxMC40Njc2QzEuNTA3ODYgOC44ODQyMyAyLjcyNDUzIDcuNTAwOSA0LjI1Nzg2IDcuNTAwOUM1LjM0MTIgNy41MDA5IDYuMjU3ODYgOC4yMDA5IDYuNjA3ODYgOS4xNjc1Nkg5LjE5MTJDOC45MjQ1MyA3LjMwOTIzIDcuNzgyODYgNS43NTA5IDYuMTk5NTMgNC44ODQyM0M1LjY2NjIgNS41NTA5IDQuODA3ODYgNS45NTA5IDMuODU3ODYgNS44MDA5QzIuODMyODYgNS42NDI1NiAxLjk3NDUzIDQuODA5MjMgMS43OTk1MyAzLjc4NDIzQzEuNTI0NTMgMi4yMDkyMyAyLjczMjg2IDAuODM0MjI5IDQuMjU3ODYgMC44MzQyMjlDNS42MjQ1MyAwLjgzNDIyOSA2LjcyNDUzIDEuOTI1OSA2Ljc0OTUzIDMuMjkyNTZDOC45ODI4NiA0LjQwMDkgMTAuNTgyOSA2LjU4NDIzIDEwLjg2NjIgOS4xNjc1NkgxNS4wOTEyVjcuNjc1OUMxNS4wOTEyIDcuMzAwOSAxNS41NDEyIDcuMTE3NTYgMTUuNzk5NSA3LjM4NDIzTDE4LjEyNDUgOS43MDkyM0MxOC4yOTEyIDkuODc1ODkgMTguMjkxMiAxMC4xMzQyIDE4LjEyNDUgMTAuMzAwOUwxNS43OTk1IDEyLjYyNTlDMTUuNTQxMiAxMi44ODQyIDE1LjA5MTIgMTIuNzAwOSAxNS4wOTEyIDEyLjMyNTlWMTAuODM0MloiIGZpbGw9IiNFM0U0RTUiLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--mic: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExLjk5OSAxNC41QzEzLjY1OSAxNC41IDE0Ljk5OSAxMy4xNiAxNC45OTkgMTEuNVY1LjVDMTQuOTk5IDMuODQgMTMuNjU5IDIuNSAxMS45OTkgMi41QzEwLjMzOSAyLjUgOC45OTkwMSAzLjg0IDguOTk5MDEgNS41VjExLjVDOC45OTkwMSAxMy4xNiAxMC4zMzkgMTQuNSAxMS45OTkgMTQuNVpNMTcuOTA5IDExLjVDMTcuNDE5IDExLjUgMTcuMDA5IDExLjg2IDE2LjkyOSAxMi4zNUMxNi41MTkgMTQuNyAxNC40NjkgMTYuNSAxMS45OTkgMTYuNUM5LjUyOTAxIDE2LjUgNy40NzkwMSAxNC43IDcuMDY5MDEgMTIuMzVDNi45ODkwMSAxMS44NiA2LjU3OTAxIDExLjUgNi4wODkwMSAxMS41QzUuNDc5MDEgMTEuNSA0Ljk5OTAxIDEyLjA0IDUuMDg5MDEgMTIuNjRDNS41NzkwMSAxNS42NCA3Ljk3OTAxIDE3Ljk5IDEwLjk5OSAxOC40MlYyMC41QzEwLjk5OSAyMS4wNSAxMS40NDkgMjEuNSAxMS45OTkgMjEuNUMxMi41NDkgMjEuNSAxMi45OTkgMjEuMDUgMTIuOTk5IDIwLjVWMTguNDJDMTYuMDE5IDE3Ljk5IDE4LjQxOSAxNS42NCAxOC45MDkgMTIuNjRDMTkuMDA5IDEyLjA0IDE4LjUxOSAxMS41IDE3LjkwOSAxMS41WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K);
  --str-video__icon--mic-off: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE0LjkyMDQgMTEuMVY1LjVDMTQuOTIwNCAzLjg0IDEzLjU4MDQgMi41IDExLjkyMDQgMi41QzEwLjM4MDQgMi41IDkuMTMwMzkgMy42NiA4Ljk2MDM5IDUuMTVMMTQuOTIwNCAxMS4xWk0xOC4wMDA0IDExLjVDMTcuNTkwNCAxMS41IDE3LjIzMDQgMTEuOCAxNy4xNzA0IDEyLjIxQzE3LjEyMDQgMTIuNTMgMTcuMDUwNCAxMi44NSAxNi45NTA0IDEzLjE0TDE4LjIyMDQgMTQuNDFDMTguNTIwNCAxMy44MSAxOC43NDA0IDEzLjE2IDE4Ljg1MDQgMTIuNDdDMTguOTIwNCAxMS45NiAxOC41MjA0IDExLjUgMTguMDAwNCAxMS41Wk0zLjYzMDM5IDQuMDZDMy4yNDAzOSA0LjQ1IDMuMjQwMzkgNS4wOCAzLjYzMDM5IDUuNDdMOC45MjAzOSAxMC43N1YxMS4yQzguOTIwMzkgMTIuMzkgOS41MjAzOSAxMy41MiAxMC41NTA0IDE0LjExQzExLjMwMDQgMTQuNTQgMTEuOTYwNCAxNC41NSAxMi41NzA0IDE0LjQyTDE0LjIzMDQgMTYuMDhDMTMuNTIwNCAxNi40MSAxMi43MzA0IDE2LjYgMTEuOTIwNCAxNi42QzkuMzgwMzkgMTYuNiA3LjA0MDM5IDE0LjgzIDYuNjcwMzkgMTIuMjFDNi42MTAzOSAxMS44IDYuMjUwMzkgMTEuNSA1Ljg0MDM5IDExLjVDNS4zMjAzOSAxMS41IDQuOTIwMzkgMTEuOTYgNC45OTAzOSAxMi40N0M1LjQ1MDM5IDE1LjQzIDcuOTUwMzkgMTcuNzcgMTAuOTIwNCAxOC4yMlYyMC41QzEwLjkyMDQgMjEuMDUgMTEuMzcwNCAyMS41IDExLjkyMDQgMjEuNUMxMi40NzA0IDIxLjUgMTIuOTIwNCAyMS4wNSAxMi45MjA0IDIwLjVWMTguMjJDMTMuODMwNCAxOC4wOSAxNC42OTA0IDE3Ljc3IDE1LjQ3MDQgMTcuMzJMMTguOTYwNCAyMC44MUMxOS4zNTA0IDIxLjIgMTkuOTgwNCAyMS4yIDIwLjM3MDQgMjAuODFDMjAuNzYwNCAyMC40MiAyMC43NjA0IDE5Ljc5IDIwLjM3MDQgMTkuNEw1LjA0MDM5IDQuMDZDNC42NTAzOSAzLjY3IDQuMDIwMzkgMy42NyAzLjYzMDM5IDQuMDZaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--more: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTEyIDhDMTMuMSA4IDE0IDcuMSAxNCA2QzE0IDQuOSAxMy4xIDQgMTIgNEMxMC45IDQgMTAgNC45IDEwIDZDMTAgNy4xIDEwLjkgOCAxMiA4Wk0xMiAxMEMxMC45IDEwIDEwIDEwLjkgMTAgMTJDMTAgMTMuMSAxMC45IDE0IDEyIDE0QzEzLjEgMTQgMTQgMTMuMSAxNCAxMkMxNCAxMC45IDEzLjEgMTAgMTIgMTBaTTEyIDE2QzEwLjkgMTYgMTAgMTYuOSAxMCAxOEMxMCAxOS4xIDEwLjkgMjAgMTIgMjBDMTMuMSAyMCAxNCAxOS4xIDE0IDE4QzE0IDE2LjkgMTMuMSAxNiAxMiAxNloiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--network-quality: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuNCA5LjJINi42QzcuMzcgOS4yIDggOS44MyA4IDEwLjZWMTcuNkM4IDE4LjM3IDcuMzcgMTkgNi42IDE5SDYuNEM1LjYzIDE5IDUgMTguMzcgNSAxNy42VjEwLjZDNSA5LjgzIDUuNjMgOS4yIDYuNCA5LjJaTTEyIDVDMTIuNzcgNSAxMy40IDUuNjMgMTMuNCA2LjRWMTcuNkMxMy40IDE4LjM3IDEyLjc3IDE5IDEyIDE5QzExLjIzIDE5IDEwLjYgMTguMzcgMTAuNiAxNy42VjYuNEMxMC42IDUuNjMgMTEuMjMgNSAxMiA1Wk0xNy42IDEzQzE4LjM3IDEzIDE5IDEzLjYzIDE5IDE0LjRWMTcuNkMxOSAxOC4zNyAxOC4zNyAxOSAxNy42IDE5QzE2LjgzIDE5IDE2LjIgMTguMzcgMTYuMiAxNy42VjE0LjRDMTYuMiAxMy42MyAxNi44MyAxMyAxNy42IDEzWiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--participants: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE2IDExQzE3LjY2IDExIDE4Ljk5IDkuNjYgMTguOTkgOEMxOC45OSA2LjM0IDE3LjY2IDUgMTYgNUMxNC4zNCA1IDEzIDYuMzQgMTMgOEMxMyA5LjY2IDE0LjM0IDExIDE2IDExWk04IDExQzkuNjYgMTEgMTAuOTkgOS42NiAxMC45OSA4QzEwLjk5IDYuMzQgOS42NiA1IDggNUM2LjM0IDUgNSA2LjM0IDUgOEM1IDkuNjYgNi4zNCAxMSA4IDExWk04IDEzQzUuNjcgMTMgMSAxNC4xNyAxIDE2LjVWMThDMSAxOC41NSAxLjQ1IDE5IDIgMTlIMTRDMTQuNTUgMTkgMTUgMTguNTUgMTUgMThWMTYuNUMxNSAxNC4xNyAxMC4zMyAxMyA4IDEzWk0xNiAxM0MxNS43MSAxMyAxNS4zOCAxMy4wMiAxNS4wMyAxMy4wNUMxNS4wNSAxMy4wNiAxNS4wNiAxMy4wOCAxNS4wNyAxMy4wOUMxNi4yMSAxMy45MiAxNyAxNS4wMyAxNyAxNi41VjE4QzE3IDE4LjM1IDE2LjkzIDE4LjY5IDE2LjgyIDE5SDIyQzIyLjU1IDE5IDIzIDE4LjU1IDIzIDE4VjE2LjVDMjMgMTQuMTcgMTguMzMgMTMgMTYgMTNaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--person-add: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNCAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9InBlcnNvbl9hZGRfYWx0Ij4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTguOTc3NDIgOC42NDg1QzcuOTk3NDIgOC4xNDY4MyA2LjcyNTc1IDcuNzM4NSA1LjI0OTkyIDcuNzM4NUMzLjc3NDA5IDcuNzM4NSAyLjUwMjQyIDguMTQ2ODMgMS41MjI0MiA4LjY0ODVDMC45MzkwODUgOC45NDYgMC41ODMyNTIgOS41NDY4MyAwLjU4MzI1MiAxMC4yMDAyVjExLjgyMThIOS45MTY1OVYxMC4yMDAyQzkuOTE2NTkgOS41NDY4MyA5LjU2MDc1IDguOTQ2IDguOTc3NDIgOC42NDg1Wk01LjI0OTkyIDcuMTU1MTZDNi41MzkwOSA3LjE1NTE2IDcuNTgzMjUgNi4xMTEgNy41ODMyNSA0LjgyMTgzQzcuNTgzMjUgMy41MzI2NiA2LjUzOTA5IDIuNDg4NDkgNS4yNDk5MiAyLjQ4ODQ5QzMuOTYwNzUgMi40ODg0OSAyLjkxNjU5IDMuNTMyNjYgMi45MTY1OSA0LjgyMTgzQzIuOTE2NTkgNi4xMTEgMy45NjA3NSA3LjE1NTE2IDUuMjQ5OTIgNy4xNTUxNlpNMTEuNjY2NiA1LjQwNTE2VjQuMjM4NDlDMTEuNjY2NiAzLjkxNzY2IDExLjQwNDEgMy42NTUxNiAxMS4wODMzIDMuNjU1MTZDMTAuNzYyNCAzLjY1NTE2IDEwLjQ5OTkgMy45MTc2NiAxMC40OTk5IDQuMjM4NDlWNS40MDUxNkg5LjMzMzI1QzkuMDEyNDIgNS40MDUxNiA4Ljc0OTkyIDUuNjY3NjYgOC43NDk5MiA1Ljk4ODVDOC43NDk5MiA2LjMwOTMzIDkuMDEyNDIgNi41NzE4MyA5LjMzMzI1IDYuNTcxODNIMTAuNDk5OVY3LjczODVDMTAuNDk5OSA4LjA1OTMzIDEwLjc2MjQgOC4zMjE4MyAxMS4wODMzIDguMzIxODNDMTEuNDA0MSA4LjMyMTgzIDExLjY2NjYgOC4wNTkzMyAxMS42NjY2IDcuNzM4NVY2LjU3MTgzSDEyLjgzMzNDMTMuMTU0MSA2LjU3MTgzIDEzLjQxNjYgNi4zMDkzMyAxMy40MTY2IDUuOTg4NUMxMy40MTY2IDUuNjY3NjYgMTMuMTU0MSA1LjQwNTE2IDEyLjgzMzMgNS40MDUxNkgxMS42NjY2WiIgZmlsbD0iI0UzRTRFNSIvPgo8L2c+Cjwvc3ZnPgo=);
  --str-video__icon--qr-code: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjMiIGhlaWdodD0iMjMiIHZpZXdCb3g9IjAgMCAyMyAyMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMjA3MDMgNi4wNTg5M1Y4LjgwODkzSDYuNDU3MDNWNi4wNTg5M0g5LjIwNzAzWk0xMC41ODIgNC42ODM5M0g1LjA4MjAzVjEwLjE4MzlIMTAuNTgyVjQuNjgzOTNaTTkuMjA3MDMgMTMuMzkyM1YxNi4xNDIzSDYuNDU3MDNWMTMuMzkyM0g5LjIwNzAzWk0xMC41ODIgMTIuMDE3M0g1LjA4MjAzVjE3LjUxNzNIMTAuNTgyVjEyLjAxNzNaTTE2LjU0MDQgNi4wNTg5M1Y4LjgwODkzSDEzLjc5MDRWNi4wNTg5M0gxNi41NDA0Wk0xNy45MTU0IDQuNjgzOTNIMTIuNDE1NFYxMC4xODM5SDE3LjkxNTRWNC42ODM5M1pNMTIuNDE1NCAxMi4wMTczSDEzLjc5MDRWMTMuMzkyM0gxMi40MTU0VjEyLjAxNzNaTTEzLjc5MDQgMTMuMzkyM0gxNS4xNjU0VjE0Ljc2NzNIMTMuNzkwNFYxMy4zOTIzWk0xNS4xNjU0IDEyLjAxNzNIMTYuNTQwNFYxMy4zOTIzSDE1LjE2NTRWMTIuMDE3M1pNMTIuNDE1NCAxNC43NjczSDEzLjc5MDRWMTYuMTQyM0gxMi40MTU0VjE0Ljc2NzNaTTEzLjc5MDQgMTYuMTQyM0gxNS4xNjU0VjE3LjUxNzNIMTMuNzkwNFYxNi4xNDIzWk0xNS4xNjU0IDE0Ljc2NzNIMTYuNTQwNFYxNi4xNDIzSDE1LjE2NTRWMTQuNzY3M1pNMTYuNTQwNCAxMy4zOTIzSDE3LjkxNTRWMTQuNzY3M0gxNi41NDA0VjEzLjM5MjNaTTE2LjU0MDQgMTYuMTQyM0gxNy45MTU0VjE3LjUxNzNIMTYuNTQwNFYxNi4xNDIzWk0yMC42NjU0IDYuNTE3MjZIMTguODMyVjMuNzY3MjZIMTYuMDgyVjEuOTMzOTNIMjAuNjY1NFY2LjUxNzI2Wk0yMC42NjU0IDIwLjI2NzNWMTUuNjgzOUgxOC44MzJWMTguNDMzOUgxNi4wODJWMjAuMjY3M0gyMC42NjU0Wk0yLjMzMjAzIDIwLjI2NzNINi45MTUzNlYxOC40MzM5SDQuMTY1MzZWMTUuNjgzOUgyLjMzMjAzVjIwLjI2NzNaTTIuMzMyMDMgMS45MzM5M1Y2LjUxNzI2SDQuMTY1MzZWMy43NjcyNkg2LjkxNTM2VjEuOTMzOTNIMi4zMzIwM1oiIGZpbGw9IiNGQUZBRkEiLz4KPC9zdmc+Cg==);
  --str-video__icon--reactions: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIzIDQuNUMyMyA1LjA1IDIyLjU1IDUuNSAyMiA1LjVIMjFWNi41QzIxIDcuMDUgMjAuNTUgNy41IDIwIDcuNUMxOS40NSA3LjUgMTkgNy4wNSAxOSA2LjVWNS41SDE4QzE3LjQ1IDUuNSAxNyA1LjA1IDE3IDQuNUMxNyAzLjk1IDE3LjQ1IDMuNSAxOCAzLjVIMTlWMi41QzE5IDEuOTUgMTkuNDUgMS41IDIwIDEuNUMyMC41NSAxLjUgMjEgMS45NSAyMSAyLjVWMy41SDIyQzIyLjU1IDMuNSAyMyAzLjk1IDIzIDQuNVpNMjAuNTIgOS40NUMyMC44MyAxMC40MSAyMSAxMS40NCAyMSAxMi41QzIxIDE4LjAyIDE2LjUyIDIyLjUgMTEgMjIuNUM1LjQ4IDIyLjUgMSAxOC4wMiAxIDEyLjVDMSA2Ljk4IDUuNDggMi41IDExIDIuNUMxMi41IDIuNSAxMy45MiAyLjg0IDE1LjIgMy40NEMxNS4wOCAzLjc3IDE1IDQuMTIgMTUgNC41QzE1IDUuODUgMTUuOSA3IDE3LjEzIDcuMzdDMTcuNSA4LjYgMTguNjUgOS41IDIwIDkuNUMyMC4xOCA5LjUgMjAuMzUgOS40OCAyMC41MiA5LjQ1Wk02IDEwQzYgMTAuODMgNi42NyAxMS41IDcuNSAxMS41QzguMzMgMTEuNSA5IDEwLjgzIDkgMTBDOSA5LjE3IDguMzMgOC41IDcuNSA4LjVDNi42NyA4LjUgNiA5LjE3IDYgMTBaTTE1LjMxIDE0LjVINi42OUM2LjMxIDE0LjUgNi4wNiAxNC45MiA2LjI1IDE1LjI1QzcuMiAxNi44OSA4Ljk3IDE4IDExIDE4QzEzLjAzIDE4IDE0LjggMTYuODkgMTUuNzUgMTUuMjVDMTUuOTQgMTQuOTIgMTUuNyAxNC41IDE1LjMxIDE0LjVaTTE2IDEwQzE2IDkuMTcgMTUuMzMgOC41IDE0LjUgOC41QzEzLjY3IDguNSAxMyA5LjE3IDEzIDEwQzEzIDEwLjgzIDEzLjY3IDExLjUgMTQuNSAxMS41QzE1LjMzIDExLjUgMTYgMTAuODMgMTYgMTBaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--recording-off: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPGcgaWQ9IlZlY3RvciI+CjxwYXRoIGQ9Ik0xMiAyQzYuNDggMiAyIDYuNDggMiAxMkMyIDE3LjUyIDYuNDggMjIgMTIgMjJDMTcuNTIgMjIgMjIgMTcuNTIgMjIgMTJDMjIgNi40OCAxNy41MiAyIDEyIDJaTTEyIDIwQzcuNTggMjAgNCAxNi40MiA0IDEyQzQgNy41OCA3LjU4IDQgMTIgNEMxNi40MiA0IDIwIDcuNTggMjAgMTJDMjAgMTYuNDIgMTYuNDIgMjAgMTIgMjBaIiBmaWxsPSIjQjBCNEI3Ii8+CjxwYXRoIGQ9Ik0xMiAxN0MxNC43NjE0IDE3IDE3IDE0Ljc2MTQgMTcgMTJDMTcgOS4yMzg1OCAxNC43NjE0IDcgMTIgN0M5LjIzODU4IDcgNyA5LjIzODU4IDcgMTJDNyAxNC43NjE0IDkuMjM4NTggMTcgMTIgMTdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--recording-on: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwIDBDNC40OCAwIDAgNC40OCAwIDEwQzAgMTUuNTIgNC40OCAyMCAxMCAyMEMxNS41MiAyMCAyMCAxNS41MiAyMCAxMEMyMCA0LjQ4IDE1LjUyIDAgMTAgMFpNMTMgMTRIN0M2LjQ1IDE0IDYgMTMuNTUgNiAxM1Y3QzYgNi40NSA2LjQ1IDYgNyA2SDEzQzEzLjU1IDYgMTQgNi40NSAxNCA3VjEzQzE0IDEzLjU1IDEzLjU1IDE0IDEzIDE0WiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K);
  --str-video__icon--refresh: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOTIwIDE5MjAiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTk2MCAwdjIxMy4zMzNjNDExLjYyNyAwIDc0Ni42NjcgMzM0LjkzNCA3NDYuNjY3IDc0Ni42NjdTMTM3MS42MjcgMTcwNi42NjcgOTYwIDE3MDYuNjY3IDIxMy4zMzMgMTM3MS43MzMgMjEzLjMzMyA5NjBjMC0xOTcuMDEzIDc4LjQtMzgyLjUwNyAyMTMuMzM0LTUyMC43NDd2MjU0LjA4SDY0MFYxMDYuNjY3SDUzLjMzM1YzMjBoMTkxLjA0Qzg4LjY0IDQ5NC4wOCAwIDcyMC45NiAwIDk2MGMwIDUyOS4yOCA0MzAuNjEzIDk2MCA5NjAgOTYwczk2MC00MzAuNzIgOTYwLTk2MFMxNDg5LjM4NyAwIDk2MCAwIi8+PC9zdmc+Cg==);
  --str-video__icon--screen-share-off: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIwIDE4QzIxLjEgMTggMjIgMTcuMSAyMiAxNlY2QzIyIDQuOSAyMS4xIDQgMjAgNEg0QzIuOSA0IDIgNC45IDIgNlYxNkMyIDE3LjEgMi44OSAxOCA0IDE4SDFDMC40NSAxOCAwIDE4LjQ1IDAgMTlDMCAxOS41NSAwLjQ1IDIwIDEgMjBIMjNDMjMuNTUgMjAgMjQgMTkuNTUgMjQgMTlDMjQgMTguNDUgMjMuNTUgMTggMjMgMThIMjBaTTEzIDE0LjQ3VjEyLjI4QzEwLjIyIDEyLjI4IDguMzkgMTMuMTMgNyAxNUM3LjU2IDEyLjMzIDkuMTEgOS42NyAxMyA5LjEzVjdMMTYuNjEgMTAuMzZDMTYuODIgMTAuNTYgMTYuODIgMTAuODkgMTYuNjEgMTEuMDlMMTMgMTQuNDdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--screen-share-on: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPU91dGxpbmVkIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIwIDE4QzIxLjEgMTggMjEuOTkgMTcuMSAyMS45OSAxNkwyMiA2QzIyIDQuODkgMjEuMSA0IDIwIDRINEMyLjg5IDQgMiA0Ljg5IDIgNlYxNkMyIDE3LjEgMi44OSAxOCA0IDE4SDBWMjBIMjRWMThIMjBaTTQgMTZWNkgyMFYxNi4wMUw0IDE2Wk0xMyA5LjEzQzkuMTEgOS42NyA3LjU2IDEyLjMzIDcgMTVDOC4zOSAxMy4xMyAxMC4yMiAxMi4yOCAxMyAxMi4yOFYxNC40N0wxNyAxMC43M0wxMyA3VjkuMTNaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--settings: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE5LjQ5OTcgMTJDMTkuNDk5NyAxMS43NyAxOS40ODk3IDExLjU1IDE5LjQ2OTcgMTEuMzJMMjEuMzI5NyA5LjkxQzIxLjcyOTcgOS42MSAyMS44Mzk3IDkuMDUgMjEuNTg5NyA4LjYxTDE5LjcxOTcgNS4zOEMxOS40Njk3IDQuOTQgMTguOTI5NyA0Ljc2IDE4LjQ2OTcgNC45NkwxNi4zMTk3IDUuODdDMTUuOTQ5NyA1LjYxIDE1LjU1OTcgNS4zOCAxNS4xNDk3IDUuMTlMMTQuODU5NyAyLjg4QzE0Ljc5OTcgMi4zOCAxNC4zNjk3IDIgMTMuODY5NyAySDEwLjEzOTdDOS42Mjk2NyAyIDkuMTk5NjcgMi4zOCA5LjEzOTY3IDIuODhMOC44NDk2NyA1LjE5QzguNDM5NjcgNS4zOCA4LjA0OTY2IDUuNjEgNy42Nzk2NyA1Ljg3TDUuNTI5NjcgNC45NkM1LjA2OTY3IDQuNzYgNC41Mjk2NyA0Ljk0IDQuMjc5NjcgNS4zOEwyLjQwOTY3IDguNjJDMi4xNTk2NyA5LjA2IDIuMjY5NjcgOS42MSAyLjY2OTY3IDkuOTJMNC41Mjk2NyAxMS4zM0M0LjUwOTY3IDExLjU1IDQuNDk5NjcgMTEuNzcgNC40OTk2NyAxMkM0LjQ5OTY3IDEyLjIzIDQuNTA5NjcgMTIuNDUgNC41Mjk2NyAxMi42OEwyLjY2OTY3IDE0LjA5QzIuMjY5NjcgMTQuMzkgMi4xNTk2NyAxNC45NSAyLjQwOTY3IDE1LjM5TDQuMjc5NjcgMTguNjJDNC41Mjk2NyAxOS4wNiA1LjA2OTY3IDE5LjI0IDUuNTI5NjcgMTkuMDRMNy42Nzk2NyAxOC4xM0M4LjA0OTY2IDE4LjM5IDguNDM5NjcgMTguNjIgOC44NDk2NyAxOC44MUw5LjEzOTY3IDIxLjEyQzkuMTk5NjcgMjEuNjIgOS42Mjk2NyAyMiAxMC4xMjk3IDIySDEzLjg1OTdDMTQuMzU5NyAyMiAxNC43ODk3IDIxLjYyIDE0Ljg0OTcgMjEuMTJMMTUuMTM5NyAxOC44MUMxNS41NDk3IDE4LjYyIDE1LjkzOTcgMTguMzkgMTYuMzA5NyAxOC4xM0wxOC40NTk3IDE5LjA0QzE4LjkxOTcgMTkuMjQgMTkuNDU5NyAxOS4wNiAxOS43MDk3IDE4LjYyTDIxLjU3OTcgMTUuMzlDMjEuODI5NyAxNC45NSAyMS43MTk3IDE0LjQgMjEuMzE5NyAxNC4wOUwxOS40NTk3IDEyLjY4QzE5LjQ4OTcgMTIuNDUgMTkuNDk5NyAxMi4yMyAxOS40OTk3IDEyWk0xMi4wMzk3IDE1LjVDMTAuMTA5NyAxNS41IDguNTM5NjcgMTMuOTMgOC41Mzk2NyAxMkM4LjUzOTY3IDEwLjA3IDEwLjEwOTcgOC41IDEyLjAzOTcgOC41QzEzLjk2OTcgOC41IDE1LjUzOTcgMTAuMDcgMTUuNTM5NyAxMkMxNS41Mzk3IDEzLjkzIDEzLjk2OTcgMTUuNSAxMi4wMzk3IDE1LjVaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--speaker: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTMgMTAuMDAxOFYxNC4wMDE4QzMgMTQuNTUxOCAzLjQ1IDE1LjAwMTggNCAxNS4wMDE4SDdMMTAuMjkgMTguMjkxOEMxMC45MiAxOC45MjE4IDEyIDE4LjQ3MTggMTIgMTcuNTgxOFY2LjQxMTc5QzEyIDUuNTIxNzkgMTAuOTIgNS4wNzE3OSAxMC4yOSA1LjcwMTc5TDcgOS4wMDE3OUg0QzMuNDUgOS4wMDE3OSAzIDkuNDUxNzkgMyAxMC4wMDE4Wk0xNi41IDEyLjAwMThDMTYuNSAxMC4yMzE4IDE1LjQ4IDguNzExNzkgMTQgNy45NzE3OVYxNi4wMjE4QzE1LjQ4IDE1LjI5MTggMTYuNSAxMy43NzE4IDE2LjUgMTIuMDAxOFpNMTQgNC40NTE3OVY0LjY1MTc5QzE0IDUuMDMxNzkgMTQuMjUgNS4zNjE3OSAxNC42IDUuNTAxNzlDMTcuMTggNi41MzE3OSAxOSA5LjA2MTc5IDE5IDEyLjAwMThDMTkgMTQuOTQxOCAxNy4xOCAxNy40NzE4IDE0LjYgMTguNTAxOEMxNC4yNCAxOC42NDE4IDE0IDE4Ljk3MTggMTQgMTkuMzUxOFYxOS41NTE4QzE0IDIwLjE4MTggMTQuNjMgMjAuNjIxOCAxNS4yMSAyMC40MDE4QzE4LjYgMTkuMTExOCAyMSAxNS44NDE4IDIxIDEyLjAwMThDMjEgOC4xNjE3OSAxOC42IDQuODkxNzkgMTUuMjEgMy42MDE3OUMxNC42MyAzLjM3MTc5IDE0IDMuODIxNzkgMTQgNC40NTE3OVoiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--stats: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTEzLjg5MTEgMTAuNTQ3NUwxMi44MzExIDEwLjA1NzVDMTIuNDQxMSA5Ljg3NzQ2IDEyLjQ0MTEgOS4zMjc0NiAxMi44MzExIDkuMTQ3NDZMMTMuODkxMSA4LjY1NzQ2TDE0LjM4MTEgNy42MDc0NkMxNC41NjExIDcuMjE3NDYgMTUuMTExMSA3LjIxNzQ2IDE1LjI5MTEgNy42MDc0NkwxNS43ODExIDguNjY3NDZMMTYuODMxMSA5LjE1NzQ2QzE3LjIyMTEgOS4zMzc0NiAxNy4yMjExIDkuODg3NDYgMTYuODMxMSAxMC4wNjc1TDE1Ljc3MTEgMTAuNTU3NUwxNS4yODExIDExLjYwNzVDMTUuMTAxMSAxMS45OTc1IDE0LjU1MTEgMTEuOTk3NSAxNC4zNzExIDExLjYwNzVMMTMuODkxMSAxMC41NDc1Wk00LjI4MTA3IDEzLjYwNzVMNC43NzEwNyAxMi41NDc1TDUuODMxMDcgMTIuMDU3NUM2LjIyMTA3IDExLjg3NzUgNi4yMjEwNyAxMS4zMjc1IDUuODMxMDcgMTEuMTQ3NUw0Ljc3MTA3IDEwLjY1NzVMNC4yODEwNyA5LjYwNzQ2QzQuMTExMDcgOS4yMTc0NiAzLjU1MTA3IDkuMjE3NDYgMy4zODEwNyA5LjYwNzQ2TDIuODkxMDcgMTAuNjY3NUwxLjgzMTA3IDExLjE1NzVDMS40NDEwNyAxMS4zMzc1IDEuNDQxMDcgMTEuODg3NSAxLjgzMTA3IDEyLjA2NzVMMi44OTEwNyAxMi41NTc1TDMuMzgxMDcgMTMuNjA3NUMzLjU1MTA3IDEzLjk5NzUgNC4xMTEwNyAxMy45OTc1IDQuMjgxMDcgMTMuNjA3NVpNOC43OTEwNyA4LjU5NzQ2TDkuNDIxMDcgNy4xOTc0NkwxMC44MjExIDYuNTY3NDZDMTEuMjExMSA2LjM4NzQ2IDExLjIxMTEgNS44Mzc0NiAxMC44MjExIDUuNjU3NDZMOS40MjEwNyA1LjAyNzQ2TDguNzkxMDcgMy42Mjc0NkM4LjYxMTA3IDMuMjM3NDYgOC4wNjEwNyAzLjIzNzQ2IDcuODgxMDcgMy42Mjc0Nkw3LjI1MTA3IDUuMDI3NDZMNS44NTEwNyA1LjY1NzQ2QzUuNDYxMDcgNS44Mzc0NiA1LjQ2MTA3IDYuMzg3NDYgNS44NTEwNyA2LjU2NzQ2TDcuMjUxMDcgNy4xOTc0Nkw3Ljg4MTA3IDguNTk3NDZDOC4wNTEwNyA4Ljk4NzQ2IDguNjExMDcgOC45ODc0NiA4Ljc5MTA3IDguNTk3NDZaTTIyLjE3MTEgOC44Nzc0NkMyMS43NzExIDguNDc3NDYgMjEuMTAxMSA4LjQ4NzQ2IDIwLjcyMTEgOC45MTc0NkwxNC4zMzExIDE2LjA5NzVMMTEuMDQxMSAxMi44MDc1QzEwLjY1MTEgMTIuNDE3NSAxMC4wMjExIDEyLjQxNzUgOS42MzEwNyAxMi44MDc1TDMuNTkxMDcgMTguODU3NUMzLjE4MTA3IDE5LjI2NzUgMy4xODEwNyAxOS45NDc1IDMuNTkxMDcgMjAuMzU3NUM0LjAwMTA3IDIwLjc2NzUgNC42ODEwNyAyMC43Njc1IDUuMDkxMDcgMjAuMzU3NUwxMC4zNDExIDE1LjA5NzVMMTMuNTkxMSAxOC4zNDc1QzE0LjAwMTEgMTguNzU3NSAxNC42NjExIDE4LjczNzUgMTUuMDQxMSAxOC4zMDc1TDIyLjIxMTEgMTAuMjM3NUMyMi41NjExIDkuODQ3NDYgMjIuNTQxMSA5LjI0NzQ2IDIyLjE3MTEgOC44Nzc0NloiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K);
  --str-video__icon--star: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1LjA4NzggOS42MTE1NUwxMy41NTY1IDQuNzcxNTVDMTMuMjU0NSAzLjgyMTU1IDExLjg1ODYgMy44MjE1NSAxMS41NjcgNC43NzE1NUwxMC4wMjUzIDkuNjExNTVINS4zODk4OEM0LjM3OTQ2IDkuNjExNTUgMy45NjI4IDEwLjg2MTYgNC43ODU3MSAxMS40MjE2TDguNTc3MzggMTQuMDIxNkw3LjA4NzggMTguNjMxNkM2Ljc4NTcxIDE5LjU2MTYgNy45MTA3MSAyMC4zMTE2IDguNzEyOCAxOS43MjE2TDEyLjU1NjUgMTYuOTIxNkwxNi40MDAzIDE5LjczMTZDMTcuMjAyNCAyMC4zMjE2IDE4LjMyNzQgMTkuNTcxNiAxOC4wMjUzIDE4LjY0MTZMMTYuNTM1NyAxNC4wMzE2TDIwLjMyNzQgMTEuNDMxNkMyMS4xNTAzIDEwLjg2MTYgMjAuNzMzNiA5LjYyMTU1IDE5LjcyMzIgOS42MjE1NUgxNS4wODc4VjkuNjExNTVaIiBmaWxsPSIjRkZENjQ2Ii8+Cjwvc3ZnPgo=);
  --str-video__icon--support-agent: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3LjUwMTMgMTAuMTgzM0MxNy41MDEzIDUuNjA4MzMgMTMuOTUxMyAyLjUgMTAuMDAxMyAyLjVDNi4wOTI5NyAyLjUgMi41MDEzIDUuNTQxNjcgMi41MDEzIDEwLjIzMzNDMi4wMDEzIDEwLjUxNjcgMS42Njc5NyAxMS4wNSAxLjY2Nzk3IDExLjY2NjdWMTMuMzMzM0MxLjY2Nzk3IDE0LjI1IDIuNDE3OTcgMTUgMy4zMzQ2NCAxNUMzLjc5Mjk3IDE1IDQuMTY3OTcgMTQuNjI1IDQuMTY3OTcgMTQuMTY2N1YxMC4xNTgzQzQuMTY3OTcgNi45NjY2NyA2LjYyNjMgNC4xNzUgOS44MTc5NyA0LjA4MzMzQzEzLjExOCAzLjk4MzMzIDE1LjgzNDYgNi42MzMzMyAxNS44MzQ2IDkuOTE2NjdWMTUuODMzM0gxMC4wMDEzQzkuNTQyOTcgMTUuODMzMyA5LjE2Nzk3IDE2LjIwODMgOS4xNjc5NyAxNi42NjY3QzkuMTY3OTcgMTcuMTI1IDkuNTQyOTcgMTcuNSAxMC4wMDEzIDE3LjVIMTUuODM0NkMxNi43NTEzIDE3LjUgMTcuNTAxMyAxNi43NSAxNy41MDEzIDE1LjgzMzNWMTQuODE2N0MxNy45OTMgMTQuNTU4MyAxOC4zMzQ2IDE0LjA1IDE4LjMzNDYgMTMuNDVWMTEuNTMzM0MxOC4zMzQ2IDEwLjk1IDE3Ljk5MyAxMC40NDE3IDE3LjUwMTMgMTAuMTgzM1oiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTcuNTAxMyAxMS42NjY3QzcuOTYxNTQgMTEuNjY2NyA4LjMzNDY0IDExLjI5MzYgOC4zMzQ2NCAxMC44MzMzQzguMzM0NjQgMTAuMzczMSA3Ljk2MTU0IDEwIDcuNTAxMyAxMEM3LjA0MTA3IDEwIDYuNjY3OTcgMTAuMzczMSA2LjY2Nzk3IDEwLjgzMzNDNi42Njc5NyAxMS4yOTM2IDcuMDQxMDcgMTEuNjY2NyA3LjUwMTMgMTEuNjY2N1oiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTEyLjUwMTMgMTEuNjY2N0MxMi45NjE1IDExLjY2NjcgMTMuMzM0NiAxMS4yOTM2IDEzLjMzNDYgMTAuODMzM0MxMy4zMzQ2IDEwLjM3MzEgMTIuOTYxNSAxMCAxMi41MDEzIDEwQzEyLjA0MTEgMTAgMTEuNjY4IDEwLjM3MzEgMTEuNjY4IDEwLjgzMzNDMTEuNjY4IDExLjI5MzYgMTIuMDQxMSAxMS42NjY3IDEyLjUwMTMgMTEuNjY2N1oiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTE1LjAwMTMgOS4xOTE2N0MxNC42MDEzIDYuODE2NjcgMTIuNTM0NiA1IDEwLjA0MyA1QzcuNTE3OTcgNSA0LjgwMTMgNy4wOTE2NyA1LjAxNzk3IDEwLjM3NUM3LjA3NjMgOS41MzMzMyA4LjYyNjMgNy43IDkuMDY3OTcgNS40NjY2N0MxMC4xNTk2IDcuNjU4MzMgMTIuNDAxMyA5LjE2NjY3IDE1LjAwMTMgOS4xOTE2N1oiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--user-plus: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxNSAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xMi40OTkgMy42MjQwMlYxLjc0OTAySDExLjI0OVYzLjYyNDAySDkuMzc0MDJWNC44NzQwMkgxMS4yNDlWNi43NDkwMkgxMi40OTlWNC44NzQwMkgxNC4zNzRWMy42MjQwMkgxMi40OTlaTTUuNjI0MDIgNS40OTkwMkM3LjAwNTI3IDUuNDk5MDIgOC4xMjQwMiA0LjM4MDI3IDguMTI0MDIgMi45OTkwMkM4LjEyNDAyIDEuNjE3NzcgNy4wMDUyNyAwLjQ5OTAyMyA1LjYyNDAyIDAuNDk5MDIzQzQuMjQyNzcgMC40OTkwMjMgMy4xMjQwMiAxLjYxNzc3IDMuMTI0MDIgMi45OTkwMkMzLjEyNDAyIDQuMzgwMjcgNC4yNDI3NyA1LjQ5OTAyIDUuNjI0MDIgNS40OTkwMlpNNS42MjQwMiAxLjc0OTAyQzYuMzExNTIgMS43NDkwMiA2Ljg3NDAyIDIuMzExNTIgNi44NzQwMiAyLjk5OTAyQzYuODc0MDIgMy42ODY1MiA2LjMxMTUyIDQuMjQ5MDIgNS42MjQwMiA0LjI0OTAyQzQuOTM2NTIgNC4yNDkwMiA0LjM3NDAyIDMuNjg2NTIgNC4zNzQwMiAyLjk5OTAyQzQuMzc0MDIgMi4zMTE1MiA0LjkzNjUyIDEuNzQ5MDIgNS42MjQwMiAxLjc0OTAyWk05LjYxNzc3IDcuMDk5MDJDOC41Njc3NyA2LjU2MTUyIDcuMjA1MjcgNi4xMjQwMiA1LjYyNDAyIDYuMTI0MDJDNC4wNDI3NyA2LjEyNDAyIDIuNjgwMjcgNi41NjE1MiAxLjYzMDI3IDcuMDk5MDJDMS4wMDUyNyA3LjQxNzc3IDAuNjI0MDIzIDguMDYxNTIgMC42MjQwMjMgOC43NjE1MlYxMC40OTlIMTAuNjI0VjguNzYxNTJDMTAuNjI0IDguMDYxNTIgMTAuMjQyOCA3LjQxNzc3IDkuNjE3NzcgNy4wOTkwMlpNOS4zNzQwMiA5LjI0OTAySDEuODc0MDJWOC43NjE1MkMxLjg3NDAyIDguNTI0MDIgMS45OTkwMiA4LjMxMTUyIDIuMTk5MDIgOC4yMTE1MkMyLjk0Mjc3IDcuODMwMjcgNC4xNDI3NyA3LjM3NDAyIDUuNjI0MDIgNy4zNzQwMkM3LjEwNTI3IDcuMzc0MDIgOC4zMDUyNyA3LjgzMDI3IDkuMDQ5MDIgOC4yMTE1MkM5LjI0OTAyIDguMzExNTIgOS4zNzQwMiA4LjUyNDAyIDkuMzc0MDIgOC43NjE1MlY5LjI0OTAyWiIgZmlsbD0iI0Y3RjdGOCIvPgo8L3N2Zz4K);
  --str-video__icon--verified: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMzI1IDEuMDU1MjVMMy40OTE2NyAzLjY0NjkyQzIuODkxNjcgMy45MTM1OCAyLjUgNC41MTM1OCAyLjUgNS4xNzE5MlY5LjA4ODU4QzIuNSAxMy43MTM2IDUuNyAxOC4wMzg2IDEwIDE5LjA4ODZDMTQuMyAxOC4wMzg2IDE3LjUgMTMuNzEzNiAxNy41IDkuMDg4NThWNS4xNzE5MkMxNy41IDQuNTEzNTggMTcuMTA4MyAzLjkxMzU4IDE2LjUwODMgMy42NDY5MkwxMC42NzUgMS4wNTUyNUMxMC4yNSAwLjg2MzU4MiA5Ljc1IDAuODYzNTgyIDkuMzI1IDEuMDU1MjVaTTcuNzQxNjcgMTMuNDk2OUw1LjU4MzMzIDExLjMzODZDNS4yNTgzMyAxMS4wMTM2IDUuMjU4MzMgMTAuNDg4NiA1LjU4MzMzIDEwLjE2MzZDNS45MDgzMyA5LjgzODU4IDYuNDMzMzMgOS44Mzg1OCA2Ljc1ODMzIDEwLjE2MzZMOC4zMzMzMyAxMS43MzAyTDEzLjIzMzMgNi44MzAyNUMxMy41NTgzIDYuNTA1MjUgMTQuMDgzMyA2LjUwNTI1IDE0LjQwODMgNi44MzAyNUMxNC43MzMzIDcuMTU1MjUgMTQuNzMzMyA3LjY4MDI1IDE0LjQwODMgOC4wMDUyNUw4LjkxNjY3IDEzLjQ5NjlDOC42IDEzLjgyMTkgOC4wNjY2NyAxMy44MjE5IDcuNzQxNjcgMTMuNDk2OVoiIGZpbGw9IiMwMEUyQTEiLz4KPC9zdmc+Cg==);
  --str-video__icon--paperclip: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE2IDYuNzQ3NThWMTcuMzI3NkMxNiAxOS40MTc2IDE0LjQ3IDIxLjI3NzYgMTIuMzkgMjEuNDc3NkMxMCAyMS43MDc2IDggMTkuODM3NiA4IDE3LjQ5NzZWNS4xMzc1OEM4IDMuODI3NTggOC45NCAyLjYzNzU4IDEwLjI0IDIuNTA3NThDMTEuNzQgMi4zNTc1OCAxMyAzLjUyNzU4IDEzIDQuOTk3NThWMTUuNDk3NkMxMyAxNi4wNDc2IDEyLjU1IDE2LjQ5NzYgMTIgMTYuNDk3NkMxMS40NSAxNi40OTc2IDExIDE2LjA0NzYgMTEgMTUuNDk3NlY2Ljc0NzU4QzExIDYuMzM3NTggMTAuNjYgNS45OTc1OCAxMC4yNSA1Ljk5NzU4QzkuODQgNS45OTc1OCA5LjUgNi4zMzc1OCA5LjUgNi43NDc1OFYxNS4zNTc2QzkuNSAxNi42Njc2IDEwLjQ0IDE3Ljg1NzYgMTEuNzQgMTcuOTg3NkMxMy4yNCAxOC4xMzc2IDE0LjUgMTYuOTY3NiAxNC41IDE1LjQ5NzZWNS4xNjc1OEMxNC41IDMuMDc3NTggMTIuOTcgMS4yMTc1OCAxMC44OSAxLjAxNzU4QzguNTEgMC43ODc1ODMgNi41IDIuNjU3NTggNi41IDQuOTk3NThWMTcuMjY3NkM2LjUgMjAuMTM3NiA4LjYgMjIuNzA3NiAxMS40NiAyMi45Nzc2QzE0Ljc1IDIzLjI3NzYgMTcuNSAyMC43MTc2IDE3LjUgMTcuNDk3NlY2Ljc0NzU4QzE3LjUgNi4zMzc1OCAxNy4xNiA1Ljk5NzU4IDE2Ljc1IDUuOTk3NThDMTYuMzQgNS45OTc1OCAxNiA2LjMzNzU4IDE2IDYuNzQ3NThaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==);
  --str-video__icon--person-off: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjMiIGhlaWdodD0iMjMiIHZpZXdCb3g9IjAgMCAyMyAyMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5LjQ4NDkgMTYuMDcwNUwxNi4zOTU4IDEyLjk3MjFDMTYuOTgyNCAxMy4xNzM4IDE3LjUyMzMgMTMuNDEyMSAxOC4wMTgzIDEzLjY2ODhDMTguOTA3NCAxNC4xMzYzIDE5LjQ2NjYgMTUuMDYyMSAxOS40ODQ5IDE2LjA3MDVaTTIwLjU3NTggMTkuNzU1NUwxOS4yODMzIDIxLjA0OEwxNi44OTA4IDE4LjY2NDZINC44MTgyOFYxNi4xMTYzQzQuODE4MjggMTUuMDg5NiA1LjM3NzQ1IDE0LjE0NTUgNi4yOTQxMSAxMy42NzhDNy40NzY2MSAxMy4wNzMgOC45MjQ5NSAxMi41NTk2IDEwLjU3NDkgMTIuMzQ4OEwyLjQyNTc4IDQuMTk5NjNMMy43MTgyOCAyLjkwNzE0TDIwLjU3NTggMTkuNzU1NVpNMTUuMDU3NCAxNi44MzEzTDEyLjMwNzQgMTQuMDgxM0MxMi4yNTI0IDE0LjA4MTMgMTIuMjA2NiAxNC4wODEzIDEyLjE1MTYgMTQuMDgxM0M5Ljk3OTExIDE0LjA4MTMgOC4yMTkxMSAxNC43NTA1IDcuMTI4MjggMTUuMzA5NkM2LjgzNDk1IDE1LjQ1NjMgNi42NTE2MSAxNS43NjggNi42NTE2MSAxNi4xMTYzVjE2LjgzMTNIMTUuMDU3NFpNMTIuMTUxNiA1LjgzMTNDMTMuMTU5OSA1LjgzMTMgMTMuOTg0OSA2LjY1NjMgMTMuOTg0OSA3LjY2NDY0QzEzLjk4NDkgOC40NTI5NyAxMy40ODk5IDkuMTIyMTQgMTIuNzkzMyA5LjM3ODhMMTQuMTQ5OSAxMC43MzU1QzE1LjE1ODMgMTAuMDg0NiAxNS44MTgzIDguOTQ3OTcgMTUuODE4MyA3LjY2NDY0QzE1LjgxODMgNS42Mzg4IDE0LjE3NzQgMy45OTc5NyAxMi4xNTE2IDMuOTk3OTdDMTAuODY4MyAzLjk5Nzk3IDkuNzMxNjEgNC42NTc5NyA5LjA4MDc4IDUuNjY2M0wxMC40Mzc0IDcuMDIyOTdDMTAuNjk0MSA2LjMyNjMgMTEuMzYzMyA1LjgzMTMgMTIuMTUxNiA1LjgzMTNaIiBmaWxsPSIjRkFGQUZBIi8+Cjwvc3ZnPgo=);
  --str-video__icon--pin: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xOSAxMi44N0MxOSAxMi40IDE4LjY2IDEyLjAyIDE4LjIgMTEuODlDMTYuOTMgMTEuNTQgMTYgMTAuMzggMTYgOVY0SDE3QzE3LjU1IDQgMTggMy41NSAxOCAzQzE4IDIuNDUgMTcuNTUgMiAxNyAySDdDNi40NSAyIDYgMi40NSA2IDNDNiAzLjU1IDYuNDUgNCA3IDRIOFY5QzggMTAuMzggNy4wNyAxMS41NCA1LjggMTEuODlDNS4zNCAxMi4wMiA1IDEyLjQgNSAxMi44N1YxM0M1IDEzLjU1IDUuNDUgMTQgNiAxNEgxMC45OEwxMSAyMUMxMSAyMS41NSAxMS40NSAyMiAxMiAyMkMxMi41NSAyMiAxMyAyMS41NSAxMyAyMUwxMi45OCAxNEgxOEMxOC41NSAxNCAxOSAxMy41NSAxOSAxM1YxMi44N1oiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==);
  --str-video__icon--provider-google: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzk1MV81NjAwMykiPgo8cGF0aCBkPSJNMTguOCAxMS4xODU5QzE4LjggMTAuNTM1OSAxOC43NDE3IDkuOTEwODggMTguNjMzMyA5LjMxMDg4SDEwVjEyLjg2MDlIMTQuOTMzM0MxNC43MTY3IDE0LjAwMjUgMTQuMDY2NyAxNC45NjkyIDEzLjA5MTcgMTUuNjE5MlYxNy45Mjc1SDE2LjA2NjdDMTcuOCAxNi4zMjc1IDE4LjggMTMuOTc3NSAxOC44IDExLjE4NTlaIiBmaWxsPSIjNDI4NUY0Ii8+CjxwYXRoIGQ9Ik05Ljk5OTc0IDIwLjE0NDJDMTIuNDc0NyAyMC4xNDQyIDE0LjU0OTcgMTkuMzI3NSAxNi4wNjY0IDE3LjkyNzVMMTMuMDkxNCAxNS42MTkyQzEyLjI3NDcgMTYuMTY5MiAxMS4yMzMxIDE2LjUwMjUgOS45OTk3NCAxNi41MDI1QzcuNjE2NDEgMTYuNTAyNSA1LjU5MTQxIDE0Ljg5NDIgNC44NjY0MSAxMi43Mjc1SDEuODE2NDFWMTUuMDk0MkMzLjMyNDc0IDE4LjA4NTkgNi40MTY0MSAyMC4xNDQyIDkuOTk5NzQgMjAuMTQ0MloiIGZpbGw9IiMzNEE4NTMiLz4KPHBhdGggZD0iTTQuODY1MzYgMTIuNzE5MkM0LjY4MjAzIDEyLjE2OTIgNC41NzM3IDExLjU4NTkgNC41NzM3IDEwLjk3NzVDNC41NzM3IDEwLjM2OTIgNC42ODIwMyA5Ljc4NTg3IDQuODY1MzYgOS4yMzU4N1Y2Ljg2OTJIMS44MTUzNkMxLjE5MDM2IDguMTAyNTQgMC44MzIwMzEgOS40OTQyIDAuODMyMDMxIDEwLjk3NzVDMC44MzIwMzEgMTIuNDYwOSAxLjE5MDM2IDEzLjg1MjUgMS44MTUzNiAxNS4wODU5TDQuMTkwMzYgMTMuMjM1OUw0Ljg2NTM2IDEyLjcxOTJaIiBmaWxsPSIjRkJCQzA1Ii8+CjxwYXRoIGQ9Ik05Ljk5OTc0IDUuNDYwODhDMTEuMzQ5NyA1LjQ2MDg4IDEyLjU0OTcgNS45Mjc1NSAxMy41MDgxIDYuODI3NTVMMTYuMTMzMSA0LjIwMjU1QzE0LjU0MTQgMi43MTkyMiAxMi40NzQ3IDEuODEwODggOS45OTk3NCAxLjgxMDg4QzYuNDE2NDEgMS44MTA4OCAzLjMyNDc0IDMuODY5MjIgMS44MTY0MSA2Ljg2OTIyTDQuODY2NDEgOS4yMzU4OEM1LjU5MTQxIDcuMDY5MjIgNy42MTY0MSA1LjQ2MDg4IDkuOTk5NzQgNS40NjA4OFoiIGZpbGw9IiNFQTQzMzUiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF85NTFfNTYwMDMiPgo8cmVjdCB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IndoaXRlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDAuOTc3NTM5KSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=);
  --str-video__icon--no-audio: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAyMCAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjMzNjI5IDAuNzcyNzA5TDkuNzQ5MjQgMC40NDI2MTNDOS45MzYxNCAwLjI5MjkyOSAxMC4yMTE5IDAuMzE5NTk2IDEwLjM2NTEgMC41MDIxNzZDMTAuNDI5MyAwLjU3ODY3NyAxMC40NjQ0IDAuNjc0NTYzIDEwLjQ2NDMgMC43NzM0ODdWMS4zMzU0NlYxLjMzNzE1VjEuODY0NDdWMS45MjUyM1YxMy4yMDcyVjEzLjI2ODFWMTMuNzk1NVYxMy43OTcxVjE0LjM1OUMxMC40NjQ0IDE0LjU5NTEgMTAuMjY4NiAxNC43ODY2IDEwLjAyNjkgMTQuNzg2OEM5LjkyNTY4IDE0Ljc4NjggOS44Mjc1MyAxNC43NTI2IDkuNzQ5MjIgMTQuNjg5OUw5LjMzNjI2IDE0LjM1OTdMOS4zMzUzOSAxNC4zNTlMOC45MDg2MSAxNC4wMTc4TDguODU5NzMgMTMuOTc4N0w1LjExNjcyIDEwLjk4NjFMNS4xMTU4NSAxMC45ODYxSDEuNzEyMTNDMS4yMjg3NiAxMC45ODYxIDAuODM2OTE0IDEwLjYwMzMgMC44MzY5MTQgMTAuMTMxMlY1LjAwMTMzQzAuODM2OTE0IDQuNTI5MTQgMS4yMjg3NiA0LjE0NjM1IDEuNzEyMTMgNC4xNDYzNUg1LjExNTg1TDguODU5NzMgMS4xNTM2NUw4LjkwOTY0IDEuMTEzNzVMOS4zMzUzMiAwLjc3MzQ4N0w5LjMzNjI5IDAuNzcyNzA5Wk02LjExNzcyIDUuMzk5N0w4Ljg1OTczIDMuMjA3ODVWMTEuOTI0M0w2LjExODcxIDkuNzMyODhMNS42Nzg2NSA5LjM4MTA1TDUuMTE1ODUgOS4zODE1N0g1LjExNTIzTDUuMTE0MzYgOS4zODE1N0wyLjQ0MTQ4IDkuMzgxNTdWNS43NTA5Mkg1LjExNTg1SDUuNjc4MzRMNi4xMTc3MiA1LjM5OTdaTTE5LjUyNDQgOS44NjQ0NkwxNy4yMjYyIDcuNTY2MjRMMTkuNTI0NCA1LjI2ODAxQzE5LjgzNzcgNC45NTQ3IDE5LjgzMiA0LjQ0MTA4IDE5LjUxODcgNC4xMjc3N0MxOS4yMDU0IDMuODE0NDYgMTguNjkxOCAzLjgwODgyIDE4LjM3ODUgNC4xMjIxM0wxNi4wODAzIDYuNDIwMzVMMTMuNzgyIDQuMTIyMTNDMTMuNDY4NyAzLjgwODgyIDEyLjk1NTEgMy44MTQ0NiAxMi42NDE4IDQuMTI3NzdDMTIuMzI4NSA0LjQ0MTA4IDEyLjMyMjggNC45NTQ3IDEyLjYzNjIgNS4yNjgwMUwxNC45MzQ0IDcuNTY2MjRMMTIuNjM2MiA5Ljg2NDQ2QzEyLjMyMjggMTAuMTc3OCAxMi4zMjg1IDEwLjY5MTQgMTIuNjQxOCAxMS4wMDQ3QzEyLjk1NTEgMTEuMzE4IDEzLjQ2ODcgMTEuMzIzNyAxMy43ODIgMTEuMDEwM0wxNi4wODAzIDguNzEyMTJMMTguMzc4NSAxMS4wMTAzQzE4LjY5MTggMTEuMzIzNyAxOS4yMDU0IDExLjMxOCAxOS41MTg3IDExLjAwNDdDMTkuODMyIDEwLjY5MTQgMTkuODM3NyAxMC4xNzc4IDE5LjUyNDQgOS44NjQ0NloiIGZpbGw9IiM3Mjc2N0UiLz4KPC9zdmc+Cg==);
  --str-video__icon--camera-off-outline: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuODUxMzggNS41MDk5OUw1LjI0NjgyIDMuOTA1NDNMMS45MTczNSAwLjU4Mzk4NEwwLjc4NjEzMyAxLjcxNTJMMi45NzYzNiAzLjkwNTQzSDIuMzkwN0MxLjk0OTQ0IDMuOTA1NDMgMS41ODg0MSA0LjI2NjQ2IDEuNTg4NDEgNC43MDc3MVYxMi43MzA1QzEuNTg4NDEgMTMuMTcxOCAxLjk0OTQ0IDEzLjUzMjggMi4zOTA3IDEzLjUzMjhIMTIuMDE4MUMxMi4xODY2IDEzLjUzMjggMTIuMzMxIDEzLjQ2ODYgMTIuNDU5MyAxMy4zODg0TDE1LjAxMDYgMTUuOTM5N0wxNi4xNDE4IDE0LjgwODRMOS4wMzM1OSA3LjcwMDIyTDYuODUxMzggNS41MDk5OVpNMy4xOTI5OCAxMS45MjgyVjUuNTA5OTlINC41ODA5MkwxMC45OTkyIDExLjkyODJIMy4xOTI5OFpNMTEuMjE1OCA1LjUwOTk5VjcuNjAzOTVMMTYuMDI5NSAxMi40MTc2VjQuMzA2NTdMMTIuODIwNCA3LjUxNTdWNC43MDc3MUMxMi44MjA0IDQuMjY2NDYgMTIuNDU5MyAzLjkwNTQzIDEyLjAxODEgMy45MDU0M0g3LjUxNzI4TDkuMTIxODQgNS41MDk5OUgxMS4yMTU4WiIgZmlsbD0iIzcyNzY3RSIvPgo8L3N2Zz4K);
  --str-video__icon--not-allowed: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNyAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNDY0MjIgMC45MzU1NDdDNC4wMzU2MyAwLjkzNTU0NyAwLjQ0MTQwNiA0LjUyOTc3IDAuNDQxNDA2IDguOTU4MzZDMC40NDE0MDYgMTMuMzg3IDQuMDM1NjMgMTYuOTgxMiA4LjQ2NDIyIDE2Ljk4MTJDMTIuODkyOCAxNi45ODEyIDE2LjQ4NyAxMy4zODcgMTYuNDg3IDguOTU4MzZDMTYuNDg3IDQuNTI5NzcgMTIuODkyOCAwLjkzNTU0NyA4LjQ2NDIyIDAuOTM1NTQ3Wk0yLjA0NTk3IDguOTU4MzZDMi4wNDU5NyA1LjQxMjI4IDQuOTE4MTQgMi41NDAxMSA4LjQ2NDIyIDIuNTQwMTFDOS45NDg0NCAyLjU0MDExIDExLjMxMjMgMy4wNDU1NSAxMi4zOTU0IDMuODk1OTdMMy40MDE4MyAxMi44ODk1QzIuNTUxNDEgMTEuODA2NSAyLjA0NTk3IDEwLjQ0MjYgMi4wNDU5NyA4Ljk1ODM2Wk04LjQ2NDIyIDE1LjM3NjZDNi45OCAxNS4zNzY2IDUuNjE2MTIgMTQuODcxMiA0LjUzMzA0IDE0LjAyMDhMMTMuNTI2NiA1LjAyNzE4QzE0LjM3NyA2LjExMDI2IDE0Ljg4MjUgNy40NzQxNCAxNC44ODI1IDguOTU4MzZDMTQuODgyNSAxMi41MDQ0IDEyLjAxMDMgMTUuMzc2NiA4LjQ2NDIyIDE1LjM3NjZaIiBmaWxsPSIjNzI3NjdFIi8+Cjwvc3ZnPgo=);
}
.str-video__avatar {
  width: 2rem;
  height: 2rem;
  object-fit: cover;
}
.str-video__avatar--initials-fallback {
  width: 2rem;
  height: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.str-video {
/* The font color applied inside the component */
  --str-video__avatar--color: var(--str-video__text-color1);
/* The background color of the component */
  --str-video__avatar--background-color: var(--str-video__background-color1);
/* The border radius used for the borders of the component */
  --str-video__avatar--border-radius: var(--str-video__border-radius-circle);
}
.str-video__avatar {
  background: var(--str-video__avatar--background-color);
  color: var(--str-video__avatar--color);
  box-shadow: var(--str-video__avatar--box-shadow);
  border-radius: var(--str-video__avatar--border-radius);
  border-block-start: var(--str-video__avatar--border-block-start);
  border-block-end: var(--str-video__avatar--border-block-end);
  border-inline-start: var(--str-video__avatar--border-inline-start);
  border-inline-end: var(--str-video__avatar--border-inline-end);
}
.str-video__avatar--initials-fallback {
  background-color: var(--str-video__primary-color);
  font-size: 1rem;
  font-weight: 600;
  border-radius: var(--str-video__border-radius-circle);
  text-transform: uppercase;
}
.str-video__button {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--str-video__border-radius-md);
  padding: var(--str-video__spacing-sm) var(--str-video__spacing-lg);
  text-align: center;
  min-width: 120px;
  width: 100%;
  font-size: var(--str-video__font-size-md);
  font-weight: 500;
  border: 1px solid transparent;
  color: var(--str-video__text-color1);
  background-color: var(--str-video__button-primary-base);
}
.str-video__button:hover {
  background-color: var(--str-video__button-primary-hover);
  cursor: pointer;
}
.str-video__button__icon {
  margin-right: var(--str-video__spacing-xs);
  background-color: var(--str-video__text-color1);
}
.str-video__button:disabled {
  background-color: var(--str-video__button-default-disabled);
  cursor: not-allowed;
}
.str-video__composite-button--caption {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 0.25rem;
}
.str-video__composite-button .str-video__composite-button__button-group {
  display: flex;
  align-items: center;
}
.str-video__composite-button .str-video__composite-button__button-group .str-video__composite-button__button {
  all: unset;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  padding: 0.5rem;
}
.str-video__composite-button .str-video__composite-button__button-group .str-video__composite-button__button:hover {
  cursor: pointer;
}
.str-video__composite-button .str-video__composite-button__button-group .str-video__menu-toggle-button {
  padding: 0;
  margin-left: -30px;
  margin-right: 8px;
}
.str-video__composite-button .str-video__composite-button__button-group .str-video__loading-indicator__icon {
  width: 1.375rem;
  height: 1.375rem;
  -webkit-mask-size: 1.25rem;
  mask-size: 1.25rem;
}
.str-video__composite-button.str-video__composite-button--menu .str-video__composite-button__button {
  padding-right: 2.5rem;
}
.str-video__call-controls__button {
  padding: 0.5rem;
}
.str-video__call-controls__button[disabled] {
  cursor: not-allowed;
}
.str-video__call-controls__button:hover,
.str-video__call-controls__button:hover > *:hover {
  cursor: pointer;
}
.str-video__text-button {
  all: unset;
  padding: 5px;
  font-size: 12px;
  border-radius: var(--str-video__participant-list-header__close-button--border-radius);
  background: var(--str-video__participant-list-header__close-button--background-color);
}
.str-video__call-recording-list-item__action-button {
  border: none;
}
.str-video {
/* The font color applied inside the component */
  --str-video__composite-button__button-group--color: var(--str-video__text-color1);
/* The background color of the component */
  --str-video__composite-button__button-group--background-color: var(--str-video__button-primary-base);
/* The active background color of the component */
  --str-video__composite-button__button-group-active--background-color: var(--str-video__button-primary-active);
  --str-video__composite-button__button-group-active-primary--background-color: var(--str-video__button-primary-active);
  --str-video__composite-button__button-group-active-secondary--background-color: var(--str-video__button-secondary-active);
  --str-video__composite-button__button-group-active-secondary-hover--background-color: var(--str-video__button-secondary-hover);
/* The hover background color of the component */
  --str-video__composite-button__button-group-hover--background-color: var(--str-video__button-default-hover);
/* The border radius used for the borders of the component */
  --str-video__composite-button__button-group--border-radius: var(--str-video__border-radius-xs);
}
.str-video__composite-button__button-group {
  background: var(--str-video__composite-button__button-group--background-color);
  color: var(--str-video__composite-button__button-group--color);
  box-shadow: var(--str-video__composite-button__button-group--box-shadow);
  border-radius: var(--str-video__composite-button__button-group--border-radius);
  border-block-start: var(--str-video__composite-button__button-group--border-block-start);
  border-block-end: var(--str-video__composite-button__button-group--border-block-end);
  border-inline-start: var(--str-video__composite-button__button-group--border-inline-start);
  border-inline-end: var(--str-video__composite-button__button-group--border-inline-end);
  background-color: var(--str-video__composite-button__button-group--background-color);
  border-radius: var(--str-video__border-radius-circle);
}
.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button {
  background-color: var(--str-video__button-primary-base);
}
.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button:hover {
  background-color: var(--str-video__button-default-hover);
}
.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active {
  background-color: var(--str-video__composite-button__button-group-hover--background-color);
  color: #fff;
}
.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active:hover {
  background-color: var(--str-video__composite-button__button-group-hover--background-color);
}
.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active:disabled {
  background-color: var(--str-video__composite-button__button-group-hover--background-color);
}
.str-video__composite-button__button-group.str-video__composite-button__button-group--active {
  background-color: var(--str-video__composite-button__button-group-active--background-color);
}
.str-video__composite-button__button-group.str-video__composite-button__button-group--active:hover {
  background-color: var(--str-video__button-primary-hover);
}
.str-video__composite-button__button-group.str-video__composite-button__button-group--active .str-video__icon {
  background-color: var(--str-video__icon-active);
}
.str-video__composite-button__button-group.str-video__composite-button__button-group--active-primary {
  background-color: var(--str-video__composite-button__button-group-active-primary--background-color);
}
.str-video__composite-button__button-group.str-video__composite-button__button-group--active-secondary {
  background-color: var(--str-video__composite-button__button-group-active-secondary--background-color);
}
.str-video__composite-button__caption {
  font-size: 12px;
  line-height: 15px;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
}
.str-video__composite-button__button-group:hover {
  background-color: var(--str-video__composite-button__button-group-hover--background-color);
}
.str-video__composite-button__button-group:hover.str-video__composite-button__button-group--active-secondary:hover {
  background-color: var(--str-video__composite-button__button-group-active-secondary-hover--background-color);
}
.str-video__composite-button__button-group:hover .str-video__icon {
  background-color: var(--str-video__icon-hover);
}
.str-video__call-controls__button {
  border-radius: var(--str-video__border-radius-circle);
  text-decoration: none;
  box-shadow: none;
  border: none;
  background-color: var(--str-video__button-primary-base);
}
.str-video__call-controls__button:hover {
  text-decoration: none;
  background-color: var(--str-video__composite-button__button-group-hover--background-color);
}
.str-video__call-controls__button:hover .str-video__icon {
  background-color: var(--str-video__icon-hover);
}
.str-video__call-controls__button--variant-danger {
  background-color: var(--str-video__button-tertiary-base);
}
.str-video__call-controls__button--variant-danger .str-video__icon {
  background-color: #fff;
}
.str-video__call-controls__button--variant-danger:hover {
  background-color: var(--str-video__button-tertiary-hover);
}
.str-video__call-controls__button--variant-success {
  background-color: var(--str-video__info-color);
}
.str-video__call-controls__button--variant-success:hover {
  background-color: var(--str-video__info-color--accent);
}
.str-video__call-controls__button--variant-active {
  background-color: var(--str-video__button-primary-active);
}
.str-video__call-controls__button--variant-active:hover {
  background-color: var(--str-video__button-primary-hover);
}
.str-video__call-controls__button--enabled {
  background: var(--str-video__background-color7);
}
.str-video__background-filters {
  position: absolute;
  bottom: 0;
  right: calc(100% - 1px);
  overflow: hidden;
  opacity: 0;
}
.str-video__background-filters .str-video__background-filters__video {
  top: 0;
  width: 100%;
  height: auto;
  object-fit: cover;
}
.str-video__background-filters .str-video__background-filters__video--tall {
  object-fit: contain;
}
.str-video__background-filters .str-video__background-filters__background-image {
  top: 5px;
  width: 100%;
  height: auto;
}
.str-video__background-filters .str-video__background-filters__target-canvas {
  top: 10px;
  width: 100%;
  height: auto;
}
.str-video__call-controls {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding: 1rem 0;
}
.str-video__call-controls .str-video__reactions-menu {
  background-color: var(--str-video__base-color6);
  display: flex;
  padding: var(--str-video__spacing-sm);
  gap: 0.5rem;
  border-radius: var(--str-video__border-radius-lg);
}
.str-video__call-controls .str-video__reactions-menu--horizontal {
  flex-direction: row;
}
.str-video__call-controls .str-video__reactions-menu--vertical {
  flex-direction: column;
}
.str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button {
  font-family: "Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color";
  font-size: 1.2rem;
  height: 38px;
  width: 38px;
  background-color: var(--str-video__button-primary-base);
  border-radius: var(--str-video__border-radius-circle);
  border: 1px solid transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button:hover {
  background-color: var(--str-video__button-primary-hover);
  cursor: pointer;
}
.str-video__no-media-permission {
  position: absolute;
  background-color: var(--str-video__alert-caution);
  height: 12px;
  width: 12px;
  border-radius: var(--str-video__border-radius-circle);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--str-video__font-size-xxs);
  color: var(--str-video__base-color4);
  cursor: pointer;
  font-weight: 600;
  top: 0;
  right: -3px;
}
.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__button-group {
  background-color: var(--str-video__button-default-disabled);
}
.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__button-group:hover {
  background-color: var(--str-video__button-default-hover);
}
.str-video__end-call__confirmation {
  padding: var(--str-video__spacing-lg);
  gap: var(--str-video__spacing-md);
  display: flex;
  flex-direction: column;
}
.str-video__end-call__leave,
.str-video__end-call__end {
  min-width: 196px;
  color: var(--str-video__text-color1);
  border: 1px solid transparent;
  padding: calc(var(--str-video__spacing-sm) - 1px) var(--str-video__spacing-lg);
}
.str-video__end-call__leave-icon,
.str-video__end-call__end-icon {
  background-color: var(--str-video__text-color1);
}
.str-video__end-call__leave {
  background-color: var(--str-video__button-tertiary-base);
}
.str-video__end-call__leave:hover {
  background-color: var(--str-video__button-tertiary-hover);
}
.str-video__end-call__end {
  background-color: var(--str-video__button-primary-base);
  border-color: var(--str-video__button-default-hover);
}
.str-video__end-call__end:hover {
  background-color: var(--str-video__button-tertiary-hover);
  border-color: transparent;
}
.str-video__end-call.str-video__end-call__leave-icon,
.str-video__icon.str-video__end-call__end-icon {
  background-color: var(--str-video__text-color1);
}
.str-video__end-recording__confirmation {
  background-color: var(--str-video__base-color7);
  border-radius: var(--str-video__border-radius-lg);
  padding: var(--str-video__spacing-xl);
  gap: var(--str-video__spacing-lg);
  display: flex;
  flex-direction: column;
}
.str-video__end-recording__header {
  display: flex;
  flex-direction: row;
  gap: var(--str-video__spacing-md);
}
.str-video__end-recording__heading {
  font-size: var(--str-video__font-size-lg);
  font-weight: 600;
  margin: 0;
}
.str-video__end-recording__description {
  margin: 0;
  color: var(--str-video__text-color2);
  font-size: var(--str-video__font-size-sm);
}
.str-video__end-recording__actions {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: var(--str-video__spacing-md);
}
.str-video__end-recording__actions .str-video__composite-button {
  width: 100%;
  gap: var(--str-video__spacing-md);
}
.str-video__end-recording__actions .str-video__composite-button:first-of-type {
  background-color: transparent;
}
.str-video__end-recording__actions .str-video__composite-button:first-of-type .str-video__composite-button__button-group {
  background-color: transparent;
  border: 1px solid var(--str-video__base-color2);
  width: 100%;
  justify-content: center;
}
.str-video__end-recording__actions .str-video__composite-button:first-of-type .str-video__composite-button__button-group:hover {
  background-color: var(--str-video__button-default-hover);
}
.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group {
  background-color: var(--str-video__button-tertiary-base);
  width: 100%;
  justify-content: center;
}
.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group .str-video__text-button {
  display: flex;
  align-items: center;
  gap: 5px;
}
.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group:hover {
  background-color: var(--str-video__button-tertiary-hover);
}
.str-video__livestream-layout__wrapper {
  flex-grow: 1;
  overflow-y: hidden;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__screen-share {
  max-width: 100%;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__screen-share .str-video__video {
  object-fit: contain;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant {
  position: absolute;
  width: 240px;
  height: 135px;
  box-shadow: var(--str-video__background-color1) 0 0 3px 0;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--top-right {
  top: 8px;
  right: 8px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--top-left {
  top: 8px;
  left: 8px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--bottom-right {
  bottom: 8px;
  right: 8px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--bottom-left {
  bottom: 8px;
  left: 8px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column-reverse;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay:hover .str-video__livestream-layout__overlay__bar {
  background-color: var(--str-video__livestream-overlay-color-hovered);
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar {
  height: 10%;
  min-height: 40px;
  max-height: 70px;
  position: relative;
  bottom: 0;
  border-bottom-left-radius: var(--str-video__border-radius-sm);
  border-bottom-right-radius: var(--str-video__border-radius-sm);
  background-color: var(--str-video__livestream-overlay-color);
  display: flex;
  align-items: center;
  padding: 0 20px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__live-badge {
  padding: 4px 8px;
  border-radius: var(--str-video__border-radius-xxs);
  background-color: var(--str-video__primary-color);
  color: var(--str-video__text-color1);
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count {
  padding: 4px 8px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count::before {
  content: var(--str-video__icon--livestream-viewers);
  margin-right: 3px;
  vertical-align: middle;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name {
  flex: 1;
  font-size: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration {
  flex: 1;
  text-align: center;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__go-fullscreen {
  background: var(--str-video__icon--fullscreen) center no-repeat;
  border-radius: var(--str-video__border-radius-xxs);
  cursor: pointer;
  width: 32px;
  height: 32px;
}
.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__go-fullscreen:hover {
  background-color: var(--str-video__overlay-color);
}
.str-video__paginated-grid-layout__wrapper {
  flex-grow: 1;
}
.str-video__paginated-grid-layout {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: space-between;
}
.str-video__paginated-grid-layout .str-video__paginated-grid-layout__group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  max-width: 110vh;
  padding-inline: 1.25rem;
  margin: auto;
  width: 100%;
}
.str-video__paginated-grid-layout .str-video__paginated-grid-layout__group .str-video__participant-view {
  flex: 0 1 calc(25% - 6px);
}
.str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--one .str-video__participant-view {
  flex: 0 1 calc(100% - 6px);
}
.str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--two-four .str-video__participant-view {
  flex: 0 1 calc(50% - 6px);
}
.str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--five-nine .str-video__participant-view {
  flex: 0 1 calc(33% - 6px);
}
.str-video__speaker-layout__wrapper {
  flex-grow: 1;
  overflow-y: hidden;
}
.str-video__speaker-layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  width: 100%;
  gap: 1rem;
  padding-inline: 2px;
  padding: 2px;
}
.str-video__speaker-layout .str-video__participant-view {
  aspect-ratio: 16/9;
}
.str-video__speaker-layout .str-video__speaker-layout__spotlight {
  display: flex;
  justify-content: center;
  min-height: 0;
  height: 100%;
}
.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__participant-view--speaking:has(.str-video__video--screen-share) {
  outline: none;
}
.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__video {
  height: 100%;
  width: 100%;
}
.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__participant-details,
.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__call-controls__button {
  opacity: 1;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper > .str-video__call-controls__button .str-video__icon {
  width: 1rem;
  height: 1rem;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-left {
  position: absolute;
  left: 0.5rem;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-right {
  position: absolute;
  right: 0.5rem;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-top {
  position: absolute;
  top: 0.5rem;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-bottom {
  position: absolute;
  bottom: 0.5rem;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-wrapper {
  scrollbar-width: none;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-wrapper::-webkit-scrollbar {
  display: none;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-wrapper .str-video__speaker-layout__participants-bar {
  display: flex;
  align-items: center;
}
.str-video__speaker-layout .str-video__speaker-layout__participants-bar-wrapper .str-video__speaker-layout__participants-bar .str-video__speaker-layout__participant-tile {
  width: 280px;
  min-width: 280px;
  max-width: 25vh;
  padding: 5px;
}
.str-video__speaker-layout--variant-top {
  flex-direction: column-reverse;
}
.str-video__speaker-layout--variant-left {
  flex-direction: row-reverse;
}
.str-video__speaker-layout--variant-right {
  flex-direction: row;
}
.str-video__speaker-layout--variant-left .str-video__speaker-layout__participants-bar-wrapper,
.str-video__speaker-layout--variant-right .str-video__speaker-layout__participants-bar-wrapper {
  overflow-y: auto;
  max-height: 100%;
}
.str-video__speaker-layout--variant-left .str-video__speaker-layout__participants-bar,
.str-video__speaker-layout--variant-right .str-video__speaker-layout__participants-bar {
  flex-direction: column;
}
.str-video__speaker-layout--variant-left .str-video__speaker-layout__spotlight,
.str-video__speaker-layout--variant-right .str-video__speaker-layout__spotlight {
  width: 100%;
}
.str-video__speaker-layout--variant-left .str-video__participant-view,
.str-video__speaker-layout--variant-right .str-video__participant-view {
  max-width: unset;
}
.str-video__speaker-layout--variant-top .str-video__speaker-layout__participants-bar-wrapper,
.str-video__speaker-layout--variant-bottom .str-video__speaker-layout__participants-bar-wrapper {
  overflow-x: auto;
}
.str-video__speaker-layout--variant-top .str-video__speaker-layout__participants-bar,
.str-video__speaker-layout--variant-bottom .str-video__speaker-layout__participants-bar {
  flex-direction: row;
}
.str-video__speaker-layout--variant-top .str-video__participant-view,
.str-video__speaker-layout--variant-bottom .str-video__participant-view {
  max-width: 110vh;
}
@media (min-width: 600px) {
  .str-video__speaker-layout .str-video__speaker-layout__spotlight {
    align-items: center;
    height: auto;
  }
  .str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__video {
    object-fit: contain;
  }
}
.str-video__participant-list {
  display: flex;
  flex-direction: column;
}
.str-video__participant-list .str-video__participant-list-header {
  display: flex;
  align-items: center;
}
.str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__title {
  flex: 1;
  font-size: var(--str-video__font-size-sm);
}
.str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__close-button > span {
  height: 15px;
  width: 15px;
}
.str-video__participant-list .str-video__search-input__container {
  margin-top: var(--str-video__spacing-md);
}
.str-video__participant-list .str-video__participant-list__content-header {
  display: none;
  align-items: center;
  gap: 0.5rem;
  margin-top: var(--str-video__spacing-md);
  justify-content: flex-end;
}
.str-video__participant-list .str-video__participant-list__content-header .str-video__participant-list__content-header-title {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.str-video__participant-list .str-video__participant-list__content-header .str-video__call-controls__button {
  width: 1.75rem;
  height: 1.75rem;
  display: flex;
  padding: unset;
  align-items: center;
  justify-content: center;
}
.str-video__participant-list .str-video__participant-list__content-header .str-video__call-controls__button .str-video__icon--filter {
  width: 1rem;
  height: 1rem;
}
.str-video__participant-list .str-video__participant-list__content {
  height: auto;
  flex-grow: 1;
  overflow-y: auto;
  margin-top: var(--str-video__spacing-xl);
}
.str-video__participant-list .str-video__participant-list__footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 0.5rem;
}
.str-video__participant-list .str-video__search-results--loading {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.str-video__participant-list .str-video__search-results--loading .str-video__loading-indicator__icon {
  height: 3rem;
  width: 3rem;
  mask-size: 3rem;
  -webkit-mask-size: 3rem;
}
.str-video__participant-list .str-video__participant-list--empty {
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--str-video__spacing-md);
  font-size: var(--str-video__font-size-sm);
}
.str-video__invite-link-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  width: 100%;
  position: relative;
  padding-block: 0.5rem;
}
.str-video__invite-link-button .str-video__invite-link-tooltip {
  position: absolute;
  bottom: 110%;
}
.str-video__invite-link-button .str-video__invite-participant-icon {
  height: 20px;
  width: 20px;
}
.str-video__participant-listing-item {
  display: flex;
  justify-content: space-between;
  gap: var(--str-video__spacing-sm);
  padding-block: 0.5rem;
  width: 100%;
  align-items: center;
}
.str-video__participant-listing-item .str-video__call-controls__button {
  padding: unset;
}
.str-video__participant-listing-item .str-video__participant-listing-item__display-name {
  flex: 1;
  white-space: nowrap;
  overflow-y: visible;
  overflow-x: hidden;
  overflow-x: clip;
  text-overflow: ellipsis;
}
.str-video__participant-listing-item .str-video__participant-avatar {
  display: flex;
  align-items: center;
  gap: var(--str-video__spacing-sm);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group {
  display: flex;
  align-items: center;
  gap: var(--str-video__spacing-sm);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon {
  width: 0.75rem;
  height: 0.75rem;
}
.str-video__participant-listing-item .str-video__participant-listing-item__display-name {
  font-size: 13px;
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-mic {
  mask-image: var(--str-video__icon--mic);
  -webkit-mask-image: var(--str-video__icon--mic);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__text-color1);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-mic-off {
  mask-image: var(--str-video__icon--mic-off);
  -webkit-mask-image: var(--str-video__icon--mic-off);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__danger-color);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-camera {
  mask-image: var(--str-video__icon--camera);
  -webkit-mask-image: var(--str-video__icon--camera);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__text-color1);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-camera-off {
  mask-image: var(--str-video__icon--camera-off);
  -webkit-mask-image: var(--str-video__icon--camera-off);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__danger-color);
}
.str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-pinned {
  mask-image: var(--str-video__icon--pin);
  -webkit-mask-image: var(--str-video__icon--pin);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__text-color1);
}
.str-video__call-preview {
  width: 100%;
  height: auto;
  display: inline-block;
  object-fit: contain;
}
.str-video__call-recording-list__list {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
}
.str-video__call-recording-list__list:first-of-type .str-video__call-recording-list__item {
  font-weight: 600;
}
.str-video__call-recording-list__item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  font-size: var(--str-video__font-size-xs);
  border-bottom: 1px solid var(--str-video__base-color2);
  padding: var(--str-video__spacing-sm) 0;
  gap: var(--str-video__spacing-sm);
}
.str-video__call-recording-list__item:last-of-type {
  border-bottom: none;
}
.str-video__call-recording-list__filename {
  width: 200px;
}
.str-video__call-recording-list__time {
  width: 100px;
}
.str-video__call-recording-list__download {
  display: flex;
  justify-content: flex-end;
  width: 100px;
}
.str-video__call-recording-list__filename,
.str-video__call-recording-list__time {
  text-overflow: ellipsis;
  overflow: hidden;
}
.str-video__call-recording-list-item__action-button--download .str-video__icon--download {
  height: 32px;
  width: 32px;
}
.str-video__call-recording-list-item__action-button--download:hover .str-video__icon--download {
  cursor: pointer;
  background-color: var(--str-video__brand-color1);
}
.str-video__call-recording-list__title {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.25rem;
}
.str-video__call-controls__button--icon-call-recordings {
  mask-image: var(--str-video__icon--film-roll);
  -webkit-mask-image: var(--str-video__icon--film-roll);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: 2px;
  -webkit-mask-size: 2px;
  background-color: var(--str-video__text-color1);
}
.str-video__call-recordings__toggle-button--active {
  background-color: var(--str-video__background-color7);
}
.str-video__refresh-button {
  background-color: transparent;
  cursor: pointer;
  border-radius: 4px;
}
.str-video__refresh-button:hover {
  background-color: var(--str-video__background-color7);
}
.str-video__refresh-button:active {
  background-color: var(--str-video__background-color5);
  transition: background-color 0.2s ease-out;
}
.str-video__refresh-button .str-video__refresh-button--icon {
  mask-image: var(--str-video__icon--refresh);
  -webkit-mask-image: var(--str-video__icon--refresh);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__text-color1);
}
.str-video__call-recording-list__listing--icon-empty {
  mask-image: var(--str-video__icon--film-roll);
  -webkit-mask-image: var(--str-video__icon--film-roll);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  background-color: var(--str-video__text-color1);
}
.str-video__call-stats {
  border-radius: var(--str-video__border-radius-lg);
  background-color: var(--str-video__base-color7);
  padding: var(--str-video__spacing-md);
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.str-video__call-stats h3 {
  margin: unset;
}
.str-video__call-stats .str-video__call-stats__header {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--str-video__spacing-md);
}
.str-video__call-stats .str-video__call-stats__heading {
  display: flex;
  align-items: center;
}
.str-video__call-stats .str-video__call-stats__icon {
  margin-right: var(--str-video__spacing-sm);
  height: 18px;
  width: 18px;
}
.str-video__call-stats .str-video__call-stats__description {
  font-size: var(--str-video__font-size-sm);
  margin-bottom: var(--str-video__spacing-sm);
  font-weight: 600;
}
.str-video__call-stats .str-video__call-stats__card-container {
  --gap: 1rem;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: var(--gap);
}
.str-video__call-stats .str-video__call-stats__card {
  display: flex;
  justify-content: space-between;
  background-color: var(--str-video__background-color4);
  border-radius: var(--str-video__border-radius-xs);
  width: calc(50% - var(--gap) / 2);
  padding: 0.5rem 0.5rem;
}
.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-content {
  display: flex;
  flex-direction: column;
}
.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-label {
  display: flex;
  color: var(--str-video__text-color2);
  font-size: 0.5625rem;
  font-weight: 500;
  text-transform: uppercase;
}
.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-value {
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.25rem;
}
.str-video__call-stats .str-video__call-explanation__icon {
  height: 12px;
  width: 12px;
  margin-left: var(--str-video__spacing-xs);
}
.str-video__call-stats .str-video__call-explanation__icon:hover {
  cursor: pointer;
}
.str-video__call-stats .str-video__call-explanation__description {
  background-color: var(--str-video__base-color3);
  padding: var(--str-video__spacing-xs);
  font-size: var(--str-video__font-size-xs);
  border-radius: var(--str-video__border-radius-xs);
}
.str-video__call-stats .str-video__call-stats-line-chart-container {
  position: relative;
  margin: auto;
  height: 170px;
  width: 100%;
}
.str-video__call-stats .str-video__call-stats__tag {
  border-radius: var(--str-video__border-radius-sm);
  padding: var(--str-video__spacing-xs);
  font-size: var(--str-video__font-size-sm);
  font-weight: 600;
  height: 30px;
}
.str-video__call-stats .str-video__call-stats__tag--good {
  color: var(--str-video__alert-success);
  background-color: var(--str-video__alert-success-background);
}
.str-video__call-stats .str-video__call-stats__tag--ok {
  color: var(--str-video__alert-caution);
  background-color: var(--str-video__alert-caution-background);
}
.str-video__call-stats .str-video__call-stats__tag--bad {
  color: var(--str-video__alert-warning);
  background-color: var(--str-video__alert-warming-background);
}
.str-video__device-settings__button .str-video__call-controls__button--icon-device-settings {
  width: 1.25rem;
  height: 1.25rem;
}
.str-video__device-settings {
  padding: 0.625rem;
  z-index: 1;
  font-family: "Inter";
}
.str-video__device-settings__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 16px 0px 16px;
  margin-bottom: 33px;
}
.str-video__icon.str-video__device-settings__settings-icon {
  height: 24px;
  width: 24px;
  color: var(--str-video__base-color1);
}
.str-video__device-settings__heading {
  width: 100%;
  justify-self: start;
  margin: unset;
  margin-left: 8px;
  color: var(--str-video__base-color1);
  font-size: 24;
  font-weight: 500;
  word-wrap: "break-word";
}
.str-video__device-settings__close-button {
  color: var(--str-video__base-color1);
  background-color: transparent;
}
.str-video__device-settings__device-kind {
  padding: var(--str-video__spacing-lg);
}
.str-video__device-settings__device-kind .str-video__device-settings__device-selector-title {
  font-size: var(--str-video__font-size-xs);
  line-height: 1.25rem;
  padding-bottom: 0.5rem;
  font-size: 13px;
  margin-bottom: 8px;
}
.str-video__device-settings__device-kind .str-video__option,
.str-video__device-settings__device-kind .str-video__device-settings__option {
  display: flex;
  align-items: center;
  border-radius: var(--str-video__border-radius-lg);
  background-color: var(--str-video__button-primary-base);
  padding: var(--str-video__spacing-sm) var(--str-video__spacing-lg);
  gap: 8px;
  font-weight: 600;
  font-size: var(--str-video__font-size-sm);
  line-height: var(--str-video__spaging-lg);
}
.str-video__device-settings__device-kind .str-video__option:not(:first-of-type),
.str-video__device-settings__device-kind .str-video__device-settings__option:not(:first-of-type) {
  margin-top: 8px;
}
.str-video__device-settings__device-kind .str-video__option__icon--selected,
.str-video__device-settings__device-kind .str-video__device-settings__option__icon--selected {
  background-color: var(--str-video__brand-color1);
}
.str-video__device-settings__device-kind .str-video__option:hover,
.str-video__device-settings__device-kind .str-video__device-settings__option:hover {
  background-color: var(--str-video__button-default-hover);
  cursor: pointer;
}
.str-video__device-settings__device-kind .str-video__option--selected,
.str-video__device-settings__device-kind .str-video__option--active,
.str-video__device-settings__device-kind .str-video__device-settings__option--selected,
.str-video__device-settings__device-kind .str-video__device-settings__option--active {
  background-color: var(--str-video__button-default-hover);
}
.str-video__device-settings__device-kind .str-video__option input[type=radio],
.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio] {
  margin: 0;
  height: 1rem;
  width: 1rem;
  display: grid;
  place-content: center;
}
.str-video__device-settings__device-kind .str-video__option input[type=radio]::before,
.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  transform: scale(0);
}
.str-video__device-settings__device-kind .str-video__option input[type=radio]:checked::before,
.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:checked::before {
  transform: scale(1);
}
.str-video__device-settings__device-kind .str-video__option input[type=radio]:checked,
.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:checked {
  border-color: var(--str-video__primary-color);
}
.str-video__dropdown {
  position: relative;
}
.str-video__dropdown-selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--str-video__base-color4);
  border-radius: var(--str-video__border-radius-lg);
  border: 1px solid var(--str-video__base-color6);
}
.str-video__dropdown-selected__label {
  display: flex;
  align-items: center;
  font-weight: 600;
  padding: var(--str-video__spacing-sm);
  font-size: var(--str-video__font-size-xs);
}
.str-video__dropdown-selected__icon {
  margin-right: var(--str-video__spacing-sm);
}
.str-video__dropdown-selected__chevron {
  margin-right: var(--str-video__spacing-md);
}
.str-video__dropdown-selected > *:hover,
.str-video__dropdown-selected:hover {
  cursor: pointer;
}
.str-video__dropdown-selected:hover {
  border: 1px solid var(--str-video__brand-color1);
}
.str-video__dropdown-list {
  display: flex;
  flex-direction: column;
  position: absolute;
  z-index: 2;
  width: 100%;
  margin-top: var(--str-video__spacing-sm);
  background-color: var(--str-video__base-color6);
  border-radius: var(--str-video__border-radius-lg);
  padding: var(--str-video__spacing-md);
  gap: var(--str-video__spacing-sm);
  box-shadow: 0 0 24px -4px rgba(0,0,0,0.64);
}
.str-video__dropdown-option {
  display: flex;
  align-items: center;
  border-radius: var(--str-video__border-radius-lg);
  padding: 8px 16px;
  gap: 8px;
  font-weight: 600;
  font-size: var(--str-video__font-size-sm);
}
.str-video__dropdown-option:hover {
  background-color: var(--str-video__button-default-hover);
  cursor: pointer;
}
.str-video__dropdown-option--selected {
  background-color: var(--str-video__button-primary-active);
  color: var(--str-video__text-color1);
}
.str-video__dropdown-option--selected:hover {
  background-color: var(--str-video__button-primary-hover);
}
.str-video__dropdown-icon {
  background-color: var(--str-video__icon-default);
}
.str-video__dropdown__option:hover .str-video__dropdown-icon {
  background-color: var(--str-video__icon-hover);
}
.str-video__dropdown-option--selected .str-video__dropdown-icon {
  background-color: var(--str-video__text-color1);
}
.str-video__dropdown-label {
  font-size: var(--str-video__font-size-xs);
}
.str-video__dropdown__option:hover .str-video__dropdown-label {
  color: var(--str-video__base-color1);
}
@media (min-width: 600px) {
  .str-video__dropdown-selected__label {
    font-size: var(--str-video__font-size-sm);
  }
}
.str-video__icon {
  background-color: var(--str-video__icon-default);
}
.str-video__icon--chat {
  mask-image: var(--str-video__icon--chat);
  -webkit-mask-image: var(--str-video__icon--chat);
}
.str-video__icon--reactions {
  -webkit-mask-image: var(--str-video__icon--reactions);
  mask-image: var(--str-video__icon--reactions);
}
.str-video__icon--call-latency {
  -webkit-mask-image: var(--str-video__icon--call-latency);
  mask-image: var(--str-video__icon--call-latency);
}
.str-video__icon--network-quality {
  -webkit-mask-image: var(--str-video__icon--network-quality);
  mask-image: var(--str-video__icon--network-quality);
}
.str-video__icon--support-agent {
  -webkit-mask-image: var(--str-video__icon--support-agent);
  mask-image: var(--str-video__icon--support-agent);
}
.str-video__icon--recording-on {
  mask-image: var(--str-video__icon--recording-on);
  -webkit-mask-image: var(--str-video__icon--recording-on);
}
.str-video__icon--mediation {
  mask-image: var(--str-video__icon--mediation);
  -webkit-mask-image: var(--str-video__icon--mediation);
}
.str-video__icon--copy {
  mask-image: var(--str-video__icon--copy);
  -webkit-mask-image: var(--str-video__icon--copy);
}
.str-video__icon--caret-up {
  mask-image: var(--str-video__icon--caret-up);
  -webkit-mask-image: var(--str-video__icon--caret-up);
}
.str-video__icon--download {
  mask-image: var(--str-video__icon--download);
  -webkit-mask-image: var(--str-video__icon--download);
}
.str-video__icon--caret-down {
  mask-image: var(--str-video__icon--caret-down);
  -webkit-mask-image: var(--str-video__icon--caret-down);
  transform: rotate(180deg);
}
.str-video__icon--layout-speaker-bottom {
  mask-image: var(--str-video__icon--layout-speaker-bottom);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-bottom);
}
.str-video__icon--layout-speaker-top {
  mask-image: var(--str-video__icon--layout-speaker-top);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-top);
}
.str-video__icon--layout-speaker-left {
  mask-image: var(--str-video__icon--layout-speaker-left);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-left);
}
.str-video__icon--layout-speaker-one-on-one {
  mask-image: var(--str-video__icon--layout-speaker-one-on-one);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-one-on-one);
}
.str-video__icon--layout-speaker-live-stream {
  mask-image: var(--str-video__icon--layout-speaker-live-stream);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-live-stream);
}
.str-video__icon--layout-speaker-right {
  mask-image: var(--str-video__icon--layout-speaker-right);
  -webkit-mask-image: var(--str-video__icon--layout-speaker-right);
}
.str-video__icon--layout {
  mask-image: var(--str-video__icon--layout);
  -webkit-mask-image: var(--str-video__icon--layout);
}
.str-video__icon--folder {
  mask-image: var(--str-video__icon--folder);
  -webkit-mask-image: var(--str-video__icon--folder);
}
.str-video__icon--paperclip {
  mask-image: var(--str-video__icon--paperclip);
  -webkit-mask-image: var(--str-video__icon--paperclip);
}
.str-video__icon--chevron-right {
  mask-image: var(--str-video__icon--chevron-right);
  -webkit-mask-image: var(--str-video__icon--chevron-right);
}
.str-video__icon--recording-off {
  mask-image: var(--str-video__icon--recording-off);
  -webkit-mask-image: var(--str-video__icon--recording-off);
}
.str-video__icon--camera-add {
  mask-image: var(--str-video__icon--camera-add);
  -webkit-mask-image: var(--str-video__icon--camera-add);
}
.str-video__icon--person-add {
  mask-image: var(--str-video__icon--person-add);
  -webkit-mask-image: var(--str-video__icon--person-add);
}
.str-video__icon--qr-code {
  mask-image: var(--str-video__icon--qr-code);
  -webkit-mask-image: var(--str-video__icon--qr-code);
}
.str-video__icon--loading {
  mask-image: var(--str-video__icon--loading);
  -webkit-mask-image: var(--str-video__icon--loading);
  transform: rotate(360deg);
  transition-duration: 1s;
  transition-delay: now;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.str-video__icon--login {
  mask-image: var(--str-video__icon--login);
  -webkit-mask-image: var(--str-video__icon--login);
}
.str-video__icon--logout {
  mask-image: var(--str-video__icon--logout);
  -webkit-mask-image: var(--str-video__icon--logout);
}
.str-video__icon--provider-google {
  mask-image: var(--str-video__icon--provider-google);
  -webkit-mask-image: var(--str-video__icon--provider-google);
}
.str-video__icon--person-off {
  mask-image: var(--str-video__icon--person-off);
  -webkit-mask-image: var(--str-video__icon--person-off);
}
.str-video__icon--verified {
  mask-image: var(--str-video__icon--verified);
  -webkit-mask-image: var(--str-video__icon--verified);
}
.str-video__icon--chevron-up {
  mask-image: var(--str-video__icon--chevron-up);
  -webkit-mask-image: var(--str-video__icon--chevron-up);
}
.str-video__icon--chevron-down {
  mask-image: var(--str-video__icon--chevron-down);
  -webkit-mask-image: var(--str-video__icon--chevron-down);
}
.str-video__icon--developer {
  mask-image: var(--str-video__icon--developer);
  -webkit-mask-image: var(--str-video__icon--developer);
}
.str-video__icon--screen-share-on {
  mask-image: var(--str-video__icon--screen-share-on);
  -webkit-mask-image: var(--str-video__icon--screen-share-on);
}
.str-video__icon--screen-share-off {
  mask-image: var(--str-video__icon--screen-share-off);
  -webkit-mask-image: var(--str-video__icon--screen-share-off);
}
.str-video__icon--caret-down {
  transform: rotate(180deg);
  mask-image: var(--str-video__icon--caret);
  -webkit-mask-image: var(--str-video__icon--caret);
}
.str-video__icon--caret-up {
  mask-image: var(--str-video__icon--caret);
  -webkit-mask-image: var(--str-video__icon--caret);
}
.str-video__icon--caret-right {
  transform: rotate(90deg);
  mask-image: var(--str-video__icon--caret);
  -webkit-mask-image: var(--str-video__icon--caret);
}
.str-video__icon--caret-left {
  transform: rotate(-90deg);
  mask-image: var(--str-video__icon--caret);
  -webkit-mask-image: var(--str-video__icon--caret);
}
.str-video__icon--star {
  mask-image: var(--str-video__icon--star);
  -webkit-mask-image: var(--str-video__icon--star);
}
.str-video__icon--close {
  mask-image: var(--str-video__icon--close);
  -webkit-mask-image: var(--str-video__icon--close);
}
.str-video__icon--mic {
  mask-image: var(--str-video__icon--mic);
  -webkit-mask-image: var(--str-video__icon--mic);
}
.str-video__icon--mic-off {
  mask-image: var(--str-video__icon--mic-off);
  -webkit-mask-image: var(--str-video__icon--mic-off);
}
.str-video__icon--more {
  mask-image: var(--str-video__icon--more);
  -webkit-mask-image: var(--str-video__icon--more);
}
.str-video__icon--camera {
  mask-image: var(--str-video__icon--camera);
  -webkit-mask-image: var(--str-video__icon--camera);
}
.str-video__icon--camera-off {
  mask-image: var(--str-video__icon--camera-off);
  -webkit-mask-image: var(--str-video__icon--camera-off);
}
.str-video__icon--camera-off-outline {
  mask-image: var(--str-video__icon--camera-off-outline);
  -webkit-mask-image: var(--str-video__icon--camera-off-outline);
}
.str-video__icon--call-end {
  mask-image: var(--str-video__icon--call-end);
  -webkit-mask-image: var(--str-video__icon--call-end);
}
.str-video__icon--call-accept {
  mask-image: var(--str-video__icon--call-accept);
  -webkit-mask-image: var(--str-video__icon--call-accept);
}
.str-video__icon--info {
  -webkit-mask-image: var(--str-video__icon--info-icon);
  mask-image: var(--str-video__icon--info-icon);
}
.str-video__icon--feedback {
  -webkit-mask-image: var(--str-video__icon--feedback);
  mask-image: var(--str-video__icon--feedback);
}
.str-video__icon--info-document {
  -webkit-mask-image: var(--str-video__icon--info-document);
  mask-image: var(--str-video__icon--info-document);
}
.str-video__icon--stats {
  -webkit-mask-image: var(--str-video__icon--stats);
  mask-image: var(--str-video__icon--stats);
}
.str-video__icon--participants {
  mask-image: var(--str-video__icon--participants);
  -webkit-mask-image: var(--str-video__icon--participants);
}
.str-video__icon--user-plus {
  mask-image: var(--str-video__icon--user-plus);
  -webkit-mask-image: var(--str-video__icon--user-plus);
}
.str-video__icon--speaker {
  mask-image: var(--str-video__icon--speaker);
  -webkit-mask-image: var(--str-video__icon--speaker);
}
.str-video__icon--language {
  mask-image: var(--str-video__icon--language);
  -webkit-mask-image: var(--str-video__icon--language);
}
.str-video__icon--ellipsis {
  mask-image: var(--str-video__icon--ellipsis);
  -webkit-mask-image: var(--str-video__icon--ellipsis);
}
.str-video__icon--grid {
  mask-image: var(--str-video__icon--grid);
  -webkit-mask-image: var(--str-video__icon--grid);
}
.str-video__icon--pin {
  mask-image: var(--str-video__icon--pin);
  -webkit-mask-image: var(--str-video__icon--pin);
}
.str-video__icon--no-audio {
  mask-image: var(--str-video__icon--no-audio);
  -webkit-mask-image: var(--str-video__icon--no-audio);
}
.str-video__icon--not-allowed {
  mask-image: var(--str-video__icon--not-allowed);
  -webkit-mask-image: var(--str-video__icon--not-allowed);
}
.str-video__icon--film-roll {
  mask-image: var(--str-video__icon--film-roll);
  -webkit-mask-image: var(--str-video__icon--film-roll);
}
.str-video__icon--device-settings {
  mask-image: var(--str-video__icon--settings);
  -webkit-mask-image: var(--str-video__icon--settings);
}
.str-video__icon--filter {
  mask-image: var(--str-video__icon--filter);
  -webkit-mask-image: var(--str-video__icon--filter);
}
.str-video__icon--refresh {
  mask-image: var(--str-video__icon--refresh);
  -webkit-mask-image: var(--str-video__icon--refresh);
}
.str-video__icon {
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: contain;
  -webkit-mask-size: contain;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}
.str-video__loading-indicator {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.str-video__loading-indicator__icon.spinner {
  mask-image: var(--str-video__icon--loading);
  -webkit-mask-image: var(--str-video__icon--loading);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: 1rem;
  -webkit-mask-size: 1rem;
  background-color: var(--str-video__text-color2);
  animation: rotation 1s linear infinite;
  width: 1rem;
  height: 1rem;
}
.str-video__menu-container {
  z-index: 2;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.str-video__menu-container::-webkit-scrollbar {
  display: none;
}
.str-video__portal {
  position: fixed;
  z-index: 1;
  width: 100vw;
  height: 100vh;
  background-color: var(--str-video__backdrop1);
  left: 0;
  top: 0;
}
.str-video__portal:hover {
  cursor: pointer;
}
.str-video__portal-content {
  z-index: 2;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.str-video__menu-container {
  background-color: var(--str-video__base-color6);
  border-radius: var(--str-video__border-radius-lg);
  box-shadow: 0 0 24px -4px rgba(0,0,0,0.64);
}
.str-video__generic-menu {
  list-style: none;
  margin: unset;
  padding: var(--str-video__spacing-md);
  display: flex;
  flex-direction: column;
  gap: var(--str-video__spacing-xs);
}
.str-video__generic-menu .str-video__generic-menu--item {
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: var(--str-video__font-size-md);
  display: flex;
}
.str-video__generic-menu .str-video__generic-menu--item button {
  all: unset;
  width: 100%;
  font-size: 13px;
  border-radius: var(--str-video__border-radius-lg);
  background-color: var(--str-video__button-primary-base);
  padding: var(--str-video__spacing-xs) var(--str-video__spacing-lg);
  gap: 10px;
  display: flex;
  align-items: center;
  position: relative;
}
.str-video__generic-menu .str-video__generic-menu--item button:hover {
  background-color: var(--str-video__button-default-hover);
  cursor: pointer;
}
.str-video__generic-menu .str-video__generic-menu--item button--selected,
.str-video__generic-menu .str-video__generic-menu--item button--active {
  background-color: var(--str-video__button-primary-hover);
}
.str-video__generic-menu .str-video__generic-menu--item button[aria-selected] {
  padding: 5px 10px 5px 26px;
}
.str-video__generic-menu .str-video__generic-menu--item button[aria-selected=true]::after {
  content: "●";
  font-size: 10px;
  left: 10px;
  position: absolute;
}
.str-video__notification {
  padding: 0.625rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.str-video__notification .str-video__notification__icon {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
}
.str-video__notification .str-video__notification__message {
  flex: 1;
}
.str-video__notification .str-video__notification__close {
  display: inline-block;
  width: 1rem;
  height: 1rem;
}
.str-video__notification .str-video__notification__close:hover {
  cursor: pointer;
}
.str-video__notification {
  background-color: var(--str-video__background-color1);
  border-radius: var(--str-video__border-radius-xs);
  z-index: 100;
}
.str-video__notification .str-video__notification__icon {
  mask-image: var(--str-video__icon--info-icon);
  -webkit-mask-image: var(--str-video__icon--info-icon);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: 1.5rem;
  -webkit-mask-size: 1.5rem;
  background-color: var(--str-video__text-color1);
}
.str-video__notification .str-video__notification__message {
  font-size: 0.75rem;
}
.str-video__participant-view {
  position: relative;
  width: 100%;
  max-width: 1280px;
  max-height: 100%;
  min-height: 0;
  aspect-ratio: 4/3;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--str-video__border-radius-sm);
}
.str-video__participant-view--speaking {
  outline: 2px solid var(--str-video__primary-color);
}
.str-video__participant-view .str-video__call-controls__button {
  transition: opacity 200ms ease-out;
  opacity: 0.3;
  color: var(--str-video__text-color1);
}
.str-video__participant-view:hover .str-video__call-controls__button {
  opacity: 1;
}
.str-video__participant-view > .str-video__call-controls__button {
  position: absolute;
  top: 0.875rem;
  left: 0.875rem;
  padding: 0.3rem;
}
.str-video__participant-view .str-video__participant-details {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: var(--str-video__spacing-sm);
  border-radius: 0 var(--str-video__border-radius-xs) 0 var(--str-video__border-radius-sm);
  background-color: var(--str-video__background-color4);
}
.str-video__participant-view .str-video__participant-details .str-video__participant-details__name {
  display: flex;
  align-items: center;
  gap: var(--str-video__spacing-sm);
  padding: 4px 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--str-video__font-size-sm);
}
.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--audio-muted {
  width: 1rem;
  height: 1rem;
  mask-size: 1rem;
  -webkit-mask-size: 1rem;
  background-color: var(--str-video__text-color1);
  mask-image: var(--str-video__icon--mic-off);
  -webkit-mask-image: var(--str-video__icon--mic-off);
}
.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--video-muted {
  width: 1rem;
  height: 1rem;
  mask-size: 1rem;
  -webkit-mask-size: 1rem;
  background-color: var(--str-video__text-color1);
  mask-image: var(--str-video__icon--camera-off);
  -webkit-mask-image: var(--str-video__icon--camera-off);
}
.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--pinned {
  cursor: pointer;
  width: 1rem;
  height: 1rem;
  mask-size: 1rem;
  -webkit-mask-size: 1rem;
  background-color: var(--str-video__text-color1);
  width: 0.8rem;
  -webkit-mask-size: 0.8rem;
  height: 1rem;
  mask-size: 0.8rem;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-image: var(--str-video__icon--pin);
  -webkit-mask-image: var(--str-video__icon--pin);
}
.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--network-stats {
  width: 1rem;
  height: 1rem;
  mask-size: 1rem;
  -webkit-mask-size: 1rem;
  background-color: var(--str-video__text-color1);
  background-image: var(--str-video__icon--network-quality);
  cursor: pointer;
  margin-right: 0.625rem;
}
.str-video__participant-view .str-video__participant-details__connection-quality {
  position: absolute;
  bottom: 0;
  right: 0;
  border-radius: var(--str-video__border-radius-sm) 0 var(--str-video__border-radius-sm) 0;
  width: 24px;
  height: 24px;
  display: block;
  background-size: cover;
  background-color: var(--str-video__background-color4);
}
.str-video__participant-view .str-video__participant-details__connection-quality--poor {
  background-image: var(--str-video__icon--connection-quality-poor);
}
.str-video__participant-view .str-video__participant-details__connection-quality--good {
  background-image: var(--str-video__icon--connection-quality-good);
}
.str-video__participant-view .str-video__participant-details__connection-quality--excellent {
  background-image: var(--str-video__icon--connection-quality-excellent);
}
.str-video__speech-indicator {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1px;
  height: 16px;
}
.str-video__speech-indicator .str-video__speech-indicator__bar {
  width: 3px;
  height: 20%;
  background-color: var(--str-video__primary-color);
  border-radius: 2px;
  animation-duration: 0.4s;
  animation-iteration-count: 1;
  animation-name: speech-indicator-silence;
  animation-timing-function: ease-in-out;
}
.str-video__speech-indicator.str-video__speech-indicator--dominant .str-video__speech-indicator__bar {
  background-color: var(--str-video__primary-color);
}
.str-video__speech-indicator.str-video__speech-indicator--speaking .str-video__speech-indicator__bar {
  height: 100%;
  animation-iteration-count: infinite;
}
.str-video__speech-indicator.str-video__speech-indicator--speaking .str-video__speech-indicator__bar:nth-child(1) {
  height: 70%;
  animation-duration: 0.8s;
  animation-name: speech-indicator-quiet;
}
.str-video__speech-indicator.str-video__speech-indicator--speaking .str-video__speech-indicator__bar:nth-child(2) {
  height: 80%;
  animation-duration: 1s;
  animation-name: speech-indicator-loud;
}
.str-video__speech-indicator.str-video__speech-indicator--speaking .str-video__speech-indicator__bar:nth-child(3) {
  height: 60%;
  animation-duration: 0.9s;
  animation-name: speech-indicator-quiet;
}
.str-video__permission-requests {
  background-color: var(--str-video__background-color1);
  border-radius: 8px;
  padding: 10px;
  position: relative;
}
.str-video__permission-requests .str-video__permission-requests__notification,
.str-video__permission-requests .str-video__permission-request {
  display: flex;
  gap: 10px;
  padding: 10px 0;
  align-items: center;
}
.str-video__permission-requests .str-video__permission-requests__notification__message,
.str-video__permission-requests .str-video__permission-request__message {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.str-video__permission-requests .str-video__permission-request__button {
  background-color: transparent;
  border: 1px solid var(--str-video__text-color1);
  border-radius: 4px;
  color: var(--str-video__color1);
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 8px;
  min-width: 120px;
}
.str-video__permission-requests .str-video__permission-request__button--allow {
  background-color: var(--str-video__primary-color);
  border: 1px solid var(--str-video__primary-color);
}
.str-video__permission-requests .str-video__permission-requests-list {
  background-color: var(--str-video__background-color1);
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  padding: 10px;
  width: 100%;
  z-index: 1;
  opacity: 0.9;
  overflow-x: scroll;
  overflow-y: hidden;
}
.str-video__permission-requests .str-video__permission-requests-list::-webkit-scrollbar {
  display: none;
}
.str-video__reaction {
  position: absolute;
  right: 0.875rem;
  top: 0.875rem;
}
.str-video__reaction .str-video__reaction__emoji {
  display: flex;
  line-height: 1;
  font-size: 2.5rem;
}
.str-video__call-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  width: 400px;
  height: 300px;
  padding: 1rem 1rem 0.5rem;
  gap: 1rem;
  position: absolute;
  bottom: 26px;
  right: 16px;
  z-index: 100;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list {
  overflow: hidden;
  display: flex;
  align-items: center;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__avatar {
  width: 80px;
  height: 80px;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__member_details {
  bottom: 10%;
  padding: 0.125rem 0.375rem;
}
.str-video__call-panel--ringing .str-video__pending-call-controls {
  display: flex;
  gap: 0.675rem;
}
.str-video__call-panel {
  background: var(--str-video__background-color3);
  border: 2px solid rgba(200,200,200,0.6);
  border-radius: 10px;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box {
  border-radius: var(--str-video__border-radius-circle);
  background: var(--str-video__background-color6);
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box:before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--str-video__border-radius-circle);
  padding: 4px;
  background: linear-gradient(180deg, var(--str-video__primary-color), var(--str-video__info-color));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__member_details {
  background-color: var(--str-video__background-color4);
  color: var(--str-video__text-color1);
  border-radius: 4px;
  font-size: 12px;
  line-height: 16px;
}
.str-video__screen-share-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: absolute;
  width: 100%;
  height: 100%;
  gap: 1.8rem;
}
.str-video__screen-share-overlay > .str-video__icon {
  width: 4rem;
  height: 4rem;
}
.str-video__screen-share-overlay .str-video__screen-share-overlay__button {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  padding-inline: 1.6rem;
  padding-block: 0.8rem;
}
.str-video__screen-share-overlay .str-video__screen-share-overlay__button .str-video__icon {
  width: 0.7rem;
  height: 0.7rem;
}
.str-video__screen-share-overlay {
  background: var(--str-video__overlay-color);
  backdrop-filter: blur(3px);
  border-radius: inherit;
}
.str-video__screen-share-overlay .str-video__screen-share-overlay__title {
  font-size: 1.3rem;
}
.str-video__screen-share-overlay .str-video__screen-share-overlay__button {
  color: #fff;
  background: var(--str-video__danger-color);
  border-radius: var(--str-video__border-radius-xs);
}
.str-video__screen-share-overlay .str-video__screen-share-overlay__button:hover {
  background-color: var(--str-video__danger-color--accent);
}
.str-video__search-input__container {
  display: flex;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  margin-inline: -0.25rem;
}
.str-video__search-input__container input {
  flex: 1;
  min-width: 0;
}
.str-video__search-input__container .str-video__search-input__clear-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.str-video__search-input__container .str-video__search-input__icon {
  padding: 0.25rem;
}
.str-video__search-input__container .str-video__search-input__icon--active,
.str-video__search-input__container .str-video__search-input__icon {
  display: inline-block;
  width: 1.125rem;
  height: 1.125rem;
}
.str-video {
  --str-video__search-input__container--color: var(--str-video__text-color1);
  --str-video__search-input__container--background-color: var(--str-video__background-color0);
  --str-video__search-input__container--border-radius: var(--str-video__border-radius-circle);
  --str-video__search-input__container--border-block-start: 1px solid transparent;
  --str-video__search-input__container--border-block-end: 1px solid transparent;
  --str-video__search-input__container--border-inline-start: 1px solid transparent;
  --str-video__search-input__container--border-inline-end: 1px solid transparent;
  --str-video__search-input__placeholder-color: var(--str-video__text-color2);
  --str-video__search-input__icon--color: var(--str-video__text-color1);
}
.str-video__search-input__container.str-video__search-input__container--active {
  border-color: var(--str-video__primary-color);
}
.str-video__search-input__container {
  background: var(--str-video__search-input__container--background-color);
  color: var(--str-video__search-input__container--color);
  box-shadow: var(--str-video__search-input__container--box-shadow);
  border-radius: var(--str-video__search-input__container--border-radius);
  border-block-start: var(--str-video__search-input__container--border-block-start);
  border-block-end: var(--str-video__search-input__container--border-block-end);
  border-inline-start: var(--str-video__search-input__container--border-inline-start);
  border-inline-end: var(--str-video__search-input__container--border-inline-end);
}
.str-video__search-input__container input {
  background-color: transparent;
  border: none;
  outline: none;
  color: inherit;
  font-size: 13px;
}
.str-video__search-input__container input::placeholder {
  color: var(--str-video__search-input__placeholder-color);
}
.str-video__search-input__container .str-video__search-input__icon {
  mask-image: var(--str-video__icon--magnifier-glass);
  -webkit-mask-image: var(--str-video__icon--magnifier-glass);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: 0.75rem 0.75rem;
  -webkit-mask-size: 0.75rem 0.75rem;
  background-color: var(--str-video__search-input__icon--color);
}
.str-video__search-input__container .str-video__search-input__clear-btn {
  background-color: transparent;
  border-radius: var(--str-video__border-radius-circle);
  border: none;
}
.str-video__search-input__container .str-video__search-input__clear-btn:hover {
  cursor: pointer;
}
.str-video__search-input__container .str-video__search-input__clear-btn .str-video__search-input__icon--active {
  mask-image: var(--str-video__icon--close);
  -webkit-mask-image: var(--str-video__icon--close);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-position: center;
  mask-size: 0.75rem 0.75rem;
  -webkit-mask-size: 0.75rem 0.75rem;
  background-color: var(--str-video__search-input__icon--color);
}
.str-video__call {
  background-color: var(--str-video__background-color2);
  color: var(--str-video__text-color1);
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  display: flex;
  flex-direction: column;
}
.str-video__call .str-video {
  background-color: var(--str-video__background-color2);
  color: var(--str-video__text-color1);
}
.str-video__tooltip {
  display: flex;
  justify-content: center;
  padding: var(--str-video__spacing-sm);
  z-index: 4;
  max-width: 250px;
  width: max-content;
  white-space: initial;
  overflow-wrap: break-word;
}
.str-video {
/* The border radius used for the borders of the component */
  --str-video__tooltip--border-radius: var(--str-video__border-radius-xs);
/* The text/icon color of the component */
  --str-video__tooltip--color: var(--str-video__text-color1);
/* The background color of the component */
  --str-video__tooltip--background-color: var(--str-video__button-default-hover);
/* Top border of the component */
  --str-video__tooltip--border-block-start: none;
/* Bottom border of the component */
  --str-video__tooltip--border-block-end: none;
/* Left (right in RTL layout) border of the component */
  --str-video__tooltip--border-inline-start: none;
/* Right (left in RTL layout) border of the component */
  --str-video__tooltip--border-inline-end: none;
/* Box shadow applied to the component */
  --str-video__tooltip--box-shadow: none;
}
.str-video__tooltip {
  background: var(--str-video__tooltip--background-color);
  color: var(--str-video__tooltip--color);
  box-shadow: var(--str-video__tooltip--box-shadow);
  border-radius: var(--str-video__tooltip--border-radius);
  border-block-start: var(--str-video__tooltip--border-block-start);
  border-block-end: var(--str-video__tooltip--border-block-end);
  border-inline-start: var(--str-video__tooltip--border-inline-start);
  border-inline-end: var(--str-video__tooltip--border-inline-end);
  font-size: 14px;
  line-height: 1rem;
}
.str-video__tooltip::after {
  background-color: var(--str-video__tooltip-background-color);
}
.str-video__video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  pointer-events: none;
}
.str-video__video--tall {
  object-fit: contain;
}
.str-video__video--mirror {
  transform: scaleX(-1);
}
.str-video__video {
  background-color: var(--str-video__background-color5);
}
.str-video__video-placeholder {
  aspect-ratio: 4/3;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.str-video__video-placeholder .str-video__video-placeholder__avatar {
  width: 100px;
  height: 100px;
  object-fit: cover;
}
.str-video__video-placeholder .str-video__video-placeholder__initials-fallback {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
}
.str-video__video-placeholder {
  background: var(--str-video__base-color6);
  border-radius: inherit;
}
.str-video__video-placeholder .str-video__video-placeholder__avatar {
  border-radius: var(--str-video__border-radius-circle);
}
.str-video__video-placeholder .str-video__video-placeholder__initials-fallback {
  background-color: var(--str-video__primary-color);
  border-radius: var(--str-video__border-radius-circle);
  font-size: 32px;
  font-weight: 600;
  text-transform: uppercase;
}
.str-video__video-preview-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 500px;
  height: 375px;
}
.str-video__video-preview-container .str-video__video-preview {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.str-video__video-preview-container .str-video__loading-indicator__icon {
  height: 3rem;
  width: 3rem;
  mask-size: 3rem;
}
.str-video__video-preview-container .str-video__video-preview--mirror {
  transform: scaleX(-1);
}
.str-video__video-preview-container .str-video__video-preview--loading {
  display: none;
}
.str-video {
/* The font color applied inside the component */
  --str-video__video-preview-container--color: var(--str-video__text-color1);
/* The background color of the component */
  --str-video__video-preview-container--background-color: var(--str-video__background-color5);
/* The border radius used for the borders of the component */
  --str-video__video-preview-container--border-radius: var(--str-video__border-radius-xs);
/* The border used for the borders of the component */
  --str-video__video-preview-container--border-block-start: 4px solid var(--str-video__primary-color);
/* The border used for the borders of the component */
  --str-video__video-preview-container--border-block-end: 4px solid var(--str-video__primary-color);
/* The border used for the borders of the component */
  --str-video__video-preview-container--border-inline-start: 4px solid var(--str-video__primary-color);
/* The border used for the borders of the component */
  --str-video__video-preview-container--border-inline-end: 4px solid var(--str-video__primary-color);
}
.str-video__video-preview-container {
  background: var(--str-video__video-preview-container--background-color);
  color: var(--str-video__video-preview-container--color);
  box-shadow: var(--str-video__video-preview-container--box-shadow);
  border-radius: var(--str-video__video-preview-container--border-radius);
  border-block-start: var(--str-video__video-preview-container--border-block-start);
  border-block-end: var(--str-video__video-preview-container--border-block-end);
  border-inline-start: var(--str-video__video-preview-container--border-inline-start);
  border-inline-end: var(--str-video__video-preview-container--border-inline-end);
  overflow: hidden;
}
@-moz-keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-o-keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes speech-indicator-silence {
  25% {
    transform: scaleY(2);
  }
  50% {
    transform: scaleY(2.5);
  }
  75% {
    transform: scaleY(1);
  }
}
@-webkit-keyframes speech-indicator-silence {
  25% {
    transform: scaleY(2);
  }
  50% {
    transform: scaleY(2.5);
  }
  75% {
    transform: scaleY(1);
  }
}
@-o-keyframes speech-indicator-silence {
  25% {
    transform: scaleY(2);
  }
  50% {
    transform: scaleY(2.5);
  }
  75% {
    transform: scaleY(1);
  }
}
@keyframes speech-indicator-silence {
  25% {
    transform: scaleY(2);
  }
  50% {
    transform: scaleY(2.5);
  }
  75% {
    transform: scaleY(1);
  }
}
@-moz-keyframes speech-indicator-quiet {
  25% {
    transform: scaleY(0.5);
  }
  50% {
    transform: scaleY(0.3);
  }
  75% {
    transform: scaleY(0.5);
  }
}
@-webkit-keyframes speech-indicator-quiet {
  25% {
    transform: scaleY(0.5);
  }
  50% {
    transform: scaleY(0.3);
  }
  75% {
    transform: scaleY(0.5);
  }
}
@-o-keyframes speech-indicator-quiet {
  25% {
    transform: scaleY(0.5);
  }
  50% {
    transform: scaleY(0.3);
  }
  75% {
    transform: scaleY(0.5);
  }
}
@keyframes speech-indicator-quiet {
  25% {
    transform: scaleY(0.5);
  }
  50% {
    transform: scaleY(0.3);
  }
  75% {
    transform: scaleY(0.5);
  }
}
@-moz-keyframes speech-indicator-loud {
  25% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.45);
  }
  75% {
    transform: scaleY(1.1);
  }
}
@-webkit-keyframes speech-indicator-loud {
  25% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.45);
  }
  75% {
    transform: scaleY(1.1);
  }
}
@-o-keyframes speech-indicator-loud {
  25% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.45);
  }
  75% {
    transform: scaleY(1.1);
  }
}
@keyframes speech-indicator-loud {
  25% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.45);
  }
  75% {
    transform: scaleY(1.1);
  }
}

.ChannelSearch {
  position: relative;
  display: flex;
  align-items: center;
  padding: 20px;
}
.ChannelSearch__Input {
  display: flex;
  align-items: center;
  height: 40px;
  border-radius: 10px;
  border: 1px solid #d1d1d1;
  color: #000;
}
.ChannelSearch__Input:focus-within {
  border-color: #16a085;
}
.ChannelSearch__Input input {
  background: none;
  border: none;
  outline: none;
  font-size: 16px;
  width: 310px;
  padding-left: 10px;
  min-width: 0;
  font-weight: 600;
}
.ChannelSearch__Input--Icon {
  width: 32px;
  display: flex;
  justify-content: center;
}

.ChannelSearchContainer {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #d1d1d1;
}
.ChannelSearchContainer__ChatIcon {
  display: flex;
  align-items: center;
  padding: 5px 5px;
  font-size: 25px;
  border-radius: 6px;
  background: #16a085;
  color: #fff;
  cursor: pointer;
}

.MentionChannel__Name {
  padding: 5px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
  font-weight: 700;
  color: #000;
  font-size: 15px;
}
.MentionChannel__Group svg {
  position: relative;
  top: 5px;
  padding-right: 2px;
  width: 16px;
  height: 20px;
}
.MentionChannel__Dm {
  text-transform: capitalize;
}
.MentionChannel__Message {
  gap: 10px;
  padding: 8px 0;
  position: relative;
  display: flex;
}
.MentionChannel__Message--Redirect:hover {
  background: #e1f3ec !important;
  cursor: pointer;
}
.MentionChannel__Message--Group {
  gap: 10px;
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.MentionChannel__Message--Group ._Button {
  padding: 5px 0;
  border: none;
  background: none;
  color: #16a085;
}
.MentionChannel__Message--Group ._Button:focus {
  box-shadow: none;
  border-color: none;
}
.MentionChannel__Message--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}
.MentionChannel__Message--Author {
  text-transform: capitalize;
  font-weight: 600;
  font-size: 15px;
  margin-right: 8px;
  color: #000;
}
.MentionChannel__Message .avatar-host {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
}
.MentionChannel__Message .avatar-host img {
  border-radius: 5px;
}
.MentionChannel__Message--Text {
  overflow-wrap: break-word;
  font-size: 14px;
}
.MentionChannel__Message:hover {
  background: none;
}
.MentionChannel__MessageInput--Wrapper {
  padding: 10px 5px;
  background: none;
  display: flex;
  align-items: center;
  width: 100%;
  flex-direction: column;
}
.MentionChannel__MessageInput--Input {
  overflow: hidden;
  width: 100%;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,0.2);
}
.MentionChannel__MessageInput--Input:focus-within {
  border-color: #16a085;
}
.MentionChannel__MessageInput--Top {
  min-height: 43px;
  width: 100%;
  background: #fff;
}
.MentionChannel__MessageInput--Form {
  background: #f0f0f0;
  display: flex;
  align-items: center;
  padding-right: 10px;
}
.MentionChannel__MessageInput--Form ._Button {
  padding: 7px;
}
.MentionChannel__MessageInput--Form ._Button:focus {
  box-shadow: none;
  border-color: none;
}
.MentionChannel__MessageInput--Textarea {
  flex: 1 1;
}
.MentionChannel__MessageInput--Textarea textarea {
  background: #f0f0f0;
  font-size: 15px !important;
  overflow: hidden;
  height: 51px !important;
  width: 100%;
  resize: none;
  padding: 16px 10px;
  border: none;
  color: #000;
}
.MentionChannel__MessageInput--sendButton {
  border: none;
}
.MentionChannel__MessageInput--sendButton:disabled svg {
  color: #000;
  opacity: 0.6;
}
.MentionChannel__MessageInput--Emoji {
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border-radius: 5px;
  border: none;
  background: transparent;
  cursor: pointer;
}
.MentionChannel__MessageInput--Emoji svg {
  width: 30px;
  height: 16px;
}
.MentionChannel__MessageInput--Emoji svg path {
  fill-opacity: 0.2;
  fill: #000;
}
.MentionChannel__MessageInput--Emoji:hover path {
  fill: #16a085;
  fill-opacity: 1;
}
.MentionChannel__MessageInput--previewImage {
  padding: 2px 5px;
  position: relative;
  background: #ececec;
}
.MentionChannel__MessageInput--previewImage img {
  width: 100px;
  height: 100px;
}
.MentionChannel__MessageInput--previewImage svg {
  color: #fff;
  position: absolute;
  top: 2px;
  left: 80px;
  background-color: rgba(0,0,0,0.2);
  border-radius: 999px;
  border: none;
  display: flex;
  cursor: pointer;
  width: 24px;
  height: 24px;
}

.MentionChannel__Container {
  background: #fff;
  margin-bottom: 15px;
  padding: 10px 15px;
  box-shadow: 0 0 2px rgba(0,0,0,0.25);
}
.MentionChannel__NoData img {
  width: 100%;
}

.MentionChannel {
  background: #fff;
  height: 100%;
}
.MentionChannel__Header {
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  padding: 0 20px;
  border-bottom: 1px solid #d1d1d1;
}
.MentionChannel__Header p {
  color: #000;
  font-weight: 700;
  font-size: 16px;
}
.MentionChannel__Wrapper {
  background: #f0f0f0;
  overflow-x: hidden;
  overflow-y: auto;
  height: 90%;
}
.MentionChannel__Icon {
  display: flex;
  align-items: center;
}
.MentionChannel__Icon svg {
  cursor: pointer;
  height: 34px;
  width: 18px;
}

.ThreadChannel__Name {
  padding: 5px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
  font-weight: 700;
  color: #000;
  font-size: 15px;
  cursor: pointer;
}
.ThreadChannel__Group svg {
  position: relative;
  top: 5px;
  padding-right: 2px;
  width: 16px;
  height: 20px;
}
.ThreadChannel__Dm {
  text-transform: capitalize;
}
.ThreadChannel__Participants {
  display: flex;
  font-size: 12px;
  font-weight: 400;
  padding-top: 5px;
  white-space: break-spaces;
}
.ThreadChannel__Participants span {
  text-transform: capitalize;
}
.ThreadChannel__Message {
  gap: 10px;
  padding: 8px 0px;
  display: flex;
}
.ThreadChannel__Message--Group {
  gap: 10px;
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ThreadChannel__Message--Group ._Button {
  padding: 5px 0;
  border: none;
  background: none;
  color: #16a085;
}
.ThreadChannel__Message--Group ._Button:focus {
  box-shadow: none;
  border-color: none;
}
.ThreadChannel__Message--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}
.ThreadChannel__Message--Author {
  text-transform: capitalize;
  font-weight: 600;
  font-size: 15px;
  margin-right: 8px;
  color: #000;
}
.ThreadChannel__Message .avatar-host {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
}
.ThreadChannel__Message .avatar-host img {
  border-radius: 5px;
}
.ThreadChannel__Message--Text {
  overflow-wrap: break-word;
  font-size: 14px;
}
.ThreadChannel__Message:hover {
  background: none;
}
.ThreadChannel__MessageInput--Wrapper {
  padding: 10px 5px;
  display: flex;
  align-items: center;
  width: 100%;
  flex-direction: column;
}
.ThreadChannel__MessageInput--Input {
  overflow: hidden;
  width: 100%;
  border-radius: 18px;
  border: 1px solid #d1d1d1;
}
.ThreadChannel__MessageInput--Input:focus-within {
  border-color: #16a085;
}
.ThreadChannel__MessageInput--Top {
  min-height: 43px;
  width: 100%;
  background: #fff;
}
.ThreadChannel__MessageInput--Form {
  background: #f0f0f0;
  display: flex;
  align-items: center;
  padding-right: 10px;
}
.ThreadChannel__MessageInput--Form ._Button {
  padding: 7px;
}
.ThreadChannel__MessageInput--Form ._Button:focus {
  box-shadow: none;
  border-color: none;
}
.ThreadChannel__MessageInput--sendButton {
  background: #16a085 !important;
  border: none;
}
.ThreadChannel__MessageInput--sendButton:disabled svg {
  color: #4a4a4a;
  opacity: 0.6;
}
.ThreadChannel__MessageInput--Textarea {
  flex: 1 1;
}
.ThreadChannel__MessageInput--Textarea textarea {
  background: #f0f0f0;
  font-size: 15px !important;
  overflow: hidden;
  height: 51px !important;
  width: 100%;
  resize: none;
  padding: 16px 10px;
  border: none;
  color: #000;
}
.ThreadChannel__MessageInput--Emoji {
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border-radius: 5px;
  border: none;
  background: transparent;
  cursor: pointer;
}
.ThreadChannel__MessageInput--Emoji svg {
  width: 30px;
  height: 16px;
}
.ThreadChannel__MessageInput--Emoji svg path {
  fill-opacity: 0.2;
  fill: #000;
}
.ThreadChannel__MessageInput--Emoji:hover path {
  fill: #16a085;
  fill-opacity: 1;
}
.ThreadChannel__MessageInput--previewImage {
  padding: 2px 5px;
  position: relative;
  background: #ececec;
}
.ThreadChannel__MessageInput--previewImage img {
  width: 100px;
  height: 100px;
}
.ThreadChannel__MessageInput--previewImage svg {
  color: #fff;
  position: absolute;
  top: 2px;
  left: 80px;
  background-color: rgba(0,0,0,0.2);
  border-radius: 999px;
  border: none;
  display: flex;
  cursor: pointer;
  width: 24px;
  height: 24px;
}

.ThreadChannel__Container {
  background: #fff;
  margin-bottom: 15px;
  padding: 10px 15px;
  box-shadow: 0 0 2px rgba(0,0,0,0.25);
}
.ThreadChannel__NoData img {
  width: 100%;
}

.ThreadChannel {
  background: #fff;
  height: 100%;
}
.ThreadChannel__Header {
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  padding: 0 20px;
  border-bottom: 1px solid #d1d1d1;
}
.ThreadChannel__Header p {
  color: #000;
  font-weight: 700;
  font-size: 16px;
}
.ThreadChannel__Wrapper {
  background: #f0f0f0;
  overflow-x: hidden;
  overflow-y: auto;
  height: 90%;
}
.ThreadChannel__Icon {
  display: flex;
  align-items: center;
}
.ThreadChannel__Icon svg {
  cursor: pointer;
  height: 34px;
  width: 18px;
}

.TeamChannelList {
  width: 100%;
  background: #fff;
  position: relative;
  color: #000;
}
.TeamChannelList__Message {
  padding: 0 16px;
}
.TeamChannelList__Message--Loading {
  height: 115px;
  padding: 0 20px;
}
.TeamChannelList__Header {
  display: flex;
  align-items: center;
  padding: 0 16px;
}
.TeamChannelList__Header--Title {
  font-weight: bold;
  height: 16px;
  margin-bottom: 10px;
  margin-right: 10px;
  color: #000;
}
.TeamChannelList__Add {
  background: #16a085;
  color: #fff;
  padding: 2px;
  border-radius: 5px;
  cursor: pointer;
}
.TeamChannelList__Options {
  width: 150px;
  position: absolute;
  z-index: 1000;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
  left: 70px;
  top: 30px;
}
.TeamChannelList__Options ._Group {
  width: 100%;
}
.TeamChannelList__Option {
  line-height: 32px;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
.TeamChannelList__Option:hover {
  background: #e1f3ec;
}
.TeamChannelList__Icon {
  position: relative;
  padding-right: 5px;
  top: 2px;
}
.TeamChannelList__Create {
  padding: 0 28px;
  display: flex;
  align-items: center;
}
.TeamChannelList__Create--Group {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.TeamChannelList__Create ._Button {
  color: #16a085;
  background: #fff;
  border: none;
  font-weight: 600;
  font-size: 14px;
}
.TeamChannelList__Create ._Button:focus {
  box-shadow: none;
  border-color: none;
}

.ChannelPreview {
  display: flex;
  align-items: center;
  width: 97%;
  justify-content: space-between;
  background: transparent;
  cursor: pointer;
  font-weight: 400;
}
.ChannelPreview__Selected {
  display: flex;
  align-items: center;
  height: 37px;
}
.ChannelPreview:hover {
  background: #e1f3ec;
  border-radius: 8px;
  font-weight: bold;
}
.ChannelPreview__Item {
  display: flex;
  align-items: center;
  max-width: 350px;
  height: 100%;
  width: 100%;
  padding-left: 26px;
}
.ChannelPreview__Item span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  padding: 12px 0;
}
.ChannelPreview__Item--directMessage {
  text-transform: capitalize;
}
.ChannelPreview__Item--Single .str-chat__avatar {
  margin-right: 12px;
}
.ChannelPreview__Item--Multi .str-chat__avatar {
  margin-right: 0;
}
.ChannelPreview__Item--Multi span:first-child {
  position: relative;
  z-index: 3;
  bottom: 6px;
}
.ChannelPreview__Item--Multi div:nth-child(2) {
  position: relative;
  right: 10px;
  z-index: 2;
  margin-bottom: 0;
}
.ChannelPreview__Item--Unread {
  background-color: #f35468;
  position: relative;
  padding: 0px 12px;
  border-radius: 15px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 34px;
}
.ChannelPreview__Item--Highlighted {
  font-weight: bold;
  color: #000;
}
.ChannelPreview__Icons {
  position: relative;
  top: 2px;
  padding-right: 5px !important;
}
.str-chat__load-more-button {
  display: none;
}
.str-chat-channel-list {
  height: fit-content;
}
.str-chat-channel-list .str-chat__channel-list-empty {
  display: none;
}
.str-chat-channel-list .str-chat__channel-list-empty-v1 {
  position: relative;
  left: 16px;
}

.SavedItemScreen {
  background: #fff;
  margin-bottom: 15px;
  padding: 10px 15px;
  box-shadow: 0 0 2px rgba(0,0,0,0.25);
  color: #000;
}
.SavedItemScreen__Name {
  padding: 5px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
  font-weight: 700;
  font-size: 15px;
  width: 370px;
}
.SavedItemScreen__Group svg {
  position: relative;
  top: 5px;
  padding-right: 2px;
  width: 16px;
  height: 20px;
}
.SavedItemScreen__Dm {
  text-transform: capitalize;
}
.SavedItemScreen__Message {
  cursor: pointer;
  gap: 10px;
  padding: 8px 5px;
  position: relative;
  display: flex;
}
.SavedItemScreen__Message:hover {
  background: #e1f3ec;
}
.SavedItemScreen__Message--Group {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.SavedItemScreen__Message--Meta {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
}
.SavedItemScreen__Message--Author {
  text-transform: capitalize;
  font-weight: 600;
  font-size: 15px;
  margin-right: 8px;
}
.SavedItemScreen__Message--Text {
  overflow-wrap: break-word;
  font-size: 14px;
}
.SavedItemScreen__Check svg path {
  fill-opacity: 0.5;
}
.SavedItemScreen__Check:hover {
  cursor: pointer;
}
.SavedItemScreen__Check:hover path {
  fill-opacity: 1;
}
.SavedItemScreen__Title {
  display: flex;
  justify-content: space-between;
  font-size: 15px;
  font-weight: 700;
  padding: 5px 0;
  align-items: center;
}
.SavedItemScreen__Title span svg {
  position: relative;
  top: 3px;
}

.SavedForLaterScreen {
  background: #fff;
  height: 100%;
  color: #000;
}
.SavedForLaterScreen__Header {
  height: 62px;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  padding: 0 20px;
  border-bottom: 1px solid #d1d1d1;
}
.SavedForLaterScreen__Header p {
  color: #000;
  font-weight: 700;
  font-size: 16px;
}
.SavedForLaterScreen__Icon {
  display: flex;
  align-items: center;
}
.SavedForLaterScreen__Icon svg {
  cursor: pointer;
  height: 34px;
  width: 18px;
}
.SavedForLaterScreen__Buttons {
  display: flex;
  border-bottom: 1px solid #d1d1d1;
}
.SavedForLaterScreen__Pending {
  cursor: pointer;
  padding: 8px 20px;
}
.SavedForLaterScreen__Pending--Active {
  font-weight: bold;
  border-bottom: 1px solid #4a4a4a;
}
.SavedForLaterScreen__Complete {
  cursor: pointer;
  padding: 8px 20px;
}
.SavedForLaterScreen__Complete--Active {
  font-weight: bold;
  border-bottom: 1px solid #4a4a4a;
}
.SavedForLaterScreen__Wrapper {
  background: #f0f0f0;
  height: 88%;
  overflow-x: hidden;
}
.SavedForLaterScreen__NoData img {
  width: 100%;
}

.Sidebar {
  display: flex;
  height: 100%;
  background: #fff;
  color: #000;
}
.Sidebar__Chats {
  overflow: scroll;
  overflow-x: hidden;
}
.Sidebar__ChannelList {
  display: flex;
  flex-direction: column;
  width: 435px;
}
.Sidebar__ChannelList--Header {
  padding-inline: 16px;
}
.Sidebar__ChannelList--Navigation {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  justify-content: space-between;
  border-bottom: 1px solid #d1d1d1;
}
.Sidebar__ChannelList--Navigation p {
  margin: 3px 0;
}
.Sidebar__ChannelList--Items {
  cursor: pointer;
  border: 1px solid #d1d1d1;
  width: 30%;
  padding: 10px 5px;
  border-radius: 10px;
  height: 80px;
  position: relative;
}
.Sidebar__ChannelList--Items svg {
  width: 20px;
  height: 20px;
}
.Sidebar__ChannelList--Unread {
  background: #f0f0f0;
}
.Sidebar__ChannelList--Unread p {
  color: #000;
  font-weight: bold;
}
.Sidebar__ChannelList--Badge {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #f35468;
  border-radius: 10px;
  top: 7px;
  left: 18px;
}
.Sidebar__ChannelList--Channel {
  border-bottom: 1px solid #d1d1d1;
  padding-bottom: 5px;
}
.Sidebar__ChannelList--saveIcon {
  fill: #000;
}
.Sidebar__Search {
  position: relative;
}

.AdminPanelFooter {
  height: 82px;
  padding: 10px 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.AdminPanelFooter button {
  padding: 10px 20px;
  margin-right: 20px;
}
.AdminPanelFooter ._Button--Disabled {
  background-color: #d1d1d1 !important;
}

.ValidationError {
  color: #f35468;
  font-size: 14px;
  line-height: 20px;
  padding-bottom: 10px;
}

.ChannelNameInput {
  display: flex;
  flex-direction: column;
  padding: 0px 20px;
  padding-bottom: 15px;
  color: #000;
}
.ChannelNameInput span {
  padding: 10px 0;
  font-weight: bold;
  font-size: 16px;
}
.ChannelNameInput h2 {
  height: auto;
  padding: 0;
}
.ChannelNameInput input {
  height: 50px;
  width: 100%;
  max-width: 540px;
  padding-left: 16px;
  font-size: 18px;
  background: #f1f3f7;
  border: 1px solid #d1d1d1;
  border-radius: 8px;
}
.ChannelNameInput input:focus {
  border: 1px solid #16a085;
  outline: none;
}
.ChannelNameInput__Message {
  padding-top: 10px;
  font-weight: bold;
}

.ChannelAccess {
  padding-left: 20px;
  color: #000;
}
.ChannelAccess span {
  padding: 10px 0;
  font-weight: bold;
  font-size: 16px;
}
.ChannelAccess__Option {
  display: flex;
  align-items: center;
  padding: 10px 0;
}
.ChannelAccess__Option input {
  cursor: pointer;
}
.ChannelAccess__Option label {
  padding-left: 10px;
  cursor: pointer;
}

.UserList__Row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 8px;
  padding-inline: 10px;
  gap: 10px;
}
.UserList__Row:hover {
  background: #e1f3ec;
  cursor: pointer;
}
.UserList__Row p {
  margin: 0;
}
.UserList__Column {
  width: 90%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.UserList__Column--UserData {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  overflow: hidden;
  color: #000;
}
.UserList__Column--Checkbox {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.UserList__Column--Checkbox input:hover {
  cursor: pointer;
}
.UserList__Column--Checkbox input:disabled:hover {
  cursor: default;
}

.UserList {
  position: relative;
  height: fit-content;
  width: 396px;
  z-index: 10;
  left: 20px;
  background: #fff;
  border: 1px solid #ececec;
  box-shadow: 0 2px 4px rgba(0,0,0,0.06);
  border-radius: 8px;
  max-height: 350px;
  overflow-y: auto;
}
.UserList h2 {
  border-bottom: 1px solid #d1d1d1;
  height: auto;
}

.UserList__Message {
  margin: 20px;
}
.UserList__Search input {
  width: 362px;
}

.AdminPanelForm {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ChannelMemberList {
  position: relative;
  max-height: 350px;
  overflow-y: auto;
  width: 396px;
  left: 20px;
  margin-top: 10px;
}
.ChannelMemberList .ChannelMember {
  background: #fff;
  border: 1px solid #ececec;
  box-shadow: 0 2px 4px rgba(0,0,0,0.06);
  border-radius: 8px;
}
.ChannelMemberList .ChannelMember h2 {
  border-bottom: 1px solid #ececec;
  height: auto;
}
.ChannelMemberList .ChannelMember__Row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 8px;
  padding-inline: 10px;
  gap: 10px;
}
.ChannelMemberList .ChannelMember__Row p {
  margin: 0;
}
.ChannelMemberList .ChannelMember__Block {
  width: 90%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.ChannelMemberList .ChannelMember__userData {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  overflow: hidden;
}
.ChannelMemberList .ChannelMember__Admin {
  width: 150px;
  background: #e1f3ec;
  font-weight: bold;
  text-align: center;
}

.ChannelSetting {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  background-color: #e1f3ec;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  margin: 5px;
}
.ChannelSetting__Info {
  display: flex;
  flex-direction: column;
}
.ChannelSetting__Title {
  font-size: 14px;
  font-weight: bold;
  margin: 0;
}
.ChannelSetting__Name {
  font-size: 16px;
  margin: 0;
  max-width: 350px;
  word-wrap: break-word;
}
.ChannelSetting__Name span svg {
  position: relative;
  top: 4px;
  padding-right: 4px;
}
.ChannelSetting__Validation {
  border-bottom: 1px solid #d1d1d1;
  padding: 10px 10px 0 10px;
  font-weight: bold;
}
.ChannelSetting__Input {
  font-size: 16px;
  padding: 5px;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  width: 350px;
}
.ChannelSetting__EditButton {
  background: none;
  color: #75cbad;
  border: none;
  font-size: 14px;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
  position: relative;
  top: 3px;
}
.ChannelSetting__EditButton:hover {
  opacity: 0.8;
}

.EditChannel {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: #000;
}
.EditChannel__Buttons {
  display: flex;
  border-bottom: 1px solid #d1d1d1;
}
.EditChannel__Members {
  cursor: pointer;
  padding: 8px 20px;
}
.EditChannel__Members--Active {
  font-weight: bold;
  border-bottom: 1px solid #4a4a4a;
}
.EditChannel__Settings {
  cursor: pointer;
  padding: 8px 20px;
}
.EditChannel__Settings--Active {
  font-weight: bold;
  border-bottom: 1px solid #4a4a4a;
}
.EditChannel__Wrapper {
  overflow-y: scroll;
}

.NewMessageUserList {
  position: relative;
}
.NewMessageUserList input {
  width: 362px;
}

.NewMessageChannel {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.BrowseChannelList {
  position: relative;
}
.BrowseChannelList input {
  width: 362px;
}

.BrowseChannel {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.NewGroupChannel {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.WebChat {
  height: 100%;
  background: #fff;
}
.WebChat .Channel__Container {
  height: 90%;
}
.--isMobile .WebChat {
  padding-bottom: 0px !important;
}

.App {
  display: grid;
  grid-template-rows: 80px 1fr;
  overflow: auto;
  position: relative;
}
.App--withOverlay::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(117,203,173,0.3);
  z-index: 99;
}
.App--withAsideNav {
  padding-right: 60px;
}
.App--withSidebar {
  padding-right: 500px;
}
.App--isMobile,
.App--isTablet {
  grid-template-rows: 55px 1fr;
}
.App:not(.App--isMobile) .App__Body {
  overflow-y: hidden;
  overflow-x: auto;
}
.App--withBlockingOverlay {
  position: absolute;
  z-index: 100;
  background: rgba(217,217,217,0.9);
  width: 100%;
  height: 100%;
}
.App--withBottomNav {
  grid-template-rows: 55px 1fr 55px;
}
.App--withBottomNav .App__Body {
  overflow-y: auto;
}
.App--withBottomNav .App__Body > div {
  padding-bottom: 60px;
}
.App--withBottomNav .Module {
  height: auto;
}

.Fingerprint__Async {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 50px;
  width: 100%;
  height: 100%;
  background: rgba(225,243,236,0.9);
  color: #16a085;
  text-align: center;
}
.Fingerprint__Header {
  font-size: 1.1rem;
  line-height: 1.4em;
  padding: 10px 0;
}
.Fingerprint__Icon {
  height: 100%;
}
.Fingerprint__Icon svg {
  width: 100%;
  height: 100%;
}
.Fingerprint__Footer {
  padding: 10px 0;
}

.WidgetModal {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.WidgetModal__WithImage {
  display: flex;
  align-items: center;
}
.WidgetModal__WithImage img {
  width: 33px;
  margin-right: 10px;
}
.WidgetModal__WithImage p {
  text-align: left;
}
.WidgetModal__IconButton {
  width: 1.5rem;
  height: 1.5rem;
}
.WidgetModal__Table td:not(:last-child) {
  padding-right: 5px;
}
.WidgetModal__Back {
  position: absolute;
  left: 10px;
  top: 10px;
}
.WidgetModal__Title {
  padding: 18px 10px 0 10px;
  font-size: 13px;
  font-weight: 700;
}
.WidgetModal__Actions {
  padding: 10px;
  display: flex;
  gap: 10px;
}
.WidgetModal__Actions ._Button {
  width: 100%;
  justify-content: center;
  height: 36px;
}
.WidgetModal__Actions ._Button div {
  position: absolute;
  bottom: -8px;
  font-size: 10px;
  font-weight: 400;
}
.WidgetModal__Slides {
  height: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 10px;
}
.WidgetModal__Footer {
  font-size: 12px;
  color: #f35468;
  margin-bottom: 10px;
}
.WidgetModal__Slide {
  width: 6px;
  height: 6px;
  background: #d9d9d9;
  margin: 5px;
  border-radius: 6px;
}
.WidgetModal__Slide--isActive {
  background: #16a085;
}
.WidgetModal__Body {
  height: 100%;
  padding: 10px 10px 0 10px;
  overflow: auto;
}
.WidgetModal__Body ._Form__Field {
  margin: 8px 0;
}
.WidgetModal__Body ._Form__Legend {
  font-size: 10px;
  font-weight: 700;
}
.WidgetModal__Body p {
  font-size: 12px;
}
.WidgetModal__Body p span {
  color: #f35468;
}

.WidgetShiftEndAutoClockOut {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  padding: 20px 15px;
  background: #fff;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.WidgetShiftEndAutoClockOut__Head {
  font-weight: 700;
  text-align: center;
}
.WidgetShiftEndAutoClockOut__Time {
  margin-top: 20px;
}
.WidgetShiftEndAutoClockOut__Proposal {
  margin-top: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  gap: 5px;
}
.WidgetShiftEndAutoClockOut__Proposal > ._Button {
  justify-content: center;
}
.WidgetShiftEndAutoClockOut ._Form {
  margin-top: 20px;
  width: 100%;
}
.WidgetShiftEndAutoClockOut ._Form .TimeInput {
  position: static;
}
.WidgetShiftEndAutoClockOut ._Form .TimeInput ._DropDown {
  bottom: auto;
  top: 15px;
  right: 10px;
}
.WidgetShiftEndAutoClockOut ._Form .TimeInput ._DropDown__Body {
  left: auto;
  top: 0;
  right: 0;
}
.WidgetShiftEndAutoClockOut ._Form ._Group {
  width: 100%;
  text-align: right;
}
.--isMobile .ShiftEndAutoClockOut {
  padding: 50px;
}

.TimeClockModule {
  position: relative;
  padding: 20px 10px;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.TimeClockModule__Refresh {
  position: absolute;
  right: 10px;
  top: 10px;
}
.TimeClockModule__Actions {
  display: flex;
  gap: 10px;
}
.TimeClockModule__Actions ._Button {
  width: 100%;
  flex-direction: column;
  justify-content: center;
  line-height: 1rem;
}
.TimeClockModule__Actions ._Button--Disabled {
  background: #adadad !important;
  border-color: transparent !important;
}
.TimeClockModule__Actions ._Button span {
  display: block;
  font-size: 10px;
}
.TimeClockModule ._Preloader {
  height: 55px;
}
.TimeClockModule__Title {
  height: 100%;
  padding-top: 20px;
}
.TimeClockModule__Name {
  font-weight: 400;
  font-size: 22px;
  color: #000;
}
.TimeClockModule__Info {
  padding: 4px 0;
  color: #16a085;
  font-weight: 700;
  font-size: 14px;
}
.TimeClockModule__Info--danger {
  color: #f35468;
}
.TimeClockModule__Avatar {
  display: flex;
  justify-content: center;
}
.TimeClockModule__Avatar .UserAvatar__Photo {
  width: 85px;
  height: 85px;
  border: 3px solid #16a085;
}
.TimeClockModule__Avatar .UserAvatar__Photo--noPhoto {
  font-size: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.TimeClockModule__Avatar .UserAvatar .OnShiftStatus {
  display: none;
}
.TimeClockModule__Hours {
  position: absolute;
  top: 10px;
  right: 20px;
}
.TimeClockModule__Date {
  position: absolute;
  top: 10px;
  left: 20px;
}
.TimeClockModule__Row {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  font-size: 12px;
  padding-bottom: 3px;
}
.TimeClockModule__Row span {
  padding: 2px 0;
  font-weight: 700;
  font-size: 7px;
  line-height: 3px;
  color: #16a085;
}
.TimeClockModule table {
  width: 100%;
}
.TimeClockModule table td {
  font-size: 10px;
  font-weight: 700;
  text-align: left;
}
.TimeClockModule table td ._TextInput__Postfix {
  padding-right: 5px;
}
.TimeClockModule table td ._TextInput input {
  font-size: 8px;
  padding: 0 5px;
}
.TimeClockModule .TimeInput {
  position: unset;
}
.TimeClockModule .TimeInput ._DropDown {
  top: auto;
  bottom: 0;
}

.ExternalWidget {
  height: 100%;
}
.ExternalWidget__Info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.ExternalWidget__Info ._Button {
  margin-top: 15px;
}

._ErrorBoundary {
  height: 100%;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: space-between;
  background-image: url(/1447e909216dd88bed50.png);
  background-repeat: no-repeat;
  background-size: 100vw;
  background-position: bottom;
}
._ErrorBoundary__Message {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-flow: column;
  text-align: center;
}
._ErrorBoundary__Message h2 {
  line-height: 70px;
  font-size: 44px;
}
._ErrorBoundary__Message button {
  padding: 0px 70px;
  height: 40px;
  font-size: 16px;
}
._ErrorBoundary--isMobile h2 {
  line-height: 40px;
  font-size: 22px;
}
._ErrorBoundary img {
  max-width: 80vw;
}

._ErrorBoundary {
  height: 100%;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: space-between;
  background-image: url(/1447e909216dd88bed50.png);
  background-repeat: no-repeat;
  background-size: 100vw;
  background-position: bottom;
}
._ErrorBoundary__Message {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-flow: column;
  text-align: center;
}
._ErrorBoundary__Message h2 {
  line-height: 70px;
  font-size: 44px;
}
._ErrorBoundary__Message button {
  padding: 0px 70px;
  height: 40px;
  font-size: 16px;
}
._ErrorBoundary--isMobile h2 {
  line-height: 40px;
  font-size: 22px;
}
._ErrorBoundary img {
  max-width: 80vw;
}

html {
  line-height: 1.15; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
div,
summary {
  box-sizing: border-box;
  display: block;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:active,
a:hover {
  outline: 0;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: bold;
}
dfn {
  font-style: italic;
}
h1,
h2,
h3 {
  font-weight: 400;
  margin: 20px 0;
}
h1 {
  font-size: 26px;
}
h1 small {
  margin-left: 10px;
  font-size: 13px;
}
mark {
  background: #ff0;
  color: #000;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  box-sizing: content-box;
  height: 0;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
  box-sizing: border-box;
}
button:focus,
input:focus,
optgroup:focus,
select:focus,
textarea:focus {
  outline: none;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: textfield;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
}
optgroup {
  font-weight: bold;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
.-clearFix::after {
  content: " ";
  display: block;
  clear: both;
}
html,
body {
  background: #ecf0f1;
  color: #5c5c5c;
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}
@media print {
  html,
  body {
    height: auto;
    overflow: visible;
  }
}
html.Body--withSidebar ._Modal__Overlay,
body.Body--withSidebar ._Modal__Overlay {
  right: 500px;
}
@media only screen and (max-width: 1400px) {
  .ScheduleGrid ._Table.GridWeek,
  .ScheduleGrid ._Table.GridDay {
    flex-basis: 1000px;
  }
  .ScheduleGrid ._Table.GridWeek .Shift__Time,
  .ScheduleGrid ._Table.GridDay .Shift__Time {
    font-size: 0.85em;
  }
}
.--mobileShow {
  display: none;
}
@media only screen and (max-width: 1280px) {
  .--mobileShow {
    display: block;
  }
}
.--mobileHide {
  display: block;
}
@media only screen and (max-width: 1280px) {
  .--mobileHide {
    display: none;
  }
}
.--mobileBlock {
  display: inline-block;
}
@media only screen and (max-width: 1280px) {
  .--mobileBlock {
    display: block;
  }
}
.--isMobile .ScheduleGrid ._Table,
.--isTablet .ScheduleGrid ._Table {
  flex-shrink: 1;
}
.--isMobile ._FileInput__Image {
  flex-flow: wrap;
  justify-content: space-around;
}
.--isMobile ._Modal {
  width: 100%;
  min-height: -webkit-fill-available;
}
.--isMobile ._Modal__Overlay {
  padding: 0;
  background: rgba(0,0,0,0.35);
}
.--isMobile ._Modal__Footer {
  justify-content: flex-end;
}
.--isMobile .EmployeeHours__Body {
  justify-content: end;
  padding-top: 3px;
}
.--isMobile .EmployeeHours__Clock {
  padding-left: 0;
}
.--isMobile .Employee__Performance--withGrossProfit {
  width: 90%;
  flex-flow: column;
  align-items: flex-start;
}
.--isMobile .Employee__Performance--withGrossProfit >div:first-child {
  margin: 0 0 3px 3px;
}
.--isMobile .Employee__Name,
.--isMobile .Employee__Position {
  width: 100px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.--isMobile .DateSlider__Nav {
  padding: 4px;
}
.--isMobile .Employee__Body {
  padding-left: 5px;
  align-items: end;
}
.--isMobile .Staff__Employee {
  padding-right: 0;
}
.--isMobile .CompanyUser__Name {
  width: 100%;
  font-size: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.--isMobile .Avatar {
  display: flex;
  justify-content: center;
}
.--isMobile .Avatar img {
  width: 50%;
}
.--isMobile ._ImageUploadInput__Image {
  display: block;
}
.--isMobile ._ImageUploadInput__Image img {
  width: 50%;
}
.--isMobile ._Table__Column--StoreName {
  width: 245px;
}
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-track {
  background: #e1f3ec;
}
::-webkit-scrollbar-thumb {
  background: #16a085;
}
#app,
.App {
  height: 100%;
  width: 100%;
}
a {
  text-decoration: none;
  color: inherit;
}
h2 {
  display: inline-block;
  padding: 0;
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  display: block;
  height: 48px;
  line-height: 48px;
  padding: 0 10px;
  font-size: 18px;
  color: #16a085;
  font-weight: bold;
}
h3 {
  display: inline-block;
  padding: 0;
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  display: block;
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  font-size: 18px;
  color: #379d79;
  font-weight: bold;
}
label {
  box-sizing: border-box;
  cursor: inherit;
}
hr {
  background: #ececec;
  height: 1px;
  border: none;
}
.-withRightMargin {
  margin-right: 10px;
}
.--Inline {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
}
.--NotOverflowTable ._Table__Cell {
  overflow: initial;
}
._Toast {
  z-index: 9999;
}
._Toast--Notice {
  border-width: 5px;
}
._Toast--Notice ._Toast__Title {
  display: flex;
  align-items: center;
  color: #379d79;
}
._Toast--Notice ._Toast__Title::before {
  content: '\2713';
  display: inline-block;
  font-size: large;
  font-weight: bold;
  color: #75cbad;
  width: 14px;
  padding: 0 3px;
  border: 2px solid #75cbad;
  border-radius: 50%;
  float: left;
  margin-right: 15px;
}
._Toast--Warning {
  border-width: 5px;
}
._Toast--Warning ._Toast__Title {
  display: flex;
  align-items: center;
  color: #ecc63e;
}
._Badge {
  background: #e1f3ec;
  color: #4a4a4a;
  font-weight: 600;
  padding: 0.6em 0.8em;
}
._Button {
  padding: 0 10px;
  background: #16a085;
  border-color: #16a085;
  color: #fff;
  font-weight: bold;
  border-width: 2px;
  border-radius: 5px;
  height: 34px;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}
._Button--Smaller {
  height: 26px;
}
._Button--Smallest {
  height: 20px;
  line-height: 12px;
}
._Button--Disabled {
  background-color: #ecf0f1 !important;
  border-color: #d7ebe4;
}
._Button--Ghost._Button {
  color: #16a085;
}
._Button--Narrow {
  padding: 0 3px;
}
._Button svg {
  font-size: 1.4em;
  vertical-align: -0.2em;
}
._Button img {
  height: 26px;
  margin-right: 10px;
}
._TextInput,
._NumberInput,
._TextareaInput,
._SelectInput,
._PostfixInput {
  border: 1px solid #d1d1d1;
}
._TabsInput__Option {
  border-color: #d1d1d1;
}
._TabsInput__Option--isActive {
  background: #16a085;
  color: #fff;
  border-color: #16a085;
}
._CheckboxInput {
  width: 1.5em !important;
  height: 1.5em;
}
._CheckboxInput__Input {
  border: 1px solid #d1d1d1;
  border-radius: 5px;
}
._CheckboxInput--Disabled {
  background-color: #ecf0f1;
  border-color: #d7ebe4;
}
._CheckboxInput--Illuminated ._CheckboxInput--Disabled {
  color: #16a085;
}
._TextareaInput textarea {
  display: block;
  min-height: 100px;
}
._ImageUploadInput__Image {
  border: 1px dashed #ececec;
}
._ImageUploadInput__Image img {
  width: 100%;
}
._Group ._Group {
  margin: 0 20px;
}
._Group ._Group:last-child {
  margin-right: 0;
}
._Group ._Group:first-child {
  margin-left: 0;
}
._Group > ._Button--Narrow:not(:last-child) {
  margin-right: 5px;
}
._Group {
  white-space: nowrap;
  display: inline-block;
}
._Group > a:not(:last-child) {
  margin-right: 15px;
}
._Form__Field {
  margin: 10px 0;
  text-align: left;
}
._Form__Field a {
  color: #16a085;
}
._Form__Field--Inline ._Form__Label {
  margin-right: 10px;
}
._Form__Field--Fullwidth ._Form__View {
  width: 100%;
}
._Form__Field--Fullwidth ._Input {
  width: 100%;
}
._Form__Label {
  line-height: 2.3em;
  font-size: 13px;
  font-weight: 600;
  color: #899abe;
  white-space: nowrap;
}
._Form__Label::after {
  content: ':';
}
._Form__Label--Inline {
  display: inline-block;
  margin-right: 10px;
}
._Form__Error {
  margin-top: 5px;
  padding: 5px 20px;
  text-align: left;
  background: #f35468;
  color: #fff;
}
._Form__Error:first-of-type {
  margin-top: 10px;
}
._Form__View {
  font-weight: 600;
}
._Form__Group {
  padding: 0;
  border: none;
}
._Form__GroupHeader {
  display: flex;
  align-items: center;
  margin: 15px 0;
}
._Form__GroupTitle {
  display: inline-block;
  padding: 0;
  margin-right: 10px;
  font-size: 20px;
  font-weight: 600;
  color: #4a4a4a;
}
._Modal {
  border-radius: 5px;
  min-width: 300px;
}
._Modal__Overlay {
  background: rgba(117,203,173,0.3);
  z-index: 1000;
}
._Modal__Header {
  padding: 15px 20px;
  font-weight: bold;
  color: #16a085;
  font-size: 18px;
  border-bottom: none;
  position: relative;
}
._Modal__Header--withoutPadding {
  padding: 0;
}
._Modal__Header::after {
  display: block;
  content: '';
  position: absolute;
  bottom: 0;
  left: 20px;
  right: 20px;
  height: 1px;
  background: #ececec;
}
._Modal__Header svg {
  margin-right: 10px;
}
._Modal__Body {
  padding: 10px 20px;
  overflow-y: auto;
}
._Modal__Footer {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  padding: 0 20px 10px 20px;
  text-align: right;
}
._Table__Table {
  table-layout: fixed;
}
._Table__Header {
  background: #f1f3f7;
}
._Table__Column {
  padding: 15px 30px;
  font-weight: bold;
  line-height: normal;
  position: sticky;
  top: 0;
  background: #f1f3f7;
  z-index: 1;
  border: none;
}
._Table__Column:not(:first-child)::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ececec;
}
._Table__Row {
  cursor: default;
  border-bottom: 1px solid #ececec;
}
._Table__Row--Summary ._Table__Cell {
  color: #4a4a4a;
  font-weight: 700;
}
._Table__Cell {
  padding: 15px 20px;
  font-weight: 600;
}
._Table__Cell a {
  color: #16a085;
}
._Table:not(._Table--withoutRowHover) ._Table__Row {
  cursor: pointer;
}
._Table:not(._Table--withoutRowHover) ._Table__Row:hover ._Table__Cell {
  background: #e1f3ec;
}
._Table__Group {
  display: table-row-group;
}
.Grid {
  display: grid;
  grid-gap: 0 30px;
}
.Grid.Grid--2 {
  grid-template-columns: 1fr 1fr;
}
.Grid.Grid--4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
._DropDown::before {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 0;
  transform: translate(-50%, 0);
}
._DropDown--LeftBottom::before,
._DropDown--Bottom::before {
  top: 0;
  border-bottom: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}
._DropDown--LeftTop::before {
  bottom: 0;
  border-top: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}
._DropDown--Bottom ._DropDown__Body {
  top: 10px;
}
._DropDown--LeftBottom ._DropDown__Body {
  top: 10px;
  right: -20px;
}
._DropDown--LeftTop ._DropDown__Body {
  bottom: 10px;
  right: -20px;
}
._Menu__Option {
  font-weight: 600;
}
._Menu__Option a.active {
  color: #16a085;
}
._Menu__Option:hover {
  background: #e1f3ec;
}
._Button {
  position: relative;
}
._Button ._DropDown {
  position: absolute;
  bottom: 0;
  left: 50%;
}
.Popup {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  border-radius: 5px;
}
.Popup:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.Popup__Content {
  background-color: #fff;
  padding: 2px 16px 14px 16px;
}
.Popup__Content__Item {
  color: #379d79;
}
.Popup__Content__Text {
  margin-bottom: 10px;
  display: block;
  max-width: 250px;
  margin: 0 auto;
  font-size: $font-size;
  line-height: $line-height;
}
.Popup__Content svg {
  color: #379d79;
  margin-right: 10px;
}
.GridWeek__DayActions--showDayActions,
.Shift__Actions--showShiftActions {
  animation-duration: 5s;
  animation-name: DisappearanceElement;
  display: flex;
}
._Dialog__Overlay {
  background: rgba(0,0,0,0.8);
  z-index: 10000;
}
.--withBottomMargin {
  margin-bottom: 10px;
}
.--withoutPointer {
  cursor: default;
}
.--withoutPointer ._ToggleInput__Input {
  cursor: default;
}
@media print {
  @page {
    size: A4 landscape;
    max-width: 100%;
  }
}
@media print {
  .--printHide {
    display: none;
  }
}
.--printShow {
  display: none;
}
@media print {
  .--printShow {
    display: block;
  }
}
@media print {
  .--printBlock {
    display: block;
  }
}
.App--isPrinting .--printHide {
  display: none;
}
.App--isPrinting .--printShow {
  display: block;
}
.App--isPrinting .--printBlock,
.App--isPrinting.--printBlock {
  display: block;
}
._Menu__Option {
  white-space: nowrap;
}
._Menu__Option svg {
  margin-right: 10px;
}
.--isTablet ._SelectInput select {
  padding-left: 5px;
  border-radius: 0;
}
@-moz-keyframes DisappearanceElement {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes DisappearanceElement {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-o-keyframes DisappearanceElement {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes DisappearanceElement {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.--isMobile .intercom-lightweight-app-launcher {
  bottom: 60px;
}
.--isMobile .intercom-app > [class^="intercom-with-namespace"] {
  bottom: 60px;
}
.--fullHeight {
  height: 100%;
}