.emoji-mart,
.emoji-mart * {
  box-sizing: border-box;
  line-height: 1.15;
}

.emoji-mart {
  font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
  font-size: 16px;
  display: inline-block;
  color: #222427;
  border: 1px solid #d9d9d9;
  border-radius: 5px;
  background: #fff;
  white-space: normal;
}

.emoji-mart .emoji-mart-emoji {
  padding: 6px;
}

.emoji-mart-bar {
  border: 0 solid #d9d9d9;
}
.emoji-mart-bar:first-child {
  border-bottom-width: 1px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.emoji-mart-bar:last-child {
  border-top-width: 1px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.emoji-mart-anchors {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 0 6px;
  line-height: 0;
}

.emoji-mart-anchor {
  position: relative;
  display: block;
  flex: 1 1 auto;
  color: #858585;
  text-align: center;
  padding: 12px 4px;
  overflow: visible;
  transition: color 0.1s ease-out;
  margin: 0;
  box-shadow: none;
  background: none;
  border: none;
}

/* Tooltip for anchor icons */
.emoji-mart-anchor-tooltip {
  padding: 2px 5px;
  background-color: #f5f5f5;
  color: #333;
  font-size: 12px;
  line-height: 1.4;
  white-space: nowrap;
  border: 1px solid #ccc;
  pointer-events: none;
  z-index: 10000;
}

.emoji-mart-anchor:hover,
.emoji-mart-anchor-selected {
  color: #464646;
}

.emoji-mart-anchor-selected .emoji-mart-anchor-bar {
  opacity: 1;
}

.emoji-mart-anchor-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #464646;
  opacity: 0;
}

.emoji-mart-anchors i {
  display: inline-block;
  width: 100%;
  max-width: 22px;
}

.emoji-mart-anchors svg,
.emoji-mart-anchors img {
  fill: currentColor;
  height: 18px;
  width: 18px;
}

.emoji-mart-scroll {
  overflow-y: scroll;
  height: 270px;
  padding: 0 6px 6px 0;
  will-change: transform; /* avoids "repaints on scroll" in mobile Chrome */
}

.emoji-mart-search {
  margin-top: 16px;
  padding: 0 16px;
  position: relative;
}

.emoji-mart-search input {
  font-size: 16px;
  display: block;
  width: 100%;
  height: 36px;
  padding: 5px 25px 6px 33px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
  outline: 0;
}

.emoji-mart-search input,
.emoji-mart-search input::-webkit-search-decoration,
.emoji-mart-search input::-webkit-search-cancel-button,
.emoji-mart-search input::-webkit-search-results-button,
.emoji-mart-search input::-webkit-search-results-decoration {
  /* remove webkit/blink styles for <input type="search">
   * via https://stackoverflow.com/a/9422689 */
  -webkit-appearance: none;
}

.emoji-mart-search-icon {
  position: absolute;
  top: 10px;
  left: 28px;
  z-index: 2;
  padding: 1px 0 0 0;
  border: none;
  background: none;
  width: 16px;
  height: 16px;
}

.emoji-mart-category .emoji-mart-emoji span {
  z-index: 1;
  position: relative;
  text-align: center;
  cursor: pointer;
}

.emoji-mart-category .emoji-mart-emoji:hover:before {
  z-index: 0;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
}
.emoji-mart-category .focus-visible:before {
  z-index: 0;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background-color: rgba(102, 102, 102, 0.16);
}
.emoji-mart-category .emoji-mart-emoji:hover:before .emoji-mart-category-label {
  z-index: 2;
  position: relative;
  top: 0;
}

.emoji-mart-category-label span {
  display: block;
  width: 100%;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 16px;
  padding: 16px 16px 8px;
  color: #666666;
  background-color: rgba(255, 255, 255, 0.95);
}

.emoji-mart-category-list {
  margin: 0;
  padding-left: 16px;
}

.emoji-mart-category-list li {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-block;
}


.emoji-mart-emoji > span {
  --emoji-scale: 1;
  margin: calc(
    (var(--emoji-size, 0px) - (var(--emoji-size, 0px) * var(--emoji-scale, 1)))
      / 2
  );
  transition: width 120ms ease-out, height 120ms ease-out, margin 120ms ease-out,
    font-size 120ms ease-out;
  will-change: width, height, margin;
}

.emoji-mart-category-list li:hover .emoji-mart-emoji > span,
.emoji-mart-emoji:hover > span,
.emoji-mart-emoji:focus-visible > span,
.emoji-mart-emoji.focus-visible > span {
  --emoji-scale: var(--emoji-hover-scale, 1.3);
}

.emoji-mart-emoji {
  position: relative;
  display: inline-block;
  font-size: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  box-shadow: none;
  line-height: 0;
}



.emoji-mart-emoji-native {
  font-family: 'Segoe UI Emoji', 'Segoe UI Symbol', 'Segoe UI',
  'Apple Color Emoji', 'Twemoji Mozilla', 'Noto Color Emoji', 'EmojiOne Color',
  'Android Emoji';
}

.emoji-mart-no-results {
  font-size: 14px;
  text-align: center;
  padding-top: 70px;
  color: #858585;
}
.emoji-mart-no-results-img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}
.emoji-mart-no-results .emoji-mart-category-label {
  display: none;
}
.emoji-mart-no-results .emoji-mart-no-results-label {
  margin-top: 0.2em;
}
.emoji-mart-no-results .emoji-mart-emoji:hover:before {
  content: none;
}
.emoji-mart-no-results .emoji-mart-emoji,
.emoji-mart-no-results .emoji-mart-emoji > span {
  cursor: default;
  pointer-events: none;
}
.emoji-mart-no-results .emoji-mart-emoji:hover > span,
.emoji-mart-no-results .emoji-mart-emoji:focus-visible > span,
.emoji-mart-no-results .emoji-mart-emoji.focus-visible > span {
  --emoji-scale: 1;
}

.emoji-mart-preview {
  position: relative;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 12px;
  gap: 12px;
}

.emoji-mart-preview.has-preview {
  justify-content: space-between;
}

.emoji-mart-preview-left-container {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
}

.emoji-mart-preview-emoji {
  flex-shrink: 0;
}

.emoji-mart-preview-data {
  flex: 1 1 auto;
  word-break: break-all;
  min-width: 0;
}
.emoji-mart-preview-keep-open {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.emoji-mart-preview-skins {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px;
  flex-shrink: 0;
}

.emoji-mart-preview-skins.custom {
  padding: 10px;
}

.emoji-mart-preview-name {
  font-size: 14px;
}

.emoji-mart-preview-shortname {
  font-size: 12px;
  color: #888;
}
.emoji-mart-preview-shortname + .emoji-mart-preview-shortname,
.emoji-mart-preview-shortname + .emoji-mart-preview-emoticon,
.emoji-mart-preview-emoticon + .emoji-mart-preview-emoticon {
  margin-left: 0.5em;
}

.emoji-mart-preview-emoticon {
  font-size: 11px;
  color: #bbb;
}

.emoji-mart-title span {
  display: inline-block;
  vertical-align: middle;
}

.emoji-mart-title .emoji-mart-emoji {
  padding: 0;
}

.emoji-mart-skin-swatches {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  padding: 2px 0;
  border: 1px solid #d9d9d9;
  border-radius: 12px;
  background-color: #fff;
}

.emoji-mart-skin-swatches.custom {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row-reverse;
  font-size: 0;
  border: none;
  background-color: #fff;
}

.emoji-mart-skin-swatches.opened .emoji-mart-skin-swatch {
  width: 16px;
  padding: 0 2px;
}

.emoji-mart-skin-swatches.opened .emoji-mart-skin-swatch.selected:after {
  opacity: 0.75;
}

.emoji-mart-skin-swatch {
  display: inline-block;
  width: 0;
  vertical-align: middle;
  transition-property: width, padding;
  transition-duration: 0.125s;
  transition-timing-function: ease-out;
}

.emoji-mart-skin-swatch:nth-child(1) {
  transition-delay: 0s;
}
.emoji-mart-skin-swatch:nth-child(2) {
  transition-delay: 0.03s;
}
.emoji-mart-skin-swatch:nth-child(3) {
  transition-delay: 0.06s;
}
.emoji-mart-skin-swatch:nth-child(4) {
  transition-delay: 0.09s;
}
.emoji-mart-skin-swatch:nth-child(5) {
  transition-delay: 0.12s;
}
.emoji-mart-skin-swatch:nth-child(6) {
  transition-delay: 0.15s;
}

.emoji-mart-skin-swatch.selected {
  position: relative;
  width: 16px;
  padding: 0 2px;
}

.emoji-mart-skin-swatch.selected:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 4px;
  margin: -2px 0 0 -2px;
  background-color: #fff;
  border-radius: 100%;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease-out;
}

.emoji-mart-skin-swatch.custom {
  display: inline-block;
  width: 0;
  height: 38px;
  overflow: hidden;
  vertical-align: middle;
  transition-property: width, height;
  transition-duration: 0.125s;
  transition-timing-function: ease-out;
  cursor: default;
}

.emoji-mart-skin-swatch.custom.selected {
  position: relative;
  width: 36px;
  height: 38px;
  padding: 0 2px 0 0;
}

.emoji-mart-skin-swatch.custom.selected:after {
  content: '';
  width: 0;
  height: 0;
}

.emoji-mart-skin-swatches.custom .emoji-mart-skin-swatch.custom:hover {
  background-color: #f4f4f4;
  border-radius: 10%;
}

.emoji-mart-skin-swatches.custom.opened .emoji-mart-skin-swatch.custom {
  width: 36px;
  height: 38px;
  padding: 0 2px 0 0;
}

.emoji-mart-skin-swatches.custom.opened
.emoji-mart-skin-swatch.custom.selected:after {
  opacity: 0.75;
}

.emoji-mart-skin-text {
  display: none;
}

.emoji-mart-skin-text.opened {
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
  justify-content: center;
  text-align: left;
  color: #888;
  font-size: 11px;
  padding: 5px 8px;
  width: 95px;
  height: 40px;
  border-radius: 10%;
  background-color: #fff;
  margin-right: 6px;
  flex-shrink: 0;
}

.emoji-mart-skin {
  display: inline-block;
  width: 100%;
  padding-top: 100%;
  max-width: 12px;
  border-radius: 100%;
}

.emoji-mart-skin-tone-1 {
  background-color: #ffc93a;
}
.emoji-mart-skin-tone-2 {
  background-color: #fadcbc;
}
.emoji-mart-skin-tone-3 {
  background-color: #e0bb95;
}
.emoji-mart-skin-tone-4 {
  background-color: #bf8f68;
}
.emoji-mart-skin-tone-5 {
  background-color: #9b643d;
}
.emoji-mart-skin-tone-6 {
  background-color: #594539;
}

/* For screenreaders only, via https://stackoverflow.com/a/19758620 */
.emoji-mart-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: rect(0, 0, 0, 0);
  border: 0;
}

/*
 * Dark mode styles
 */

.emoji-mart-dark {
  color: #fff;
  border-color: #555453;
  background-color: #222;
}

.emoji-mart-dark .emoji-mart-bar {
  border-color: #555453;
}

.emoji-mart-dark .emoji-mart-search input {
  color: #fff;
  border-color: #555453;
  background-color: #282a32;
}

.emoji-mart-dark .emoji-mart-search-icon svg {
  fill: #fff;
}

.emoji-mart-dark .emoji-mart-category .focus-visible:before {
  background-color: #444;
}

.emoji-mart-dark .emoji-mart-category-label span {
  background-color: #282a32;
  color: #fff;
}

.emoji-mart-dark .emoji-mart-skin-swatches {
  border-color: #555453;
  background-color: #222;
}

.emoji-mart-dark .emoji-mart-anchor:hover,
.emoji-mart-dark .emoji-mart-anchor:focus,
.emoji-mart-dark .emoji-mart-anchor-selected {
  color: #bfbfbf;
}

.emoji-mart-dark .emoji-mart-anchor-tooltip {
  background-color: #444;
  color: #fff;
  border-color: #666;
}

html.RCV, body.RCV {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
body.RCV {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 14px;
}
.RCV-namespace {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 14px;
  width: 100%;
  height: 100%;
  position: relative;
}
.RCV-namespace #mount-point {
  height: 100%;
}
.RCV-namespace .mount-manager {
  position: relative;
  width: 100%;
  height: 100%;
}
.RCV-namespace .mount-manager > .waiting {
  display: none;
  padding-bottom: 72px;
}
.RCV-namespace .mount-manager > .waiting:only-child {
  display: flex;
}
.RCV-namespace .Main {
  min-height: 180px;
  min-width: 320px;
}
.RCV-namespace .avatar-img {
  border-radius: 100%;
  overflow: hidden;
  display: block;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
}
.RCV-namespace .avatar-img:before {
  content: ' ';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #FFFFFF;
}
.RCV-namespace .avatar-img:after {
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-image: url(https://wcdn.ringcentral.com/_whc/unknown-participant-3b0335a1426ccde1264bb38168433c77.svg?appVersion=23.2.30);
  display: block;
  background-repeat: round;
  background-position: top left;
  position: absolute;
  top: 0;
}

.RCV-namespace .AutosizeField {
  width: 100%;
  box-sizing: border-box;
  resize: none;
  padding: 8px 10px;
  border-radius: 4px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 18px;
  border: 1px solid #999999;
}
.RCV-namespace .AutosizeField::-moz-placeholder {
  color: #757575;
}
.RCV-namespace .AutosizeField::placeholder {
  color: #757575;
}
.RCV-namespace .AutosizeField:focus {
  outline: none !important;
  border: 1px solid #067BBD;
}
.RCV-namespace .AutosizeField__counter {
  display: flex;
  justify-content: end;
  color: #666666;
  padding: 0 4px;
}
.RCV-namespace .AutosizeField__counter--filled {
  color: #F44336;
}

.RCV-namespace .Badge {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  border-radius: 8px;
  padding: 0 3px;
}
.RCV-namespace .Badge--highlight {
  background-color: #FF8800;
  color: #FFFFFF;
}
.RCV-namespace .Badge--small {
  font-size: 10px;
  min-width: 16px;
  height: 16px;
}
.RCV-namespace .Badge--medium {
  font-size: 12px;
  height: 18px;
  min-width: 18px;
}

.RCV-namespace .basic-popup {
  display: flex;
  position: relative;
  margin: 0;
}
.RCV-namespace .basic-popup__content {
  display: none;
  width: 240px;
  border-radius: 10px;
  padding: 0;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
  background-color: #FFFFFF;
  position: absolute;
  left: -3px;
}
.RCV-namespace .basic-popup__content:before {
  content: "";
  position: absolute;
  border: 6px solid;
}
.RCV-namespace .basic-popup__content.bottom:before {
  border-color: transparent transparent #FFFFFF transparent;
  top: -12px;
}
.RCV-namespace .basic-popup__content.bottom.right {
  transform: translate(-85%, 40%);
}
.RCV-namespace .basic-popup__content.bottom.left {
  transform: translate(0%, 30%);
}
.RCV-namespace .basic-popup__content.top:before {
  border-color: #FFFFFF transparent transparent transparent;
  bottom: -12px;
}
.RCV-namespace .basic-popup__content.top.right {
  transform: translate(-40%, -110%);
}
.RCV-namespace .basic-popup__content.top.left {
  transform: translate(0%, -110%);
}
.RCV-namespace .basic-popup__content.right:before {
  right: 15px;
}
.RCV-namespace .basic-popup__content.left:before {
  left: 15px;
}
.RCV-namespace .basic-popup--active .basic-popup__content {
  display: block;
  z-index: 5;
  pointer-events: all;
}

.RCV-namespace .Loader {
  --size: 40px;
  --base-color: #c5e9fd;
  --active-color: #067BBD;
  height: 40px;
  width: 40px;
  border-radius: 40px;
  height: var(--size);
  width: var(--size);
  border-radius: var(--size);
  border: 4px solid;
  border-color: #c5e9fd #c5e9fd #c5e9fd #067BBD;
  border-color: var(--base-color) var(--base-color) var(--base-color) var(--active-color);
  box-sizing: border-box;
  animation-name: Loader-spin;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.RCV-namespace .Loader__wrapper {
  position: relative;
  padding: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.RCV-namespace .Loader--small {
  height: 20px;
  width: 20px;
  border-radius: 20px;
  --size: 20px;
  border-width: 2px;
}
@keyframes Loader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@font-face {
  font-family: 'RCV-Desktop';
  src: url(https://wcdn.ringcentral.com/_whc/RCV-Desktop.19b3d9defb18b9788fe0.woff2?appVersion=23.2.30) format('woff2');
  font-weight: normal;
  font-style: normal;
}
.RCV-namespace .icon {
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.RCV-namespace [class^="icon-"], .RCV-namespace [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'RCV-Desktop' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  background: none;
  border: none;
  outline: none;
  padding: 0;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.RCV-namespace .icon-gallery-mode-active-speaker:before {
  content: "\e95c";
}
.RCV-namespace .icon-gallery-mode-film-strip:before {
  content: "\e95d";
}
.RCV-namespace .icon-gallery-mode-grid:before {
  content: "\e95e";
}
.RCV-namespace .icon-gallery-mode-active-speaker-ss:before {
  content: "\e95f";
}
.RCV-namespace .icon-gallery-mode-film-strip-ss:before {
  content: "\e960";
}
.RCV-namespace .icon-gallery-mode-grid-ss:before {
  content: "\e962";
}
.RCV-namespace .icon-selfvideo-pop-out:before {
  content: "\e95a";
}
.RCV-namespace .icon-selfvideo-pop-in:before {
  content: "\e95b";
}
.RCV-namespace .icon-ic-nav-first-page:before {
  content: "\e956";
}
.RCV-namespace .icon-ic-nav-last-page:before {
  content: "\e957";
}
.RCV-namespace .icon-ic-nav-before:before {
  content: "\e958";
}
.RCV-namespace .icon-ic-nav-next:before {
  content: "\e959";
}
.RCV-namespace .icon-icon-sharing-locked-moderatorcontrols:before {
  content: "\e955";
}
.RCV-namespace .icon-sharingtab-mobile:before {
  content: "\e954";
}
.RCV-namespace .icon-lower-chat:before {
  content: "\e953";
}
.RCV-namespace .icon-view-gallery:before {
  content: "\e951";
}
.RCV-namespace .icon-view_speaker:before {
  content: "\e952";
}
.RCV-namespace .icon-virtual-bg:before {
  content: "\e950";
}
.RCV-namespace .icon-auto-receptionist:before {
  content: "\e94e";
}
.RCV-namespace .icon-auto-receptionist1:before {
  content: "\e94f";
}
.RCV-namespace .icon-no_camera:before {
  content: "\e94d";
}
.RCV-namespace .icon-meetingsshare:before {
  content: "\e94a";
}
.RCV-namespace .icon-screen_share_24px:before {
  content: "\e949";
}
.RCV-namespace .icon-Recording-status:before {
  content: "\e948";
}
.RCV-namespace .icon-recents:before {
  content: "\e947";
}
.RCV-namespace .icon-preferences:before {
  content: "\e945";
}
.RCV-namespace .icon-feedback:before {
  content: "\e946";
}
.RCV-namespace .icon-fullscreen:before {
  content: "\e941";
}
.RCV-namespace .icon-fullscreen_exit:before {
  content: "\e942";
}
.RCV-namespace .icon-toparr:before {
  content: "\e93e";
}
.RCV-namespace .icon-pstn_muted:before {
  content: "\e93f";
}
.RCV-namespace .icon-pstn:before {
  content: "\e908";
}
.RCV-namespace .icon-pstn_speaking1:before {
  content: "\e943";
}
.RCV-namespace .icon-pstn_speaking2:before {
  content: "\e944";
}
.RCV-namespace .icon-joinaudio:before {
  content: "\e940";
}
.RCV-namespace .icon-colon-copy:before {
  content: "\3a";
}
.RCV-namespace .icon-0:before {
  content: "\30";
}
.RCV-namespace .icon-1:before {
  content: "\31";
}
.RCV-namespace .icon-2:before {
  content: "\32";
}
.RCV-namespace .icon-3:before {
  content: "\33";
}
.RCV-namespace .icon-4:before {
  content: "\34";
}
.RCV-namespace .icon-5:before {
  content: "\35";
}
.RCV-namespace .icon-6:before {
  content: "\36";
}
.RCV-namespace .icon-7:before {
  content: "\37";
}
.RCV-namespace .icon-8:before {
  content: "\38";
}
.RCV-namespace .icon-9:before {
  content: "\39";
}
.RCV-namespace .icon-hide:before {
  content: "\e931";
}
.RCV-namespace .icon-audio_off:before {
  content: "\e932";
}
.RCV-namespace .icon-speakers_on:before {
  content: "\e933";
}
.RCV-namespace .icon-speakers_off:before {
  content: "\e93d";
}
.RCV-namespace .icon-split:before {
  content: "\e93c";
}
.RCV-namespace .icon-phone:before {
  content: "\e93b";
}
.RCV-namespace .icon-alert-small:before {
  content: "\e92a";
}
.RCV-namespace .icon-backspace:before {
  content: "\e924";
}
.RCV-namespace .icon-keyboard:before {
  content: "\e929";
}
.RCV-namespace .icon-signout:before {
  content: "\e922";
}
.RCV-namespace .icon-cameracontrol:before {
  content: "\e91f";
}
.RCV-namespace .icon-galleryview:before {
  content: "\e920";
}
.RCV-namespace .icon-star_empty:before {
  content: "\e91b";
}
.RCV-namespace .icon-star_full:before {
  content: "\e91e";
}
.RCV-namespace .icon-drawing:before {
  content: "\e912";
}
.RCV-namespace .icon-Record:before {
  content: "\e921";
}
.RCV-namespace .icon-Fit-to-window:before {
  content: "\e9e1";
}
.RCV-namespace .icon-Fit-to-window2:before {
  content: "\e9e2";
}
.RCV-namespace .icon-info:before {
  content: "\e90b";
}
.RCV-namespace .icon-check:before {
  content: "\e91a";
}
.RCV-namespace .icon-Send22:before {
  content: "\ea3e";
}
.RCV-namespace .icon-drag2:before {
  content: "\e8f8";
}
.RCV-namespace .icon-MoreAction3:before {
  content: "\ea37";
}
.RCV-namespace .icon-waiting:before {
  content: "\e92f";
}
.RCV-namespace .icon-drag:before {
  content: "\e937";
}
.RCV-namespace .icon-pin:before {
  content: "\e938";
}
.RCV-namespace .icon-unpin:before {
  content: "\e939";
}
.RCV-namespace .icon-next:before {
  content: "\e900";
}
.RCV-namespace .icon-prev:before {
  content: "\e901";
}
.RCV-namespace .icon-next2:before {
  content: "\e909";
}
.RCV-namespace .icon-prev2:before {
  content: "\e90a";
}
.RCV-namespace .icon-forward:before {
  content: "\e902";
}
.RCV-namespace .icon-back:before {
  content: "\e903";
}
.RCV-namespace .icon-original-size:before {
  content: "\e914";
}
.RCV-namespace .icon-fit:before {
  content: "\e904";
}
.RCV-namespace .icon-resize:before {
  content: "\e905";
}
.RCV-namespace .icon-close:before {
  content: "\ea2d";
}
.RCV-namespace .icon-clear:before {
  content: "\ea1a";
}
.RCV-namespace .icon-repeat:before {
  content: "\ea59";
}
.RCV-namespace .icon-refresh:before {
  content: "\ea1c";
}
.RCV-namespace .icon-search:before {
  content: "\ea5a";
}
.RCV-namespace .icon-meeting-schedule:before {
  content: "\e92c";
}
.RCV-namespace .icon-meeting-join:before {
  content: "\e92b";
}
.RCV-namespace .icon-meeting-start:before {
  content: "\e92d";
}
.RCV-namespace .icon-alert:before {
  content: "\e936";
}
.RCV-namespace .icon-delete:before {
  content: "\e91c";
}
.RCV-namespace .icon-download:before {
  content: "\e91d";
}
.RCV-namespace .icon-share:before {
  content: "\e923";
}
.RCV-namespace .icon-copy:before {
  content: "\e9e0";
}
.RCV-namespace .icon-chat:before {
  content: "\e906";
}
.RCV-namespace .icon-draw:before {
  content: "\e907";
}
.RCV-namespace .icon-remotecontrol:before {
  content: "\ea62";
}
.RCV-namespace .icon-moderator:before {
  content: "\e919";
}
.RCV-namespace .icon-rec:before {
  content: "\ea03";
}
.RCV-namespace .icon-stop:before {
  content: "\e9e8";
}
.RCV-namespace .icon-pause:before {
  content: "\e92e";
}
.RCV-namespace .icon-play:before {
  content: "\e9e4";
}
.RCV-namespace .icon-unlock:before {
  content: "\e911";
}
.RCV-namespace .icon-lock:before {
  content: "\e90c";
}
.RCV-namespace .icon-ContactsFilled2:before {
  content: "\ea4c";
}
.RCV-namespace .icon-SingleAvatar3:before {
  content: "\ea3f";
}
.RCV-namespace .icon-Contacts2:before {
  content: "\ea4b";
}
.RCV-namespace .icon-invite-locked:before {
  content: "\ea63";
}
.RCV-namespace .icon-invite-people:before {
  content: "\e913";
}
.RCV-namespace .icon-participants:before {
  content: "\e93a";
}
.RCV-namespace .icon-sharing-off:before {
  content: "\e918";
}
.RCV-namespace .icon-sharing:before {
  content: "\e9e5";
}
.RCV-namespace .icon-video-off:before {
  content: "\e90f";
}
.RCV-namespace .icon-video-on:before {
  content: "\e910";
}
.RCV-namespace .icon-mic-off:before {
  content: "\e90d";
}
.RCV-namespace .icon-mic-on:before {
  content: "\e90e";
}
.RCV-namespace .icon-connecting:before {
  content: "\e930";
}
.RCV-namespace .icon-hangup:before {
  content: "\e9f4";
}
.RCV-namespace .icon-connection-status-1:before {
  content: "\e925";
}
.RCV-namespace .icon-connection-status-2:before {
  content: "\e926";
}
.RCV-namespace .icon-connection-status-3:before {
  content: "\e927";
}
.RCV-namespace .icon-home:before {
  content: "\e928";
}
.RCV-namespace .icon-hamburger:before {
  content: "\e915";
}
.RCV-namespace .icon-right-panel:before {
  content: "\e916";
}
.RCV-namespace .icon-settings:before {
  content: "\e917";
}
.RCV-namespace .icon-minimize:before {
  content: "\e935";
}
.RCV-namespace .icon-maximize:before {
  content: "\e934";
}
.RCV-namespace .icon-virtual-background:before {
  content: "\e950";
}
.RCV-namespace .icon-auto-receptionist:before {
  content: "\e935";
}
.RCV-namespace .icon-maximize:before {
  content: "\e934";
}
.RCV-namespace .icon-minus:before {
  content: "\ea64";
}
@font-face {
  font-family: "Proxima Nova Light";
  src: url(https://wcdn.ringcentral.com/_whc/proxima-nova-thin.84aa53fa29fbbbb036a9.woff2?appVersion=23.2.30) format('woff2');
  font-style: normal;
  font-weight: 200;
}
@font-face {
  font-family: "Proxima Nova Regular";
  src: url(https://wcdn.ringcentral.com/_whc/proxima-nova-light.f20b007473e2a56900c6.woff2?appVersion=23.2.30) format('woff2');
  font-style: normal;
  font-weight: 300;
}
@font-face {
  font-family: "Proxima Nova Medium";
  src: url(https://wcdn.ringcentral.com/_whc/proxima-nova.7db15df5480492a574e7.woff2?appVersion=23.2.30) format('woff2');
  font-style: normal;
  font-weight: 400;
}
@font-face {
  font-family: "Proxima Nova Semibold";
  src: url(https://wcdn.ringcentral.com/_whc/proxima-nova-semibold.86854c18bf8fad93cc0b.woff2?appVersion=23.2.30) format('woff2');
  font-style: normal;
  font-weight: 600;
}

.RCV-namespace .buttonBig {
  min-width: 230px;
  min-height: 45px;
  border-radius: 22.5px;
  font-size: 18px;
}
.RCV-namespace .Button.mobile-unmute-button {
  min-height: 30px;
  min-width: 92px;
  font-size: 14px;
  line-height: 1.2;
}
.RCV-namespace .Button {
  min-height: 36px;
  min-width: 96px;
  padding: 6px 16px;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  display: inline-block;
  zoom: 1;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  -webkit-user-drag: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  text-rendering: optimizespeed;
  box-sizing: border-box;
  outline: none;
  position: relative;
}
.RCV-namespace .Button--with-loader {
  padding-left: 0;
}
.RCV-namespace .Button__with-loader-content {
  display: flex;
  flex-direction: row;
}
.RCV-namespace .Button__with-loader-content .Loader__wrapper {
  padding: 0 10px;
}
.RCV-namespace .Button__with-loader-content .Loader__wrapper .Loader {
  --size: 25px;
  --base-color: #067BBD;
  --active-color: #E2E2E2;
}
.RCV-namespace .Button__with-loader-content-children {
  flex-grow: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.RCV-namespace .Button::-moz-focus-inner {
  padding: 0;
  border: 0;
}
.RCV-namespace .Button--container {
  padding: 0;
  min-width: 0;
  min-height: auto;
  border-radius: 0;
}
.RCV-namespace .Button--contained {
  background-color: #067BBD;
  color: #FFFFFF;
}
.RCV-namespace .Button--contained:hover {
  background-color: #056ba4;
}
.RCV-namespace .Button--contained:disabled {
  background-color: #E2E2E2 !important;
  color: #999999;
  cursor: default;
}
.RCV-namespace .Button--contained:active {
  background-color: #045b8c;
}
.RCV-namespace .Button--big {
  min-width: 230px;
  min-height: 45px;
  border-radius: 22.5px;
  font-size: 18px;
  background-color: #067BBD;
  color: #FFFFFF;
}
.RCV-namespace .Button--big:hover {
  background-color: #056ba4;
}
.RCV-namespace .Button--big:disabled {
  background-color: rgba(6, 123, 189, 0.3) !important;
}
.RCV-namespace .Button--big:active {
  background-color: #045b8c;
}
.RCV-namespace .Button--big-outline {
  min-width: 230px;
  min-height: 45px;
  border-radius: 22.5px;
  font-size: 18px;
  color: #067BBD;
  border: 1px solid currentColor;
  background-color: #FFFFFF;
}
.RCV-namespace .Button--big-outline:disabled {
  color: rgba(6, 123, 189, 0.3);
  border-color: rgba(6, 123, 189, 0.3);
}
.RCV-namespace .Button--big-outline:disabled:hover {
  background-color: #FFFFFF;
}
.RCV-namespace .Button--big-outline:hover {
  background-color: rgba(6, 123, 189, 0.05);
}
.RCV-namespace .Button--big-outline:active {
  background-color: rgba(6, 123, 189, 0.1);
}
.RCV-namespace .Button--text {
  background-color: #FFFFFF;
  color: #067BBD;
}
.RCV-namespace .Button--text:disabled {
  background-color: #C7C7C7 !important;
  color: #999999;
}
.RCV-namespace .Button--text:hover {
  background-color: rgba(6, 123, 189, 0.05);
}
.RCV-namespace .Button--text:active {
  background-color: rgba(6, 123, 189, 0.1);
}
.RCV-namespace .Button--text-only {
  background-color: #FFFFFF;
  color: #067BBD;
  padding: 0px;
  line-height: 45px;
}
.RCV-namespace .Button--text-only:disabled {
  background-color: transparent;
  color: rgba(6, 123, 189, 0.4);
}
.RCV-namespace .Button--text-only:hover {
  background-color: transparent;
}
.RCV-namespace .Button--text-only:active {
  color: rgba(6, 123, 189, 0.1);
}
.RCV-namespace .Button--small-text {
  background-color: transparent;
  color: #1D6EAA;
  padding: 4px 8px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 1em;
}
.RCV-namespace .Button--small-text:hover {
  background-color: rgba(6, 123, 189, 0.05);
}
.RCV-namespace .Button--small-text:active {
  background-color: rgba(6, 123, 189, 0.1);
}
.RCV-namespace .Button--small-text:disabled {
  background-color: transparent;
  color: #999999;
}
.RCV-namespace .Button--outlined {
  color: #067BBD;
  padding: 5px 15px;
  border: 1px solid currentColor;
  background-color: #FFFFFF;
}
.RCV-namespace .Button--outlined:disabled {
  color: #C7C7C7;
  border-color: currentColor;
}
.RCV-namespace .Button--outlined:disabled:hover {
  background-color: #FFFFFF;
}
.RCV-namespace .Button--outlined:hover {
  background-color: rgba(6, 123, 189, 0.05);
}
.RCV-namespace .Button--outlined:active {
  background-color: rgba(6, 123, 189, 0.1);
}
.RCV-namespace .Button--sign-in {
  padding: 11px 44px !important;
  width: auto;
  min-width: 0;
  background-color: transparent;
  border: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.RCV-namespace .Button--sign-in:hover {
  color: #2F2F2F;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
}
.RCV-namespace .Button--sign-in:active {
  color: #2F2F2F;
  background-color: rgba(255, 255, 255, 0.7);
  border-color: transparent;
}
.RCV-namespace .Button--join, .RCV-namespace .Button--start {
  font-size: 21px;
  line-height: 21px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  letter-spacing: 1.4px;
  border-width: 2px;
  border-radius: 7px;
  padding: 15px 24px;
}
.RCV-namespace .Button--join {
  background-color: #E6F2F8;
  color: #067BBD;
}
.RCV-namespace .Button--join:active {
  background-color: #caadf9;
}
.RCV-namespace .Button--start {
  background-color: #067BBD;
  color: #FFFFFF;
}
.RCV-namespace .Button--start:active {
  background-color: #089bee;
}
.RCV-namespace .Button.small-input {
  box-sizing: border-box;
  height: 30px;
  border-radius: 2px;
  text-align: center;
  font-size: 1em;
  padding-top: 3px;
  padding-bottom: 1px;
  min-width: 0;
  width: 60px;
  font-family: "Proxima Nova Regular", "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .Button--light-clear {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.3);
  opacity: 0.6;
}
.RCV-namespace .Button--light-clear:active {
  background-color: rgba(255, 255, 255, 0.7);
}
.RCV-namespace .Button--uppercase {
  text-transform: uppercase;
}
.RCV-namespace .Button--round {
  min-height: 45px;
  min-width: 148px;
  border-radius: 45px;
  padding: 10px 45px;
}
.RCV-namespace .Button--round.Button--with-loader {
  padding: 10px 45px 10px 0;
}
.RCV-namespace .Button--bland:disabled {
  color: #FFFFFF;
  opacity: 0.3;
  background-color: #067BBD !important;
}
.RCV-namespace .Button--promo {
  background-color: #4237C8;
  color: #FFFFFF;
}
.RCV-namespace .Button--promo:hover {
  background-color: #3b31b4;
}
.RCV-namespace .Button--promo:active {
  background-color: #352ca0;
}
.RCV-namespace .Button--confirm {
  margin-left: 3px;
  margin-right: 3px;
  background-color: #F44336;
  color: #FFFFFF;
}
.RCV-namespace .Button--confirm:hover {
  background-color: #f32c1e;
}
.RCV-namespace .Button--confirm:active {
  background-color: #ea1c0d;
}
.RCV-namespace .Button--confirm.outlined {
  color: #F44336;
  padding: 5px 15px;
  border: 1px solid currentColor;
  background-color: #FFFFFF;
}
.RCV-namespace .Button--confirm.outlined:hover {
  background-color: rgba(255, 255, 255, 0.05);
}
.RCV-namespace .Button--confirm.outlined:active {
  background-color: rgba(255, 255, 255, 0.1);
}
.RCV-namespace .Button--reaction {
  width: 100%;
  min-width: auto;
  min-height: auto;
  margin-left: auto;
  margin-right: auto;
  border-radius: 8px;
  background-color: rgba(0, 0, 0, 0.05);
  color: rgba(0, 0, 0, 0.7);
  font-size: 11px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  line-height: 1;
}
.RCV-namespace .Button--reaction:enabled:hover {
  background-color: rgba(0, 0, 0, 0.12);
}
.RCV-namespace .Button--reaction:enabled.selected, .RCV-namespace .Button--reaction:enabled:active {
  background-color: rgba(0, 145, 255, 0.14);
  border: 1px solid #0091ff;
}
.RCV-namespace .Button--reaction:disabled {
  background-color: transparent;
  cursor: default;
}
.RCV-namespace .Button--small {
  min-width: 78px;
  min-height: 36px;
  font-size: 0.9rem;
  padding: 6px 8px;
}
.RCV-namespace .Button--white {
  color: #067BBD;
  border-right-color: #E2E2E2;
  background-color: #FFFFFF;
}
.RCV-namespace .Button--white:not(:disabled):hover {
  background-color: #E6F2F8;
}
.RCV-namespace .Button--white:disabled {
  border-right-color: #C7C7C7;
  background-color: #E2E2E2;
  color: #999999;
}
.RCV-namespace .accessibility-mode .Button:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}

@font-face {
  font-family: 'RCV-Desktop';
  src: url(https://wcdn.ringcentral.com/_whc/RCV-Desktop.19b3d9defb18b9788fe0.woff2?appVersion=23.2.30) format('woff2');
  font-weight: normal;
  font-style: normal;
}
.RCV-namespace .icon {
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.RCV-namespace [class^="icon-"], .RCV-namespace [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'RCV-Desktop' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  background: none;
  border: none;
  outline: none;
  padding: 0;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.RCV-namespace .icon-gallery-mode-active-speaker:before {
  content: "\e95c";
}
.RCV-namespace .icon-gallery-mode-film-strip:before {
  content: "\e95d";
}
.RCV-namespace .icon-gallery-mode-grid:before {
  content: "\e95e";
}
.RCV-namespace .icon-gallery-mode-active-speaker-ss:before {
  content: "\e95f";
}
.RCV-namespace .icon-gallery-mode-film-strip-ss:before {
  content: "\e960";
}
.RCV-namespace .icon-gallery-mode-grid-ss:before {
  content: "\e962";
}
.RCV-namespace .icon-selfvideo-pop-out:before {
  content: "\e95a";
}
.RCV-namespace .icon-selfvideo-pop-in:before {
  content: "\e95b";
}
.RCV-namespace .icon-ic-nav-first-page:before {
  content: "\e956";
}
.RCV-namespace .icon-ic-nav-last-page:before {
  content: "\e957";
}
.RCV-namespace .icon-ic-nav-before:before {
  content: "\e958";
}
.RCV-namespace .icon-ic-nav-next:before {
  content: "\e959";
}
.RCV-namespace .icon-icon-sharing-locked-moderatorcontrols:before {
  content: "\e955";
}
.RCV-namespace .icon-sharingtab-mobile:before {
  content: "\e954";
}
.RCV-namespace .icon-lower-chat:before {
  content: "\e953";
}
.RCV-namespace .icon-view-gallery:before {
  content: "\e951";
}
.RCV-namespace .icon-view_speaker:before {
  content: "\e952";
}
.RCV-namespace .icon-virtual-bg:before {
  content: "\e950";
}
.RCV-namespace .icon-auto-receptionist:before {
  content: "\e94e";
}
.RCV-namespace .icon-auto-receptionist1:before {
  content: "\e94f";
}
.RCV-namespace .icon-no_camera:before {
  content: "\e94d";
}
.RCV-namespace .icon-meetingsshare:before {
  content: "\e94a";
}
.RCV-namespace .icon-screen_share_24px:before {
  content: "\e949";
}
.RCV-namespace .icon-Recording-status:before {
  content: "\e948";
}
.RCV-namespace .icon-recents:before {
  content: "\e947";
}
.RCV-namespace .icon-preferences:before {
  content: "\e945";
}
.RCV-namespace .icon-feedback:before {
  content: "\e946";
}
.RCV-namespace .icon-fullscreen:before {
  content: "\e941";
}
.RCV-namespace .icon-fullscreen_exit:before {
  content: "\e942";
}
.RCV-namespace .icon-toparr:before {
  content: "\e93e";
}
.RCV-namespace .icon-pstn_muted:before {
  content: "\e93f";
}
.RCV-namespace .icon-pstn:before {
  content: "\e908";
}
.RCV-namespace .icon-pstn_speaking1:before {
  content: "\e943";
}
.RCV-namespace .icon-pstn_speaking2:before {
  content: "\e944";
}
.RCV-namespace .icon-joinaudio:before {
  content: "\e940";
}
.RCV-namespace .icon-colon-copy:before {
  content: "\3a";
}
.RCV-namespace .icon-0:before {
  content: "\30";
}
.RCV-namespace .icon-1:before {
  content: "\31";
}
.RCV-namespace .icon-2:before {
  content: "\32";
}
.RCV-namespace .icon-3:before {
  content: "\33";
}
.RCV-namespace .icon-4:before {
  content: "\34";
}
.RCV-namespace .icon-5:before {
  content: "\35";
}
.RCV-namespace .icon-6:before {
  content: "\36";
}
.RCV-namespace .icon-7:before {
  content: "\37";
}
.RCV-namespace .icon-8:before {
  content: "\38";
}
.RCV-namespace .icon-9:before {
  content: "\39";
}
.RCV-namespace .icon-hide:before {
  content: "\e931";
}
.RCV-namespace .icon-audio_off:before {
  content: "\e932";
}
.RCV-namespace .icon-speakers_on:before {
  content: "\e933";
}
.RCV-namespace .icon-speakers_off:before {
  content: "\e93d";
}
.RCV-namespace .icon-split:before {
  content: "\e93c";
}
.RCV-namespace .icon-phone:before {
  content: "\e93b";
}
.RCV-namespace .icon-alert-small:before {
  content: "\e92a";
}
.RCV-namespace .icon-backspace:before {
  content: "\e924";
}
.RCV-namespace .icon-keyboard:before {
  content: "\e929";
}
.RCV-namespace .icon-signout:before {
  content: "\e922";
}
.RCV-namespace .icon-cameracontrol:before {
  content: "\e91f";
}
.RCV-namespace .icon-galleryview:before {
  content: "\e920";
}
.RCV-namespace .icon-star_empty:before {
  content: "\e91b";
}
.RCV-namespace .icon-star_full:before {
  content: "\e91e";
}
.RCV-namespace .icon-drawing:before {
  content: "\e912";
}
.RCV-namespace .icon-Record:before {
  content: "\e921";
}
.RCV-namespace .icon-Fit-to-window:before {
  content: "\e9e1";
}
.RCV-namespace .icon-Fit-to-window2:before {
  content: "\e9e2";
}
.RCV-namespace .icon-info:before {
  content: "\e90b";
}
.RCV-namespace .icon-check:before {
  content: "\e91a";
}
.RCV-namespace .icon-Send22:before {
  content: "\ea3e";
}
.RCV-namespace .icon-drag2:before {
  content: "\e8f8";
}
.RCV-namespace .icon-MoreAction3:before {
  content: "\ea37";
}
.RCV-namespace .icon-waiting:before {
  content: "\e92f";
}
.RCV-namespace .icon-drag:before {
  content: "\e937";
}
.RCV-namespace .icon-pin:before {
  content: "\e938";
}
.RCV-namespace .icon-unpin:before {
  content: "\e939";
}
.RCV-namespace .icon-next:before {
  content: "\e900";
}
.RCV-namespace .icon-prev:before {
  content: "\e901";
}
.RCV-namespace .icon-next2:before {
  content: "\e909";
}
.RCV-namespace .icon-prev2:before {
  content: "\e90a";
}
.RCV-namespace .icon-forward:before {
  content: "\e902";
}
.RCV-namespace .icon-back:before {
  content: "\e903";
}
.RCV-namespace .icon-original-size:before {
  content: "\e914";
}
.RCV-namespace .icon-fit:before {
  content: "\e904";
}
.RCV-namespace .icon-resize:before {
  content: "\e905";
}
.RCV-namespace .icon-close:before {
  content: "\ea2d";
}
.RCV-namespace .icon-clear:before {
  content: "\ea1a";
}
.RCV-namespace .icon-repeat:before {
  content: "\ea59";
}
.RCV-namespace .icon-refresh:before {
  content: "\ea1c";
}
.RCV-namespace .icon-search:before {
  content: "\ea5a";
}
.RCV-namespace .icon-meeting-schedule:before {
  content: "\e92c";
}
.RCV-namespace .icon-meeting-join:before {
  content: "\e92b";
}
.RCV-namespace .icon-meeting-start:before {
  content: "\e92d";
}
.RCV-namespace .icon-alert:before {
  content: "\e936";
}
.RCV-namespace .icon-delete:before {
  content: "\e91c";
}
.RCV-namespace .icon-download:before {
  content: "\e91d";
}
.RCV-namespace .icon-share:before {
  content: "\e923";
}
.RCV-namespace .icon-copy:before {
  content: "\e9e0";
}
.RCV-namespace .icon-chat:before {
  content: "\e906";
}
.RCV-namespace .icon-draw:before {
  content: "\e907";
}
.RCV-namespace .icon-remotecontrol:before {
  content: "\ea62";
}
.RCV-namespace .icon-moderator:before {
  content: "\e919";
}
.RCV-namespace .icon-rec:before {
  content: "\ea03";
}
.RCV-namespace .icon-stop:before {
  content: "\e9e8";
}
.RCV-namespace .icon-pause:before {
  content: "\e92e";
}
.RCV-namespace .icon-play:before {
  content: "\e9e4";
}
.RCV-namespace .icon-unlock:before {
  content: "\e911";
}
.RCV-namespace .icon-lock:before {
  content: "\e90c";
}
.RCV-namespace .icon-ContactsFilled2:before {
  content: "\ea4c";
}
.RCV-namespace .icon-SingleAvatar3:before {
  content: "\ea3f";
}
.RCV-namespace .icon-Contacts2:before {
  content: "\ea4b";
}
.RCV-namespace .icon-invite-locked:before {
  content: "\ea63";
}
.RCV-namespace .icon-invite-people:before {
  content: "\e913";
}
.RCV-namespace .icon-participants:before {
  content: "\e93a";
}
.RCV-namespace .icon-sharing-off:before {
  content: "\e918";
}
.RCV-namespace .icon-sharing:before {
  content: "\e9e5";
}
.RCV-namespace .icon-video-off:before {
  content: "\e90f";
}
.RCV-namespace .icon-video-on:before {
  content: "\e910";
}
.RCV-namespace .icon-mic-off:before {
  content: "\e90d";
}
.RCV-namespace .icon-mic-on:before {
  content: "\e90e";
}
.RCV-namespace .icon-connecting:before {
  content: "\e930";
}
.RCV-namespace .icon-hangup:before {
  content: "\e9f4";
}
.RCV-namespace .icon-connection-status-1:before {
  content: "\e925";
}
.RCV-namespace .icon-connection-status-2:before {
  content: "\e926";
}
.RCV-namespace .icon-connection-status-3:before {
  content: "\e927";
}
.RCV-namespace .icon-home:before {
  content: "\e928";
}
.RCV-namespace .icon-hamburger:before {
  content: "\e915";
}
.RCV-namespace .icon-right-panel:before {
  content: "\e916";
}
.RCV-namespace .icon-settings:before {
  content: "\e917";
}
.RCV-namespace .icon-minimize:before {
  content: "\e935";
}
.RCV-namespace .icon-maximize:before {
  content: "\e934";
}
.RCV-namespace .icon-virtual-background:before {
  content: "\e950";
}
.RCV-namespace .icon-auto-receptionist:before {
  content: "\e935";
}
.RCV-namespace .icon-maximize:before {
  content: "\e934";
}
.RCV-namespace .icon-minus:before {
  content: "\ea64";
}

.RCV-namespace .Checkbox {
  position: relative;
  display: flex;
  justify-content: flex-start;
  padding: 3px 0;
}
.RCV-namespace .Checkbox__input {
  opacity: 0;
  margin: 0;
  position: absolute;
}
.RCV-namespace .Checkbox__check {
  position: relative;
  height: 14px;
  width: 14px;
  background-color: #FFFFFF;
  border-radius: 3px;
  border: 2px solid #666666;
  color: #FFFFFF;
  display: inline-block;
  font-family: 'RCV-Desktop' !important;
  transition: background 0.2s;
  flex-shrink: 0;
}
.RCV-namespace .Checkbox__check:after {
  position: absolute;
  line-height: 1;
  opacity: 0;
  transition: opacity 0.2s;
}
.RCV-namespace .Checkbox__check--disabled {
  border-color: #C7C7C7;
}
.RCV-namespace .Checkbox__check--checked {
  border-color: #067BBD;
  background-color: #067BBD;
}
.RCV-namespace .Checkbox__check--checked:after {
  opacity: 1;
  top: -1px;
  left: 0;
  content: "\e91a";
}
.RCV-namespace .Checkbox__check--checked.Checkbox__check--disabled {
  background-color: #C7C7C7;
  border-color: #C7C7C7;
}
.RCV-namespace .Checkbox__check--button {
  display: none;
}
.RCV-namespace .Checkbox__title {
  margin-left: 10px;
  padding: 1px 0;
  align-self: center;
}
.RCV-namespace .Checkbox__title--disabled {
  color: #C7C7C7;
}
.RCV-namespace .Checkbox__title--button {
  margin-left: 0;
  color: #666666;
}
.RCV-namespace .Checkbox__title--button.Checkbox__title--checked {
  color: #0083bf;
}
.RCV-namespace .Checkbox--button {
  border: 1px solid #C7C7C7;
  border-radius: 4px;
  justify-content: center;
  cursor: pointer;
}
.RCV-namespace .Checkbox--button.Checkbox--checked {
  border-color: #0083bf;
  background-color: #E6F2F8;
}
.RCV-namespace .Checkbox__input:disabled + .Checkbox__check {
  border-color: #C7C7C7;
}
.RCV-namespace .Checkbox__input:checked + .Checkbox__check {
  border-color: #067BBD;
  background-color: #067BBD;
}
.RCV-namespace .Checkbox__input:checked + .Checkbox__check:after {
  opacity: 1;
  top: -1px;
  left: 0;
  content: "\e91a";
}
.RCV-namespace .Checkbox__input:indeterminate + .Checkbox__check {
  border-color: #067BBD;
  background-color: #067BBD;
}
.RCV-namespace .Checkbox__input:indeterminate + .Checkbox__check:after {
  opacity: 1;
  top: 0;
  left: 0;
  content: "\ea64";
}
.RCV-namespace .Checkbox__input:checked:disabled + .Checkbox__check {
  background-color: #C7C7C7;
  border-color: #C7C7C7;
}
.RCV-namespace .rate-quality-modal__dismiss-block .Checkbox__input {
  left: 227px;
}
.RCV-namespace .accessibility-mode .Checkbox__input:focus + .Checkbox__check {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}
.RCV-namespace .accessibility-mode .Checkbox--button.Checkbox--focused {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}

.RCV-namespace .confirm-popup__text {
  color: #000000;
  margin: 15px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .confirm-popup__text > .confirm-popup__header {
  margin-bottom: 5px;
  font-weight: bold;
}
.RCV-namespace .confirm-popup__controls {
  margin: 10px;
  text-align: right;
}

.RCV-namespace .ContextPopupContentWrapper {
  --width: 280px;
  --x-shift-intension: 2;
  --x-shift: calc(-1 * var(--width) / var(--x-shift-intension));
  --triangle-size: 12px;
  --y-shift: calc(-1 * var(--triangle-size));
  background-color: #FFFFFF;
  box-sizing: border-box;
  position: absolute;
  border-radius: 5px;
  width: var(--width);
  bottom: 100%;
  left: 50%;
  transform: translate(var(--x-shift), var(--y-shift));
  box-shadow: 0 2px 22px rgba(0, 0, 0, 0.25);
  z-index: 5005;
}
.RCV-namespace .ContextPopupContentWrapper:after {
  --triangle-width: var(--triangle-size);
  --triangle-height: var(--triangle-size);
  --triangle-x-shift: calc(-1 * var(--x-shift) - calc(var(--triangle-width) / 2));
  content: '';
  position: absolute;
  top: calc(100% - 1px);
  left: 0;
  height: var(--triangle-height);
  width: var(--triangle-width);
  border: calc(var(--triangle-width) / 2) inset transparent;
  border-top: calc(var(--triangle-width) / 2) solid #FFFFFF;
  box-sizing: border-box;
  transform: translate(var(--triangle-x-shift), 0);
}

.RCV-namespace .switch {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.RCV-namespace .switch.label-position-left {
  flex-direction: row-reverse;
}
.RCV-namespace .switch.label-position-right {
  flex-direction: row;
}
.RCV-namespace .switch__input {
  opacity: 0;
  margin: 0;
  position: absolute;
}
.RCV-namespace .switch__check {
  position: relative;
  height: 14px;
  width: 34px;
  background-color: #666666;
  border-radius: 7px;
  margin: 5px 1px;
  color: #FFFFFF;
  display: inline-block;
  transition: background-color 0.2s;
}
.RCV-namespace .switch__check:after {
  content: '';
  position: absolute;
  top: -3px;
  left: -1px;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background-color: #FFFFFF;
  transition: background-color 0.2s, left 0.2s;
  box-shadow: 0 2px 3px #999999;
}
.RCV-namespace .switch__input:disabled + .switch__check {
  background-color: #E6F2F8;
}
.RCV-namespace .switch__title {
  margin-left: 10px;
}
.RCV-namespace .switch__input:checked + .switch__check {
  background-color: #9BCEE5;
}
.RCV-namespace .switch__input:checked + .switch__check:after {
  background-color: #067BBD;
  left: 15px;
  opacity: 1;
}
.RCV-namespace .switch__input:checked:disabled + .switch__check {
  background-color: #E6F2F8;
}
.RCV-namespace .switch__input:checked:disabled + .switch__check:after {
  background-color: #C7C7C7;
}
.RCV-namespace .accessibility-mode .switch__input:focus + .switch__check:after {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}

.RCV-namespace .svg-drop-down-collapse {
  width: 8px;
  height: 5px;
  margin-bottom: 2px;
  -o-object-fit: contain;
     object-fit: contain;
}
.RCV-namespace .svg-gallery-mode-grid, .RCV-namespace .svg-gallery-mode-grid-ss, .RCV-namespace .svg-gallery-mode-grid-auto, .RCV-namespace .svg-gallery-mode-grid-auto-ss, .RCV-namespace .svg-gallery-mode-active-speaker, .RCV-namespace .svg-gallery-mode-active-speaker-ss, .RCV-namespace .svg-gallery-mode-film-strip, .RCV-namespace .svg-gallery-mode-film-strip-ss, .RCV-namespace .svg-view-mode-auto, .RCV-namespace .svg-view-mode-grid, .RCV-namespace .svg-view-mode-speaker, .RCV-namespace .svg-view-mode-filmstrip, .RCV-namespace .svg-view-mode-fullscreen, .RCV-namespace .svg-view-mode-caret, .RCV-namespace .svg-view-mode-minimize, .RCV-namespace .svg-view-mode-minimize-restore {
  height: 16px;
}
.RCV-namespace .svg-view-mode-auto, .RCV-namespace .svg-view-mode-grid, .RCV-namespace .svg-view-mode-speaker, .RCV-namespace .svg-view-mode-filmstrip, .RCV-namespace .svg-view-mode-fullscreen {
  height: 20px;
}
.RCV-namespace .svg-view-mode-caret {
  height: 16px;
}
.RCV-namespace .svg-lower-bar-pstn-on, .RCV-namespace .svg-lower-bar-pstn-muted, .RCV-namespace .svg-lower-bar-help, .RCV-namespace .svg-lower-bar-featureidea, .RCV-namespace .svg-lower-bar-turn-on-e2ee, .RCV-namespace .svg-lower-bar-turn-off-e2ee, .RCV-namespace .svg-lower-bar-turn-on-e2ee-disabled, .RCV-namespace .svg-closed-captions-font-picker, .RCV-namespace .svg-lower-bar-camera-off, .RCV-namespace .svg-lower-bar-camera-locked, .RCV-namespace .svg-lower-bar-dynamic-e2ee, .RCV-namespace .svg-leave-audio, .RCV-namespace .svg-share-whiteboard, .RCV-namespace .svg-weatherman {
  height: 30px;
  width: 30px;
}
.RCV-namespace .svg-arrow-back {
  height: 30px;
  width: 18px;
}
.RCV-namespace .svg-enable-closed-captions, .RCV-namespace .svg-disable-closed-captions {
  height: 30px;
  width: 25px;
}
.RCV-namespace .svg-breakout-rooms {
  height: 30px;
  width: 19px;
}
.RCV-namespace .svg-enable-transcript, .RCV-namespace .svg-disable-transcript {
  height: 30px;
  width: 24px;
}
.RCV-namespace .svg-enable-notes, .RCV-namespace .svg-disable-notes {
  height: 30px;
  width: 30px;
}
.RCV-namespace .svg-notes-notification, .RCV-namespace .svg-notes-mention {
  height: 30px;
  width: 60px;
}
.RCV-namespace .svg-transcription-indicator {
  height: 30px;
  width: 30px;
}
.RCV-namespace .svg-lower-bar-mic-locked, .RCV-namespace .svg-lower-bar-mic-muted {
  height: 30px;
  width: 24px;
}
.RCV-namespace .svg-play-bazel, .RCV-namespace .svg-play, .RCV-namespace .svg-pause, .RCV-namespace .svg-mute, .RCV-namespace .svg-volume-mid, .RCV-namespace .svg-volume-max {
  height: 24px;
  width: 24px;
}
.RCV-namespace .svg-play-bazel, .RCV-namespace .svg-pause-bazel, .RCV-namespace .svg-rewind-bazel, .RCV-namespace .svg-forward-bazel, .RCV-namespace .svg-volume-up-bazel, .RCV-namespace .svg-volume-down-bazel, .RCV-namespace .svg-volume-mute-bazel {
  height: 36px;
  width: 36px;
}
.RCV-namespace .svg-lower-bar-mic-unmuted {
  height: 30px;
  width: 19px;
}
.RCV-namespace .svg-lower-bar-chat {
  height: 30px;
  width: 24px;
}
.RCV-namespace .svg-lower-transcript {
  width: 24px;
  height: 24px;
}
.RCV-namespace .svg-lower-bar-camera-on {
  height: 30px;
  width: 27px;
}
.RCV-namespace .svg-lower-bar-disabled-chat {
  height: 30px;
  width: 24px;
}
.RCV-namespace .svg-lower-bar-sharing-active, .RCV-namespace .svg-lower-bar-sharing-locked {
  height: 30px;
  width: 28px;
}
.RCV-namespace .svg-lower-bar-record {
  height: 30px;
  width: 24px;
}
.RCV-namespace .svg-reactions {
  height: 30px;
  width: 37px;
}
.RCV-namespace .svg-lower-bar-pause {
  height: 30px;
  width: 20px;
}
.RCV-namespace .svg-lower-bar-invite {
  height: 30px;
  width: 27px;
}
.RCV-namespace .svg-lower-bar-sharing {
  height: 30px;
  width: 28px;
  color: #039FD8;
}
.RCV-namespace .svg-sidebar-invite {
  width: 24px;
  height: 24px;
}
.RCV-namespace .svg-zoom-in, .RCV-namespace .svg-zoom-out {
  height: 30px;
  width: 18px;
}
.RCV-namespace .svg-lower-bar-breakout-rooms {
  height: 30px;
  width: 28px;
  width: 100%;
}
.RCV-namespace .svg-chat-with-host {
  height: 30px;
  width: 30px;
}
.RCV-namespace .svg-lower-bar-notes {
  height: 30px;
  width: 32px;
}

.RCV-namespace .FeatureFlagsDevtoolsItem {
  margin: 0.5rem 0;
}
.RCV-namespace .FeatureFlagsDevtoolsItem .switch__title {
  max-width: calc(100% - 36px);
}
.RCV-namespace .FeatureFlagsDevtoolsItem .switch__title button {
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__header {
  width: 100%;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__header .switch {
  width: 100%;
  justify-content: space-between;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__header .switch__title {
  margin: 0;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__spoiler {
  background-color: transparent;
  border-color: transparent;
  border-radius: 0;
  border-width: 0;
  margin: 0;
  padding: 0;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__content {
  width: 100%;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__content--collapsed {
  display: none;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__content--expanded {
  padding: 0.5rem 0;
  border-bottom: 1px solid #C7C7C7;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__row td {
  vertical-align: top;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__row pre {
  margin: 0;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__row pre:empty {
  color: #666666;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__row pre:empty:before {
  content: 'empty';
}
.RCV-namespace .FeatureFlagsDevtoolsItem__label {
  width: 20%;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__actions {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__actions button {
  min-height: unset;
  min-width: unset;
  width: 30px;
  height: 30px;
  padding: 0;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__actions button svg {
  width: 24px;
  height: 24px;
  padding: 2px;
  fill: currentColor;
}
.RCV-namespace .FeatureFlagsDevtoolsItem__select-all {
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
}

.RCV-namespace .tooltip-container {
  --tooltipBackground: #fff;
  --tooltipBorder: #c0c0c0;
  --tooltipColor: #000;

  background-color: var(--tooltipBackground);
  border-radius: 3px;
  border: 1px solid var(--tooltipBorder);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
  color: var(--tooltipColor);
  display: flex;
  flex-direction: column;
  padding: 0.4rem;
  transition: opacity 0.3s;
  z-index: 9999;
}

.RCV-namespace .tooltip-container[data-popper-interactive='false'] {
  pointer-events: none;
}

.RCV-namespace .tooltip-arrow {
  height: 1rem;
  position: absolute;
  width: 1rem;
  pointer-events: none;
}

.RCV-namespace .tooltip-arrow::before {
  border-style: solid;
  content: '';
  display: block;
  height: 0;
  margin: auto;
  width: 0;
}

.RCV-namespace .tooltip-arrow::after {
  border-style: solid;
  content: '';
  display: block;
  height: 0;
  margin: auto;
  position: absolute;
  width: 0;
}

.RCV-namespace .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {
  left: 0;
  margin-top: -0.4rem;
  top: 0;
}

.RCV-namespace .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow::before {
  border-color: transparent transparent var(--tooltipBorder) transparent;
  border-width: 0 0.5rem 0.4rem 0.5rem;
  position: absolute;
  top: -1px;
}

.RCV-namespace .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow::after {
  border-color: transparent transparent var(--tooltipBackground) transparent;
  border-width: 0 0.5rem 0.4rem 0.5rem;
}

.RCV-namespace .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {
  bottom: 0;
  left: 0;
  margin-bottom: -1rem;
}

.RCV-namespace .tooltip-container[data-popper-placement*='top'] .tooltip-arrow::before {
  border-color: var(--tooltipBorder) transparent transparent transparent;
  border-width: 0.4rem 0.5rem 0 0.5rem;
  position: absolute;
  top: 1px;
}

.RCV-namespace .tooltip-container[data-popper-placement*='top'] .tooltip-arrow::after {
  border-color: var(--tooltipBackground) transparent transparent transparent;
  border-width: 0.4rem 0.5rem 0 0.5rem;
}

.RCV-namespace .tooltip-container[data-popper-placement*='right'] .tooltip-arrow {
  left: 0;
  margin-left: -0.7rem;
}

.RCV-namespace .tooltip-container[data-popper-placement*='right'] .tooltip-arrow::before {
  border-color: transparent var(--tooltipBorder) transparent transparent;
  border-width: 0.5rem 0.4rem 0.5rem 0;
}

.RCV-namespace .tooltip-container[data-popper-placement*='right'] .tooltip-arrow::after {
  border-color: transparent var(--tooltipBackground) transparent transparent;
  border-width: 0.5rem 0.4rem 0.5rem 0;
  left: 6px;
  top: 0;
}

.RCV-namespace .tooltip-container[data-popper-placement*='left'] .tooltip-arrow {
  margin-right: -0.7rem;
  right: 0;
}

.RCV-namespace .tooltip-container[data-popper-placement*='left'] .tooltip-arrow::before {
  border-color: transparent transparent transparent var(--tooltipBorder);
  border-width: 0.5rem 0 0.5rem 0.4em;
}

.RCV-namespace .tooltip-container[data-popper-placement*='left'] .tooltip-arrow::after {
  border-color: transparent transparent transparent var(--tooltipBackground);
  border-width: 0.5rem 0 0.5rem 0.4em;
  left: 3px;
  top: 0;
}

.RCV-namespace .tooltip-container.tooltip-container--rcv {
  display: inline-block;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 1;
  text-align: left;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  max-width: 250px;
  white-space: normal;
  padding: 4px 8px;
  z-index: 9999;
  background-color: #2F2F2F;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv .tooltip-arrow {
  font-size: 20px;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv .tooltip-arrow::before {
  border-color: transparent;
  display: none;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv[data-popper-placement*='bottom'] .tooltip-arrow::after {
  top: 1px;
  border-color: transparent transparent #2F2F2F transparent;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv[data-popper-placement*='top'] .tooltip-arrow::after {
  top: -1px;
  border-color: #2F2F2F transparent transparent transparent;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv[data-popper-placement*='right'] .tooltip-arrow::after {
  border-color: transparent #2F2F2F transparent transparent;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv[data-popper-placement*='left'] .tooltip-arrow::after {
  border-color: transparent transparent transparent #2F2F2F;
}
.RCV-namespace .tooltip-container.tooltip-container--textAlign--left {
  text-align: left;
}
.RCV-namespace .tooltip-container.tooltip-container--textAlign--center {
  text-align: center;
}
.RCV-namespace .tooltip-container.tooltip-container--textAlign--right {
  text-align: right;
}
.RCV-namespace .tooltip-container__content {
  display: flex;
  flex-direction: row;
  line-height: normal;
  white-space: pre-wrap;
}
.RCV-namespace .tooltip-container__content :not(:last-child) {
  margin-inline-end: 0.5rem;
}
.RCV-namespace .Tooltip.closable > .tooltip-container {
  padding: 8px 36px 8px 12px;
  line-height: 20px;
  pointer-events: all;
}
.RCV-namespace .Tooltip.closable > .tooltip-container .closing-cross {
  right: 12px;
  top: 12px;
  position: absolute;
}
.RCV-namespace .Tooltip {
  position: relative;
  display: flex;
}
.RCV-namespace .Tooltip:not(.disable):hover .Tooltip__tooltip {
  display: block;
}
.RCV-namespace .Tooltip__tooltip {
  display: none;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: #FFFFFF;
  line-height: 1;
  text-align: left;
  border-radius: 4px;
  position: absolute;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.31);
  background-color: #2F2F2F;
  white-space: pre;
  padding: 4px 8px;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  left: calc(50% + 0px);
  z-index: 1;
  pointer-events: none;
}
.RCV-namespace .Tooltip__tooltip:before {
  content: '';
  display: block;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 6px solid transparent;
  border-top-color: #2F2F2F;
  position: absolute;
  bottom: -12px;
  right: calc(50% + 0px);
  transform: translateX(6px);
}
.RCV-namespace .Tooltip__tooltip--no-pointer-translate:before {
  transform: none;
}
.RCV-namespace .Tooltip__tooltip--center-x {
  left: 50%;
  transform: translateX(-50%);
}
.RCV-namespace .Tooltip__tooltip--full-width {
  width: 100% !important;
}
.RCV-namespace .Tooltip__closing-cross {
  right: 12px;
  top: 12px;
  position: absolute;
}
.RCV-namespace .Tooltip__closing-cross:before {
  content: '\D7';
}

.RCV-namespace .tooltip-container.tooltip-container--rcv.tooltip-container--guide.FeatureGuide {
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
  background: #FFFFFF;
  color: #000000;
  border-radius: 10px;
  padding: 16px;
}
.RCV-namespace .FeatureGuide__title {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: #000000;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  margin-right: 12px;
}
.RCV-namespace .FeatureGuide__content {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  color: #4E4E57;
  font-size: 14px;
  line-height: 20px;
  padding-top: 8px;
  font-weight: normal;
}
.RCV-namespace .FeatureGuide__footer {
  margin-top: 12px;
  display: flex;
  justify-content: right;
}
.RCV-namespace .FeatureGuide__close {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  color: #666666;
  padding: 4px;
  border-radius: 4px;
}

.RCV-namespace .grid-layout {
  width: 100%;
}
.RCV-namespace .grid-layout__row {
  display: flex;
  background: #FFFFFF;
  align-items: flex-start;
  border-bottom: 1px solid #eaeaea;
}
.RCV-namespace .grid-layout__row:last-child {
  border-bottom: none;
}
.RCV-namespace .grid-layout__row:hover, .RCV-namespace .grid-layout__row:focus, .RCV-namespace .grid-layout__row:focus-within {
  background: #F9F9F9;
}
.RCV-namespace .grid-layout__cell {
  text-align: left;
  padding: 22px 22px 22px 10px;
}
.RCV-namespace .grid-layout__cell--left-align {
  text-align: left;
}
.RCV-namespace .grid-layout__cell--right-align {
  text-align: right;
}
.RCV-namespace .grid-layout__cell--center-align {
  text-align: center;
}

.RCV-namespace .HomeButtonMenu {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 104px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px 0px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 2px 1px -1px;
  z-index: 1;
  --icon-color: #067BBD;
}
.RCV-namespace .HomeButtonMenu__button {
  --button-gap: 23px;
  --separator-offset: calc(-1px - var(--button-gap));
  display: flex;
  position: relative;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  color: #2F2F2F;
  min-width: 36px;
  padding: 8px;
  margin: auto var(--button-gap);
}
.RCV-namespace .HomeButtonMenu__button:hover {
  color: #626262;
  --icon-color: #089bee;
}
.RCV-namespace .HomeButtonMenu__button:active {
  color: #959595;
  --icon-color: #31b0f8;
}
.RCV-namespace .HomeButtonMenu__button:not(:last-child)::after {
  content: '';
  height: 48px;
  background-color: #e6e6e6;
  width: 1px;
  position: absolute;
  right: var(--separator-offset);
}
.RCV-namespace .HomeButtonMenu__icon-wrapper {
  height: 36px;
  width: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.RCV-namespace .HomeButtonMenu__icon-wrapper .svg-startMeeting {
  height: 22px;
}
.RCV-namespace .HomeButtonMenu__icon-wrapper .svg-scheduleMeeting {
  height: 24px;
}
.RCV-namespace .HomeButtonMenu__icon-wrapper .svg-joinMeeting {
  height: 24px;
}
.RCV-namespace .HomeButtonMenu__icon-wrapper .svg-shareScreen {
  height: 25px;
}
.RCV-namespace .HomeButtonMenu__icon {
  fill: var(--icon-color);
}
.RCV-namespace .HomeButtonMenu__separator {
  height: 48px;
  background-color: #e6e6e6;
  width: 1px;
  border: none;
}
.RCV-namespace .HomeButtonMenu__text {
  font-size: 15px;
  line-height: 18px;
  margin-top: 4px;
}
.RCV-namespace .HomeButtonMenu__button--locked:disabled {
  background-color: #FFFFFF !important;
}
.RCV-namespace .HomeButtonMenu__button--locked::before {
  content: "\e90c";
  font-family: 'RCV-Desktop';
  color: var(--icon-color);
  height: 30px;
  width: 30px;
  border-radius: 50%;
  position: absolute;
  right: 5px;
  bottom: 20px;
}
.RCV-namespace .accessibility-mode .HomeButtonMenu__button:focus {
  border: 1px solid #067BBD;
  border-radius: 4px;
}

.RCV-namespace .Icon__description {
  margin: 0;
  font-size: 13px;
  line-height: 15px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  width: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.RCV-namespace .InputNumber {
  white-space: nowrap;
}
.RCV-namespace .InputNumber__controls {
  display: inline-block;
  vertical-align: middle;
}
.RCV-namespace .InputNumber__input {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  width: 32px;
  height: 36px;
  text-align: center;
  border: 1px solid #999999;
  border-left-color: transparent;
  border-right-color: transparent;
  background: transparent;
  outline: none;
  line-height: 34px;
  vertical-align: middle;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  z-index: 1;
}
.RCV-namespace .accessibility-mode .InputNumber__input:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
  border-left-color: #999999;
  border-right-color: #999999;
}
.RCV-namespace .Button.InputNumber__button {
  position: relative;
  min-width: auto;
  width: 32px;
  height: 36px;
  padding: 0;
  line-height: 36px;
}
.RCV-namespace .Button.InputNumber__button:disabled {
  border-color: #999999;
}
.RCV-namespace .Button.InputNumber__button:disabled::before, .RCV-namespace .Button.InputNumber__button:disabled::after {
  background-color: #999999;
}
.RCV-namespace .Button.InputNumber__button--increment {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.RCV-namespace .Button.InputNumber__button--increment::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 12px;
  height: 2px;
  background: #067BBD;
  content: '';
}
.RCV-namespace .Button.InputNumber__button--increment::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 2px;
  height: 12px;
  background: #067BBD;
  content: '';
}
.RCV-namespace .Button.InputNumber__button--decrement {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.RCV-namespace .Button.InputNumber__button--decrement::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 12px;
  height: 2px;
  background: #067BBD;
  content: '';
}
.RCV-namespace .Tooltip.InputNumber__tooltip {
  display: inline-block;
  vertical-align: middle;
}
.RCV-namespace .InputNumber__label {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  font-weight: 600;
  margin-left: 8px;
  color: #000000;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .InputNumber input::-webkit-outer-spin-button, .RCV-namespace .InputNumber input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.RCV-namespace .InputNumber input[type=number] {
  -moz-appearance: textfield;
}

.RCV-namespace .JoinButton {
  position: relative;
  display: flex;
  justify-content: center;
  min-width: 230px;
  min-height: 45px;
}
.RCV-namespace .JoinButton__button {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: relative;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  background-color: #067BBD;
  color: #FFFFFF;
  min-width: 185px;
  height: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  border-right: 1px solid #93c6e3;
  padding: 10px 0 10px 45px;
  margin: 0;
  vertical-align: middle;
  font-size: 18px;
  border-radius: 50vh 0 0 50vh;
  outline: none;
}
.RCV-namespace .JoinButton__button-text {
  display: flex;
  flex-grow: 1;
  justify-content: flex-end;
}
.RCV-namespace .JoinButton__button-icon {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-grow: 1;
  min-width: 56px;
}
.RCV-namespace .JoinButton__button:hover {
  background-color: #056ba4;
}
.RCV-namespace .JoinButton__button--disabled {
  background-color: rgba(6, 123, 189, 0.3);
  border-right-color: rgba(255, 255, 255, 0.3);
}
.RCV-namespace .JoinButton__button--disabled:hover {
  background-color: rgba(6, 123, 189, 0.3);
}
.RCV-namespace .JoinButton__dropdown {
  position: relative;
  display: flex;
  background-color: #067BBD;
  color: #FFFFFF;
  width: 45px;
  height: 100%;
  border-radius: 0 50vh 50vh 0;
  border: none;
  outline: none;
}
.RCV-namespace .JoinButton__dropdown--disabled:focus {
  box-shadow: none !important;
}
.RCV-namespace .JoinButton__dropdown::after {
  content: '';
  position: absolute;
  left: calc(50% - 20px / 2);
  top: calc(50%);
  height: 20px;
  width: 20px;
  border: 10px inset transparent;
  border-bottom: 10px solid #FFFFFF;
  box-sizing: border-box;
  z-index: 1;
  display: none;
}
.RCV-namespace .JoinButton__dropdown--disabled:focus-within::after {
  display: none;
}
.RCV-namespace .JoinButton__dropdown:hover {
  background-color: #056ba4;
}
.RCV-namespace .JoinButton__dropdown--disabled {
  background-color: rgba(6, 123, 189, 0.3);
}
.RCV-namespace .JoinButton__dropdown--disabled:hover {
  background-color: rgba(6, 123, 189, 0.3);
}
.RCV-namespace .JoinButton--expanded .JoinButton__dropdown-list, .RCV-namespace .JoinButton--expanded .JoinButton__dropdown::after {
  display: block;
}
.RCV-namespace .JoinButton .Tooltip__tooltip {
  z-index: 2;
}
.RCV-namespace .JoinButton .Tooltip.dropdown-tooltip .Tooltip__tooltip {
  margin-right: 10px;
}
.RCV-namespace .JoinButton__dropdown-icon {
  width: 100%;
  height: 100%;
  font-size: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.RCV-namespace .JoinButton__dropdown-list {
  max-height: 300px;
  box-sizing: border-box;
  margin: -1px 0 30px;
  padding: 0;
  background-color: #FFFFFF;
  width: 170px;
  top: calc(50% + 20px);
  right: 0;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.25);
  border: none;
  border-radius: 4px;
  z-index: 2;
  overflow: visible;
  position: absolute;
  display: none;
}
.RCV-namespace .JoinButton__dropdown-list.open-up {
  top: auto;
  bottom: 100%;
  left: 0;
}
.RCV-namespace .JoinButton__dropdown-list-item {
  position: relative;
  color: #000000;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  padding: 9px 5px 9px 33px;
}
.RCV-namespace .JoinButton__dropdown-list-item--selected:not(.JoinButton__dropdown-list-item--disabled) {
  color: #067BBD;
  background-color: #FFFFFF;
}
.RCV-namespace .JoinButton__dropdown-list-item:first-child {
  border-radius: 5px 5px 0 0;
}
.RCV-namespace .JoinButton__dropdown-list-item:last-child {
  border-radius: 0 0 5px 5px;
}
.RCV-namespace .JoinButton__dropdown-list-item--selected::after {
  position: absolute;
  top: 9px;
  left: 13px;
  font-family: 'RCV-Desktop';
  content: "\e91a";
}
.RCV-namespace .JoinButton__dropdown-list-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.RCV-namespace .JoinButton__dropdown-list-item--disabled {
  background-color: rgba(0, 0, 0, 0.05);
  color: #666666;
}
.RCV-namespace .JoinButton--white .JoinButton__button {
  color: #067BBD;
  border-right-color: #E2E2E2;
  background-color: #FFFFFF;
}
.RCV-namespace .JoinButton--white .JoinButton__button:not(.JoinButton__button--disabled):hover {
  background-color: #E6F2F8;
}
.RCV-namespace .JoinButton--white .JoinButton__button--disabled {
  border-right-color: #C7C7C7;
  background-color: #E2E2E2;
  color: #999999;
}
.RCV-namespace .JoinButton--white .JoinButton__dropdown {
  color: #999999;
  background-color: #FFFFFF;
}
.RCV-namespace .JoinButton--white .JoinButton__dropdown:not(.JoinButton__dropdown--disabled):hover {
  color: #067BBD;
  background-color: #E6F2F8;
}
.RCV-namespace .JoinButton--white .JoinButton__dropdown--disabled {
  background-color: #E2E2E2;
}
.RCV-namespace .JoinButton--small {
  min-width: 95px;
  min-height: 36px;
}
.RCV-namespace .JoinButton--small .Tooltip.dropdown-tooltip .Tooltip__tooltip {
  margin-right: 0;
}
.RCV-namespace .JoinButton--small .JoinButton__button {
  min-width: 70px;
  font-size: 0.9rem;
  padding: 6px 0 6px 8px;
}
.RCV-namespace .JoinButton--small .JoinButton__button-icon {
  min-width: 26px;
}
.RCV-namespace .JoinButton--small .JoinButton__button [class*=" icon-"] {
  font-size: 22px;
}
.RCV-namespace .JoinButton--small .JoinButton__dropdown::after {
  top: calc(50% - 5px);
}
.RCV-namespace .JoinButton--small .JoinButton__dropdown-list {
  top: calc(50% + 12px);
}
.RCV-namespace .JoinButton--small .JoinButton__dropdown {
  width: 25px;
  font-size: 0.9rem;
}
.RCV-namespace .JoinButton--small .JoinButton__dropdown-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}
.RCV-namespace .JoinButton--stateless .JoinButton__dropdown-list-item {
  padding: 9px 13px 9px 16px;
}
.RCV-namespace .JoinButton--stateless .JoinButton__dropdown-list-item--selected {
  display: none;
}
.RCV-namespace .JoinButton--without-icon .JoinButton__button-icon {
  display: none;
}
.RCV-namespace .accessibility-mode .JoinButton__button:focus, .RCV-namespace .accessibility-mode .JoinButton__dropdown:focus, .RCV-namespace .accessibility-mode .JoinButton__dropdown-list-item:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
  z-index: 1;
}

.RCV-namespace .TextField__wrapper {
  display: inline-flex;
  width: 100%;
  position: relative;
}
.RCV-namespace .TextField__wrapper--transparent {
  position: relative;
  height: 40px;
  border-radius: 4px;
  padding: 0;
}
.RCV-namespace .TextField__wrapper--material {
  position: relative;
  display: block;
  height: 52px;
}
.RCV-namespace .TextField__wrapper--flat {
  display: block;
}
.RCV-namespace .TextField__wrapper--flat .TextField__prefix {
  padding: 0;
  border: none;
  font-family: "Proxima Nova Regular", "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 20px;
  color: #666666;
}
.RCV-namespace .TextField__wrapper--flat .TextField__input-wrapper {
  padding-top: 15px;
}
.RCV-namespace .TextField__wrapper--flat.TextField__wrapper--error {
  border-color: #d0021b;
}
.RCV-namespace .TextField__input-wrapper {
  position: relative;
  width: 100%;
}
.RCV-namespace .TextField__input-wrapper--material {
  position: static;
}
.RCV-namespace .TextField__clear-tooltip {
  position: absolute !important;
  right: 12px;
  width: 18px;
  height: 18px;
  top: calc(50% - 9px);
}
.RCV-namespace .TextField__clear-button {
  background: 0;
  border: 0;
  font-size: 0;
  cursor: pointer;
  padding: 0;
}
.RCV-namespace .TextField__clear-icon {
  font-size: 18px;
  color: #999999;
}
.RCV-namespace .TextField__prefix {
  flex: 0 0;
  padding: 8px 10px 0;
  border: 1px solid #C7C7C7;
  border-radius: 4px 0 0 4px;
  border-right: none;
}
.RCV-namespace .TextField__icon {
  position: absolute;
  height: 16px;
  width: 16px;
  top: calc(50% - 8px);
  font-size: 16px;
  left: 14px;
  overflow: hidden;
  pointer-events: none;
}
.RCV-namespace .TextField__icon--right {
  left: auto;
  right: 4px;
}
.RCV-namespace .TextField__input--transparent:-moz-placeholder + .TextField__hint {
  font-size: 16px;
  top: 10px;
}
.RCV-namespace .TextField__input--transparent:placeholder-shown + .TextField__hint {
  font-size: 16px;
  top: 10px;
}
.RCV-namespace .TextField__input--transparent:focus:-moz-placeholder + .TextField__hint {
  font-size: 8px;
  top: 1px;
}
.RCV-namespace .TextField__input--transparent:focus:placeholder-shown + .TextField__hint {
  font-size: 8px;
  top: 1px;
}
.RCV-namespace .TextField__input--material:-moz-placeholder + .TextField__hint {
  font-size: 18px;
  color: rgba(0, 0, 0, 0.3);
  top: 20px;
}
.RCV-namespace .TextField__input--material:placeholder-shown + .TextField__hint {
  font-size: 18px;
  color: rgba(0, 0, 0, 0.3);
  top: 20px;
}
.RCV-namespace .TextField__input--material:-moz-placeholder + .TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__input--material:placeholder-shown + .TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__input--material:focus:-moz-placeholder + .TextField__hint {
  font-size: 12px;
  color: #067BBD;
  top: -1px;
}
.RCV-namespace .TextField__input--material:focus:placeholder-shown + .TextField__hint {
  font-size: 12px;
  color: #067BBD;
  top: -1px;
}
.RCV-namespace .TextField__input--material:focus:-moz-placeholder + .TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__input--material:focus:placeholder-shown + .TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__input--material:focus + .TextField__hint {
  color: #067BBD;
}
.RCV-namespace .TextField__input--material:focus + .TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__hint {
  color: #C7C7C7;
  font-size: 8px;
  line-height: 20px;
  position: absolute;
  left: 10px;
  top: 1px;
  transition: font-size 0.3s, top 0.3s;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.RCV-namespace .TextField__hint--error {
  color: #F44336;
}
.RCV-namespace .TextField__hint--material {
  color: #999999;
  text-transform: initial;
  font-size: 12px;
  background-color: #FFFFFF;
  top: -1px;
  padding: 0 7px;
}
.RCV-namespace .TextField__hint--material.TextField__hint--error {
  color: #d0021b;
}
.RCV-namespace .TextField__input {
  order: 2;
  flex: 1;
  margin: 0;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid #999999;
  border-radius: 4px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 18px;
  width: 100%;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .TextField__input--right-padded {
  padding-right: 38px;
}
.RCV-namespace .TextField__input--icon-positioned {
  padding-left: 38px;
}
.RCV-namespace .TextField__input--prefixed {
  border-radius: 0 4px 4px 0;
}
.RCV-namespace .TextField__input--outlined {
  background-color: #F9F9F9;
}
.RCV-namespace .TextField__input--outlined:disabled {
  border-color: #F9F9F9;
}
.RCV-namespace .TextField__input--white {
  background-color: #FFFFFF;
}
.RCV-namespace .TextField__input--gray {
  border-color: #eaeaea;
}
.RCV-namespace .TextField__input--transparent {
  border: none;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 4px;
  color: #FFFFFF;
  padding: 16px 10px 4px 10px;
  line-height: 20px;
  transition: background-color 0.2s;
}
.RCV-namespace .TextField__input--transparent:focus {
  background-color: rgba(0, 0, 0, 0.7);
}
.RCV-namespace .TextField__input--transparent:disabled {
  color: #FFFFFF !important;
  background-color: rgba(0, 0, 0, 0.3) !important;
}
.RCV-namespace .TextField__input--join:focus {
  color: #2F2F2F;
  background-color: #F9F9F9;
}
.RCV-namespace .TextField__input--join, .RCV-namespace .TextField__input--join.TextField__input--error {
  color: #2F2F2F;
  background-color: #F9F9F9;
  border: 1px solid #E2E2E2 !important;
  padding: 15px 9px 3px 9px;
}
.RCV-namespace .TextField__input--transparent.TextField__input--join:disabled {
  color: #C7C7C7 !important;
  background-color: #F9F9F9 !important;
  border: 1px solid #E2E2E2 !important;
}
.RCV-namespace .TextField__input--join.TextField__input--error:focus {
  border-color: #F44336 !important;
}
.RCV-namespace .TextField__input--transparent.TextField__input--error:focus {
  border: 1px solid #F44336;
  padding: 15px 9px 3px 9px;
}
.RCV-namespace .TextField__input::-moz-placeholder {
  color: #757575;
}
.RCV-namespace .TextField__input::placeholder {
  color: #757575;
}
.RCV-namespace .TextField__input::-moz-placeholder {
  color: #757575;
  opacity: 1;
}
.RCV-namespace .TextField__input--error, .RCV-namespace .TextField__input:invalid:focus {
  border-color: #F44336 !important;
}
.RCV-namespace .TextField__input:focus {
  border-color: #067BBD;
  outline: none;
}
.RCV-namespace .TextField__input:disabled {
  background-color: #F9F9F9;
  color: #999999;
}
.RCV-namespace .TextField__input--material {
  height: 45px;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #999999;
  font-size: 18px;
  background-color: #FFFFFF;
  border-radius: 5px;
  color: #000000;
  padding: 13px 15px 11px 15px;
  line-height: 20px;
  transition: background-color 0.2s;
}
.RCV-namespace .TextField__input--material:focus {
  border-color: #067BBD;
}
.RCV-namespace .TextField__input--material:disabled {
  border-color: rgba(0, 0, 0, 0.1);
  background-color: #FFFFFF;
  color: rgba(0, 0, 0, 0.2);
}
.RCV-namespace .TextField__input--material:-webkit-autofill, .RCV-namespace .TextField__input--material:-webkit-autofill:hover, .RCV-namespace .TextField__input--material:-webkit-autofill:focus, .RCV-namespace .TextField__input--material:-webkit-autofill:active {
  box-shadow: 0 0 0 30px white inset !important;
}
.RCV-namespace .TextField__input--flat {
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #eaeaea;
  text-align: center;
  color: #2F2F2F;
  font-family: "Proxima Nova Regular", "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 20px;
  caret-color: #067BBD;
  padding: 5px;
}
.RCV-namespace .accessibility-mode .TextField__clear-button:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}
.RCV-namespace .SearchField {
  position: relative;
  overflow: hidden;
}
.RCV-namespace .SearchField__search-icon {
  color: #b3b3b3;
}
.RCV-namespace .SearchField__search-icon--focused {
  color: #067BBD;
}
.RCV-namespace .SearchField__input {
  width: 100%;
  display: block;
  padding: 8px 40px 8px 40px;
  box-sizing: border-box;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  color: #C7C7C7;
  transition: 0.2s;
  border: 1px solid #C7C7C7;
  border-radius: 4px;
  outline: none;
  font-size: 16px;
}
.RCV-namespace .SearchField__input:focus {
  color: #2F2F2F;
}
.RCV-namespace .SearchField__placeholder {
  display: inline-flex;
  align-items: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -52%);
  transition: 0.3s;
  pointer-events: none;
  color: #C7C7C7;
}
.RCV-namespace .SearchField__placeholder-text {
  opacity: 0;
  color: #C7C7C7;
}
.RCV-namespace .SearchField__clear-icon {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transition: 0.2s;
  font-family: 'RCV-Desktop';
  color: #C7C7C7;
  font-size: 20px;
  right: 0;
  transform: translate(-8px, -53%);
  opacity: 0;
  padding: 0;
  border: none;
  background: none;
  outline: none;
}
.RCV-namespace .SearchField__input:focus {
  border-color: #067BBD;
}
.RCV-namespace .SearchField__input:-moz-placeholder ~ .SearchField__placeholder {
  transform: translate(-50%, -52%);
}
.RCV-namespace .SearchField__input:placeholder-shown ~ .SearchField__placeholder {
  transform: translate(-50%, -52%);
}
.RCV-namespace .SearchField__input:-moz-placeholder ~ .SearchField__placeholder .SearchField__placeholder-text {
  opacity: 1;
}
.RCV-namespace .SearchField__input:placeholder-shown ~ .SearchField__placeholder .SearchField__placeholder-text {
  opacity: 1;
}
.RCV-namespace .SearchField__input:not(:-moz-placeholder) ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
}
.RCV-namespace .SearchField__input:not(:placeholder-shown) ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
}
.RCV-namespace .SearchField__input:not(:-moz-placeholder) ~ .SearchField__clear-icon {
  opacity: 1;
}
.RCV-namespace .SearchField__input:not(:placeholder-shown) ~ .SearchField__clear-icon {
  opacity: 1;
}
.RCV-namespace .SearchField__input:-moz-placeholder:focus ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
  color: #067BBD;
}
.RCV-namespace .SearchField__input:focus ~ .SearchField__placeholder, .RCV-namespace .SearchField__input:placeholder-shown:focus ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
  color: #067BBD;
}
.RCV-namespace .SearchField--static .SearchField__input {
  border-radius: 17px;
  background: #FFFFFF;
}
.RCV-namespace .SearchField--static .SearchField__placeholder {
  transform: translate(10px, -52%);
}
.RCV-namespace .SearchField--static .SearchField__input:-moz-placeholder ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
}
.RCV-namespace .SearchField--static .SearchField__input:placeholder-shown ~ .SearchField__placeholder {
  left: 0;
  transform: translate(10px, -52%);
}
.RCV-namespace .SearchField--static .SearchField__clear-icon {
  opacity: 1;
}
.RCV-namespace .SearchField--dark .SearchField__input {
  background-color: rgba(255, 255, 255, 0.05);
  color: #FFFFFF;
}
.RCV-namespace .SearchField--dark .SearchField__search-icon, .RCV-namespace .SearchField--dark .SearchField__placeholder-text, .RCV-namespace .SearchField--dark .SearchField__clear-icon {
  color: #FFFFFF;
}
.RCV-namespace .SearchField--no-border .SearchField__input {
  border: none;
}
.RCV-namespace .SearchField--round .SearchField__input {
  border-radius: 11px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.RCV-namespace .JoinForm {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 14px;
  text-align: center;
}
.RCV-namespace .JoinForm__name-row {
  margin-bottom: 5px;
}
.RCV-namespace .JoinForm__meeting-id-row {
  display: flex;
}
.RCV-namespace .JoinForm__meeting-id-input {
  flex: 1;
}
.RCV-namespace .JoinForm__join-button {
  margin-left: 5px;
  background-color: #FFFFFF;
  color: #2F2F2F;
  min-width: 0;
  flex-shrink: 0;
  padding: 10px 16px;
  font-size: 14px;
  line-height: 16px;
}
.RCV-namespace .JoinForm__join-button--meeting-only {
  background-color: #067BBD;
  color: #FFFFFF;
}
.RCV-namespace .JoinForm__join-button--meeting-only:hover {
  background-color: #056ba4;
}
.RCV-namespace .JoinForm__join-button--meeting-only:active {
  background-color: #045b8c;
}
.RCV-namespace .JoinForm__join-button--meeting-only.JoinForm__join-button--disabled {
  background-color: #E2E2E2 !important;
  color: #999999;
}
.RCV-namespace .JoinForm__join-button--disabled, .RCV-namespace .JoinForm__join-button:disabled {
  background-color: rgba(255, 255, 255, 0.5);
  border-color: transparent;
}

.RCV-namespace .NewJoinForm {
  height: 300px;
  display: flex;
  flex-direction: column;
  width: 320px;
  margin: 0 auto;
}
.RCV-namespace .NewJoinForm__meeting-id-row-error {
  height: 20px;
  box-sizing: border-box;
  line-height: 14px;
  font-size: 12px;
  color: #d0021b;
  text-align: left;
  padding: 4px 0;
}
.RCV-namespace .NewJoinForm__name-row-error {
  height: 20px;
  box-sizing: border-box;
  line-height: 14px;
  font-size: 12px;
  color: #d0021b;
  text-align: left;
  padding: 4px 0;
}
.RCV-namespace .NewJoinForm__join-button-row {
  align-self: center;
  padding: 20px 0;
}
.RCV-namespace .NewJoinForm__sign-in-cta {
  text-align: center;
  margin-top: 32px;
}
.RCV-namespace .NewJoinForm__sign-in-cta button {
  color: #067BBD;
}
.RCV-namespace .mobile-browser .NewJoinForm {
  height: auto;
}
.RCV-namespace .mobile-browser .NewJoinForm__join-button-row {
  width: 100%;
}
.RCV-namespace .mobile-browser .NewJoinForm__join-button-row > .Button--big {
  width: 100%;
}
@media screen and (orientation: landscape) {
  .RCV-namespace .mobile-browser .NewJoinForm__join-button-row {
    margin-top: 0px;
  }
}

.RCV-namespace .KeypadButton {
  padding: 0;
  margin: 0 6px;
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  height: 74px;
  width: 74px;
  text-align: center;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 36px;
  line-height: initial;
  outline: none;
  color: #FFFFFF;
  background-color: transparent;
  --ripple-color: #FFFFFF;
  position: relative;
  transform: translate3d(0, 0, 0);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: background 0.3s;
  border-radius: 100%;
}
.RCV-namespace .KeypadButton:disabled {
  --ripple-color: transparent;
}
.RCV-namespace .KeypadButton:after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-color: var(--ripple-color);
  border-radius: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transform: scale(1.5, 1.5);
  opacity: 0;
  transition: transform 0.5s, opacity 0.8s;
}
.RCV-namespace .KeypadButton:active {
  background: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .KeypadButton:disabled:active {
  background: inherit;
}
.RCV-namespace .KeypadButton:active:after {
  transform: scale(0, 0);
  opacity: 0.4;
  transition: 0s;
}
.RCV-namespace .Keypad {
  display: grid;
  grid-template-columns: repeat(3, 74px);
  place-items: center;
  grid-row-gap: 22px;
  grid-column-gap: 28px;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
}
.RCV-namespace .Keypad__delete-button {
  padding: 0;
  margin: 0 6px;
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  height: 74px;
  width: 74px;
  text-align: center;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 36px;
  line-height: initial;
  outline: none;
  color: #FFFFFF;
  background-color: transparent;
  --ripple-color: #FFFFFF;
  position: relative;
  transform: translate3d(0, 0, 0);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: background 0.3s;
  border-radius: 100%;
  border: none;
}
.RCV-namespace .Keypad__delete-button:disabled {
  --ripple-color: transparent;
}
.RCV-namespace .Keypad__delete-button:after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-color: var(--ripple-color);
  border-radius: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transform: scale(1.5, 1.5);
  opacity: 0;
  transition: transform 0.5s, opacity 0.8s;
}
.RCV-namespace .Keypad__delete-button:active {
  background: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .Keypad__delete-button:disabled:active {
  background: inherit;
}
.RCV-namespace .Keypad__delete-button:active:after {
  transform: scale(0, 0);
  opacity: 0.4;
  transition: 0s;
}
.RCV-namespace .Keypad__keyboard-button {
  padding: 0;
  margin: 0 6px;
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  height: 74px;
  width: 74px;
  text-align: center;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 36px;
  line-height: initial;
  outline: none;
  color: #FFFFFF;
  background-color: transparent;
  --ripple-color: #FFFFFF;
  position: relative;
  transform: translate3d(0, 0, 0);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: background 0.3s;
  border-radius: 100%;
  border: none;
  grid-column-start: 1;
}
.RCV-namespace .Keypad__keyboard-button:disabled {
  --ripple-color: transparent;
}
.RCV-namespace .Keypad__keyboard-button:after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-color: var(--ripple-color);
  border-radius: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transform: scale(1.5, 1.5);
  opacity: 0;
  transition: transform 0.5s, opacity 0.8s;
}
.RCV-namespace .Keypad__keyboard-button:active {
  background: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .Keypad__keyboard-button:disabled:active {
  background: inherit;
}
.RCV-namespace .Keypad__keyboard-button:active:after {
  transform: scale(0, 0);
  opacity: 0.4;
  transition: 0s;
}
.RCV-namespace .Keypad__zero-button {
  grid-column-start: 2;
}
.RCV-namespace .Keypad__digit-button {
  padding: 0;
  margin: 0 6px;
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  height: 74px;
  width: 74px;
  text-align: center;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 36px;
  line-height: initial;
  outline: none;
  color: #FFFFFF;
  background-color: transparent;
  --ripple-color: #FFFFFF;
  position: relative;
  transform: translate3d(0, 0, 0);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition: background 0.3s;
  border-radius: 100%;
  border: 1px solid #FFFFFF;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.RCV-namespace .Keypad__digit-button:disabled {
  --ripple-color: transparent;
}
.RCV-namespace .Keypad__digit-button:after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-color: var(--ripple-color);
  border-radius: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transform: scale(1.5, 1.5);
  opacity: 0;
  transition: transform 0.5s, opacity 0.8s;
}
.RCV-namespace .Keypad__digit-button:active {
  background: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .Keypad__digit-button:disabled:active {
  background: inherit;
}
.RCV-namespace .Keypad__digit-button:active:after {
  transform: scale(0, 0);
  opacity: 0.4;
  transition: 0s;
}
.RCV-namespace .Keypad__digit-button:active {
  background-color: #FFFFFF;
  border-color: transparent;
  color: #2F2F2F;
  text-shadow: none;
}

.RCV-namespace .Launcher {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  color: #2F2F2F;
  flex-grow: 2;
  flex-shrink: 0;
}
.RCV-namespace .Launcher a {
  text-decoration: none;
  color: #067BBD;
  cursor: pointer;
}
.RCV-namespace .Launcher__header {
  padding: 30px 30px 10px;
  width: 100%;
  margin-bottom: 0;
  box-sizing: border-box;
}
.RCV-namespace .Launcher__mobile {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.RCV-namespace .Launcher__mobile--center {
  padding-top: 12vw;
  padding-bottom: 7.2vw;
  justify-content: center;
}
.RCV-namespace .Launcher__mobile--center svg, .RCV-namespace .Launcher__mobile--center img {
  height: 40px;
}
.RCV-namespace .mobile-orientation-landscape .Launcher__mobile--center {
  padding: 10px 20px;
  justify-content: flex-start;
}
.RCV-namespace .mobile-orientation-landscape .Launcher__mobile--center svg, .RCV-namespace .mobile-orientation-landscape .Launcher__mobile--center img {
  height: 24px;
}
.RCV-namespace .Launcher__mobile--top-left {
  padding: 10px 20px;
  justify-content: flex-start;
}
.RCV-namespace .Launcher__mobile--top-left svg, .RCV-namespace .Launcher__mobile--top-left img {
  height: 24px;
}
.RCV-namespace .mobile-orientation-landscape .Launcher__mobile .mobile-logo svg, .RCV-namespace .mobile-orientation-landscape .Launcher__mobile .mobile-logo img {
  height: 20px;
}
.RCV-namespace .Launcher__mobile .mobile-logo-extra {
  position: absolute;
  top: 10px;
  right: 20px;
}
.RCV-namespace .Launcher__mobile .mobile-logo-extra svg {
  width: 20px;
  height: 20px;
}
.RCV-namespace .Launcher .colored-logo {
  display: inline-block;
}
.RCV-namespace .Launcher .colored-logo svg, .RCV-namespace .Launcher .colored-logo img {
  display: inline-block;
  vertical-align: bottom;
}
.RCV-namespace .Launcher .colored-logo svg {
  height: 35px;
  width: 160px;
  -o-object-fit: contain;
     object-fit: contain;
}
.RCV-namespace .Launcher .colored-logo img {
  max-height: 35px;
  max-width: 160px;
}
.RCV-namespace .Launcher__main {
  text-align: center;
  flex-grow: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.RCV-namespace .Launcher__main .unsupported-message {
  font-size: 20px;
  font-family: "Proxima Nova Regular", "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .Launcher__main .unsupported-message .Row__inner {
  width: 100%;
  flex-basis: auto;
}
.RCV-namespace .Launcher__main .welcome-text {
  font-size: 28px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  margin: 0 15px 40px;
  text-align: center;
  white-space: pre-wrap;
}
.RCV-namespace .Launcher__main .download-button-wrapper {
  margin-bottom: 50px;
}
.RCV-namespace .Launcher__main .join-button-wrapper {
  margin-bottom: 20px;
}
.RCV-namespace .Launcher__main .login-form {
  width: 320px;
}
.RCV-namespace .Launcher__main .login-form .join-form__row {
  margin-bottom: 20px;
}
.RCV-namespace .Launcher__main .login-form .Button {
  width: 100%;
}
.RCV-namespace .Launcher__main .image {
  height: 250px;
  width: 240px;
  max-width: 100%;
  margin-top: 60px;
  margin-bottom: 30px;
  margin-left: -40px;
}
.RCV-namespace .Launcher__main .image svg {
  max-width: 100%;
  height: auto;
}
.RCV-namespace .Launcher__main .trouble-helper {
  margin-bottom: 50px;
  font-size: 14px;
  margin-top: auto;
}
.RCV-namespace .Launcher__main .trouble-helper p {
  margin: 0 0 10px;
}
.RCV-namespace .Launcher__main .trouble-helper a {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .Launcher__main .outdated-tips {
  display: block;
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px;
  white-space: pre-wrap;
  line-height: 1.5;
}
.RCV-namespace .Launcher__main .join-steps-wrapper {
  text-align: left;
}
.RCV-namespace .Launcher__main .step {
  display: flex;
  margin-bottom: 20px;
  font-size: 16px;
}
.RCV-namespace .Launcher__main .step-order {
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #666666;
  background-color: #F9F9F9;
  border-radius: 30px;
  margin-right: 10px;
  margin-top: 10px;
}
.RCV-namespace .Launcher__main .step-content {
  color: #666666;
  line-height: 30px;
}
.RCV-namespace .Launcher__main .step-content p {
  font-size: 18px;
  margin-top: 11px;
}
.RCV-namespace .Launcher__main .step-content a {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .Launcher__main .copy-link-wrapper {
  display: flex;
  height: 48px;
  font-size: 16px;
  line-height: 1;
  align-items: stretch;
}
.RCV-namespace .Launcher__main .copy-link-wrapper .link {
  background-color: #ebedee;
  padding: 0 20px;
  border-radius: 10px 0 0 10px;
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
  min-width: 300px;
  max-width: 400px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.RCV-namespace .Launcher__main .copy-link-wrapper .link span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .Launcher__main .copy-link-wrapper .copy-button {
  background-color: #067BBD;
  border: none;
  padding: 0 30px;
  color: #FFFFFF;
  border-radius: 0 10px 10px 0;
  cursor: pointer;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 16px;
  white-space: nowrap;
  -webkit-appearance: none;
  margin: 0;
}
.RCV-namespace .Launcher__footer {
  margin-top: auto;
  border-top: 1px solid #E2E2E2;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: 10px;
  box-sizing: border-box;
  color: #2F2F2F;
  padding: 20px 15px;
}
.RCV-namespace .Launcher__footer .inner {
  max-width: 600px;
  color: #666666;
  text-align: center;
  box-sizing: border-box;
}
.RCV-namespace .Launcher__footer .powered-by {
  width: 130px;
  height: 32px;
  display: inline-block;
}
.RCV-namespace .mobile-browser .Launcher__header {
  padding: 0px;
}
.RCV-namespace .mobile-browser .Launcher__main {
  justify-content: center;
  padding: 0 20px;
}
.RCV-namespace .mobile-browser .Launcher__main .welcome-text {
  font-size: 20px;
}
.RCV-namespace .mobile-browser .Launcher__main .image {
  height: auto;
}
.RCV-namespace .mobile-browser .Launcher__main .svg-welcome {
  height: 44.44vw;
}
@media screen and (orientation: landscape) {
  .RCV-namespace .mobile-browser .Launcher__header {
    padding: 0;
  }
  .RCV-namespace .mobile-browser .Launcher__main {
    flex-direction: column;
    align-items: center;
    margin-top: -28px;
  }
  .RCV-namespace .mobile-browser .Launcher__main .welcome-text {
    margin-bottom: 8px;
  }
  .RCV-namespace .mobile-browser .Launcher__main .image {
    margin-top: 0;
    margin-bottom: 0;
  }
  .RCV-namespace .mobile-browser .Launcher__main .svg-welcome {
    width: 27.6vw;
    height: 26.05vw;
  }
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__main .copy-link-wrapper {
    height: 48px;
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__main .copy-link-wrapper .link {
    padding: 0 20px;
    min-width: 200px;
    width: 200px;
    font-size: 14px;
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__main .copy-link-wrapper .copy-button {
    padding: 0 10px;
    font-size: 14px;
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__main .step-content {
    color: #666666;
    line-height: 30px;
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__main .step-content p {
    font-size: 16px;
    margin-top: 11px;
}
.RCV-namespace .RCV_media_query-max_width_500  .Launcher__header {
    text-align: center;
}

.RCV-namespace .LowerBar {
  transition-property: bottom;
  transition-timing-function: linear;
  bottom: 0;
  position: absolute;
  height: 84px;
  left: 0;
  right: 0;
  pointer-events: none;
  z-index: 3;
  transition: transform 0.2s linear;
  display: flex;
  justify-content: center;
}
.RCV-namespace .LowerBar--hidden {
  transform: translate(0, 100%);
}
.RCV-namespace .LowerBar--hidden .mute-alarm-wrapper .RoundButton {
  opacity: 1 !important;
}
.RCV-namespace .LowerBar--sidebar-opened .LowerBar__wrapper {
  margin-right: 300px;
}
.RCV-namespace .LowerBar__wrapper {
  position: relative;
  pointer-events: auto;
  padding: 20px;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.RCV-namespace .LowerBar .mute-alarm-wrapper {
  position: absolute;
  margin-left: -33px;
  left: 50%;
  bottom: 124px;
}
.RCV-namespace .LowerBar .mute-alarm-wrapper .RoundButton {
  transition: 0.2s opacity;
  opacity: 0;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.RCV-namespace .modal-loader__container {
  width: 160px;
  height: 80px;
  opacity: 0.75;
  background-color: black;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 6px;
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}
.RCV-namespace .modal-loader__spinner-boundary {
  width: 24px;
  height: 24px;
  margin-top: 15px;
}
.RCV-namespace .modal-loader__spinner {
  width: 100%;
  height: 100%;
  position: relative;
  display: inline-block;
  font-size: 4px;
  overflow: hidden;
  animation: spin 2s linear infinite;
}
.RCV-namespace .modal-loader__spinner:before, .RCV-namespace .modal-loader__spinner:after, .RCV-namespace .modal-loader__shape:before, .RCV-namespace .modal-loader__shape:after {
  content: '';
  position: absolute;
  top: 0px;
  left: 11px;
  width: 2px;
  height: 8px;
  background: white;
  border-radius: 1px;
  box-shadow: 0 16px white;
  transform-origin: 50% 12px;
}
.RCV-namespace .modal-loader__spinner:after {
  transform: rotate(-45deg);
}
.RCV-namespace .modal-loader__shape:before {
  transform: rotate(-90deg);
}
.RCV-namespace .modal-loader__shape:after {
  transform: rotate(-135deg);
}
.RCV-namespace .modal-loader__text {
  color: white;
  font-size: 12px;
  position: relative;
  margin: 0px;
  top: 10px;
}

.RCV-namespace .star-rating {
  display: grid;
  grid-auto-flow: column;
  width: 100%;
  color: #FFBF2A;
  --star-fill: #FFBF2A;
}
.RCV-namespace .star-rating__star {
  position: relative;
  cursor: pointer;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.RCV-namespace .star-rating__star.star-rating__star--empty {
  color: #666666;
  --star-fill: transparent;
}
.RCV-namespace .star-rating input {
  opacity: 0;
  margin: 0;
  padding: 0;
  width: 38px;
  height: 38px;
  position: absolute;
  pointer-events: none;
}
.RCV-namespace .star-rating--no-rated {
  color: #666666;
  --star-fill: transparent;
}
.RCV-namespace .star-rating input:checked ~ label {
  color: #666666;
  --star-fill: transparent;
}
.RCV-namespace .star-rating input:checked + label {
  color: #FFBF2A;
  --star-fill: #FFBF2A;
}
.RCV-namespace .star-rating label:hover, .RCV-namespace .star-rating input:focus + label {
  color: #FFBF2A;
  --star-fill: #FFBF2A;
}
.RCV-namespace .star-rating:hover .star-rating__star {
  color: #FFBF2A;
  --star-fill: #FFBF2A;
}
.RCV-namespace .star-rating:hover label:hover ~ label {
  color: #666666;
  --star-fill: transparent;
}
.RCV-namespace .star-full {
  width: 25px;
  height: 25px;
}
.RCV-namespace .mobile-browser .star-full {
  width: 32px;
  height: 32px;
}
.RCV-namespace .accessibility-mode .star-rating--no-rated {
  color: #FFBF2A;
  --star-fill: #FFBF2A;
}
.RCV-namespace .accessibility-mode .star-rating__star--empty {
  color: #666666;
  --star-fill: transparent;
}

.RCV-namespace :where(.DialogTitle) button, .RCV-namespace :where(.DialogTitle) input[type='submit'] {
  background: none;
  border: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  outline: none;
}
.RCV-namespace .DialogWrapper {
  background-color: #FFFFFF;
  border-radius: 6px;
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 1px 10px rgba(0, 0, 0, 0.12), 0 4px 5px rgba(0, 0, 0, 0.14);
  display: flex;
  flex-direction: column;
}
.RCV-namespace .dialog-title-actions {
  position: absolute;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 12px 17px;
  height: 49px;
  box-sizing: border-box;
  z-index: 1;
}
.RCV-namespace .dialog-button {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  z-index: 1;
  color: #666666;
  width: 24px;
  height: 24px;
  line-height: 1;
  font-size: 18px;
}
.RCV-namespace .dialog-button:active, .RCV-namespace .dialog-button:hover {
  outline: none;
  color: #067BBD;
}
.RCV-namespace .help-btn {
  position: relative;
  top: -1px;
  line-height: normal;
  display: flex;
  align-items: center;
}
.RCV-namespace .help-btn .svg-help {
  width: 18px;
  height: 18px;
}
.RCV-namespace .DialogTitle {
  text-align: center;
  padding: 12px 0 11px;
  position: sticky;
}
.RCV-namespace .DialogTitle__actions {
  position: absolute;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 12px 17px;
  height: 49px;
  box-sizing: border-box;
  z-index: 1;
}
.RCV-namespace .DialogTitle__text {
  font-size: 16px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  line-height: 25px;
  color: #2F2F2F;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 50px;
  max-height: 50px;
  text-overflow: ellipsis;
}
.RCV-namespace .DialogTitle__button {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  z-index: 1;
  color: #666666;
  width: 24px;
  height: 24px;
  line-height: 1;
  font-size: 18px;
}
.RCV-namespace .DialogTitle__button:active, .RCV-namespace .DialogTitle__button:hover {
  outline: none;
  color: #067BBD;
}
.RCV-namespace .DialogTitle__button--help {
  position: relative;
  top: -1px;
  line-height: normal;
  display: flex;
  align-items: center;
}
.RCV-namespace .DialogTitle__button--help .svg-help {
  width: 18px;
  height: 18px;
}
.RCV-namespace .DialogTitle--underlined {
  border-bottom: 1px solid #E2E2E2;
}
.RCV-namespace .DialogButtonsWrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 14px 0 18px 0;
  text-align: center;
  flex-shrink: 0;
}
.RCV-namespace .DialogButtonsWrapper .Button {
  margin: 0 8px;
}
.RCV-namespace .HeightWrapper {
  height: 100%;
  overflow: auto;
}
.RCV-namespace .DialogInner {
  padding: 21px 0;
  height: auto;
  display: grid;
  grid-template-columns: [all-start] 24px [content-start] minmax(auto, calc(100% - 48px)) [content-end] 24px [all-end];
  grid-auto-flow: row;
  overflow: auto;
}
.RCV-namespace .DialogInner > * {
  grid-column: content;
}
.RCV-namespace .DialogInner > .full-width {
  grid-column: all;
  padding-left: 24px;
  padding-right: 24px;
}
.RCV-namespace .DialogInner > .no-padding {
  padding: 0;
}
.RCV-namespace .DialogInner--thin {
  grid-template-columns: [all-start] 40px [content-start] minmax(auto, calc(100% - 80px)) [content-end] 40px [all-end];
}
.RCV-namespace .DialogInner--thin .full-width {
  padding-left: 40px;
  padding-right: 40px;
}
.RCV-namespace .DialogInner--medium {
  grid-template-columns: [all-start] 59px [content-start] minmax(auto, calc(100% - 80px)) [content-end] 59px [all-end];
}
.RCV-namespace .DialogInner--medium .full-width {
  padding-left: 59px;
  padding-right: 59px;
}
.RCV-namespace .DialogInner--xthin {
  grid-template-columns: [all-start] 80px [content-start] minmax(auto, calc(100% - 160px)) [content-end] 80px [all-end];
}
.RCV-namespace .DialogInner--xthin .full-width {
  padding-left: 80px;
  padding-right: 80px;
}
.RCV-namespace .DialogInner--full-height {
  height: 100%;
}
.RCV-namespace .DialogInner--no-vertical-offset {
  padding-top: 0;
  padding-bottom: 0;
}
.RCV-namespace .DialogInner--overflow-visible {
  overflow: visible;
}
.RCV-namespace .DialogInner--overflow-hidden {
  overflow: hidden;
}
.RCV-namespace .DialogGroupTitle {
  background-color: transparent;
  height: 36px;
  display: grid;
  align-content: center;
  grid-template-areas: 'content';
  grid-template-columns: 1fr;
}
.RCV-namespace .DialogGroupTitle + .DialogGroupTitle {
  border-top: 2px solid transparent;
}
.RCV-namespace .DialogGroupTitle--has-right {
  position: relative;
  grid-template-columns: 1fr max-content;
  grid-template-areas: 'content toggle' 'content .';
}
.RCV-namespace .DialogGroupTitle__content {
  font-size: 16px;
  color: #000000;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  word-break: break-word;
  grid-area: content;
  align-self: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.RCV-namespace .DialogGroupTitle__right {
  grid-area: toggle;
  align-self: start;
  margin: 0 auto;
}
.RCV-namespace .WaitingRoomNotification, .RCV-namespace .UnmuteWrapper {
  position: relative;
  display: inline-block;
  z-index: 5000;
}
.RCV-namespace .WaitingRoomNotification__modal, .RCV-namespace .UnmuteWrapper__modal {
  width: 312px;
  position: absolute;
  bottom: calc(12px + 100%);
  left: calc(-135px + 50%);
  border-radius: 5px;
}
.RCV-namespace .mobile-browser .WaitingRoomNotification__modal, .RCV-namespace .mobile-browser .UnmuteWrapper__modal {
  width: 240px;
  left: -82px;
}
.RCV-namespace .WaitingRoomNotification__modal--invisible, .RCV-namespace .UnmuteWrapper__modal--invisible {
  display: none !important;
}
.RCV-namespace .WaitingRoomNotification__modal h4, .RCV-namespace .UnmuteWrapper__modal h4 {
  padding: 0 16px;
  text-align: center;
  margin: 14px 0 4px 0;
}
.RCV-namespace .WaitingRoomNotification__modal::after, .RCV-namespace .UnmuteWrapper__modal::after {
  content: '';
  display: block;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 6px inset transparent;
  border-top: 6px solid #FFFFFF;
  position: absolute;
  bottom: -12px;
  right: 50%;
  transform: translateX(6px);
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 312px;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogTitle {
  padding: 0;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogTitle__text {
  margin: 14px 0 4px;
  padding: 0 28px 0 16px;
  text-align: center;
  font-size: 14px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogTitle__actions {
  position: absolute;
  right: 4px;
  top: 4px;
  padding: 0;
  margin: 0;
  height: auto;
  width: auto;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogTitle__button {
  margin: 0;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogButtonsWrapper {
  padding: 14px 0 18px;
  display: flex;
  justify-content: center;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .WaitingRoomNotification__modal .DialogButtonsWrapper > button {
  min-height: 30px;
  min-width: 92px;
  font-size: 14px;
  margin: 0 8px;
}
.RCV-namespace .mobile-browser.mobile-orientation-landscape.mobile-browser.mobile-orientation-landscape.mobile-browser.mobile-orientation-landscape .WaitingRoomNotification__modal {
  margin: 0;
  left: calc((75px - 312px) / 2);
}

.RCV-namespace .rate-quality-modal-wrapper {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  max-width: 700px;
  width: 700px;
  display: grid;
  overflow-y: auto;
  overflow-x: hidden;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__dialog-title {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 20px;
  text-align: left;
  padding-left: 25px;
  margin: 24px 0 32px 0;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__star-rating {
  margin: 0 auto 32px;
  width: 100%;
  min-width: 260px;
  max-width: 280px;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__dismiss-block {
  text-align: center;
  color: #666666;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__dismiss-block-description {
  align-items: center;
  justify-content: center;
  margin: 0 0 32px;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__dismiss-block-button {
  margin: 0 0 60px;
  color: #666666;
  border-color: #999999;
  min-width: 140px;
  min-height: 48px;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__dismiss-block-button:hover {
  color: #0083bf;
  background-color: #FFFFFF;
  border-color: currentColor;
}
.RCV-namespace .rate-quality-modal-wrapper .rate-quality-modal__feedback-sent {
  width: clamp(260px, 100vw, 522px);
}
.RCV-namespace .rate-quality-modal-wrapper:has(.rate-quality-modal__details-form) {
  width: auto;
}
.RCV-namespace .rate-quality-modal-wrapper:has(.rate-quality-modal__details-form) .Button {
  width: 240px;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper {
  max-width: 100%;
  width: 100%;
  height: calc(100% - 44px);
  background: #F9F9F9;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .rate-quality-modal__title-wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .rate-quality-modal__dismiss-block .Checkbox__title--checkbox {
  max-width: 260px;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .rate-quality-modal__dismiss-block-button {
  margin: 0 0 28px;
  width: 90vw;
  max-width: 400px;
  color: #067BBD;
  border-color: #067BBD;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .rate-quality-modal__dismiss-block-description {
  margin: 0 0 12px;
  height: 28px;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .rate-quality-modal__dialog-title {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  text-align: center;
  padding: 0;
  max-width: 90vw;
}
.RCV-namespace .mobile-browser .rate-quality-modal-wrapper .rate-quality-modal__feedback-wrapper .Checkbox__title--checkbox {
  font-size: 16px;
  text-align: left;
}
.RCV-namespace .modal:has(.feedback-modal) .modal-header-actions {
  padding: 24px;
  height: initial;
  width: 100px;
  right: 0;
}
.RCV-namespace .dialog:has(.feedback-modal):not(.mobile-browser .dialog) {
  position: absolute;
  top: 4%;
}
.RCV-namespace .mobile-browser .modal:has(.feedback-modal) .modal-header-actions {
  padding: 12px 17px;
}
.RCV-namespace .RCV_media_query-max_width_540  .modal:has(.feedback-modal) .modal-header-actions {
    padding: 12px 17px;
}

.RCV-namespace .ReactionsMessageNotification {
  box-sizing: border-box;
  position: relative;
  margin-inline-start: auto;
  margin-inline-end: auto;
  margin-block-end: 12px;
  padding: 10px 16px;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 320px;
  border-radius: 15px;
  pointer-events: initial;
  background-color: rgba(0, 0, 0, 0.7);
  cursor: pointer;
}
.RCV-namespace .ReactionsMessageNotification .reaction {
  display: grid;
  grid-template-columns: repeat(3, fit-content(100%));
  align-items: center;
  color: #FFFFFF;
  gap: 6px;
}
.RCV-namespace .ReactionsMessageNotification .reaction [class*="svg-"] {
  width: 30px;
  color: #0091ff;
}
.RCV-namespace .ReactionsMessageNotification .reaction .name, .RCV-namespace .ReactionsMessageNotification .reaction .message {
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .ReactionsMessageNotification .reaction .name {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .accessibility-mode .ReactionsMessageNotification:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}

.RCV-namespace .ReactionsNotification {
  color: #FFFFFF;
  font-size: 11px;
  line-height: 14px;
  font-weight: bold;
}
.RCV-namespace .ReactionsNotification .ReactionsNotification__modal {
  z-index: 1;
  background-color: #FF8800;
  min-height: 20px;
  width: auto;
  position: absolute;
  border-radius: 4px;
  bottom: calc(-6px + 100%);
  left: 50%;
  transform: translateX(-50%);
  flex-direction: row;
  align-items: center;
  padding: 3px 4px;
  gap: 4px;
  box-sizing: border-box;
  box-shadow: none;
}
.RCV-namespace .ReactionsNotification .ReactionsNotification__modal--invisible {
  display: none;
}
.RCV-namespace .ReactionsNotification--top > .ReactionsNotification__modal, .RCV-namespace .ReactionsNotification--bottom > .ReactionsNotification__modal {
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.3);
}
.RCV-namespace .ReactionsNotification--top > .ReactionsNotification__modal::after, .RCV-namespace .ReactionsNotification--bottom > .ReactionsNotification__modal::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  height: 8px;
  width: 8px;
  border: 4px inset transparent;
  border-top: 4px solid #FF8800;
  transform: translateX(-4px);
  box-sizing: border-box;
}
.RCV-namespace .ReactionsNotification--bottom > .ReactionsNotification__modal {
  bottom: unset;
  top: calc(4px + 100%);
}
.RCV-namespace .ReactionsNotification--bottom > .ReactionsNotification__modal::after {
  bottom: 100%;
  top: initial;
  border: 4px inset transparent;
  border-bottom: 4px solid #FF8800;
}
.RCV-namespace .ReactionsNotification__icon-wrapper {
  display: flex;
  align-items: center;
}
.RCV-namespace .ReactionsNotification .ReactionsNotification__icon {
  width: 14px;
  height: 14px;
  padding-right: 2px;
  color: #FFFFFF;
}

.RCV-namespace .sequoia-alert-dialog__wrapper {
  width: 600px;
  max-width: 100vw;
}
.RCV-namespace .sequoia-alert-dialog__title.DialogTitle {
  padding: 0;
}
.RCV-namespace .sequoia-alert-dialog__inner.DialogInner {
  padding-top: 0;
}
.RCV-namespace .sequoia-alert-dialog__image-container {
  display: flex;
  justify-content: center;
}
.RCV-namespace .sequoia-alert-dialog__image {
  width: 270px;
}
.RCV-namespace .sequoia-alert-dialog__buttons-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.RCV-namespace .RCV_media_query-max_width_600  .sequoia-alert-dialog__inner.DialogInner {
    padding-top: 21px;
}

.RCV-namespace .service-unavailable {
  text-align: center;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 8px;
}
.RCV-namespace .service-unavailable .service-unavailable__image {
  display: block;
  margin: 0 auto;
}
.RCV-namespace .service-unavailable .service-unavailable__text {
  color: #2F2F2F;
  font-size: 16px;
  white-space: pre;
}

.RCV-namespace .NewShareForm {
  height: 300px;
  display: flex;
  flex-direction: column;
  width: 320px;
  margin: 0 auto;
}
.RCV-namespace .NewShareForm__meeting-id-row-error {
  height: 20px;
  box-sizing: border-box;
  line-height: 14px;
  font-size: 12px;
  color: #d0021b;
  text-align: left;
  padding: 2px 18px;
}
.RCV-namespace .NewShareForm__name-row-error {
  height: 20px;
  box-sizing: border-box;
  line-height: 14px;
  font-size: 12px;
  color: #d0021b;
  text-align: left;
  padding: 2px 18px;
}
.RCV-namespace .NewShareForm__join-button-row {
  align-self: center;
  margin-top: auto;
  padding: 20px 0;
}

.RCV-namespace .actionable-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background-color: #3C3C43;
  border-radius: 4px;
}
.RCV-namespace .actionable-banner__icon {
  width: 20px;
  color: #FFFFFF;
}
.RCV-namespace .actionable-banner__message {
  color: #FFFFFF;
  font-size: 14px;
  flex: 1;
}

.RCV-namespace .Watermark {
  position: absolute;
  pointer-events: none;
  z-index: 500;
  min-width: 120px;
  max-width: 350px;
  opacity: 0.65;
  display: flex;
}
.RCV-namespace .Watermark--left {
  left: 0;
}
.RCV-namespace .mobile-browser .Watermark {
  opacity: 1;
  transition: all 0.5s;
  height: 24px;
  min-width: auto;
  max-width: 92px;
  right: 6px;
  bottom: 2px;
}
.RCV-namespace .mobile-browser.mobile-show-toolbar .Watermark {
  right: 6px;
  bottom: calc(72px + 2px);
}

.RCV-namespace .MenuButton {
  margin: 0 8px;
  display: inline-block;
  box-sizing: border-box;
  height: 40px;
  width: 40px;
  text-align: center;
  border-radius: 50%;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 24px;
  line-height: 24px;
  outline: none;
  border: 1px solid transparent;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  color: #2F2F2F;
  background-color: #FFFFFF;
  cursor: pointer;
  position: relative;
  padding: 0;
}
.RCV-namespace .MenuButton:first-of-type {
  margin-left: 0;
}
.RCV-namespace .MenuButton:last-of-type {
  margin-right: 0;
}
.RCV-namespace .MenuButton:hover {
  color: #067BBD;
}
.RCV-namespace .MenuButton:active {
  color: #FFFFFF;
  background-color: #067BBD;
}
.RCV-namespace .MenuButton--active {
  color: #FFFFFF;
  background-color: #067BBD;
}
.RCV-namespace .MenuButton--active:hover {
  color: #FFFFFF;
  background-color: #056ba4;
}
.RCV-namespace .MenuButton--active:active {
  color: #FFFFFF;
  background-color: #0570A1;
}
.RCV-namespace .MenuButton--muted {
  background-color: #FFFFFF;
}
.RCV-namespace .MenuButton--muted:hover {
  background-color: #f2f2f2;
}
.RCV-namespace .MenuButton--svg-inner-icon:active {
  background-color: #FFFFFF;
  color: #067BBD;
}
.RCV-namespace .MenuButton--toolbar.MenuButton {
  box-sizing: border-box;
  padding: 9px 0 !important;
  margin: 0 !important;
  width: 75px;
  height: 72px;
  color: #FFFFFF;
  border-radius: inherit;
  background-color: inherit;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}
.RCV-namespace .MenuButton--toolbar.MenuButton:hover, .RCV-namespace .MenuButton--toolbar.MenuButton:active {
  color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .MenuButton--toolbar.MenuButton--active:not(.MenuButton--svg-inner-icon) {
  background-color: #039FD8;
}
.RCV-namespace .MenuButton--toolbar.MenuButton--active:not(.MenuButton--svg-inner-icon):hover {
  background-color: #12bdfc;
}
.RCV-namespace .MenuButton--toolbar.MenuButton.ongoing {
  color: #FFFFFF;
}
.RCV-namespace .MenuButton--toolbar.MenuButton:disabled {
  color: #666666;
  background-color: inherit;
}
.RCV-namespace .MenuButton--secondary-lo-bar.MenuButton {
  width: 46px;
  flex-direction: row;
  justify-content: center;
  font-size: 22px;
  margin-right: 12px;
}
.RCV-namespace .MenuButton--secondary-lo-bar.MenuButton .icon-info {
  margin-bottom: 4px;
}
.RCV-namespace .MenuButton--float {
  width: 40px;
  height: 40px;
  font-size: 18px;
  line-height: 18px;
  color: #FFFFFF;
  background-color: rgba(50, 54, 54, 0.5);
  border-radius: 4px;
  border: 1px solid #969696;
}
.RCV-namespace .MenuButton--float:hover, .RCV-namespace .MenuButton--floatactive {
  color: #FFFFFF;
  background-color: rgba(50, 54, 54, 0.5);
}
.RCV-namespace .MenuButton--float:disabled {
  color: rgba(255, 255, 255, 0.2) !important;
  background-color: rgba(50, 54, 54, 0.2) !important;
}
.RCV-namespace .MenuButton--internal {
  border: 1px solid #515151;
  width: 30px;
  height: 30px;
  border-radius: 0;
  box-shadow: none;
  color: #FFFFFF;
  background-color: rgba(50, 54, 54, 0.5);
  font-size: 10px;
}
.RCV-namespace .MenuButton--internal--active:not([disabled]), .RCV-namespace .MenuButton--internal:hover:not([disabled]), .RCV-namespace .MenuButton--internal:active:not([disabled]) {
  position: relative;
  z-index: 1;
  color: #FFFFFF;
  background-color: #1a1a1a;
  border-radius: 4px;
  border: 1px solid #1a1a1a;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.59);
}
.RCV-namespace .MenuButton--internal:focus {
  position: relative;
  z-index: 2;
}
.RCV-namespace .MenuButton--internal:disabled {
  color: rgba(255, 255, 255, 0.4) !important;
  background-color: rgba(50, 54, 54, 0.5) !important;
}
.RCV-namespace .MenuButton--internal.MenuButton--active {
  position: relative;
  z-index: 1;
  color: #FFFFFF;
  background-color: #1a1a1a;
  border-radius: 4px;
  border: 1px solid #1a1a1a;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.59);
}
.RCV-namespace .MenuButton--huge {
  width: 42px;
  height: 42px;
  font-size: 24px;
  line-height: 24px;
  color: #FFFFFF;
  background-color: rgba(0, 0, 0, 0.4);
  box-shadow: none;
}
.RCV-namespace .MenuButton--huge:hover, .RCV-namespace .MenuButton--hugeactive {
  color: #FFFFFF;
  background-color: rgba(0, 0, 0, 0.4);
}
.RCV-namespace .MenuButton--huge:disabled {
  color: rgba(255, 255, 255, 0.2) !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
}
.RCV-namespace .MenuButton--huge .OverlayButton {
  right: -1px;
  top: -1px;
}
.RCV-namespace .MenuButton--semitransparent {
  width: 40px;
  height: 40px;
  font-size: 18px;
  line-height: 18px;
  color: #FFFFFF;
  background-color: rgba(0, 0, 0, 0.5);
}
.RCV-namespace .MenuButton--semitransparent:hover, .RCV-namespace .MenuButton--semitransparentactive {
  color: #FFFFFF;
  background-color: rgba(0, 0, 0, 0.5);
}
.RCV-namespace .MenuButton--semitransparent:disabled {
  color: rgba(255, 255, 255, 0.2) !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
}
.RCV-namespace .MenuButton--pulse {
  color: #2F2F2F;
  background-color: #FFFFFF;
}
.RCV-namespace .MenuButton--pulse::after {
  content: '';
  width: 2px;
  height: 2px;
  border-radius: 50%;
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% - 1px);
  box-shadow: 0 0 0 rgba(255, 0, 0, 0.4);
  animation: inner-pulse 1s infinite;
}
.RCV-namespace .MenuButton--huge.MenuButton--pulse::after {
  animation: big-inner-pulse 1s infinite;
}
@keyframes big-inner-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.4);
  }
  70% {
    box-shadow: 0 0 0 33px rgba(255, 0, 0, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
  }
}
@keyframes inner-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.4);
  }
  70% {
    box-shadow: 0 0 0 20px rgba(255, 0, 0, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
  }
}
.RCV-namespace .MenuButton--red {
  color: #FFFFFF;
  background-color: #F44336;
}
.RCV-namespace .MenuButton--red:hover {
  color: #FFFFFF;
  background-color: #ea1c0d;
}
.RCV-namespace .MenuButton--red:active, .RCV-namespace .MenuButton--red:hover:active {
  color: #FFFFFF;
  background-color: #d2190b;
}
.RCV-namespace .MenuButton--orange {
  color: #FFFFFF;
  background-color: #FF8800;
}
.RCV-namespace .MenuButton--orange:hover {
  color: #FFFFFF;
  background-color: #cc6d00;
}
.RCV-namespace .MenuButton--orange:active, .RCV-namespace .MenuButton--orange:hover:active {
  color: #FFFFFF;
  background-color: #b35f00;
}
.RCV-namespace .MenuButton--record {
  color: #2F2F2F;
}
.RCV-namespace .MenuButton--record:hover, .RCV-namespace .MenuButton--record:active {
  background-color: #FFFFFF;
  color: #067BBD;
}
.RCV-namespace .MenuButton--record.ongoing {
  color: #F44336;
}
.RCV-namespace .MenuButton--locked {
  color: #C7C7C7;
}
.RCV-namespace .MenuButton--locked:disabled {
  background-color: #FFFFFF !important;
}
.RCV-namespace .MenuButton--locked::before {
  background-color: #F44336;
  content: "\e90c";
  font-family: 'RCV-Desktop';
  font-size: 16px;
  color: #FFFFFF;
  line-height: 20px;
  height: 24px;
  width: 24px;
  border-radius: 50%;
  position: absolute;
  top: -6px;
  left: 22px;
  text-align: center;
}
.RCV-namespace .MenuButton--locked.MenuButton--active {
  color: #FFFFFF;
  background-color: #067BBD;
}
.RCV-namespace .MenuButton--locked.MenuButton--active:disabled {
  color: #FFFFFF;
  background-color: #067BBD !important;
}
.RCV-namespace .MenuButton:disabled {
  color: #C7C7C7;
  background-color: #E2E2E2;
  cursor: default;
}
.RCV-namespace .MenuButton--transparent {
  color: #FFFFFF;
  border-color: #FFFFFF;
  background-color: transparent;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.RCV-namespace .MenuButton--transparent:hover {
  background-color: #FFFFFF;
  border-color: transparent;
  color: #2F2F2F;
  text-shadow: none;
}
.RCV-namespace .MenuButton--transparent:active {
  background-color: rgba(255, 255, 255, 0.7);
  border-color: transparent;
  color: #2F2F2F;
  text-shadow: none;
}
.RCV-namespace .MenuButton--transparent:disabled {
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(255, 255, 255, 0.7);
  background-color: transparent;
}
.RCV-namespace .MenuButton--grouped {
  background-color: transparent;
  color: #FFFFFF;
  border-color: transparent;
  border-radius: 0;
  box-shadow: none;
}
.RCV-namespace .MenuButton--grouped:hover {
  color: #FFFFFF;
  background-color: transparent;
}
.RCV-namespace .MenuButton--grouped:active {
  color: #FFFFFF;
  background-color: transparent;
}
.RCV-namespace .MenuButton--grouped + .MenuButton--grouped {
  margin-left: 0;
  margin-right: 0;
}
.RCV-namespace .MenuButton--digit {
  height: 74px;
  width: 74px;
  padding-bottom: 5px;
  margin: 0;
  border-width: 2px;
}
.RCV-namespace .MenuButton--inactive {
  background-color: #FFFFFF;
  color: #C7C7C7;
}
.RCV-namespace .MenuButton--inactive:hover, .RCV-namespace .MenuButton--inactive:active, .RCV-namespace .MenuButton--inactive:disabled {
  background-color: #FFFFFF;
  color: #C7C7C7;
}
.RCV-namespace .MenuButton--flat {
  box-shadow: none;
}
.RCV-namespace .MenuButton--small {
  width: 30px;
  height: 30px;
  line-height: 1px;
}
.RCV-namespace .MenuButton--small:focus {
  z-index: 10;
}
.RCV-namespace .MenuButton--small-icon {
  font-size: 18px !important;
}
.RCV-namespace .MenuButton--small-icon span {
  font-size: 18px !important;
}
.RCV-namespace .MenuButton--middle-icon {
  font-size: 22px !important;
}
.RCV-namespace .MenuButton--middle-icon span {
  font-size: 22px !important;
}
.RCV-namespace .MenuButton--minimal {
  color: #FFFFFF;
  border: none;
  background-color: transparent;
  text-shadow: none;
  box-shadow: none;
}
.RCV-namespace .MenuButton--minimal:hover, .RCV-namespace .MenuButton--minimal:active {
  color: #2F2F2F;
  background-color: transparent;
}
.RCV-namespace .MenuButton--minimal:disabled {
  color: rgba(255, 255, 255, 0.7);
  background-color: transparent;
}
.RCV-namespace .MenuButton--minimal.MenuButton--active {
  background-color: #FFFFFF;
}
.RCV-namespace .MenuButton--center-content {
  display: inline-flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
}
.RCV-namespace .MenuButton--rounded-square {
  border-radius: 7px;
}
.RCV-namespace .MenuButton--link-text {
  color: #067BBD;
}
.RCV-namespace .MenuButton__wrapper {
  display: inline-block;
  height: 100%;
}
.RCV-namespace .accessibility-mode .MenuButton:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}
.RCV-namespace .accessibility-mode .MenuButton--toolbar.MenuButton:focus.MenuButton:not(.is-more-menu) {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}
.RCV-namespace .RCV_media_query-max_width_540  .MenuButton--toolbar.MenuButton {
    width: 70px;
}
.RCV-namespace .RCV_media_query-min_width_541.RCV_media_query-max_width_600  .MenuButton--toolbar.MenuButton {
    width: 67px;
}
.RCV-namespace .RCV_media_query-min_width_541.RCV_media_query-max_width_600  .MenuButton--toolbar.MenuButton .icon-participants-count-wrapper {
    left: 34px;
}

.RCV-namespace .MenuButtonsGroup {
  display: inline-block;
  width: auto;
}
.RCV-namespace .MenuButtonsGroup--blue {
  background-color: #067BBD;
  height: 40px;
  border-radius: 20px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}
.RCV-namespace .MenuButtonsGroup--blue > .tt-wrapper {
  margin: 0;
}
.RCV-namespace .MenuButtonsGroup--panel {
  background-color: transparent;
  height: 30px;
  border-style: solid;
  border-color: #515151;
  border-width: 1px 0 1px 1px;
  box-sizing: border-box;
  border-radius: 4px;
}
.RCV-namespace .MenuButtonsGroup--panel > .MenuButton:first-child, .RCV-namespace .MenuButtonsGroup--panel .tt-wrapper:first-child .MenuButton {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.RCV-namespace .MenuButtonsGroup--panel > .MenuButton:last-child, .RCV-namespace .MenuButtonsGroup--panel .tt-wrapper:last-child .MenuButton {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.RCV-namespace .MenuButtonsGroup--panel .MenuButton {
  margin: -1px 0 0 -1px;
}

.RCV-namespace .OverlayButton {
  background-color: #F44336;
  box-sizing: border-box;
  content: "\e90c";
  font-family: 'RCV-Desktop';
  font-size: 11px;
  color: #FFFFFF;
  line-height: 16px;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  position: absolute;
  top: -4px;
  text-align: center;
  outline: none;
  border: none;
  padding: 0;
  z-index: 1;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}
.RCV-namespace .OverlayButton:hover, .RCV-namespace .OverlayButton:active, .RCV-namespace .OverlayButton:focus, .RCV-namespace .OverlayButton:disabled {
  background-color: #F44336;
  color: #FFFFFF;
}
.RCV-namespace .OverlayButton--low-pos {
  top: 23px;
}
.RCV-namespace .OverlayButton--low-left-pos {
  top: 23px;
  left: -10px;
}
.RCV-namespace .OverlayButton--low-right-pos {
  top: 24px;
  right: 14px;
}
.RCV-namespace .OverlayButton--submenu {
  font-size: 14px;
  line-height: 14px;
  background-color: #FFFFFF;
  border: 1px solid #067BBD;
  color: #067BBD;
}
.RCV-namespace .OverlayButton--submenu-active, .RCV-namespace .OverlayButton--submenu:hover {
  font-size: 14px;
  line-height: 14px;
  background-color: #067BBD;
  color: #FFFFFF;
  border: 1px solid #067BBD;
}
.RCV-namespace .OverlayButton--submenu:focus {
  font-size: 14px;
  line-height: 14px;
  background-color: #FFFFFF;
  border: 1px solid #067BBD;
  color: #067BBD;
}
.RCV-namespace .OverlayButton--submenu:focus:hover {
  color: #FFFFFF;
  background-color: #067BBD;
}
.RCV-namespace .OverlayButton--without-shadow {
  box-shadow: none;
}
.RCV-namespace .accessibility-mode .OverlayButton--submenu:focus {
  box-shadow: 0 0 0 1px #323636, 0 0 0 4px #067BBD;
  font-size: 14px;
  line-height: 14px;
  background-color: #FFFFFF;
  border: 1px solid #067BBD;
  color: #067BBD;
}
.RCV-namespace .accessibility-mode .OverlayButton--submenu:focus:hover {
  color: #FFFFFF;
  background-color: #067BBD;
}

.RCV-namespace .RecordingMark {
  position: relative;
  top: 0;
  min-height: 16px;
  min-width: 52px;
  text-align: center;
  background-color: #FFFFFF;
  color: #000000;
  border-radius: 2px;
  font-size: 12px;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .RecordingMark__label {
  font-family: 'RCV-Desktop', "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  margin-right: 8px;
  position: relative;
}
.RCV-namespace .RecordingMark__label::after {
  content: '\ea03';
  font-family: 'RCV-Desktop', "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 12px;
  transform: scale(0.5);
  position: absolute;
  top: -5px;
  right: -9px;
}
.RCV-namespace .RecordingMark--red {
  background-color: #F44336;
  color: #FFFFFF;
  padding: 4px 6px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.RCV-namespace .MinimalNavBar {
  display: flex;
  justify-content: space-evenly;
  background-color: #1a1a1a;
  color: #FFFFFF;
  height: 56px;
}
.RCV-namespace .MinimalNavBar .Tooltip__tooltip--bottom {
  top: calc(100% + 7px);
}
.RCV-namespace .MinimalNavBar .Tooltip__tooltip--right {
  right: 12px;
}
.RCV-namespace .MinimalNavBar__wrapper {
  position: relative;
  visibility: visible;
  transition: transform 500ms ease,
            visibility 0s ease 0s;
}
.RCV-namespace .MinimalNavBar__wrapper.auto-hide-controls {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}
.RCV-namespace .MinimalNavBar__wrapper.auto-hide-controls .MinimalNavBarItem {
  border-top: 0;
  background-color: rgba(255, 255, 255, 0);
  border-bottom: 2px solid rgba(255, 255, 255, 0);
}
.RCV-namespace .MinimalNavBar__wrapper.auto-hide-controls.hide {
  visibility: hidden;
  transform: translateY(-56px);
  transition: transform 500ms ease,
                    visibility 0s ease 500ms;
}
.RCV-namespace .MinimalNavBar__wrapper .WaitingRoomNotification {
  position: absolute;
  top: 62px;
  left: 0;
  width: 100%;
}
.RCV-namespace .MinimalNavBar__wrapper .WaitingRoomNotification__modal {
  bottom: unset;
  width: 100%;
  max-width: 312px;
}
.RCV-namespace .MinimalNavBar__wrapper .WaitingRoomNotification__modal .DialogTitle__text {
  font-size: 13px;
  font-weight: 600;
}
.RCV-namespace .MinimalNavBar__wrapper .WaitingRoomNotification__modal .DialogTitle__button {
  font-size: 15px;
  margin-right: 10px;
}
.RCV-namespace .MinimalNavBar__wrapper .WaitingRoomNotification__modal:after {
  display: none;
}
.RCV-namespace .mobile-browser .MinimalNavBar {
  background-color: rgba(26, 26, 26, 0.6);
}
.RCV-namespace .mobile-browser .MinimalNavBar__wrapper {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}
.RCV-namespace .mobile-browser .MinimalNavBar__wrapper .WaitingRoomNotification {
  left: 0;
  right: 0;
  max-width: 450px;
  margin: 0 auto;
}
.RCV-namespace .mobile-browser .MinimalNavBar__wrapper.hide {
  visibility: hidden;
  height: 0;
  transform: translateY(-56px);
}
.RCV-namespace .MinimalNavBarItem {
  width: 72px;
  min-height: 56px;
  font-size: 22px;
  border: none;
  padding: 0;
  padding-top: 10px;
  padding-bottom: 2px;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  background-color: #1a1a1a;
  color: rgba(255, 255, 255, 0.5);
  border-top: 2px solid #1a1a1a;
  border-bottom: 2px solid #1a1a1a;
}
.RCV-namespace .MinimalNavBarItem svg {
  width: 24px;
  fill: rgba(255, 255, 255, 0.5);
}
.RCV-namespace .MinimalNavBarItem--isActive {
  color: #FFFFFF;
  border-bottom-color: #0ba6df;
}
.RCV-namespace .MinimalNavBarItem--isActive svg {
  fill: #FFFFFF;
}
.RCV-namespace .MinimalNavBarItem__chat-badge, .RCV-namespace .MinimalNavBarItem__participants-badge, .RCV-namespace .MinimalNavBarItem__badge-small, .RCV-namespace .MinimalNavBarItem__badge-medium {
  position: absolute;
  font-size: 10px;
  top: 10px;
}
.RCV-namespace .MinimalNavBarItem__chat-badge {
  top: 6px;
  right: 20px;
}
.RCV-namespace .MinimalNavBarItem__participants-badge {
  top: 6px;
  left: 42px;
}
.RCV-namespace .MinimalNavBarItem__badge-medium {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 12px;
  right: 18px;
}
.RCV-namespace .MinimalNavBarItem__badge-small {
  right: 18px;
}
.RCV-namespace .MinimalNavBarItem__has-notification, .RCV-namespace .MinimalNavBarItem__has-umi-notification {
  position: relative;
}
.RCV-namespace .MinimalNavBarItem__has-notification .MinimalNavBarItem:after {
  content: '';
  display: block;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 6px inset transparent;
  border-bottom: 6px solid #FFFFFF;
  position: absolute;
  bottom: -6px;
  left: 50%;
  margin-left: -6px;
  z-index: 7;
}
.RCV-namespace .mobile-browser .MinimalNavBarItem {
  background-color: rgba(255, 255, 255, 0);
  border-top: 0;
  border-bottom: 2px solid rgba(255, 255, 255, 0);
}
.RCV-namespace .mobile-browser .MinimalNavBarItem__has-notification, .RCV-namespace .mobile-browser .MinimalNavBarItem__has-umi-notification {
  display: flex;
}
.RCV-namespace .mobile-browser .MinimalNavBarItem--isActive {
  border-bottom-color: #0ba6df;
}
.RCV-namespace .accessibility-mode .MinimalNavBarItem:focus {
  outline: 1px solid rgba(255, 255, 255, 0.5);
}
.RCV-namespace .accessibility-mode .MinimalNavBarItem--isActive:focus {
  outline: 1px solid #FFFFFF;
}
.RCV-namespace .RCV_media_query-max_width_960.RCV_media_query-min_width_541  .mobile-browser .MinimalNavBar {
    justify-content: center;
}
.RCV-namespace .RCV_media_query-max_width_960.RCV_media_query-min_width_541  .mobile-browser .MinimalNavBar > div {
    justify-content: center;
    flex: 0 1 120px;
}
.RCV-namespace .RCV_media_query-max_width_960.RCV_media_query-min_width_541  .mobile-browser .MinimalNavBarItem__participants-badge {
    top: 6px;
    left: 66px;
}

.RCV-namespace .Radio {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 2px 0;
}
.RCV-namespace .Radio__input {
  opacity: 0;
  margin: 0;
  position: absolute;
}
.RCV-namespace .Radio__check {
  position: relative;
  height: 16px;
  width: 16px;
  min-width: 16px;
  background-color: #FFFFFF;
  border-radius: 50%;
  border: 2px solid #666666;
  color: #FFFFFF;
  display: inline-block;
  font-family: 'RCV-Desktop' !important;
  transition: background 0.2s;
}
.RCV-namespace .Radio__check:after {
  content: '';
  height: 10px;
  width: 10px;
  border-radius: 50%;
  position: absolute;
  background-color: #067BBD;
  top: 3px;
  left: 3px;
  opacity: 0;
  transition: opacity 0.2s;
}
.RCV-namespace .Radio__input:disabled + .Radio__check {
  border-color: #C7C7C7;
}
.RCV-namespace .Radio__title {
  margin-left: 8px;
}
.RCV-namespace .Radio__title--disabled {
  color: #C7C7C7;
}
.RCV-namespace .Radio__input:checked + .Radio__check {
  border-color: #067BBD;
}
.RCV-namespace .Radio__input:checked + .Radio__check:after {
  opacity: 1;
}
.RCV-namespace .Radio__input:checked:disabled + .Radio__check {
  border-color: #C7C7C7;
}
.RCV-namespace .Radio__input:checked:disabled + .Radio__check:after {
  background-color: #C7C7C7;
}
.RCV-namespace .accessibility-mode .Radio__input:focus + .Radio__check {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}

.RCV-namespace .Row {
  min-height: 48px;
  display: flex;
  align-items: center;
}
.RCV-namespace .Row__inner {
  flex-basis: 100%;
  max-width: 100%;
}
.RCV-namespace .Row--vertical-padded {
  padding: 10px 0;
}
.RCV-namespace .Row--horizontal-padded {
  padding: 0 10px;
}
.RCV-namespace .Row--has-right {
  justify-content: space-between;
}
.RCV-namespace .Row--has-right .Row__inner {
  flex-basis: auto;
  width: 60%;
}
.RCV-namespace .Row--has-right .Row__inner .join-url {
  word-break: break-all;
}
.RCV-namespace .Row--has-right .Row__right {
  display: flex;
  justify-content: flex-end;
  text-align: end;
  width: 40%;
}
.RCV-namespace .Row--list-group {
  min-height: 32px;
}
.RCV-namespace .Row--no-border {
  border: none;
}
.RCV-namespace .Row--aligned > .Row__inner, .RCV-namespace .Row--aligned > .Row__right {
  flex-basis: 100%;
}
.RCV-namespace .Row--align-items-start {
  align-items: flex-start;
}
.RCV-namespace .Row.Row--has-right.settings-video-hd .Row__right {
  min-width: 40%;
  width: auto;
}
.RCV-namespace .RowGroup {
  padding: 6px 0;
}
.RCV-namespace .RowGroup .Row {
  min-height: 28px;
}
.RCV-namespace .RowGroup .Row--for-input-after-checkbox {
  min-height: 39px;
  padding-bottom: 10px;
}
.RCV-namespace .RowGroup .Row--for-input-after-checkbox .Row__inner {
  padding-left: 27px;
}
.RCV-namespace .RowGroup .Row--for-input-after-checkbox .Row__inner .Dropdown {
  width: calc(100% - 27px);
}
.RCV-namespace .RowGroup--padding-right {
  padding-right: 12px;
}
.RCV-namespace .RowGroup--padding-left {
  padding-left: 12px;
}
.RCV-namespace .RowGroup--no-padding {
  padding: 0;
}

.RCV-namespace .ss-puller {
  position: absolute;
  overflow: visible;
  z-index: 16;
  padding: 0;
  right: -12px;
  top: 36px;
  height: calc(100% - 72px - 36px);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: col-resize;
}
.RCV-namespace .ss-puller__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 100%;
  flex-direction: column;
}
.RCV-namespace .ss-puller__inner svg {
  width: 12px;
  height: 12px;
  margin: 8px 0;
}
.RCV-namespace .ss-puller__line {
  width: 2px;
  border-radius: 1px;
  background-color: #757575;
  flex: 1 1 0;
  min-height: 0;
  opacity: 0;
}
.RCV-namespace .ss-puller__line--bottom {
  margin-bottom: 8px;
}
.RCV-namespace .ss-puller:hover .ss-puller__line {
  opacity: 1;
}
.RCV-namespace .ss-puller--drag {
  cursor: grabbing;
  transition: none;
}
.RCV-namespace .ss-puller--drag .ss-puller__line {
  opacity: 1;
}
.RCV-namespace .ss-puller .tooltip-btn-side-left-wrapper.force > .tooltip {
  display: flex;
  align-items: center;
  right: 12px;
}
.RCV-namespace .mobile-browser .ss-puller {
  display: none !important;
}
.RCV-namespace .controls-hidden .ss-puller {
  height: calc(100% - 36px);
}

.RCV-namespace .tooltip-container--rcv.tooltip-container--inMeeting {
  max-width: 350px;
}
.RCV-namespace .tooltip-container--rcv.tooltip-container--inMeeting.screen-share-tooltip {
  white-space: pre-line;
}

.RCV-namespace .TooltipInfo.Tooltip {
  display: inline-block;
  vertical-align: middle;
  margin: 0 4px;
  padding: 0 4px;
}
.RCV-namespace .TooltipInfo__info-icon {
  position: relative;
}
.RCV-namespace .TooltipInfo__info-icon svg {
  width: 14px;
  height: 14px;
  fill: #939393;
  display: block;
}
.RCV-namespace .TooltipInfo__info-icon svg:hover {
  fill: #067BBD;
}
.RCV-namespace .TooltipInfo__warning-icon {
  position: relative;
}
.RCV-namespace .TooltipInfo__warning-icon svg {
  width: 14px;
  height: 14px;
  color: #d0021b;
  display: block;
}
.RCV-namespace .TooltipInfo__warning-icon svg:hover {
  color: #E55649;
}
.RCV-namespace .tooltip-container.tooltip-container--rcv.tooltip-container--TooltipInfo {
  max-width: 320px;
  line-height: 1.1em;
  white-space: initial;
}
.RCV-namespace .accessibility-mode .TooltipInfo__info-icon:focus-visible {
  border-radius: 50%;
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}
.RCV-namespace .RCV_media_query-max_width_500  .tooltip-container.tooltip-container--rcv.tooltip-container--TooltipInfo {
    width: auto;
}

.RCV-namespace .NetworkIndicator {
  position: relative;
  display: inline-block;
  text-align: right;
}
.RCV-namespace .NetworkIndicator__connection-indicator {
  height: 20px;
  background-size: 20px;
  background-repeat: no-repeat;
}
.RCV-namespace .NetworkIndicator--gallery {
  width: 15px;
  height: 11px;
}
.RCV-namespace .NetworkIndicator--gallery .NetworkIndicator__connection-indicator {
  height: 11px;
  background-size: 11px;
  transform: translateY(2px);
  margin-right: 2px;
}
.RCV-namespace .NetworkIndicator--toolbar, .RCV-namespace .NetworkIndicator--show-below {
  width: 24px;
}
.RCV-namespace .NetworkIndicator--right-side {
  margin-left: 10px;
}
.RCV-namespace .tooltip-container.nqi-tooltip-wide {
  width: initial !important;
  max-width: initial !important;
}

.RCV-namespace ul.AccessibleList {
  list-style: none;
  margin: 0;
  padding: 0;
}
.RCV-namespace ul.AccessibleList li {
  list-style: none;
}
.RCV-namespace ul.AccessibleList li:focus {
  outline: none;
}

.RCV-namespace .ChatMessage {
  display: grid;
  grid-template-columns: 30px 1fr minmax(min-content, max-content);
  grid-column-gap: 8px;
  grid-row-gap: 3px;
  padding: 8px 16px 10px;
}
.RCV-namespace .ChatMessage:last-child {
  padding-bottom: 20px;
}
.RCV-namespace .ChatMessage__avatar-wrapper {
  grid-column: 1/2;
  align-self: start;
}
.RCV-namespace .ChatMessage__participant-avatar {
  width: 30px;
  height: 30px;
}
.RCV-namespace .ChatMessage__participant-name {
  grid-column: 2/3;
  align-self: center;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .ChatMessage__message-time {
  grid-column: 3/4;
  align-self: center;
  color: #999999;
  font-family: "Proxima Nova Regular", "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.ChatMessage__message-body {
  word-break: break-word;
  grid-column: 2/4;
  grid-row: 2/3;
}
.RCV-namespace .ChatMessage--notification {
  pointer-events: initial;
  box-sizing: border-box;
  position: relative;
  width: 320px;
  background-color: rgba(0, 0, 0, 0.7);
  padding: 12px 16px;
  border: none;
  color: #FFFFFF;
  border-radius: 8px;
  margin-left: 0;
  margin-bottom: 12px;
  display: grid;
  cursor: pointer;
}
.ChatMessage--notification .ChatMessage__message-body {
  grid-column: 1/4;
  grid-row: 2/3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.RCV-namespace .ChatMessage__list {
  pointer-events: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}
.RCV-namespace .ChatMessage__transition-enter {
  opacity: 0.01;
  transform: scaleY(0.001);
  height: 1px;
  margin-bottom: 1px;
  overflow: hidden;
}
.RCV-namespace .ChatMessage__transition-enter.ChatMessage__transition-enter-active {
  opacity: 1;
  transform: scaleY(1);
  margin-bottom: 12px;
  height: auto;
  transition: opacity 200ms ease-in, transform 150ms, margin 150ms;
}
.RCV-namespace .ChatMessage__transition-exit {
  opacity: 1;
  transform: scaleY(1);
  margin-bottom: 12px;
  height: auto;
}
.RCV-namespace .ChatMessage__transition-exit.ChatMessage__transition-exit-active {
  opacity: 0.01;
  transform: scaleY(0.001);
  height: 1px;
  margin-bottom: 1px;
  overflow: hidden;
  transition: opacity 200ms ease-in, transform 150ms, margin 150ms;
}
.RCV-namespace .mobile-browser .ChatMessage__message-time {
  white-space: nowrap;
}
.RCV-namespace .ChatMessageForm {
  padding: 18px 16px;
  background-color: #F9F9F9;
  border-top: 1px solid #E2E2E2;
  margin-top: -1px;
}
.RCV-namespace .ChatButton {
  position: relative;
}
.RCV-namespace .ChatButton__badge {
  position: absolute;
  top: 4px;
  left: 42px;
}
.RCV-namespace .ChatContents {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
  position: relative;
}
.RCV-namespace .ChatContents__list {
  flex: 1;
  display: flex;
  flex-direction: column;
  cursor: auto;
  overflow-y: auto;
}
.RCV-namespace .ChatContents__list--v3 {
  overflow-y: unset;
}
.RCV-namespace .ChatContents__loader {
  padding: 16px 0 32px 0;
  margin-bottom: 0!important;
}
.RCV-namespace .ChatContents__send-block {
  flex: 0 0 auto;
  z-index: 0;
}
.RCV-namespace .ChatContents__send-form {
  padding: 18px 16px;
  background-color: #F9F9F9;
  margin: 0;
  /* fix for safari */
}
.RCV-namespace .ChatContents__send-form > button[type=submit] {
  display: none;
}
.RCV-namespace .ChatContents__recovering-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.8);
  color: #666666;
  z-index: -1;
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  animation-name: recovering-overlay;
  animation-delay: 3s;
  animation-duration: 1s;
  animation-timing-function: steps(1, end);
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.RCV-namespace .ChatContents__send-message-error {
  color: #F44336;
}
.RCV-namespace .ChatContents.failure textarea {
  border-color: #F44336;
}
.RCV-namespace .ChatContents.sending input {
  border-color: #C7C7C7;
  background-color: #F9F9F9;
  color: #999999;
}
.RCV-namespace .mobile-browser .ChatContents__send-mobile-wrapper {
  display: flex;
  align-items: center;
}
.RCV-namespace .mobile-browser .ChatContents__send-button {
  width: 16px;
  height: 16px;
  padding: 12px 0 12px 12px;
  color: #999999;
}
.RCV-namespace .mobile-browser .ChatContents__send-button--active {
  color: #067BBD;
}
.RCV-namespace .mobile-keyboard-visible .ChatContents__send-form {
  padding: 0 16px 2px;
  background-color: #FFFFFF;
}
.RCV-namespace .accessibility-mode .ChatMessage:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}
@keyframes recovering-overlay {
  from {
    z-index: -10;
    opacity: 0;
  }
  to {
    opacity: 1;
    z-index: 10;
  }
}

.RCV-namespace .PrivateChatItem {
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  width: 100%;
}
.RCV-namespace .PrivateChatItem__content {
  display: grid;
  grid-template-columns: 30px 1fr auto auto;
  grid-template-rows: 1fr;
  grid-gap: 0 8px;
  height: 56px;
  padding: 12px 16px 8px 16px;
  box-sizing: border-box;
  text-align: left;
  align-items: center;
}
.RCV-namespace .PrivateChatItem__avatar-wrapper {
  align-self: center;
  grid-row: 1 / span 2;
}
.RCV-namespace .PrivateChatItem__participant-avatar {
  width: 30px;
  height: 30px;
}
.RCV-namespace .PrivateChatItem__participant-name {
  grid-column: 2 / span 2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .PrivateChatItem__unread-msg-count {
  justify-self: end;
}
.PrivateChatItem__message-body {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
  color: #737373;
}
.RCV-namespace .PrivateChatItem__message-time {
  grid-column: 3 / span 2;
  font-size: 12px;
  color: #737373;
}
.RCV-namespace .accessibility-mode .PrivateChatItem:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}

.RCV-namespace .ChatBackBtn {
  display: flex;
  width: 100%;
  height: 56px;
  padding: 0 16px;
  border-bottom: 1px solid #E2E2E2;
  align-items: center;
  cursor: pointer;
}
.RCV-namespace .ChatBackBtn__back {
  display: flex;
  align-items: center;
  min-width: 20px;
  height: 100%;
  padding-left: 3px;
}
.RCV-namespace .ChatBackBtn__back-icon {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  border-left: 2px solid #C7C7C7;
  border-bottom: 2px solid #C7C7C7;
}
.RCV-namespace .ChatBackBtn__name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .ChatBackBtn .Tooltip__tooltip-target {
  display: flex;
  max-width: 100%;
  align-items: center;
  height: 26px;
}
.RCV-namespace .ChatBackBtn:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.RCV-namespace .ChatBackBtn:hover .ChatWith__back-icon {
  border-color: #999999;
}
.RCV-namespace .accessibility-mode .ChatBackBtn:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}

.RCV-namespace .NoPrivateChats {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px;
}
.RCV-namespace .NoPrivateChats__icon {
  width: 100%;
  height: 120px;
  margin-top: 20px;
  background-position: center;
  background-repeat: no-repeat;
}
.RCV-namespace .NoPrivateChats__msg {
  margin: 30px 20px 0 20px;
  text-align: center;
}

.RCV-namespace .ChatNotification {
  padding: 10px 0 10px;
  background-color: #E2E2E2;
  text-align: center;
}

.RCV-namespace .LowerBarNotification {
  position: relative;
  display: inline-block;
  z-index: 1;
}
.RCV-namespace .LowerBarNotification__modal {
  width: 312px;
  position: absolute;
  bottom: calc(12px + 100%);
  left: -120px;
  border-radius: 5px;
}
.RCV-namespace .LowerBarNotification__modal .DialogTitle {
  text-align: left;
  font-weight: 900;
}
.RCV-namespace .LowerBarNotification__modal .DialogTitle__text {
  padding: 0 16px;
  margin: 0;
}
.RCV-namespace .mobile-browser .LowerBarNotification__modal {
  width: 240px;
  left: -82px;
}
.RCV-namespace .LowerBarNotification__modal--invisible {
  display: none;
}
.RCV-namespace .LowerBarNotification__modal h4 {
  padding: 0 16px;
  text-align: left;
  margin: 0;
  font-weight: 400;
}
.RCV-namespace .LowerBarNotification__modal::after {
  content: '';
  display: block;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 6px inset transparent;
  border-top: 6px solid #FFFFFF;
  position: absolute;
  bottom: -12px;
  right: 50%;
  transform: translateX(6px);
}
.RCV-namespace .LowerBarNotification__modal .DialogButtonsWrapper {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  padding: 16px;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .LowerBarNotification__modal {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 312px;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .LowerBarNotification__modal .DialogTitle {
  padding: 0;
  text-align: left;
  font-weight: 900;
  justify-content: left;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .LowerBarNotification__modal .DialogTitle__text {
  margin: 14px 0 4px;
  padding: 0 16px;
  text-align: left;
  font-size: 14px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .mobile-browser.mobile-browser.mobile-browser .LowerBarNotification__modal .DialogTitle__button {
  margin: 0;
}
.RCV-namespace .mobile-browser.mobile-orientation-landscape.mobile-browser.mobile-orientation-landscape.mobile-browser.mobile-orientation-landscape .WaitingRoomNotification__modal {
  margin: 0;
  left: calc((75px - 312px) / 2);
}

.RCV-namespace .OptionButton {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 24px;
  width: 50px;
  padding: 3px 5px 3px 7px;
  border: 1px solid #4E4E57;
  background-color: transparent;
  border-radius: 8px;
  box-sizing: border-box;
}
.RCV-namespace .OptionButton > *:first-child {
  height: 16px;
}
.RCV-namespace .OptionButton:hover, .RCV-namespace .OptionButton--opened {
  background: rgba(0, 0, 0, 0.2);
}
.RCV-namespace .OptionButton__icon {
  padding: 0;
  margin: 0;
  height: 16px;
  width: 16px;
}
.RCV-namespace .OptionButton__button {
  padding: 0;
  margin-top: 0;
}
.RCV-namespace .accessibility-mode .OptionButton:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
}

.RCV-namespace .OptionMenu {
  margin-top: 2px;
  display: flex;
  padding: 6px;
  width: auto;
  height: auto;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 6px;
  align-self: stretch;
  border-radius: 8px;
  border: 1px solid #4E4E57;
  background-color: #2F2F2F;
  pointer-events: auto;
}
.RCV-namespace .OptionMenu__items {
  display: flex;
  padding: 0;
  margin: 0;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  align-self: stretch;
  gap: 6px;
}

.RCV-namespace .OptionItem {
  list-style: none;
  display: flex;
  gap: 8px;
  align-items: flex-start;
  height: auto;
  padding: 4px 20px 4px 8px;
  border-radius: 4px;
  align-self: stretch;
  position: relative;
  pointer-events: auto;
}
.RCV-namespace .OptionItem > li {
  pointer-events: auto;
}
.RCV-namespace .OptionItem__icon {
  height: 20px;
  width: 20px;
}
.RCV-namespace .OptionItem:hover, .RCV-namespace .OptionItem:focus {
  background-color: rgba(255, 255, 255, 0.05);
}
.RCV-namespace .OptionItem__text {
  width: 100%;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  letter-spacing: 0.4px;
  color: #FFFFFF;
}
.RCV-namespace .OptionItem__text > span {
  font-size: 8px;
  height: 8px;
  line-height: 8px;
  display: inline-block;
  background-color: #9b9b9b;
  vertical-align: super;
  border-radius: 2px;
  padding: 1px 2px;
  margin-left: 3px;
}
.RCV-namespace .OptionItem--selected:after {
  position: absolute;
  right: 0;
  top: 4px;
  width: 20px;
  height: 20px;
  content: ' ';
  background: url(https://wcdn.ringcentral.com/_whc/gallery-mode-selected-ef7a05673f0aebdf3afe2cc84f3fd35c.svg?appVersion=23.2.30) center center no-repeat;
}
.RCV-namespace .OptionItem--selected .OptionItem__text > span {
  background-color: #999999;
  color: #F9F9F9;
}

.RCV-namespace .Delimiter {
  border-top: 1px solid #4E4E57;
  height: 1px;
  list-style: none;
  align-self: stretch;
}
.RCV-namespace .Delimiter hr {
  height: 0;
  margin: 0;
  opacity: 0;
}

.RCV-namespace .Range {
  --thumb-radius: 8px;
  --track-height: 5px;
  --track-color: #E2E2E2;
  --filled-bar-color: #067BBD;
  --thumb-color: #FFFFFF;
  --thumb-border-color: #067BBD;
  --focus-box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #067BBD;
  --focus-box-shadow-inverted: 0 0 0 2px #067BBD, 0 0 0 3px #FFFFFF;
  position: relative;
  display: flex;
  height: var(--track-height);
  background: var(--track-color);
  border-radius: calc(var(--track-height) / 2);
}
.RCV-namespace .Range__filled-bar {
  --bar-width: 0%;
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: var(--bar-width);
  height: 100%;
  background: var(--filled-bar-color);
  border-radius: calc(var(--track-height) / 2);
}
.RCV-namespace .Range__filled-bar--disabled {
  background: #E2E2E2;
}
.RCV-namespace .Range__input {
  position: relative;
  box-sizing: border-box;
  margin: 0;
  display: block;
  width: 100%;
  -webkit-appearance: none;
  /* Hides the slider so that custom slider can be made */
  background: transparent;
  /* Otherwise white in Chrome */
}
.RCV-namespace .Range__input:focus {
  outline: 0 !important;
  border: 0 !important;
  moz-outline-style: none;
  border-color: transparent;
}
.RCV-namespace .Range__input::-moz-focus-inner {
  outline: 0 !important;
  border: 0 !important;
  moz-outline-style: none;
  border-color: transparent;
}
.RCV-namespace .Range__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: calc(2 * var(--thumb-radius));
  height: calc(2 * var(--thumb-radius));
  border-radius: 50%;
  position: relative;
  border: 1px solid var(--thumb-border-color);
  top: calc(var(--track-height) / 2 - var(--thumb-radius));
  cursor: pointer;
  background-color: var(--thumb-color);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.RCV-namespace .Range__input::-moz-range-thumb {
  width: calc(2 * var(--thumb-radius));
  height: calc(2 * var(--thumb-radius));
  border-radius: 50%;
  position: relative;
  border: 1px solid var(--thumb-border-color);
  top: calc(var(--track-height) / 2 - var(--thumb-radius));
  cursor: pointer;
  background-color: var(--thumb-color);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.RCV-namespace .Range__input::-webkit-slider-runnable-track {
  --track-padding: 4px;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: calc(var(--track-height) + 2 * var(--track-padding));
  padding: var(--track-padding) 0;
  cursor: pointer;
  background: transparent;
  border: none;
}
.RCV-namespace .Range__input::-moz-range-track {
  --track-padding: 4px;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: calc(var(--track-height) + 2 * var(--track-padding));
  padding: var(--track-padding) 0;
  cursor: pointer;
  background: transparent;
  border: none;
}
.RCV-namespace .Range__input--disabled::-webkit-slider-runnable-track {
  cursor: not-allowed;
}
.RCV-namespace .Range__input--disabled::-moz-range-track {
  cursor: not-allowed;
}
.RCV-namespace .Range__input--disabled::-webkit-slider-thumb {
  border-color: #E2E2E2;
  cursor: not-allowed;
}
.RCV-namespace .Range__input--disabled::-moz-range-thumb {
  border-color: #E2E2E2;
  cursor: not-allowed;
}
.RCV-namespace .accessibility-mode .Range__input:focus {
  box-shadow: var(--focus-box-shadow);
}
.RCV-namespace .accessibility-mode .Range__input:focus-visible {
  z-index: 1;
}
.RCV-namespace .accessibility-mode .Range__input--disabled:focus {
  box-shadow: none;
}
.RCV-namespace .Range--white {
  --thumb-radius: 4px;
  --track-height: 2px;
  --track-color: rgba(255, 255, 255, 0.15);
  --filled-bar-color: #FFFFFF;
  --thumb-color: #FFFFFF;
  --thumb-border-color: transparent;
  --focus-box-shadow: var(--focus-box-shadow-inverted);
}
.RCV-namespace .range-with-hints {
  display: flex;
  align-items: center;
  word-break: keep-all;
}
.RCV-namespace .range-with-hints__caption {
  color: #999999;
  display: flex;
}
.RCV-namespace .range-with-hints__caption--min {
  margin-right: 10px;
}
.RCV-namespace .range-with-hints__caption--max {
  margin-left: 10px;
}
.RCV-namespace .simplified-menu .Range {
  --filled-bar-color: #666666;
  --thumb-border-color: #666666;
  --focus-box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px #666666;
  --focus-box-shadow-inverted: 0 0 0 2px #666666, 0 0 0 3px #FFFFFF;
}
.RCV-namespace .RangeWithOptions__options-wrapper {
  margin-top: 8px;
  height: 1em;
  margin-left: 8px;
  width: calc(100% - 16px);
  position: relative;
}
.RCV-namespace .RangeWithOptions__options-item {
  position: absolute;
  transform: translateX(-50%);
  font-size: 12px;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}

.RCV-namespace .SharingButton {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  gap: 3px;
  flex-direction: column;
  box-sizing: border-box;
  border: none;
  background-color: #1e2027;
  color: #FFFFFF;
}
.RCV-namespace .SharingButton__icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 6px;
}
.RCV-namespace .SharingButton__icon-wrapper [class*="svg-"] {
  height: 20px;
}
.RCV-namespace .SharingButton__icon-wrapper .icon-toparr {
  font-size: 15px;
}
.RCV-namespace .SharingButton__icon-wrapper .icon-toparr.flipV {
  transform: scaleY(-1);
}
.RCV-namespace .SharingButton__icon-wrapper--active {
  background: #FFFFFF;
  border-radius: 6px;
  color: #1e2027;
}
.RCV-namespace .SharingButton__icon-wrapper--active .icon-toparr:hover {
  background: #b3b3b3;
}
.RCV-namespace .SharingButton__text {
  width: 100%;
  font-family: "Proxima Nova Medium", Helvetica, Arial, sans-serif;
  font-size: 11px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .SharingButton__text:not(:has(.SharingButton__text--with-button)) {
  line-height: 1;
}
.RCV-namespace .SharingButton__text--with-button {
  font-size: 14px;
  padding: 0 8px;
  margin: 0 4px;
  background-color: #F44336;
  color: #FFFFFF;
  border-radius: 4px;
  line-height: 20px;
}
.RCV-namespace .SharingButton__text--with-button:hover {
  background-color: #f32c1e;
}
.RCV-namespace .SharingButton:enabled:not(:has(.SharingButton__text--with-button)):hover {
  background-color: #343844;
}
.RCV-namespace .SharingButton:enabled:not(:has(.SharingButton__text--with-button)):hover .SharingButton__icons--active [class*="svg-"] {
  color: #343844;
}
.RCV-namespace .SharingButton:enabled:not(:has(.SharingButton__text--with-button)):hover .icon-toparr:hover {
  background: #61677d;
  border-radius: 50%;
}
.RCV-namespace .SharingButton:disabled {
  color: #808080;
}
.RCV-namespace .accessibility-mode .SharingButton:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}

.RCV-namespace .SharingOptionMenu {
  overflow: hidden;
  max-width: 220px;
  border-radius: 3px;
  width: 205px;
  background-color: #282a32;
  color: #FFFFFF;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.5);
}
.RCV-namespace .SharingOptionMenu__item {
  position: relative;
  width: 100%;
  padding: 6px 14px 6px 38px;
  font-size: 12px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  outline: none;
  box-sizing: border-box;
  cursor: default;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .SharingOptionMenu__item--withDelimiter {
  border-top: 1px solid #494949;
}
.RCV-namespace .SharingOptionMenu__item--selected::before {
  position: absolute;
  content: "\e91a";
  font-family: 'RCV-Desktop';
  font-size: 14px;
  color: #FFFFFF;
  left: 14px;
}
.RCV-namespace .SharingOptionMenu__item--disabled {
  color: #999999;
  cursor: default;
}
.RCV-namespace .SharingOptionMenu__item--nonSelectable {
  padding-left: 14px;
  cursor: default;
  color: #FFFFFF;
  font-weight: bold;
}
.RCV-namespace .SharingOptionMenu__item:not(.SharingOptionMenu__item--disabled):hover, .RCV-namespace .SharingOptionMenu__item:not(.SharingOptionMenu__item--disabled):focus {
  background-color: #3f424e;
}
.RCV-namespace .accessibility-mode .SharingOptionMenu__item:focus {
  box-shadow: inset 0 0 0 2px #FFFFFF, inset 0 0 0 3px #067BBD;
}

.RCV-namespace .SharingOption {
  position: relative;
  background-color: transparent;
}
.RCV-namespace .SharingOption__menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  padding: 0;
  margin: 0;
}
.RCV-namespace .SharingOption .Tooltip {
  height: 100%;
}
.RCV-namespace .SharingOption .Tooltip__tooltip-target {
  width: 100%;
}

.RCV-namespace .SharingPreview {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  color: #FFFFFF;
  font-size: 14px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
  border-radius: 8px;
}
.RCV-namespace .SharingPreview .SharingToolbar {
  height: 28px;
  max-width: 420px;
  min-width: 0;
}
.RCV-namespace .SharingPreview .SharingToolbar .svg-expand {
  height: 21px;
}
.RCV-namespace .SharingPreview__content {
  display: flex;
  justify-content: center;
  background-color: #000000;
  border: 1px solid #000000;
  padding: 0 8px;
  border-radius: 0 0 8px 8px;
}

.RCV-namespace .SharingToolbar {
  --frame-border-radius: 8px;
  --padding-vertical: 16px;
  --padding-horizontal: 14px;
  display: grid;
  grid-template-areas: 'description options-buttons';
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 1fr;
  width: auto;
  max-width: 520px;
  color: #FFFFFF;
  font-size: 14px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .SharingToolbar__description {
  grid-area: description;
  background-color: #039FD8;
}
.RCV-namespace .SharingToolbar__description > .Tooltip__tooltip-target {
  display: flex;
  padding: 0 var(--padding-horizontal);
  box-sizing: border-box;
  align-items: center;
  overflow: hidden;
  width: 100%;
}
.RCV-namespace .SharingToolbar__description .description-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .SharingToolbar__options_buttons {
  grid-area: options-buttons;
  box-sizing: border-box;
  display: flex;
  background-color: #1e2027;
  min-width: 0;
  width: -moz-max-content;
  width: max-content;
  padding-left: 2px;
}
.RCV-namespace .SharingToolbar--controlling {
  max-width: 560px;
}
.RCV-namespace .SharingToolbar--controlling .SharingToolbar__description > .Tooltip__tooltip-target {
  background-color: #FF8800;
}
.RCV-namespace .SharingToolbar--centered .SharingToolbar__description > .Tooltip__tooltip-target {
  justify-content: center;
}
.RCV-namespace .mobile-browser .SharingToolbar {
  display: none;
}
.RCV-namespace .SharingToolbar--top-rounded {
  border-top-left-radius: var(--frame-border-radius);
  border-top-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--top-rounded .SharingToolbar__description {
  border-top-left-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--top-rounded .SharingToolbar__description > .Tooltip__tooltip-target {
  border-top-left-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--top-rounded .sharing-toolbar-section:last-child {
  border-top-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--top-rounded .sharing-toolbar-section:last-child .SharingOption:last-of-type .SharingButton {
  border-top-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--bottom-rounded {
  border-bottom-left-radius: var(--frame-border-radius);
  border-bottom-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--bottom-rounded .SharingToolbar__description {
  border-bottom-left-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--bottom-rounded .SharingToolbar__description > .Tooltip__tooltip-target {
  border-bottom-left-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--bottom-rounded .sharing-toolbar-section:last-child {
  border-bottom-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--bottom-rounded .sharing-toolbar-section:last-child .SharingOption:last-of-type .SharingButton {
  border-bottom-right-radius: var(--frame-border-radius);
}
.RCV-namespace .SharingToolbar--shadowing {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}
.RCV-namespace .SharingToolbar--loading .SharingToolbar__description {
  background-color: #666666;
}
.RCV-namespace .SharingToolbar--success .SharingToolbar__description {
  background-color: #16A937;
}
.RCV-namespace .SharingToolbar--warning .SharingToolbar__description {
  background-color: #F6AD16;
  color: #2F2F2F;
}
.RCV-namespace .SharingToolbar--danger .SharingToolbar__description {
  background-color: #FF4436;
}

.RCV-namespace .SimpleCountrySelectItem {
  --select-height: 36px;
  --select-item-padding: 8px;
  position: relative;
}
.RCV-namespace .SimpleCountrySelectItem__flag {
  margin-right: 10px;
  flex-shrink: 0;
}
.RCV-namespace .SimpleCountrySelectItem__country-name.hidden {
  display: none;
}
.RCV-namespace .SimpleCountrySelectItem__country-name, .RCV-namespace .SimpleCountrySelectItem__country-number {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .SimpleCountrySelectItem__calling-code {
  color: #666666;
}
.RCV-namespace .SimpleCountrySelectItem__list-item {
  display: flex;
  align-items: center;
  line-height: 1;
  height: var(--select-height);
  padding: 0;
  position: relative;
}
.RCV-namespace .SimpleCountrySelectItem__list-item > * {
  pointer-events: none;
}
.RCV-namespace .SimpleCountrySelectItem__list-item--checked:before {
  content: '\E91A';
  font-family: 'RCV-Desktop';
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translate(0, -50%);
}

.RCV-namespace .iti-flag {
  width: 20px;
}
.RCV-namespace .iti-flag.be {
  width: 18px;
}
.RCV-namespace .iti-flag.ch {
  width: 15px;
}
.RCV-namespace .iti-flag.mc {
  width: 19px;
}
.RCV-namespace .iti-flag.ne {
  width: 18px;
}
.RCV-namespace .iti-flag.np {
  width: 13px;
}
.RCV-namespace .iti-flag.va {
  width: 15px;
}
@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
  .RCV-namespace .iti-flag {
    background-size: 5652px 15px;
  }
}
.RCV-namespace .iti-flag.ac {
  height: 10px;
  background-position: 0px 0px;
}
.RCV-namespace .iti-flag.ad {
  height: 14px;
  background-position: -22px 0px;
}
.RCV-namespace .iti-flag.ae {
  height: 10px;
  background-position: -44px 0px;
}
.RCV-namespace .iti-flag.af {
  height: 14px;
  background-position: -66px 0px;
}
.RCV-namespace .iti-flag.ag {
  height: 14px;
  background-position: -88px 0px;
}
.RCV-namespace .iti-flag.ai {
  height: 10px;
  background-position: -110px 0px;
}
.RCV-namespace .iti-flag.al {
  height: 15px;
  background-position: -132px 0px;
}
.RCV-namespace .iti-flag.am {
  height: 10px;
  background-position: -154px 0px;
}
.RCV-namespace .iti-flag.ao {
  height: 14px;
  background-position: -176px 0px;
}
.RCV-namespace .iti-flag.aq {
  height: 14px;
  background-position: -198px 0px;
}
.RCV-namespace .iti-flag.ar {
  height: 13px;
  background-position: -220px 0px;
}
.RCV-namespace .iti-flag.as {
  height: 10px;
  background-position: -242px 0px;
}
.RCV-namespace .iti-flag.at {
  height: 14px;
  background-position: -264px 0px;
}
.RCV-namespace .iti-flag.au {
  height: 10px;
  background-position: -286px 0px;
}
.RCV-namespace .iti-flag.aw {
  height: 14px;
  background-position: -308px 0px;
}
.RCV-namespace .iti-flag.ax {
  height: 13px;
  background-position: -330px 0px;
}
.RCV-namespace .iti-flag.az {
  height: 10px;
  background-position: -352px 0px;
}
.RCV-namespace .iti-flag.ba {
  height: 10px;
  background-position: -374px 0px;
}
.RCV-namespace .iti-flag.bb {
  height: 14px;
  background-position: -396px 0px;
}
.RCV-namespace .iti-flag.bd {
  height: 12px;
  background-position: -418px 0px;
}
.RCV-namespace .iti-flag.be {
  height: 15px;
  background-position: -440px 0px;
}
.RCV-namespace .iti-flag.bf {
  height: 14px;
  background-position: -460px 0px;
}
.RCV-namespace .iti-flag.bg {
  height: 12px;
  background-position: -482px 0px;
}
.RCV-namespace .iti-flag.bh {
  height: 12px;
  background-position: -504px 0px;
}
.RCV-namespace .iti-flag.bi {
  height: 12px;
  background-position: -526px 0px;
}
.RCV-namespace .iti-flag.bj {
  height: 14px;
  background-position: -548px 0px;
}
.RCV-namespace .iti-flag.bl {
  height: 14px;
  background-position: -570px 0px;
}
.RCV-namespace .iti-flag.bm {
  height: 10px;
  background-position: -592px 0px;
}
.RCV-namespace .iti-flag.bn {
  height: 10px;
  background-position: -614px 0px;
}
.RCV-namespace .iti-flag.bo {
  height: 14px;
  background-position: -636px 0px;
}
.RCV-namespace .iti-flag.bq {
  height: 14px;
  background-position: -658px 0px;
}
.RCV-namespace .iti-flag.br {
  height: 14px;
  background-position: -680px 0px;
}
.RCV-namespace .iti-flag.bs {
  height: 10px;
  background-position: -702px 0px;
}
.RCV-namespace .iti-flag.bt {
  height: 14px;
  background-position: -724px 0px;
}
.RCV-namespace .iti-flag.bv {
  height: 15px;
  background-position: -746px 0px;
}
.RCV-namespace .iti-flag.bw {
  height: 14px;
  background-position: -768px 0px;
}
.RCV-namespace .iti-flag.by {
  height: 10px;
  background-position: -790px 0px;
}
.RCV-namespace .iti-flag.bz {
  height: 14px;
  background-position: -812px 0px;
}
.RCV-namespace .iti-flag.ca {
  height: 10px;
  background-position: -834px 0px;
}
.RCV-namespace .iti-flag.cc {
  height: 10px;
  background-position: -856px 0px;
}
.RCV-namespace .iti-flag.cd {
  height: 15px;
  background-position: -878px 0px;
}
.RCV-namespace .iti-flag.cf {
  height: 14px;
  background-position: -900px 0px;
}
.RCV-namespace .iti-flag.cg {
  height: 14px;
  background-position: -922px 0px;
}
.RCV-namespace .iti-flag.ch {
  height: 15px;
  background-position: -944px 0px;
}
.RCV-namespace .iti-flag.ci {
  height: 14px;
  background-position: -961px 0px;
}
.RCV-namespace .iti-flag.ck {
  height: 10px;
  background-position: -983px 0px;
}
.RCV-namespace .iti-flag.cl {
  height: 14px;
  background-position: -1005px 0px;
}
.RCV-namespace .iti-flag.cm {
  height: 14px;
  background-position: -1027px 0px;
}
.RCV-namespace .iti-flag.cn {
  height: 14px;
  background-position: -1049px 0px;
}
.RCV-namespace .iti-flag.co {
  height: 14px;
  background-position: -1071px 0px;
}
.RCV-namespace .iti-flag.cp {
  height: 14px;
  background-position: -1093px 0px;
}
.RCV-namespace .iti-flag.cr {
  height: 12px;
  background-position: -1115px 0px;
}
.RCV-namespace .iti-flag.cu {
  height: 10px;
  background-position: -1137px 0px;
}
.RCV-namespace .iti-flag.cv {
  height: 12px;
  background-position: -1159px 0px;
}
.RCV-namespace .iti-flag.cw {
  height: 14px;
  background-position: -1181px 0px;
}
.RCV-namespace .iti-flag.cx {
  height: 10px;
  background-position: -1203px 0px;
}
.RCV-namespace .iti-flag.cy {
  height: 14px;
  background-position: -1225px 0px;
}
.RCV-namespace .iti-flag.cz {
  height: 14px;
  background-position: -1247px 0px;
}
.RCV-namespace .iti-flag.de {
  height: 12px;
  background-position: -1269px 0px;
}
.RCV-namespace .iti-flag.dg {
  height: 10px;
  background-position: -1291px 0px;
}
.RCV-namespace .iti-flag.dj {
  height: 14px;
  background-position: -1313px 0px;
}
.RCV-namespace .iti-flag.dk {
  height: 15px;
  background-position: -1335px 0px;
}
.RCV-namespace .iti-flag.dm {
  height: 10px;
  background-position: -1357px 0px;
}
.RCV-namespace .iti-flag.do {
  height: 14px;
  background-position: -1379px 0px;
}
.RCV-namespace .iti-flag.dz {
  height: 14px;
  background-position: -1401px 0px;
}
.RCV-namespace .iti-flag.ea {
  height: 14px;
  background-position: -1423px 0px;
}
.RCV-namespace .iti-flag.ec {
  height: 14px;
  background-position: -1445px 0px;
}
.RCV-namespace .iti-flag.ee {
  height: 13px;
  background-position: -1467px 0px;
}
.RCV-namespace .iti-flag.eg {
  height: 14px;
  background-position: -1489px 0px;
}
.RCV-namespace .iti-flag.eh {
  height: 10px;
  background-position: -1511px 0px;
}
.RCV-namespace .iti-flag.er {
  height: 10px;
  background-position: -1533px 0px;
}
.RCV-namespace .iti-flag.es {
  height: 14px;
  background-position: -1555px 0px;
}
.RCV-namespace .iti-flag.et {
  height: 10px;
  background-position: -1577px 0px;
}
.RCV-namespace .iti-flag.eu {
  height: 14px;
  background-position: -1599px 0px;
}
.RCV-namespace .iti-flag.fi {
  height: 12px;
  background-position: -1621px 0px;
}
.RCV-namespace .iti-flag.fj {
  height: 10px;
  background-position: -1643px 0px;
}
.RCV-namespace .iti-flag.fk {
  height: 10px;
  background-position: -1665px 0px;
}
.RCV-namespace .iti-flag.fm {
  height: 11px;
  background-position: -1687px 0px;
}
.RCV-namespace .iti-flag.fo {
  height: 15px;
  background-position: -1709px 0px;
}
.RCV-namespace .iti-flag.fr {
  height: 14px;
  background-position: -1731px 0px;
}
.RCV-namespace .iti-flag.ga {
  height: 15px;
  background-position: -1753px 0px;
}
.RCV-namespace .iti-flag.gb {
  height: 10px;
  background-position: -1775px 0px;
}
.RCV-namespace .iti-flag.gd {
  height: 12px;
  background-position: -1797px 0px;
}
.RCV-namespace .iti-flag.ge {
  height: 14px;
  background-position: -1819px 0px;
}
.RCV-namespace .iti-flag.gf {
  height: 14px;
  background-position: -1841px 0px;
}
.RCV-namespace .iti-flag.gg {
  height: 14px;
  background-position: -1863px 0px;
}
.RCV-namespace .iti-flag.gh {
  height: 14px;
  background-position: -1885px 0px;
}
.RCV-namespace .iti-flag.gi {
  height: 10px;
  background-position: -1907px 0px;
}
.RCV-namespace .iti-flag.gl {
  height: 14px;
  background-position: -1929px 0px;
}
.RCV-namespace .iti-flag.gm {
  height: 14px;
  background-position: -1951px 0px;
}
.RCV-namespace .iti-flag.gn {
  height: 14px;
  background-position: -1973px 0px;
}
.RCV-namespace .iti-flag.gp {
  height: 14px;
  background-position: -1995px 0px;
}
.RCV-namespace .iti-flag.gq {
  height: 14px;
  background-position: -2017px 0px;
}
.RCV-namespace .iti-flag.gr {
  height: 14px;
  background-position: -2039px 0px;
}
.RCV-namespace .iti-flag.gs {
  height: 10px;
  background-position: -2061px 0px;
}
.RCV-namespace .iti-flag.gt {
  height: 13px;
  background-position: -2083px 0px;
}
.RCV-namespace .iti-flag.gu {
  height: 11px;
  background-position: -2105px 0px;
}
.RCV-namespace .iti-flag.gw {
  height: 10px;
  background-position: -2127px 0px;
}
.RCV-namespace .iti-flag.gy {
  height: 12px;
  background-position: -2149px 0px;
}
.RCV-namespace .iti-flag.hk {
  height: 14px;
  background-position: -2171px 0px;
}
.RCV-namespace .iti-flag.hm {
  height: 10px;
  background-position: -2193px 0px;
}
.RCV-namespace .iti-flag.hn {
  height: 10px;
  background-position: -2215px 0px;
}
.RCV-namespace .iti-flag.hr {
  height: 10px;
  background-position: -2237px 0px;
}
.RCV-namespace .iti-flag.ht {
  height: 12px;
  background-position: -2259px 0px;
}
.RCV-namespace .iti-flag.hu {
  height: 10px;
  background-position: -2281px 0px;
}
.RCV-namespace .iti-flag.ic {
  height: 14px;
  background-position: -2303px 0px;
}
.RCV-namespace .iti-flag.id {
  height: 14px;
  background-position: -2325px 0px;
}
.RCV-namespace .iti-flag.ie {
  height: 10px;
  background-position: -2347px 0px;
}
.RCV-namespace .iti-flag.il {
  height: 15px;
  background-position: -2369px 0px;
}
.RCV-namespace .iti-flag.im {
  height: 10px;
  background-position: -2391px 0px;
}
.RCV-namespace .iti-flag.in {
  height: 14px;
  background-position: -2413px 0px;
}
.RCV-namespace .iti-flag.io {
  height: 10px;
  background-position: -2435px 0px;
}
.RCV-namespace .iti-flag.iq {
  height: 14px;
  background-position: -2457px 0px;
}
.RCV-namespace .iti-flag.ir {
  height: 12px;
  background-position: -2479px 0px;
}
.RCV-namespace .iti-flag.is {
  height: 15px;
  background-position: -2501px 0px;
}
.RCV-namespace .iti-flag.it {
  height: 14px;
  background-position: -2523px 0px;
}
.RCV-namespace .iti-flag.je {
  height: 12px;
  background-position: -2545px 0px;
}
.RCV-namespace .iti-flag.jm {
  height: 10px;
  background-position: -2567px 0px;
}
.RCV-namespace .iti-flag.jo {
  height: 10px;
  background-position: -2589px 0px;
}
.RCV-namespace .iti-flag.jp {
  height: 14px;
  background-position: -2611px 0px;
}
.RCV-namespace .iti-flag.ke {
  height: 14px;
  background-position: -2633px 0px;
}
.RCV-namespace .iti-flag.kg {
  height: 12px;
  background-position: -2655px 0px;
}
.RCV-namespace .iti-flag.kh {
  height: 13px;
  background-position: -2677px 0px;
}
.RCV-namespace .iti-flag.ki {
  height: 10px;
  background-position: -2699px 0px;
}
.RCV-namespace .iti-flag.km {
  height: 12px;
  background-position: -2721px 0px;
}
.RCV-namespace .iti-flag.kn {
  height: 14px;
  background-position: -2743px 0px;
}
.RCV-namespace .iti-flag.kp {
  height: 10px;
  background-position: -2765px 0px;
}
.RCV-namespace .iti-flag.kr {
  height: 14px;
  background-position: -2787px 0px;
}
.RCV-namespace .iti-flag.kw {
  height: 10px;
  background-position: -2809px 0px;
}
.RCV-namespace .iti-flag.ky {
  height: 10px;
  background-position: -2831px 0px;
}
.RCV-namespace .iti-flag.kz {
  height: 10px;
  background-position: -2853px 0px;
}
.RCV-namespace .iti-flag.la {
  height: 14px;
  background-position: -2875px 0px;
}
.RCV-namespace .iti-flag.lb {
  height: 14px;
  background-position: -2897px 0px;
}
.RCV-namespace .iti-flag.lc {
  height: 10px;
  background-position: -2919px 0px;
}
.RCV-namespace .iti-flag.li {
  height: 12px;
  background-position: -2941px 0px;
}
.RCV-namespace .iti-flag.lk {
  height: 10px;
  background-position: -2963px 0px;
}
.RCV-namespace .iti-flag.lr {
  height: 11px;
  background-position: -2985px 0px;
}
.RCV-namespace .iti-flag.ls {
  height: 14px;
  background-position: -3007px 0px;
}
.RCV-namespace .iti-flag.lt {
  height: 12px;
  background-position: -3029px 0px;
}
.RCV-namespace .iti-flag.lu {
  height: 12px;
  background-position: -3051px 0px;
}
.RCV-namespace .iti-flag.lv {
  height: 10px;
  background-position: -3073px 0px;
}
.RCV-namespace .iti-flag.ly {
  height: 10px;
  background-position: -3095px 0px;
}
.RCV-namespace .iti-flag.ma {
  height: 14px;
  background-position: -3117px 0px;
}
.RCV-namespace .iti-flag.mc {
  height: 15px;
  background-position: -3139px 0px;
}
.RCV-namespace .iti-flag.md {
  height: 10px;
  background-position: -3160px 0px;
}
.RCV-namespace .iti-flag.me {
  height: 10px;
  background-position: -3182px 0px;
}
.RCV-namespace .iti-flag.mf {
  height: 14px;
  background-position: -3204px 0px;
}
.RCV-namespace .iti-flag.mg {
  height: 14px;
  background-position: -3226px 0px;
}
.RCV-namespace .iti-flag.mh {
  height: 11px;
  background-position: -3248px 0px;
}
.RCV-namespace .iti-flag.mk {
  height: 10px;
  background-position: -3270px 0px;
}
.RCV-namespace .iti-flag.ml {
  height: 14px;
  background-position: -3292px 0px;
}
.RCV-namespace .iti-flag.mm {
  height: 14px;
  background-position: -3314px 0px;
}
.RCV-namespace .iti-flag.mn {
  height: 10px;
  background-position: -3336px 0px;
}
.RCV-namespace .iti-flag.mo {
  height: 14px;
  background-position: -3358px 0px;
}
.RCV-namespace .iti-flag.mp {
  height: 10px;
  background-position: -3380px 0px;
}
.RCV-namespace .iti-flag.mq {
  height: 14px;
  background-position: -3402px 0px;
}
.RCV-namespace .iti-flag.mr {
  height: 14px;
  background-position: -3424px 0px;
}
.RCV-namespace .iti-flag.ms {
  height: 10px;
  background-position: -3446px 0px;
}
.RCV-namespace .iti-flag.mt {
  height: 14px;
  background-position: -3468px 0px;
}
.RCV-namespace .iti-flag.mu {
  height: 14px;
  background-position: -3490px 0px;
}
.RCV-namespace .iti-flag.mv {
  height: 14px;
  background-position: -3512px 0px;
}
.RCV-namespace .iti-flag.mw {
  height: 14px;
  background-position: -3534px 0px;
}
.RCV-namespace .iti-flag.mx {
  height: 12px;
  background-position: -3556px 0px;
}
.RCV-namespace .iti-flag.my {
  height: 10px;
  background-position: -3578px 0px;
}
.RCV-namespace .iti-flag.mz {
  height: 14px;
  background-position: -3600px 0px;
}
.RCV-namespace .iti-flag.na {
  height: 14px;
  background-position: -3622px 0px;
}
.RCV-namespace .iti-flag.nc {
  height: 10px;
  background-position: -3644px 0px;
}
.RCV-namespace .iti-flag.ne {
  height: 15px;
  background-position: -3666px 0px;
}
.RCV-namespace .iti-flag.nf {
  height: 10px;
  background-position: -3686px 0px;
}
.RCV-namespace .iti-flag.ng {
  height: 10px;
  background-position: -3708px 0px;
}
.RCV-namespace .iti-flag.ni {
  height: 12px;
  background-position: -3730px 0px;
}
.RCV-namespace .iti-flag.nl {
  height: 14px;
  background-position: -3752px 0px;
}
.RCV-namespace .iti-flag.no {
  height: 15px;
  background-position: -3774px 0px;
}
.RCV-namespace .iti-flag.np {
  height: 15px;
  background-position: -3796px 0px;
}
.RCV-namespace .iti-flag.nr {
  height: 10px;
  background-position: -3811px 0px;
}
.RCV-namespace .iti-flag.nu {
  height: 10px;
  background-position: -3833px 0px;
}
.RCV-namespace .iti-flag.nz {
  height: 10px;
  background-position: -3855px 0px;
}
.RCV-namespace .iti-flag.om {
  height: 10px;
  background-position: -3877px 0px;
}
.RCV-namespace .iti-flag.pa {
  height: 14px;
  background-position: -3899px 0px;
}
.RCV-namespace .iti-flag.pe {
  height: 14px;
  background-position: -3921px 0px;
}
.RCV-namespace .iti-flag.pf {
  height: 14px;
  background-position: -3943px 0px;
}
.RCV-namespace .iti-flag.pg {
  height: 15px;
  background-position: -3965px 0px;
}
.RCV-namespace .iti-flag.ph {
  height: 10px;
  background-position: -3987px 0px;
}
.RCV-namespace .iti-flag.pk {
  height: 14px;
  background-position: -4009px 0px;
}
.RCV-namespace .iti-flag.pl {
  height: 13px;
  background-position: -4031px 0px;
}
.RCV-namespace .iti-flag.pm {
  height: 14px;
  background-position: -4053px 0px;
}
.RCV-namespace .iti-flag.pn {
  height: 10px;
  background-position: -4075px 0px;
}
.RCV-namespace .iti-flag.pr {
  height: 14px;
  background-position: -4097px 0px;
}
.RCV-namespace .iti-flag.ps {
  height: 10px;
  background-position: -4119px 0px;
}
.RCV-namespace .iti-flag.pt {
  height: 14px;
  background-position: -4141px 0px;
}
.RCV-namespace .iti-flag.pw {
  height: 13px;
  background-position: -4163px 0px;
}
.RCV-namespace .iti-flag.py {
  height: 11px;
  background-position: -4185px 0px;
}
.RCV-namespace .iti-flag.qa {
  height: 8px;
  background-position: -4207px 0px;
}
.RCV-namespace .iti-flag.re {
  height: 14px;
  background-position: -4229px 0px;
}
.RCV-namespace .iti-flag.ro {
  height: 14px;
  background-position: -4251px 0px;
}
.RCV-namespace .iti-flag.rs {
  height: 14px;
  background-position: -4273px 0px;
}
.RCV-namespace .iti-flag.ru {
  height: 14px;
  background-position: -4295px 0px;
}
.RCV-namespace .iti-flag.rw {
  height: 14px;
  background-position: -4317px 0px;
}
.RCV-namespace .iti-flag.sa {
  height: 14px;
  background-position: -4339px 0px;
}
.RCV-namespace .iti-flag.sb {
  height: 10px;
  background-position: -4361px 0px;
}
.RCV-namespace .iti-flag.sc {
  height: 10px;
  background-position: -4383px 0px;
}
.RCV-namespace .iti-flag.sd {
  height: 10px;
  background-position: -4405px 0px;
}
.RCV-namespace .iti-flag.se {
  height: 13px;
  background-position: -4427px 0px;
}
.RCV-namespace .iti-flag.sg {
  height: 14px;
  background-position: -4449px 0px;
}
.RCV-namespace .iti-flag.sh {
  height: 10px;
  background-position: -4471px 0px;
}
.RCV-namespace .iti-flag.si {
  height: 10px;
  background-position: -4493px 0px;
}
.RCV-namespace .iti-flag.sj {
  height: 15px;
  background-position: -4515px 0px;
}
.RCV-namespace .iti-flag.sk {
  height: 14px;
  background-position: -4537px 0px;
}
.RCV-namespace .iti-flag.sl {
  height: 14px;
  background-position: -4559px 0px;
}
.RCV-namespace .iti-flag.sm {
  height: 15px;
  background-position: -4581px 0px;
}
.RCV-namespace .iti-flag.sn {
  height: 14px;
  background-position: -4603px 0px;
}
.RCV-namespace .iti-flag.so {
  height: 14px;
  background-position: -4625px 0px;
}
.RCV-namespace .iti-flag.sr {
  height: 14px;
  background-position: -4647px 0px;
}
.RCV-namespace .iti-flag.ss {
  height: 10px;
  background-position: -4669px 0px;
}
.RCV-namespace .iti-flag.st {
  height: 10px;
  background-position: -4691px 0px;
}
.RCV-namespace .iti-flag.sv {
  height: 12px;
  background-position: -4713px 0px;
}
.RCV-namespace .iti-flag.sx {
  height: 14px;
  background-position: -4735px 0px;
}
.RCV-namespace .iti-flag.sy {
  height: 14px;
  background-position: -4757px 0px;
}
.RCV-namespace .iti-flag.sz {
  height: 14px;
  background-position: -4779px 0px;
}
.RCV-namespace .iti-flag.ta {
  height: 10px;
  background-position: -4801px 0px;
}
.RCV-namespace .iti-flag.tc {
  height: 10px;
  background-position: -4823px 0px;
}
.RCV-namespace .iti-flag.td {
  height: 14px;
  background-position: -4845px 0px;
}
.RCV-namespace .iti-flag.tf {
  height: 14px;
  background-position: -4867px 0px;
}
.RCV-namespace .iti-flag.tg {
  height: 13px;
  background-position: -4889px 0px;
}
.RCV-namespace .iti-flag.th {
  height: 14px;
  background-position: -4911px 0px;
}
.RCV-namespace .iti-flag.tj {
  height: 10px;
  background-position: -4933px 0px;
}
.RCV-namespace .iti-flag.tk {
  height: 10px;
  background-position: -4955px 0px;
}
.RCV-namespace .iti-flag.tl {
  height: 10px;
  background-position: -4977px 0px;
}
.RCV-namespace .iti-flag.tm {
  height: 14px;
  background-position: -4999px 0px;
}
.RCV-namespace .iti-flag.tn {
  height: 14px;
  background-position: -5021px 0px;
}
.RCV-namespace .iti-flag.to {
  height: 10px;
  background-position: -5043px 0px;
}
.RCV-namespace .iti-flag.tr {
  height: 14px;
  background-position: -5065px 0px;
}
.RCV-namespace .iti-flag.tt {
  height: 12px;
  background-position: -5087px 0px;
}
.RCV-namespace .iti-flag.tv {
  height: 10px;
  background-position: -5109px 0px;
}
.RCV-namespace .iti-flag.tw {
  height: 14px;
  background-position: -5131px 0px;
}
.RCV-namespace .iti-flag.tz {
  height: 14px;
  background-position: -5153px 0px;
}
.RCV-namespace .iti-flag.ua {
  height: 14px;
  background-position: -5175px 0px;
}
.RCV-namespace .iti-flag.ug {
  height: 14px;
  background-position: -5197px 0px;
}
.RCV-namespace .iti-flag.um {
  height: 11px;
  background-position: -5219px 0px;
}
.RCV-namespace .iti-flag.un {
  height: 14px;
  background-position: -5241px 0px;
}
.RCV-namespace .iti-flag.us {
  height: 11px;
  background-position: -5263px 0px;
}
.RCV-namespace .iti-flag.uy {
  height: 14px;
  background-position: -5285px 0px;
}
.RCV-namespace .iti-flag.uz {
  height: 10px;
  background-position: -5307px 0px;
}
.RCV-namespace .iti-flag.va {
  height: 15px;
  background-position: -5329px 0px;
}
.RCV-namespace .iti-flag.vc {
  height: 14px;
  background-position: -5346px 0px;
}
.RCV-namespace .iti-flag.ve {
  height: 14px;
  background-position: -5368px 0px;
}
.RCV-namespace .iti-flag.vg {
  height: 10px;
  background-position: -5390px 0px;
}
.RCV-namespace .iti-flag.vi {
  height: 14px;
  background-position: -5412px 0px;
}
.RCV-namespace .iti-flag.vn {
  height: 14px;
  background-position: -5434px 0px;
}
.RCV-namespace .iti-flag.vu {
  height: 12px;
  background-position: -5456px 0px;
}
.RCV-namespace .iti-flag.wf {
  height: 14px;
  background-position: -5478px 0px;
}
.RCV-namespace .iti-flag.ws {
  height: 10px;
  background-position: -5500px 0px;
}
.RCV-namespace .iti-flag.xk {
  height: 15px;
  background-position: -5522px 0px;
}
.RCV-namespace .iti-flag.ye {
  height: 14px;
  background-position: -5544px 0px;
}
.RCV-namespace .iti-flag.yt {
  height: 14px;
  background-position: -5566px 0px;
}
.RCV-namespace .iti-flag.za {
  height: 14px;
  background-position: -5588px 0px;
}
.RCV-namespace .iti-flag.zm {
  height: 14px;
  background-position: -5610px 0px;
}
.RCV-namespace .iti-flag.zw {
  height: 10px;
  background-position: -5632px 0px;
}
.RCV-namespace .iti-flag {
  height: 15px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: url(https://wcdn.ringcentral.com/_whc/007b2705c0a8f69dfdf6ea1bfa0341c9v1.png?appVersion=23.2.30);
  background-repeat: no-repeat;
  background-color: #DBDBDB;
  background-position: 20px 0;
}
@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
  .RCV-namespace .iti-flag {
    background-image: url(https://wcdn.ringcentral.com/_whc/9d5328fb490cddd43f6698012123404bv1.png?appVersion=23.2.30);
  }
}
.RCV-namespace .iti-flag.np {
  background-color: transparent;
}

.RCV-namespace .bordered-item {
  border: 1px solid #E2E2E2;
  border-width: 1px 0;
  margin-top: -1px;
}
.RCV-namespace .MeetingControls {
  display: flex;
  background-color: #FFFFFF;
  border: 1px solid #E2E2E2;
  border-width: 1px 0;
  margin-top: -1px;
}
.RCV-namespace .MeetingControls__control {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  color: #067BBD;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  padding: 14px;
  cursor: pointer;
}
.RCV-namespace .MeetingControls__control:hover {
  background-color: #E6F2F8;
}
.RCV-namespace .MeetingControls__control:active, .RCV-namespace .MeetingControls__control--active {
  color: #067BBD;
  border-color: #067BBD;
}
.RCV-namespace .MeetingControls__control:disabled, .RCV-namespace .MeetingControls__control--disabled {
  background-color: #E2E2E2 !important;
  color: #999999 !important;
}
.RCV-namespace .MeetingControls__control-icon {
  height: 24px;
  width: 24px;
  font-size: 24px;
}
.RCV-namespace .MeetingControls__control-text {
  font-size: 12px;
  line-height: 16px;
  margin: 6px 0 0;
}
.RCV-namespace .SidebarTimer {
  text-align: center;
  line-height: 40px;
  background-color: #FFFFFF;
  font-family: 'RCV-Desktop', "Proxima Nova Medium", Helvetica, Arial, sans-serif;
}
.RCV-namespace .accessibility-mode .SidebarTimer:focus {
  box-shadow: inset 0 0 0 1px #067BBD;
}
.RCV-namespace .MuteAllDialog {
  position: absolute;
  left: 0;
  width: 100%;
  background-color: #FFFFFF;
}
.RCV-namespace .MuteAllDialog__shadow {
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 8;
}
.RCV-namespace .MuteAllDialog__header {
  margin-top: 0;
}
.RCV-namespace .MuteAllDialog__wrapper.DialogButtonsWrapper {
  padding-top: 0;
  padding-bottom: 10px;
}
.RCV-namespace .MuteAllDialog__wrapper.DialogButtonsWrapper .Button {
  margin-bottom: 8px;
}

.RCV-namespace .ModeratorControl {
  display: inline-block;
  height: 50px;
  background-color: #F9F9F9;
  border: none;
  outline: none;
  color: #067BBD;
  text-align: center;
  margin: 0 5px;
  padding: 0;
  cursor: pointer !important;
}
.RCV-namespace .ModeratorControl:not(.disabled):hover {
  color: #056ba4;
}
.RCV-namespace .ModeratorControl:not(.disabled):active {
  color: #045b8c;
}
.RCV-namespace .ModeratorControl.disabled {
  color: #C7C7C7;
}
.RCV-namespace .ModeratorControl__icon {
  font-size: 24px;
  display: flex;
}
.RCV-namespace .ModeratorControl__icon > [class*='icon'] {
  position: initial;
}
.RCV-namespace .ModeratorControl__text {
  display: block;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
}

.RCV-namespace .contact__wrapper {
  display: flex;
  align-items: center;
  min-width: 0;
}
.RCV-namespace .contact__wrapper--mobile-view {
  --avatar-size: 46px;
}
.RCV-namespace .contact__wrapper--mobile-view .Checkbox__check {
  border-radius: 50%;
}
.RCV-namespace .contact__wrapper .Checkbox {
  display: flex;
  padding: 0;
  flex-grow: 1;
  align-items: center;
  min-width: 0;
  cursor: pointer;
}
.RCV-namespace .contact__wrapper .Checkbox__title {
  display: flex;
  flex-grow: 1;
  min-width: 0;
  align-items: center;
  padding: 0;
  margin-left: 12px;
}
.RCV-namespace .contact__wrapper .Checkbox__check {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 1px solid var(--sui-colors-neutral-b2);
}
.RCV-namespace .contact__wrapper .Checkbox__input:checked + .Checkbox__check {
  background-color: var(--sui-colors-primary-f);
  border: none;
}
.RCV-namespace .contact__wrapper .Checkbox__input:checked + .Checkbox__check:after {
  font-size: 16px;
  top: 0;
  left: 2px;
  line-height: 20px;
}
.RCV-namespace .contact__wrapper .Checkbox__input:checked:disabled + .Checkbox__check {
  background-color: var(--sui-colors-primary-b-t20);
  border-color: var(--sui-colors-primary-b-t20);
}
.RCV-namespace .contact__avatar {
  width: var(--avatar-size);
  height: var(--avatar-size);
  border-radius: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  margin-right: 10px;
  flex-shrink: 0;
}
.RCV-namespace .contact__avatar .avatar-wrapper {
  width: 100%;
  height: 100%;
}
.RCV-namespace .contact__avatar .avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.RCV-namespace .contact__in-meeting-badge {
  background-color: rgba(0, 64, 221, 0.1);
  color: #066fac;
  padding: 2px 4px;
  border-radius: 4px;
  font-weight: 500;
  flex-shrink: 0;
  font-size: 12px;
}
.RCV-namespace .contact__contact-info {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 500;
  font-size: 15px;
  color: var(--sui-colors-neutral-b0);
}
.RCV-namespace .contact__email {
  color: gray;
  line-height: 19px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 340px;
}
.RCV-namespace .contact__tag-highlight {
  background: rgba(255, 191, 42, 0.15);
}

.RCV-namespace .UpcomingMeetingsList {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 10px;
  background-color: #FFFFFF;
  box-sizing: border-box;
}
.RCV-namespace .UpcomingMeetingsList__title {
  padding: 10px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  font-size: 1.1rem;
}
.RCV-namespace .UpcomingMeetingsList__list {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}
.RCV-namespace .UpcomingMeeting {
  position: relative;
  display: flex;
  min-height: 60px;
  margin: 0 -10px;
  padding: 0 10px;
}
.RCV-namespace .UpcomingMeeting .cell {
  box-sizing: border-box;
  padding-top: 10px;
  padding-bottom: 10px;
}
.RCV-namespace .UpcomingMeeting:not(:last-child) {
  border-bottom: 1px solid #eaeaea;
}
.RCV-namespace .UpcomingMeeting:focus-within, .RCV-namespace .UpcomingMeeting:hover {
  background-color: #F9F9F9;
}
.RCV-namespace .UpcomingMeeting:focus-within .UpcomingMeeting__actions-block, .RCV-namespace .UpcomingMeeting:hover .UpcomingMeeting__actions-block {
  opacity: 1;
}
.RCV-namespace .UpcomingMeeting:focus-within .UpcomingMeeting__join, .RCV-namespace .UpcomingMeeting:hover .UpcomingMeeting__join {
  display: flex;
  opacity: 1;
}
.RCV-namespace .UpcomingMeeting--running {
  background-color: #fff3e5;
}
.RCV-namespace .UpcomingMeeting--starting {
  background-color: #f2fff3;
}
.RCV-namespace .UpcomingMeeting__separator {
  margin: 15px 5px;
  border: 1px solid #0570A1;
  border-radius: 1px;
  box-sizing: content-box;
}
.RCV-namespace .UpcomingMeeting__time {
  flex-basis: 90px;
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
}
.RCV-namespace .UpcomingMeeting__main-info {
  flex-grow: 1;
  display: grid;
  grid-template-rows: 1fr 1fr;
  align-items: center;
  position: relative;
  min-width: 0;
  padding-left: 15px;
}
.RCV-namespace .UpcomingMeeting__title {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .UpcomingMeeting__location {
  color: #666666;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .UpcomingMeeting__actions-block {
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  position: absolute;
  width: 100%;
  max-width: 100%;
  height: 100%;
  right: 0;
  opacity: 0;
}
.RCV-namespace .UpcomingMeeting__actions-block::before {
  content: '';
  width: 25%;
  min-width: 100px;
  height: 100%;
  background-image: linear-gradient(to right, transparent, #F9F9F9);
}
.RCV-namespace .UpcomingMeeting__actions {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 10px 0 10px 15px;
  background-color: #F9F9F9;
}
.RCV-namespace .UpcomingMeeting__join {
  display: none;
  align-items: center;
  padding-left: 15px;
}
.RCV-namespace .UpcomingMeeting__join--visible {
  display: flex;
}
.RCV-namespace .UpcomingMeeting--starting .UpcomingMeeting__join, .RCV-namespace .UpcomingMeeting--running .UpcomingMeeting__join {
  display: flex;
}
.RCV-namespace .NoMeetingsForWeek {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
  background-color: #FFFFFF;
}
.RCV-namespace .NoMeetingsForWeek__icon {
  width: 180px;
  height: 160px;
  background-repeat: no-repeat;
  background-position: center;
}
.RCV-namespace .NoMeetingsForWeek__title {
  color: #666666;
  font-size: 26px;
  text-align: center;
}
.RCV-namespace .NoMeetingsForWeek__msg {
  margin-top: 15px;
  color: #666666;
  text-align: center;
  font-size: 16px;
}
.RCV-namespace .um-wrapper {
  display: grid;
  grid-template-rows: auto 1fr;
  grid-row-gap: 10px;
  width: 480px;
  margin: 10px;
  padding: 10px;
  resize: both;
  overflow: hidden;
  border: 1px solid #999999;
}
.RCV-namespace .um-wrapper__scrollable {
  overflow-y: auto;
}
.RCV-namespace .um-wrapper__icon {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  color: #FFFFFF;
  font-size: 10px;
  line-height: 20px;
  text-align: center;
  background-size: contain;
}
.RCV-namespace .um-wrapper__time--green {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  color: #046e0b;
}
.RCV-namespace .um-wrapper__time--orange {
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
  color: #e67a00;
}
.RCV-namespace .um-wrapper__actions {
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-column-gap: 15px;
}
.RCV-namespace .um-wrapper__actions__button {
  display: flex;
  align-items: center;
  height: 18px;
  padding: 0;
  background-color: transparent;
  border: none;
  font-size: 1.4rem;
  color: #666666;
  outline: none;
}
.RCV-namespace .um-wrapper__actions__button:hover .um-wrapper__actions__icon {
  fill: #067BBD;
}
.RCV-namespace .um-wrapper__actions__icon {
  width: 16px;
  height: 16px;
  fill: #999999;
  background-size: 16px;
}
.RCV-namespace .um-wrapper__actions__tooltip--right .Tooltip__tooltip {
  right: calc(16px / -2);
  left: auto;
  transform: none;
}
.RCV-namespace .um-wrapper__actions__tooltip--right .Tooltip__tooltip:before {
  right: 16px;
}
.RCV-namespace .um-wrapper__join-button-label {
  margin: 0 5px 0 0;
  font-size: 14px;
}
.RCV-namespace .um-wrapper__no-meetings {
  display: flex;
  padding: 10px;
}
.RCV-namespace .um-wrapper__no-meetings__icon {
  width: 20px;
  height: 16px;
  margin-right: 20px;
  fill: #666666;
}
.RCV-namespace .accessibility-mode .um-wrapper__actions__button:focus {
  outline: 1px solid rgba(6, 123, 189, 0.7);
}
.RCV-namespace .UM_CalendarsNotConnected__wrapper {
  text-align: center;
  display: grid;
  grid-template-rows: minmax(30px, 2fr) 131px minmax(30px, 2fr) minmax(35px, 1fr) minmax(20px, 1fr) 45px minmax(40px, 4fr);
  align-content: center;
  justify-items: center;
}
.RCV-namespace .UM_CalendarsNotConnected__img {
  grid-row: 2 / 3;
  width: 139px;
  height: 131px;
}
.RCV-namespace .UM_CalendarsNotConnected__msg {
  grid-row: 4 / 5;
  margin: 0;
  color: #2F2F2F;
  font-size: 15px;
  padding: 0 20px;
}
.RCV-namespace .UM_CalendarsNotConnected__button {
  font-size: 17px;
  grid-row: 6 / 7;
}

.RCV-namespace .self-quality-alert {
  position: relative;
}
.RCV-namespace .self-quality-alert .self-quality-alert__container {
  position: absolute;
  bottom: 100%;
  left: 0;
  background-color: #F6AD16;
  padding: 14px 26px 14px 20px;
  border-radius: 8px;
  width: 320px;
  z-index: 999;
  pointer-events: all;
  word-break: break-word;
}
.RCV-namespace .self-quality-alert .self-quality-alert__container:before {
  content: '';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-top: 6px solid #F6AD16;
  bottom: -12px;
  left: 20px;
}
.RCV-namespace .self-quality-alert .self-quality-alert__close-btn {
  position: absolute;
  right: 10px;
  top: 10px;
  color: #666666;
}

.RCV-namespace .AnnotationDeleteButton__control {
  background-color: #000000;
  pointer-events: auto;
  width: 40px;
  height: 40px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  border-radius: 8px;
  margin: 2px 4px;
  flex-shrink: 0;
  transition: 100ms background-color linear;
}
.RCV-namespace .AnnotationDeleteButton__control:not(.disabled):hover, .RCV-namespace .AnnotationDeleteButton__control:not(.disabled):not(.active):focus {
  background-color: #343434;
}
.RCV-namespace .AnnotationDeleteButton__control.active {
  background-color: #356AFD;
}
.RCV-namespace .AnnotationDeleteButton__control:not(.disabled).active:hover {
  background-color: #315fe4;
}
.RCV-namespace .AnnotationDeleteButton__control.disabled {
  cursor: default;
}
.RCV-namespace .AnnotationDeleteButton__control.disabled svg {
  color: #666666;
}
.RCV-namespace .AnnotationDeleteButton__control svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background-color: unset;
  border: none;
  color: #FFFFFF;
}
.RCV-namespace .AnnotationDeleteButton__control svg:active {
  color: #029fd8;
}

.RCV-namespace .AnnotationToolbar {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  background-color: #1C1B1A;
  border-radius: 12px;
  padding: 2px 0;
  transition: 0.3s width;
}
.RCV-namespace .AnnotationToolbar::before {
  content: url(https://wcdn.ringcentral.com/_whc/grip-dots-1f6df124063debd32aa61fa68b6e22ca.svg?appVersion=23.2.30);
  width: 24px;
  height: 24px;
  align-self: center;
}
.RCV-namespace .AnnotationToolbar.expanded {
  overflow-x: hidden;
}
.RCV-namespace .AnnotationToolbar.expanded .AnnotationToolbar__control {
  width: 225px;
  padding: 0 8px;
  box-sizing: border-box;
}
.RCV-namespace .AnnotationToolbar.expanded .AnnotationToolbar__control-title {
  display: initial;
  opacity: 1;
  transition: 0.1s opacity;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.RCV-namespace .AnnotationToolbar.expanded .AnnotationToolbar__control--collapse-toolbar {
  width: 210px;
}
.RCV-namespace .AnnotationToolbar.expanded .AnnotationToolbar__control-tooltip {
  width: 100%;
}
.RCV-namespace .AnnotationToolbar.expanded .expandable--bottom-right {
  transform: translate(-10px, -10px) scale(2) rotate(-45deg);
}
.RCV-namespace .AnnotationToolbar .AnnotationPopup--more-menu .AnnotationToolbar__control {
  display: none;
}
.RCV-namespace .AnnotationToolbar.color-red .AnnotationToolbar__control--color svg.color {
  color: #E55649;
}
.RCV-namespace .AnnotationToolbar.color-green .AnnotationToolbar__control--color svg.color {
  color: #3B9949;
}
.RCV-namespace .AnnotationToolbar.color-orange .AnnotationToolbar__control--color svg.color {
  color: #FF8800;
}
.RCV-namespace .AnnotationToolbar.color-greenish-blue .AnnotationToolbar__control--color svg.color {
  color: #3093A3;
}
.RCV-namespace .AnnotationToolbar.color-blue .AnnotationToolbar__control--color svg.color {
  color: #6480E6;
}
.RCV-namespace .AnnotationToolbar.color-purple .AnnotationToolbar__control--color svg.color {
  color: #8A76E3;
}
.RCV-namespace .AnnotationToolbar__control {
  width: 40px;
  height: 40px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  border-radius: 8px;
  margin: 2px 4px;
  flex-shrink: 0;
  transition: 100ms background-color linear;
}
.RCV-namespace .AnnotationToolbar__control:not(.disabled):hover, .RCV-namespace .AnnotationToolbar__control:not(.disabled):not(.active):focus {
  background-color: #343434;
}
.RCV-namespace .AnnotationToolbar__control.active {
  background-color: #356AFD;
}
.RCV-namespace .AnnotationToolbar__control:not(.disabled).active:hover {
  background-color: #315fe4;
}
.RCV-namespace .AnnotationToolbar__control.disabled {
  cursor: default;
}
.RCV-namespace .AnnotationToolbar__control.disabled svg {
  color: #666666;
}
.RCV-namespace .AnnotationToolbar__control svg {
  color: #FFFFFF;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background-color: unset;
  border: none;
}
.RCV-namespace .AnnotationToolbar__control .expandable--bottom-right {
  position: absolute;
  bottom: 5px;
  right: 4px;
  width: 8px;
  height: 8px;
  pointer-events: none;
}
.RCV-namespace .AnnotationToolbar__control .expandable--bottom-right svg {
  color: #FFFFFF;
}
.RCV-namespace .AnnotationToolbar__control--separator {
  box-sizing: border-box;
  height: 2px;
  padding: 0 5px;
  pointer-events: none;
}
.RCV-namespace .AnnotationToolbar__control--separator::before {
  content: '';
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.2);
}
.RCV-namespace .AnnotationToolbar__control--more {
  display: none;
}
.RCV-namespace .AnnotationToolbar__control--more .AnnotationToolbar__control {
  display: none;
}
.RCV-namespace .AnnotationToolbar__control--with-arrow::after {
  content: '';
  position: absolute;
  right: 5px;
  top: 5px;
  width: 20px;
  height: 20px;
  border: 2px solid #FFFFFF;
  border-left: none;
  border-bottom: none;
  transform: rotate(45deg);
}
.RCV-namespace .AnnotationToolbar__control-content {
  display: flex;
  align-items: center;
}
.RCV-namespace .AnnotationToolbar__control-title {
  display: none;
  padding-left: 10px;
  flex-grow: 1;
  opacity: 0;
  color: #FFFFFF;
  transition: 1s opacity;
}
.RCV-namespace .AnnotationToolbar__control-hint {
  color: rgba(245, 246, 249, 0.5);
}
.RCV-namespace .AnnotationToolbar__control-tooltip.AnnotationToolbar__control-tooltip {
  white-space: nowrap;
}
.RCV-namespace .AnnotationToolbar.color-selector-open .AnnotationToolbar__control--color {
  background-color: #343434;
}
.RCV-namespace .AnnotationToolbar.color-selector-open .AnnotationToolbar__control--color .tooltip-container {
  visibility: hidden;
}
.RCV-namespace .AnnotationToolbar__control--collapse-toolbar {
  justify-content: center;
  align-self: center;
  background-color: rgba(255, 255, 255, 0.16);
}
.RCV-namespace .AnnotationToolbar.thickness-selector-open .AnnotationToolbar__control--thickness {
  background-color: #343434;
}
.RCV-namespace .AnnotationToolbar.thickness-selector-open .AnnotationToolbar__control--thickness .tooltip-container {
  visibility: hidden;
}
.RCV-namespace .AnnotationToolbar.eraser-selector-open .AnnotationToolbar__control--delete {
  background-color: #343434;
}
.RCV-namespace .AnnotationToolbar.eraser-selector-open .AnnotationToolbar__control--delete .tooltip-container {
  visibility: hidden;
}
.RCV-namespace .AnnotationToolbar.more-menu-open .AnnotationToolbar__control--more {
  background-color: #343434;
}
.RCV-namespace .AnnotationToolbar.more-menu-open .AnnotationToolbar__control--more .tooltip-container {
  visibility: hidden;
}
.RCV-namespace .RCV_media_query-max_height_600  .AnnotationToolbar .AnnotationPopup--more-menu .AnnotationToolbar__control.moreMenuBreakpoint1 {
    display: flex;
}
.RCV-namespace .RCV_media_query-max_height_480  .AnnotationToolbar .AnnotationPopup--more-menu .AnnotationToolbar__control.moreMenuBreakpoint2 {
    display: flex;
}
.RCV-namespace .RCV_media_query-max_height_600  .AnnotationToolbar__control--more {
    display: flex;
}
.RCV-namespace .RCV_media_query-max_height_600  .AnnotationToolbar__control.moreMenuBreakpoint1 {
    display: none;
}
.RCV-namespace .RCV_media_query-max_height_480  .AnnotationToolbar__control.moreMenuBreakpoint2 {
    display: none;
}
.RCV-namespace .RCV_media_query-max_height_600  .AnnotationToolbar__control--more .AnnotationToolbar__control.moreMenuBreakpoint1 {
    display: flex;
}
.RCV-namespace .RCV_media_query-max_height_480  .AnnotationToolbar__control--more .AnnotationToolbar__control.moreMenuBreakpoint2 {
    display: flex;
}
.RCV-namespace .RCV_media_query-max_height_600  .AnnotationToolbar > .AnnotationToolbar__control.moreMenuBreakpoint1 + .popper {
    display: none;
}

.RCV-namespace .AnnotationPopup {
  box-sizing: border-box;
  display: flex;
  gap: 4px;
  background-color: #1C1B1A;
  padding: 4px;
  border-radius: 12px;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  padding: 4px;
  border-radius: 4px;
  cursor: pointer;
  transition: 100ms background-color linear;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item:hover, .RCV-namespace .AnnotationPopup .ColorPicker__item:focus {
  background-color: #343434;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item.selected {
  background-color: #595959;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item.selected:hover, .RCV-namespace .AnnotationPopup .ColorPicker__item.selected:focus {
  background-color: rgba(89, 89, 89, 0.84);
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--red .ColorPicker__icon.red {
  background-color: #E55649;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--green .ColorPicker__icon.green {
  background-color: #3B9949;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--orange .ColorPicker__icon.orange {
  background-color: #FF8800;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--greenish-blue .ColorPicker__icon.greenish-blue {
  background-color: #3093A3;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--blue .ColorPicker__icon.blue {
  background-color: #6480E6;
}
.RCV-namespace .AnnotationPopup .ColorPicker__item--purple .ColorPicker__icon.purple {
  background-color: #8A76E3;
}
.RCV-namespace .AnnotationPopup .ColorPicker__icon {
  width: 17px;
  height: 17px;
  border: 1px solid white;
  border-radius: 50%;
}
.RCV-namespace .AnnotationPopup .ThicknessPicker__item {
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  padding: 4px;
  border-radius: 4px;
  cursor: pointer;
  transition: 100ms background-color linear;
}
.RCV-namespace .AnnotationPopup .ThicknessPicker__item:hover, .RCV-namespace .AnnotationPopup .ThicknessPicker__item:focus {
  background-color: #343434;
}
.RCV-namespace .AnnotationPopup .ThicknessPicker__item.selected {
  background-color: #595959;
}
.RCV-namespace .AnnotationPopup .ThicknessPicker__item.selected:hover, .RCV-namespace .AnnotationPopup .ThicknessPicker__item.selected:focus {
  background-color: rgba(89, 89, 89, 0.84);
}
.RCV-namespace .AnnotationPopup .ThicknessPicker__item svg {
  color: #FFFFFF;
}
.RCV-namespace .AnnotationPopup.Eraser__popup {
  display: flex;
  flex-direction: column;
  width: initial;
  color: #FFFFFF;
  font-size: 14px;
  font-family: "Proxima Nova Semibold", Helvetica, Arial, sans-serif;
}
.RCV-namespace .AnnotationPopup .Eraser__item {
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  padding: 4px;
  cursor: pointer;
  transition: 100ms background-color linear;
  width: initial;
  height: initial;
  padding: 10px 18px 10px 8px;
  line-height: 19px;
  border-radius: 10px;
  white-space: nowrap;
}
.RCV-namespace .AnnotationPopup .Eraser__item:hover, .RCV-namespace .AnnotationPopup .Eraser__item:focus {
  background-color: #343434;
}
.RCV-namespace .AnnotationPopup .Eraser__item.selected {
  background-color: #595959;
}
.RCV-namespace .AnnotationPopup .Eraser__item.selected:hover, .RCV-namespace .AnnotationPopup .Eraser__item.selected:focus {
  background-color: rgba(89, 89, 89, 0.84);
}
.RCV-namespace .AnnotationPopup--more-menu {
  flex-flow: column;
}

.sui-form-field-label {font-size: var(--sui-typography-descriptor-mini-font-size);font-weight: var(--sui-typography-descriptor-mini-font-weight);line-height: var(--sui-typography-descriptor-mini-line-height);text-decoration: var(--sui-typography-descriptor-mini-text-decoration);text-transform: var(--sui-typography-descriptor-mini-text-transform);font-family: var(--sui-font-family);display: flex;--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}@media (prefers-reduced-motion: no-preference) {.sui-form-field-label {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}
  .sui-form-field-helper-text {font-size: var(--sui-typography-descriptor-font-size);font-weight: var(--sui-typography-descriptor-font-weight);line-height: var(--sui-typography-descriptor-line-height);text-decoration: var(--sui-typography-descriptor-text-decoration);text-transform: var(--sui-typography-descriptor-text-transform);font-family: var(--sui-font-family);margin-top: var(--sui-spacing-1);--tw-text-opacity: 1;color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}
  @media (prefers-reduced-motion: no-preference) {.sui-form-field-helper-text {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}
  .sui-form-field-content {box-sizing: border-box;display: flex;align-items: center;justify-content: flex-start;overflow: hidden;border-color: var(--sui-colors-neutral-b0-t20)
}
  @media (prefers-reduced-motion: no-preference) {.sui-form-field-content {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}
  .sui-form-field-container {position: relative
}
  .sui-form-field-focus-effect {pointer-events: none;position: absolute;inset: var(--sui-spacing-0);--tw-border-opacity: 1;border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-border-opacity)))
}
  .sui-form-field-outlined,
  .sui-form-field-contained {border-radius: var(--sui-border-radius-sm);--sui-focus-ring-border-radius: var(--sui-border-radius-sm)
}
  .sui-form-field-outlined-label, .sui-form-field-contained-label {margin-bottom: var(--sui-spacing-1)
}
  .sui-form-field-outlined-xlarge, .sui-form-field-contained-xlarge {padding-left: var(--sui-spacing-4);padding-right: var(--sui-spacing-4)
}
  .sui-form-field-outlined-large, .sui-form-field-contained-large {padding-left: var(--sui-spacing-3);padding-right: var(--sui-spacing-3)
}
  .sui-form-field-outlined-medium, .sui-form-field-contained-medium {padding-left: var(--sui-spacing-2\.5);padding-right: var(--sui-spacing-2\.5)
}
  .sui-form-field-outlined-content, .sui-form-field-contained-content {border-style: solid;border-radius: var(--sui-border-radius-sm);--sui-focus-ring-border-radius: var(--sui-border-radius-sm);--sui-focus-ring-border-width-recoup: 1
}
  @media (hover: hover) {
  .sui-form-field-outlined-content:hover, .sui-form-field-contained-content:hover {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)))
  }
}
  .sui-form-field-outlined:not(.sui-disabled):focus .sui-form-field-focus-effect, .sui-form-field-outlined:not(.sui-disabled):focus-within .sui-form-field-focus-effect, .sui-form-field-outlined:not(.sui-disabled).sui-focused .sui-form-field-focus-effect, .sui-form-field-contained:not(.sui-disabled):focus .sui-form-field-focus-effect, .sui-form-field-contained:not(.sui-disabled):focus-within .sui-form-field-focus-effect, .sui-form-field-contained:not(.sui-disabled).sui-focused .sui-form-field-focus-effect {box-sizing: border-box;border-style: solid;border-radius: var(--sui-border-radius-sm);--sui-focus-ring-border-radius: var(--sui-border-radius-sm);border-width: var(--sui-border-width-2);--sui-focus-ring-border-width: var(--sui-border-width-2);--sui-focus-ring-border-width-recoup: 1
}
  .sui-form-field-outlined-content {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));border-width: var(--sui-border-width-1);--sui-focus-ring-border-width: var(--sui-border-width-1)
}
  @media (hover: hover) {
  .sui-form-field-outlined-content:hover {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)))
  }
}
  .sui-form-field-contained-content {background-color: var(--sui-colors-neutral-b4-t50);border-width: var(--sui-border-width-0);--sui-focus-ring-border-width: var(--sui-border-width-0)
}
  @media (hover: hover) {
  .sui-form-field-contained-content:hover {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)))
  }
}
  .sui-form-field-standard-content {border-style: solid;border-color: var(--sui-colors-neutral-b0-t20);border-top-color: transparent;border-width: var(--sui-border-width-0);--sui-focus-ring-border-width: var(--sui-border-width-0);border-top-width: var(--sui-border-width-1);border-bottom-width: var(--sui-border-width-1);--sui-focus-ring-border-width-recoup: 1
}
  @media (hover: hover) {
  .sui-form-field-standard-content:hover {--tw-border-opacity: 1;border-bottom-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)))
  }
}
  .sui-form-field-standard-focus-effect {border-width: var(--sui-border-width-0);--sui-focus-ring-border-width: var(--sui-border-width-0);border-bottom-width: var(--sui-border-width-2);transform-origin: center;--tw-scale-x: 0;transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-style: solid;--sui-focus-ring-border-width-recoup: 1
}
  @media (prefers-reduced-motion: no-preference) {.sui-form-field-standard-focus-effect {transition-property: transform;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}
  .sui-form-field-standard:not(.sui-disabled):focus .sui-form-field-focus-effect, .sui-form-field-standard:not(.sui-disabled):focus-within .sui-form-field-focus-effect, .sui-form-field-standard:not(.sui-disabled).sui-focused .sui-form-field-focus-effect {--tw-scale-x: 1;transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
  .sui-form-field-quiet-content {border-width: var(--sui-border-width-0);--sui-focus-ring-border-width: var(--sui-border-width-0)
}
  .sui-form-field-xlarge-content {height: var(--sui-spacing-12)
}
  .sui-form-field-large-content {height: var(--sui-spacing-9)
}
  .sui-form-field-medium-content {height: var(--sui-spacing-8)
}
  .sui-form-field-error-helper-text,
    .sui-form-field-error-label {--tw-text-opacity: 1;color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-form-field-error-focus-effect,
    .sui-form-field-error-content {--tw-border-opacity: 1;border-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-border-opacity)))
}
  @media (hover: hover) {
  .sui-form-field-error-focus-effect:hover, .sui-form-field-error-content:hover {--tw-border-opacity: 1;border-color: rgb(var(--s-danger-high-contrast), calc(var(--s-danger-high-contrast-opacity, 1) * var(--tw-border-opacity)))
  }
}
  .sui-form-field-error-standard-content {border-top-color: transparent
}
  @media (hover: hover) {
  .sui-form-field-error-standard-content:hover {border-top-color: transparent
  }
}
  .sui-form-field-error-contained-content {background-color: var(--sui-colors-danger-t10)
}
  @media (hover: hover) {
  .sui-form-field-error-contained-content:hover {background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * 0.2))
  }
}
  .sui-form-field.sui-disabled .sui-form-field-container {pointer-events: none
}
  .sui-form-field.sui-disabled input,
    .sui-form-field.sui-disabled textarea {pointer-events: auto
}
  .sui-form-field.sui-disabled .sui-form-field-content {border-color: var(--sui-colors-neutral-b0-t10)
}
  .sui-form-field.sui-disabled .sui-form-field-standard-content {border-top-color: transparent
}
  .sui-form-field.sui-disabled .sui-form-field-contained-content {border-color: transparent
}
  .sui-form-field.sui-disabled .sui-form-field-contained-content,
    .sui-form-field.sui-disabled .sui-form-field-outlined-content {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-form-field.sui-disabled .sui-form-field-helper-text {--tw-text-opacity: 1;color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-form-label-root {
    display: inline-flex;
    align-items: center;
    vertical-align: middle
}
  .sui-form-label-label {
    font-size: var(--sui-typography-subtitle-mini-font-size);
    font-weight: var(--sui-typography-subtitle-mini-font-weight);
    line-height: var(--sui-typography-subtitle-mini-line-height);
    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);
    text-transform: var(--sui-typography-subtitle-mini-text-transform);
    font-family: var(--sui-font-family);
    margin-right: var(--sui-spacing-2);
    cursor: pointer;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-form-label-label.sui-disabled {
    pointer-events: none;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-form-label-end-label {
    margin-left: var(--sui-spacing-2)
}
  .sui-form-label-start {
    flex-direction: row-reverse
}
  .sui-form-label-start-label {
    margin-right: var(--sui-spacing-2)
}
  .sui-form-label-full-width {
    width: 100%;
    justify-content: space-between
}

.sui-squircle-root {
  /* create stacking context, prevent svg element be covered by outside element */
  position: relative;
  z-index: 0;
  outline: 2px solid transparent;
  outline-offset: 2px;
  height: var(--sui-spacing-9);
  width: var(--sui-spacing-9);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
  display: flex;
  align-items: center;
  justify-content: center;

  /* ⬇️ public css variable */

  /* use `fill` by default */
  --sui-squircle-border-color: var(--sui-squircle-fill);
  --sui-squircle-border-width: var(--sui-border-width-2);
  --sui-squircle-ring-width: 2px;
  --sui-squircle-ring-offset: 2px;
  --sui-squircle-ring-color: var(--sui-colors-primary-f-high-contrast);
  --sui-squircle-bg-color: var(--sui-colors-primary-b);
  --sui-squircle-bg-color-hover: var(--sui-colors-primary-b-high-contrast);
  --sui-squircle-bg-color-active: var(--sui-colors-neutral-b0);

  /* ⬇️ private css variable */

  --sui-squircle-fill: var(--sui-squircle-bg-color);
}

@media (hover: hover) {

.sui-squircle-interactive:hover {
    --sui-squircle-fill: var(--sui-squircle-bg-color-hover);
    --sui-squircle-border-color: var(
      --sui-squircle-border-color-hover,
      --sui-squircle-border-color
    );
  }
}

.sui-squircle-interactive.sui-active,
  .sui-squircle-interactive:active {
    --sui-squircle-fill: var(--sui-squircle-bg-color-active);
    --sui-squircle-border-color: var(
      --sui-squircle-border-color-active,
      var(--sui-squircle-fill)
    );
  }

.sui-squircle-content {
  position: absolute;
  z-index: -10;
  height: 100%;
  width: 100%;
}

@media (prefers-reduced-motion: no-preference) {

  .sui-squircle-content > path {
    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}

.sui-squircle-content > path {

    transition-property: fill, stroke;
    fill: var(--sui-squircle-fill);
    stroke: var(--sui-squircle-border-color);
    stroke-width: calc(var(--sui-squircle-border-width) * 2);
  }

.sui-squircle-ring {
  position: absolute;
  z-index: -10;

  width: calc(
    100% +
    (var(--sui-squircle-ring-offset) + var(--sui-squircle-ring-width) / 2) * 2
  );
  height: calc(
    100% +
    (var(--sui-squircle-ring-offset) + var(--sui-squircle-ring-width) / 2) * 2
  );
}

.sui-squircle-ring > path {
    stroke: var(--sui-squircle-ring-color);
    stroke-width: var(--sui-squircle-ring-width);
  }

.sui-visually-hidden-root {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0
}

.sui-overlap-root {
  position: relative;
  display: inline-flex
}
  .sui-overlap-floater {
  position: absolute;
  display: inline-flex
}
  .sui-overlap-top-left {
  top: var(--sui-spacing-0);
  left: var(--sui-spacing-0)
}
  .sui-overlap-top-right {
  top: var(--sui-spacing-0);
  right: var(--sui-spacing-0)
}
  .sui-overlap-bottom-left {
  bottom: var(--sui-spacing-0);
  left: var(--sui-spacing-0)
}
  .sui-overlap-bottom-right {
  bottom: var(--sui-spacing-0);
  right: var(--sui-spacing-0)
}
  .sui-overlap-show-floater-on-hover-only .sui-overlap-floater {
  visibility: hidden
}
  @media (hover: hover) {
  .sui-overlap-show-floater-on-hover-only:hover .sui-overlap-floater {
    visibility: visible
  }
}

.sui-skeleton-circular,
.sui-skeleton-squircle,
.sui-skeleton-rectangular {

  border-style: none;

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));

  --sui-focus-ring-border-width-recoup: 0;
}

.sui-skeleton-circular {

  height: var(--sui-spacing-10);

  width: var(--sui-spacing-10);

  border-radius: var(--sui-border-radius-full);

  --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}

.sui-skeleton-squircle {

  height: var(--sui-spacing-8);

  width: var(--sui-spacing-8);

  border-style: none;

  border-color: transparent;

  background-color: transparent;

  --sui-focus-ring-border-width-recoup: 0;

  --sui-squircle-bg-color: var(--sui-colors-neutral-b4);
}

.sui-skeleton-rectangular {

  height: var(--sui-spacing-18);

  width: var(--sui-spacing-30);

  border-radius: var(--sui-border-radius-xs);

  --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}

.sui-skeleton-text {

  flex-shrink: 0;

  flex-grow: 1;

  user-select: none;

  align-self: stretch;

  color: transparent;

  text-decoration-line: none;
}

.sui-skeleton-text > span {
    /* Disables the text-decoration */
    display: inline-block;
    width: 100%;
    --tw-scale-y: .5;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));

    border-radius: var(--sui-border-radius-xs) /
      calc(var(--sui-border-radius-xs) * 2);
  }

@keyframes skeleton-wave {
  0% {
    left: calc(0px - var(--sui-skeleton-gradient-width));
  }

  /* 0.5s delay between each loop */
  50% {
    left: calc(100% + var(--sui-skeleton-gradient-width));
  }

  100% {
    left: calc(100% + var(--sui-skeleton-gradient-width));
  }
}

.sui-skeleton-container-root {
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-text-opacity)));

  --sui-skeleton-gradient-width: var(--sui-spacing-112);
}

.sui-skeleton-container-root::after {
  position: absolute;
  --tw-translate-y: -50%;
  --tw-rotate: 15deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  --tw-content: "";
  content: var(--tw-content);

    height: 200vh;
    width: var(--sui-skeleton-gradient-width);
    animation: skeleton-wave 3.2s ease-in-out 0.5s infinite normal none running;
    background: linear-gradient(
      -90deg,
      var(--sui-colors-neutral-w0-t0),
      currentColor,
      var(--sui-colors-neutral-w0-t0)
    );
}

.sui-icon-root {

    display: inline-block;
}
  .sui-icon-svg {

    pointer-events: none;

    display: block;

    fill: currentColor;

    stroke: currentColor;

    stroke-width: 0;

    height: 1em;
    width: 1em;
}
  /* size */
  .sui-icon-xsmall {
    font-size: 12px;
  }
  .sui-icon-small {
    font-size: 16px;
  }
  .sui-icon-medium {
    font-size: 20px;
  }
  .sui-icon-large {
    font-size: 24px;
  }
  .sui-icon-xlarge {
    font-size: 32px;
  }
  .sui-icon-xxlarge {
    font-size: 36px;
  }
  .sui-icon-xxxlarge {
    font-size: 40px;
  }

.sui-status-indicator-root {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--sui-border-radius-full);
    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
    border-style: solid;
    --tw-border-opacity: 1;
    border-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-border-opacity)));
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
    border-width: var(--sui-border-width-1);
    --sui-focus-ring-border-width: var(--sui-border-width-1);
    --sui-focus-ring-border-width-recoup: 1
}
  .sui-status-indicator-large {
    height: var(--sui-spacing-4);
    width: var(--sui-spacing-4)
}
  .sui-status-indicator-medium {
    height: var(--sui-spacing-3);
    width: var(--sui-spacing-3)
}
  .sui-status-indicator-small {
    height: var(--sui-spacing-2\.5);
    width: var(--sui-spacing-2\.5)
}
  /* Special size for status icon, not part of the icon size scale */
  .sui-status-indicator-small .sui-icon {
    font-size: 0.625rem
}
  .sui-status-indicator-dnd {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-status-indicator-busy {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-status-indicator-available {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-status-indicator-unavailable {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)))
}

@media (hover: hover) {.sui-expand-collapse-caret-root:hover {
    cursor: pointer;
  }
}

.sui-expand-collapse-caret-vertical {
  transform: rotate(0);
}

.sui-expand-collapse-caret-horizontal {
  transform: rotate(-90deg);
}

@media (hover: hover) {.sui-show-hide-eye-root:hover {cursor: pointer
}
}

.sui-backdrop-root {

    position: fixed;

    inset: var(--sui-spacing-0);

    z-index: -10;

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-static-b0), calc(var(--s-neutral-static-b0-opacity, 1) * var(--tw-bg-opacity)));

    opacity: 0.5
}

.sui-backdrop-transparent {

    background-color: transparent
}

.sui-modal-root {

    position: fixed;

    inset: var(--sui-spacing-0);

    z-index: 1300;

    outline: 2px solid transparent;

    outline-offset: 2px
}

.sui-modal-non-blocking {

    pointer-events: none
}

.sui-modal-non-blocking > :not(.sui-backdrop-root) {

    pointer-events: auto
}

.sui-popper-paper-root {
  --sui-popper-paper-arrow-radius: 2px;
}

.sui-popper-paper-arrow {
  position: absolute;
  z-index: -10;
  box-sizing: border-box;
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: inherit;

  border-color: inherit;
  border-width: inherit;
  border-style: inherit;
}

.sui-popper[data-sui-popper-placement^='top'] .sui-popper-paper-arrow {
  border-bottom-right-radius: 2px;
}

.sui-popper[data-sui-popper-placement^='bottom'] .sui-popper-paper-arrow {
  border-top-left-radius: 2px;
}

.sui-popper[data-sui-popper-placement^='left'] .sui-popper-paper-arrow {
  border-top-right-radius: 2px;
}

.sui-popper[data-sui-popper-placement^='right'] .sui-popper-paper-arrow {
  border-bottom-left-radius: 2px;
}

.sui-popper-paper-content {
  overflow-y: auto;
  background-color: inherit;
  border-radius: inherit;
  --sui-focus-ring-border-radius: inherit;
}

.sui-tooltip-view-root {

 z-index: 1500;
}

.sui-tooltip-view-disable-interactions {

 pointer-events: none;
}

.sui-tooltip-trigger-wrapper {

 display: inline-block;

 width: max-content;

 outline: 2px solid transparent;

 outline-offset: 2px;
}

.sui-tooltip-view-paper {

 --tw-text-opacity: 1;

 color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));

 border-radius: var(--sui-border-radius-xs);

 --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

 will-change: transform; /* Needed to force a new stacking context, ensuring the arrow appears underneath the preceding paper-content element */
}

.sui-tooltip-view-paper-content {

 box-sizing: border-box;

 display: flex;

 max-width: var(--sui-spacing-50);

 flex-direction: row;

 align-items: flex-start;

 padding-left: var(--sui-spacing-2);

 padding-right: var(--sui-spacing-2);

 padding-top: var(--sui-spacing-1);

 padding-bottom: var(--sui-spacing-1);

 border-radius: inherit;

 --sui-focus-ring-border-radius: inherit;

  background: inherit;
}

/* The paper-content needs to have its own BG to mask the arrow */

.sui-tooltip-view-paper-content-medium {

 max-width: var(--sui-spacing-75);

 padding-top: var(--sui-spacing-1\.25);

 padding-bottom: var(--sui-spacing-1\.25);
}

.sui-tooltip-view-icon {

 margin-right: var(--sui-spacing-2);
}

.sui-tooltip-view-content {

 font-size: var(--sui-typography-descriptor-mini-font-size);

 font-weight: var(--sui-typography-descriptor-mini-font-weight);

 line-height: var(--sui-typography-descriptor-mini-line-height);

 text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

 text-transform: var(--sui-typography-descriptor-mini-text-transform);

 font-family: var(--sui-font-family);

 overflow: hidden;

 overflow-wrap: break-word;
}

.sui-tooltip-view-content-medium {

 font-size: var(--sui-typography-descriptor-font-size);

 font-weight: var(--sui-typography-descriptor-font-weight);

 line-height: var(--sui-typography-descriptor-line-height);

 text-decoration: var(--sui-typography-descriptor-text-decoration);

 text-transform: var(--sui-typography-descriptor-text-transform);

 font-family: var(--sui-font-family);
}

.sui-tooltip-view-neutral {

 --tw-border-opacity: 1;

 border-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-border-opacity)));

 --tw-bg-opacity: 1;

 background-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-tooltip-view-success {

 --tw-border-opacity: 1;

 border-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * var(--tw-border-opacity)));

 --tw-bg-opacity: 1;

 background-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-tooltip-view-danger {

 --tw-border-opacity: 1;

 border-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-border-opacity)));

 --tw-bg-opacity: 1;

 background-color: rgb(var(--s-danger-high-contrast), calc(var(--s-danger-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-tooltip-view-inverted {

 border-style: solid;

 --tw-border-opacity: 1;

 border-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-border-opacity)));

 --tw-bg-opacity: 1;

 background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

 --tw-text-opacity: 1;

 color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

 border-width: var(--sui-border-width-1);

 --sui-focus-ring-border-width: var(--sui-border-width-1);

 --sui-focus-ring-border-width-recoup: 1;
}

.sui-tooltip-view-force-hide {
  display: none;
}

.sui-circular-progress-indicator-root {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    will-change: transform;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

    width: var(--sui-circular-progress-indicator-size);
    height: var(--sui-circular-progress-indicator-size);
}
  .sui-circular-progress-indicator-xlarge {
    --sui-circular-progress-indicator-size: var(--sui-spacing-14);
  }
  .sui-circular-progress-indicator-large {
    --sui-circular-progress-indicator-size: var(--sui-spacing-10);
  }
  .sui-circular-progress-indicator-medium {
    --sui-circular-progress-indicator-size: var(--sui-spacing-6);
  }
  .sui-circular-progress-indicator-small {
    --sui-circular-progress-indicator-size: var(--sui-spacing-4);
  }
  .sui-circular-progress-indicator-xsmall {
    --sui-circular-progress-indicator-size: var(--sui-spacing-3);
  }
  .sui-circular-progress-indicator-indeterminate {
    background-color: var(--sui-circular-progress-indicator-track-bg);

    /* stylelint-disable-next-line property-no-vendor-prefix */
    -webkit-mask: radial-gradient(
      circle at center,
      transparent var(--sui-circular-progress-indicator-gradient-start),
      var(--sui-colors-neutral-w0)
        var(--sui-circular-progress-indicator-gradient-stop)
    );
  }
  .sui-circular-progress-indicator-indeterminate-outer-circle {

    display: block;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

      width: calc(var(--sui-circular-progress-indicator-size) / 4);
      height: calc(var(--sui-circular-progress-indicator-size) + 4px);
}
  .sui-circular-progress-indicator-indeterminate-inner-circle {

    display: block;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

      width: calc(var(--sui-circular-progress-indicator-size) / 4);
      height: calc(var(--sui-circular-progress-indicator-size) / 4);
      background-image: radial-gradient(
        var(--sui-circular-progress-indicator-gradient-size),
        var(--sui-circular-progress-indicator-gradient-start-color),
        var(--sui-circular-progress-indicator-gradient-end-color)
      );
      clip-path: inset(0 50% 0 0);
}
  .sui-circular-progress-indicator-indeterminate-xlarge {
      --sui-circular-progress-indicator-gradient-size: 4px;
      --sui-circular-progress-indicator-gradient-start: calc(
        var(--sui-circular-progress-indicator-size) / 3
      );
      --sui-circular-progress-indicator-gradient-stop: calc(
        var(--sui-circular-progress-indicator-size) / 2.92
      );
    }
  .sui-circular-progress-indicator-indeterminate-large {
      --sui-circular-progress-indicator-gradient-size: 3px;
      --sui-circular-progress-indicator-gradient-start: calc(
        var(--sui-circular-progress-indicator-size) / 3
      );
      --sui-circular-progress-indicator-gradient-stop: calc(
        var(--sui-circular-progress-indicator-size) / 2.82
      );
    }
  .sui-circular-progress-indicator-indeterminate-medium {
      --sui-circular-progress-indicator-gradient-size: 2px;
      --sui-circular-progress-indicator-gradient-start: calc(
        var(--sui-circular-progress-indicator-size) / 3
      );
      --sui-circular-progress-indicator-gradient-stop: calc(
        var(--sui-circular-progress-indicator-size) / 2.72
      );
    }
  .sui-circular-progress-indicator-indeterminate-small {
      --sui-circular-progress-indicator-gradient-size: 1px;
      --sui-circular-progress-indicator-gradient-start: calc(
        var(--sui-circular-progress-indicator-size) / 3
      );
      --sui-circular-progress-indicator-gradient-stop: calc(
        var(--sui-circular-progress-indicator-size) / 2.72
      );
    }
  .sui-circular-progress-indicator-indeterminate-xsmall {
      --sui-circular-progress-indicator-gradient-size: 1px;
      --sui-circular-progress-indicator-gradient-start: calc(
        var(--sui-circular-progress-indicator-size) / 3
      );
      --sui-circular-progress-indicator-gradient-stop: calc(
        var(--sui-circular-progress-indicator-size) / 2.72
      );
    }
  .sui-circular-progress-indicator-indeterminate-primary {
      --sui-circular-progress-indicator-gradient-start-color: var(
        --sui-colors-primary-f
      );
      --sui-circular-progress-indicator-gradient-end-color: var(
        --sui-colors-primary-t0
      );
      --sui-circular-progress-indicator-track-bg: var(--sui-colors-neutral-b4);
    }
  .sui-circular-progress-indicator-indeterminate-neutral {
      --sui-circular-progress-indicator-gradient-start-color: var(
        --sui-colors-neutral-static-w0
      );
      --sui-circular-progress-indicator-gradient-end-color: var(
        --sui-colors-neutral-w0-t0
      );
      --sui-circular-progress-indicator-track-bg: var(
        --sui-colors-neutral-b4-t50
      );
    }
  .sui-circular-progress-indicator-indeterminate-danger {
      --sui-circular-progress-indicator-gradient-start-color: var(
        --sui-colors-danger-f
      );
      --sui-circular-progress-indicator-gradient-end-color: var(
        --sui-colors-danger-t0
      );
      --sui-circular-progress-indicator-track-bg: var(--sui-colors-neutral-b4);
    }
  .sui-circular-progress-indicator-indeterminate-warning {
      --sui-circular-progress-indicator-gradient-start-color: var(
        --sui-colors-warning-f
      );
      --sui-circular-progress-indicator-gradient-end-color: var(
        --sui-colors-danger-t0
      );
      --sui-circular-progress-indicator-track-bg: var(--sui-colors-neutral-b4);
    }
  .sui-circular-progress-indicator-indeterminate-success {
      --sui-circular-progress-indicator-gradient-start-color: var(
        --sui-colors-success-f
      );
      --sui-circular-progress-indicator-gradient-end-color: var(
        --sui-colors-primary-t0
      );
      --sui-circular-progress-indicator-track-bg: var(--sui-colors-neutral-b4);
    }
  .sui-circular-progress-indicator-determinate-progress-circle {
      stroke: var(--sui-circular-progress-indicator-bg);
    }
  .sui-circular-progress-indicator-determinate-primary {
      --sui-circular-progress-indicator-bg: var(--sui-colors-primary-f);
    }
  .sui-circular-progress-indicator-determinate-neutral {
      --sui-circular-progress-indicator-bg: var(--sui-colors-neutral-w0);
    }
  .sui-circular-progress-indicator-determinate-danger {
      --sui-circular-progress-indicator-bg: var(--sui-colors-danger-f);
    }
  .sui-circular-progress-indicator-determinate-warning {
      --sui-circular-progress-indicator-bg: var(--sui-colors-warning-f);
    }
  .sui-circular-progress-indicator-determinate-success {
      --sui-circular-progress-indicator-bg: var(--sui-colors-success-f);
    }

.sui-button-root {

    position: relative;

    cursor: pointer;

    user-select: none;

    vertical-align: middle;

    text-decoration-line: none;

    outline: 2px solid transparent;

    outline-offset: 2px;

    display: inline-flex;

    align-items: center;

    justify-content: flex-start;
}@media (prefers-reduced-motion: no-preference) {.sui-button-root {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

        transition-duration: 150ms;

        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
    }
}.sui-button-root {

    color: var(--sui-button-text-color);
  }

    .sui-button-root.sui-disabled {

    pointer-events: none;
}

    .sui-button-root.sui-disabled .sui-button-loading-indicator {

    opacity: 0.2;
}
  /* Sizes */
  .sui-button-xlarge {

    font-size: var(--sui-typography-title-font-size);

    font-weight: var(--sui-typography-title-font-weight);

    letter-spacing: var(--sui-typography-title-letter-spacing);

    line-height: var(--sui-typography-title-line-height);

    text-decoration: var(--sui-typography-title-text-decoration);

    text-transform: var(--sui-typography-title-text-transform);

    font-family: var(--sui-font-family);

    height: var(--sui-spacing-12);

    max-width: var(--sui-spacing-86);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

    --sui-button-slot-gap: var(--sui-spacing-2);
}
  .sui-button-large {

    font-size: var(--sui-typography-subtitle-font-size);

    font-weight: var(--sui-typography-subtitle-font-weight);

    line-height: var(--sui-typography-subtitle-line-height);

    text-decoration: var(--sui-typography-subtitle-text-decoration);

    text-transform: var(--sui-typography-subtitle-text-transform);

    font-family: var(--sui-font-family);

    height: var(--sui-spacing-9);

    max-width: var(--sui-spacing-86);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

    --sui-button-slot-gap: var(--sui-spacing-2);
}
  .sui-button-medium {

    font-size: var(--sui-typography-subtitle-mini-font-size);

    font-weight: var(--sui-typography-subtitle-mini-font-weight);

    line-height: var(--sui-typography-subtitle-mini-line-height);

    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

    text-transform: var(--sui-typography-subtitle-mini-text-transform);

    font-family: var(--sui-font-family);

    height: var(--sui-spacing-8);

    max-width: var(--sui-spacing-80);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

    --sui-button-slot-gap: var(--sui-spacing-1\.5);
}
  .sui-button-small {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);

    height: var(--sui-spacing-6);

    max-width: var(--sui-spacing-80);

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

    --sui-button-slot-gap: var(--sui-spacing-1);
}
  .sui-button-xsmall {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);

    height: var(--sui-spacing-5);

    max-width: var(--sui-spacing-80);

    line-height: 1;

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

    --sui-button-slot-gap: var(--sui-spacing-1);
}
  .sui-button-contained-xlarge,
  .sui-button-outlined-xlarge,
  .sui-button-inverted-xlarge {

    padding-left: var(--sui-spacing-4\.5);

    padding-right: var(--sui-spacing-4\.5);

    --sui-button-has-slot-x-padding: var(--sui-spacing-3);
}
  .sui-button-contained-large,
  .sui-button-outlined-large,
  .sui-button-inverted-large {

    padding-left: var(--sui-spacing-4);

    padding-right: var(--sui-spacing-4);

    --sui-button-has-slot-x-padding: var(--sui-spacing-2\.5);
}
  .sui-button-contained-medium,
  .sui-button-outlined-medium,
  .sui-button-inverted-medium {

    padding-left: var(--sui-spacing-3);

    padding-right: var(--sui-spacing-3);

    --sui-button-has-slot-x-padding: var(--sui-spacing-2);
}
  .sui-button-contained-small,
  .sui-button-outlined-small,
  .sui-button-inverted-small {

    padding-left: var(--sui-spacing-2\.5);

    padding-right: var(--sui-spacing-2\.5);

    --sui-button-has-slot-x-padding: var(--sui-spacing-1\.5);
}
  .sui-button-contained-xsmall,
  .sui-button-outlined-xsmall,
  .sui-button-inverted-xsmall {

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);

    --sui-button-has-slot-x-padding: var(--sui-spacing-1);
}
  /* States */
  .sui-button-loading {

    pointer-events: none;
}
  .sui-button-content {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;
}
  /*
   * Focus @NOTE must be declared before any colors/variants in case they customize the focus ring
   */
  .sui-button-contained:focus-visible,
    .sui-button-contained.sui-focus-visible,
    .sui-button-outlined:focus-visible,
    .sui-button-outlined.sui-focus-visible,
    .sui-button-inverted:focus-visible,
    .sui-button-inverted.sui-focus-visible,
    .sui-button-text:focus-visible,
    .sui-button-text.sui-focus-visible {

    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}
  .sui-button-contained:focus-visible::after,
    .sui-button-contained.sui-focus-visible::after,
    .sui-button-outlined:focus-visible::after,
    .sui-button-outlined.sui-focus-visible::after,
    .sui-button-inverted:focus-visible::after,
    .sui-button-inverted.sui-focus-visible::after,
    .sui-button-text:focus-visible::after,
    .sui-button-text.sui-focus-visible::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  /* Variants */
  .sui-button-contained,
  .sui-button-outlined {
    background-color: var(--sui-button-bg-color);
    border-color: var(--sui-button-border-color);
  }
  @media (hover: hover) {
  .sui-button-contained:hover, .sui-button-outlined:hover {
      background-color: var(--sui-button-bg-color-hover);
      color: var(--sui-button-text-color-hover);
      border-color: var(--sui-button-border-color-hover);
    }
}
  .sui-button-contained:active, .sui-button-outlined:active {
      background-color: var(--sui-button-bg-color-active);
      color: var(--sui-button-text-color-active);
      border-color: var(--sui-button-border-color-active);
    }
  .sui-button-contained.sui-disabled, .sui-button-outlined.sui-disabled {
      background-color: var(--sui-button-bg-color-disabled);
      color: var(--sui-button-text-color-disabled);
      border-color: var(--sui-button-border-color-disabled);
    }
  .sui-button-contained {

    border-style: solid;

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    --sui-button-border-color: transparent;
    --sui-button-border-color-hover: var(--sui-button-border-color);
    --sui-button-border-color-active: var(--sui-button-border-color);
    --sui-button-border-color-disabled: transparent;
}
  .sui-button-contained-primary {
      --sui-button-bg-color: var(--sui-colors-primary-b);
      --sui-button-bg-color-hover: var(--sui-colors-primary-b-high-contrast);
      --sui-button-bg-color-active: var(--sui-colors-neutral-high-contrast-w0);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b3);
      --sui-button-text-color: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-active: var(
        --sui-colors-neutral-high-contrast-b0
      );
      --sui-button-text-color-disabled: var(--sui-colors-neutral-w0);
    }
  .sui-button-contained-secondary {
      --sui-button-bg-color: var(--sui-colors-neutral-base);
      --sui-button-bg-color-hover: var(--sui-colors-neutral-b5);
      --sui-button-bg-color-active: var(--sui-colors-neutral-b3);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-base);
      --sui-button-text-color: var(--sui-colors-neutral-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);
      --sui-button-border-color: var(--sui-colors-neutral-high-contrast);
    }
  .sui-button-contained-neutral {
      --sui-button-bg-color: var(--sui-colors-neutral-b0-t10);
      --sui-button-bg-color-hover: var(--sui-colors-neutral-b0-t20);
      --sui-button-bg-color-active: var(--sui-colors-neutral-b0-t30);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b0-t10);
      --sui-button-text-color: var(--sui-colors-neutral-b1);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);
    }
  .sui-button-contained-danger {
      --sui-button-bg-color: var(--sui-colors-danger);
      --sui-button-bg-color-hover: var(--sui-colors-danger-high-contrast);
      --sui-button-bg-color-active: var(--sui-colors-neutral-high-contrast-w0);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b3);
      --sui-button-text-color: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-active: var(
        --sui-colors-neutral-high-contrast-b0
      );
      --sui-button-text-color-disabled: var(--sui-colors-neutral-w0);
    }
  .sui-button-contained-warning {
      --sui-button-bg-color: var(--sui-colors-warning);
      --sui-button-bg-color-hover: var(--sui-colors-warning-high-contrast);
      --sui-button-bg-color-active: var(--sui-colors-neutral-high-contrast-w0);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b3);
      --sui-button-text-color: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-active: var(
        --sui-colors-neutral-high-contrast-b0
      );
      --sui-button-text-color-disabled: var(--sui-colors-neutral-w0);
    }
  .sui-button-contained-success {
      --sui-button-bg-color: var(--sui-colors-success);
      --sui-button-bg-color-hover: var(--sui-colors-success-high-contrast);
      --sui-button-bg-color-active: var(--sui-colors-neutral-high-contrast-w0);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b3);
      --sui-button-text-color: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-high-contrast-b0);
      --sui-button-text-color-active: var(
        --sui-colors-neutral-high-contrast-b0
      );
      --sui-button-text-color-disabled: var(--sui-colors-neutral-w0);
    }
  .sui-button-contained-hide-background {
      --sui-button-border-color: transparent;
    }
  .sui-button-outlined {

    border-style: solid;

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    --sui-button-bg-color: var(--sui-colors-neutral-base);
    --sui-button-bg-color-hover: var(--sui-colors-neutral-b5);
    --sui-button-bg-color-active: var(--sui-colors-neutral-b3);
    --sui-button-bg-color-disabled: var(--sui-button-bg-color);
    --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);
    --sui-button-border-color-active: var(--sui-colors-neutral-b0);
    --sui-button-border-color-disabled: var(--sui-colors-neutral-b0-t20);

    border-color: var(--sui-button-border-color);
}
  @media (hover: hover) {
  .sui-button-outlined:hover {
      border-color: var(--sui-button-border-color-hover);
    }
}
  .sui-button-outlined:active {
      border-color: var(--sui-button-border-color-active);
    }
  .sui-button-outlined.sui-disabled {
      border-color: var(--sui-button-border-color-disabled);
    }
  .sui-button-outlined-primary {
      --sui-button-text-color: var(--sui-colors-primary-f);
      --sui-button-text-color-hover: var(--sui-colors-primary-f-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-border-color: var(--sui-colors-primary-f);
      --sui-button-border-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
    }
  .sui-button-outlined-secondary {
      --sui-button-text-color: var(--sui-colors-neutral-b0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-border-color: var(--sui-colors-neutral-b0-t20);
      --sui-button-border-color-hover: var(--sui-colors-neutral-b0-t30);
      --sui-button-border-color-active: var(--sui-colors-neutral-b0-t50);
    }
  .sui-button-outlined-neutral {
      --sui-button-text-color: var(--sui-colors-neutral-b1);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-bg-color-hover: var(--sui-colors-neutral-b0-t10);
      --sui-button-bg-color-active: var(--sui-colors-neutral-b0-t20);
      --sui-button-border-color: var(--sui-colors-neutral-b0-t20);
      --sui-button-border-color-hover: var(--sui-colors-neutral-b0-t30);
      --sui-button-border-color-active: var(--sui-colors-neutral-b0-t50);
    }
  .sui-button-outlined-danger {
      --sui-button-text-color: var(--sui-colors-danger-f);
      --sui-button-text-color-hover: var(--sui-colors-danger-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-border-color: var(--sui-colors-danger-f);
      --sui-button-border-color-hover: var(--sui-colors-danger-high-contrast);
    }
  .sui-button-outlined-warning {
      --sui-button-text-color: var(--sui-colors-warning-f);
      --sui-button-text-color-hover: var(--sui-colors-warning-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-border-color: var(--sui-colors-warning-f);
      --sui-button-border-color-hover: var(--sui-colors-warning-high-contrast);
    }
  .sui-button-outlined-success {
      --sui-button-text-color: var(--sui-colors-success-f);
      --sui-button-text-color-hover: var(--sui-colors-success-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-border-color: var(--sui-colors-success-f);
      --sui-button-border-color-hover: var(--sui-colors-success-high-contrast);
    }
  .sui-button-text {

    border-style: none;

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1);

    --sui-focus-ring-border-width-recoup: 0;

    background-color: transparent;

    --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);
    --sui-button-has-slot-x-padding: var(--sui-spacing-1);
}
  @media (hover: hover) {
  .sui-button-text:hover {
      color: var(--sui-button-text-color-hover);
    }
}
  .sui-button-text:active {
      color: var(--sui-button-text-color-active);
    }
  .sui-button-text.sui-disabled {
      color: var(--sui-button-text-color-disabled);
    }
  .sui-button-text-primary {
      --sui-button-text-color: var(--sui-colors-primary-f);
      --sui-button-text-color-hover: var(--sui-colors-primary-f-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-text-secondary {
      --sui-button-text-color: var(--sui-colors-neutral-b0);
      --sui-button-text-color-hover: var(--sui-colors-primary-f-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-text-neutral {
      --sui-button-text-color: var(--sui-colors-neutral-b1);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-text-danger {
      --sui-button-text-color: var(--sui-colors-danger-f);
      --sui-button-text-color-hover: var(--sui-colors-danger-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-text-warning {
      --sui-button-text-color: var(--sui-colors-warning-f);
      --sui-button-text-color-hover: var(--sui-colors-warning-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-text-success {
      --sui-button-text-color: var(--sui-colors-success-f);
      --sui-button-text-color-hover: var(--sui-colors-success-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-inverted {

    border-color: transparent;

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);

    background-color: var(--sui-button-bg-color);
    color: var(--sui-button-text-color);
}
  @media (hover: hover) {
  .sui-button-inverted:hover {
      background-color: var(--sui-button-bg-color-hover);
      color: var(--sui-button-text-color-hover);
    }
}
  .sui-button-inverted:active {
      background-color: var(--sui-button-bg-color-active);
      color: var(--sui-button-text-color-active);
    }
  .sui-button-inverted.sui-disabled {
      background-color: var(--sui-button-bg-color-disabled);
      color: var(--sui-button-text-color-disabled);
    }
  .sui-button-inverted-primary {
      --sui-button-bg-color: var(--sui-colors-primary-t10);
      --sui-button-bg-color-hover: var(--sui-colors-primary-b-t20);
      --sui-button-bg-color-active: var(--sui-colors-primary-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b4-t50);
      --sui-button-text-color: var(--sui-colors-primary-f);
      --sui-button-text-color-hover: var(--sui-colors-primary-f-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-inverted-secondary {
      --sui-button-bg-color: var(--sui-colors-neutral-w0-t10);
      --sui-button-bg-color-hover: var(--sui-colors-neutral-w0-t20);
      --sui-button-bg-color-active: var(--sui-colors-neutral-w0-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-w0-t10);
      --sui-button-text-color: var(--sui-colors-neutral-w0);
      --sui-button-text-color-hover: var(--sui-colors-neutral-w0);
      --sui-button-text-color-active: var(--sui-colors-neutral-w0);
      --sui-button-text-color-disabled: var(--sui-colors-neutral-w0-t20);
    }
  .sui-button-inverted-secondary:focus-visible,
      .sui-button-inverted-secondary.sui-focus-visible {
        --sui-focus-ring-color: var(--sui-colors-neutral-w0);
      }
  .sui-button-inverted-neutral {
      --sui-button-bg-color: var(--sui-colors-neutral-b0-t10);
      --sui-button-bg-color-hover: var(--sui-colors-neutral-b0-t20);
      --sui-button-bg-color-active: var(--sui-colors-neutral-b0-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b0-t10);
      --sui-button-text-color: var(--sui-colors-neutral-b1);
      --sui-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-button-text-color-disabled: var(--sui-colors-neutral-b3);
    }
  .sui-button-inverted-danger {
      --sui-button-bg-color: var(--sui-colors-danger-t10);
      --sui-button-bg-color-hover: var(--sui-colors-danger-t20);
      --sui-button-bg-color-active: var(--sui-colors-danger-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b4-t50);
      --sui-button-text-color: var(--sui-colors-danger-f);
      --sui-button-text-color-hover: var(--sui-colors-danger-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-inverted-warning {
      --sui-button-bg-color: var(--sui-colors-warning-t10);
      --sui-button-bg-color-hover: var(--sui-colors-warning-t20);
      --sui-button-bg-color-active: var(--sui-colors-warning-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b4-t50);
      --sui-button-text-color: var(--sui-colors-warning-f);
      --sui-button-text-color-hover: var(--sui-colors-warning-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  .sui-button-inverted-success {
      --sui-button-bg-color: var(--sui-colors-success-t10);
      --sui-button-bg-color-hover: var(--sui-colors-success-t20);
      --sui-button-bg-color-active: var(--sui-colors-success-t10);
      --sui-button-bg-color-disabled: var(--sui-colors-neutral-b4-t50);
      --sui-button-text-color: var(--sui-colors-success-f);
      --sui-button-text-color-hover: var(--sui-colors-success-high-contrast);
      --sui-button-text-color-active: var(--sui-colors-neutral-b0);
    }
  /* Slots */
  .sui-button-start-slot {
    margin-right: var(--sui-button-slot-gap);
  }
  .sui-button-end-slot {
    margin-left: var(--sui-button-slot-gap);
  }
  .sui-button-has-start-slot {
    padding-left: var(--sui-button-has-slot-x-padding);
  }
  .sui-button-has-end-slot {
    padding-right: var(--sui-button-has-slot-x-padding);
  }
  .sui-button-hide-background {

    background-color: transparent;
}
  .sui-button-hide-background.sui-disabled {

    background-color: transparent;
}
  .sui-button-full-width {

    display: flex;

    width: 100%;

    max-width: none;

    justify-content: center;
}

/* stylelint-disable custom-property-pattern */
/* stylelint-disable color-function-notation */
.sui-icon-button-root {

    position: relative;

    box-sizing: border-box;

    display: inline-flex;

    cursor: pointer;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-style: none;

    text-decoration-line: none;

    outline: 2px solid transparent;

    outline-offset: 2px;

    --sui-focus-ring-border-width-recoup: 0;
}
@media (prefers-reduced-motion: no-preference) {
    .sui-icon-button-root {

        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
    }
}
.sui-icon-button-root.sui-disabled {

    pointer-events: none;
}
.sui-icon-button-label {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);

    margin-top: var(--sui-spacing-1);

    width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    text-align: center;
}
.sui-icon-button-circular {

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
.sui-icon-button-circular.focus-visible,
    .sui-icon-button-circular:focus-visible,
    .sui-icon-button-circular.sui-focus-visible,
    .sui-icon-button-rectangular.focus-visible,
    .sui-icon-button-rectangular:focus-visible,
    .sui-icon-button-rectangular.sui-focus-visible {

    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}
.sui-icon-button-circular.focus-visible::after,
    .sui-icon-button-circular:focus-visible::after,
    .sui-icon-button-circular.sui-focus-visible::after,
    .sui-icon-button-rectangular.focus-visible::after,
    .sui-icon-button-rectangular:focus-visible::after,
    .sui-icon-button-rectangular.sui-focus-visible::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
.sui-icon-button-contained {

    padding-left: var(--sui-spacing-0);

    padding-right: var(--sui-spacing-0);

    background-color: var(--sui-icon-button-bg-color);
    color: var(
      --sui-icon-button-text-color,
      var(--sui-colors-neutral-high-contrast-b0)
    );

    --sui-icon-button-bg-color-active: var(
      --sui-colors-neutral-high-contrast-w0
    );
    --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-b3);
    --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-base);
}
@media (hover: hover) {
.sui-icon-button-contained:hover {
      background-color: var(--sui-icon-button-bg-color-hover);
    }
}
.sui-icon-button-contained.sui-active,
    .sui-icon-button-contained:active {
      background-color: var(
        --sui-icon-button-bg-color-active,
        var(--sui-colors-neutral-high-contrast-w0)
      );
    }
@media (hover: hover) {
.sui-icon-button-contained:active:hover {
      background-color: var(
        --sui-icon-button-bg-color-active,
        var(--sui-colors-neutral-high-contrast-w0)
      );
    }
}
.sui-icon-button-contained.sui-disabled {

    border-style: none;

    --sui-focus-ring-border-width-recoup: 0;

      background-color: var(
        --sui-icon-button-bg-color-disabled,
        var(--sui-colors-neutral-b3)
      );
      color: var(
        --sui-icon-button-text-color-disabled,
        var(--sui-colors-neutral-base)
      );
}
.sui-icon-button-contained-squircle {
      --sui-icon-button-border-color: transparent;
      --sui-icon-button-border-color-hover: transparent;
      --sui-icon-button-border-color-active: transparent;
      --sui-icon-button-border-color-disabled: transparent;
    }
.sui-icon-button-contained-primary,
    .sui-icon-button-contained-success,
    .sui-icon-button-contained-danger,
    .sui-icon-button-contained-warning {
      --sui-squircle-label-bg-color: var(--sui-squircle-bg-color);
      --sui-squircle-label-bg-color-hover: var(--sui-squircle-bg-color-hover);
      --sui-squircle-label-bg-color-active: var(--sui-squircle-bg-color-active);
    }
.sui-icon-button-contained-primary {
      --sui-icon-button-bg-color: var(--sui-colors-primary-b);
      --sui-icon-button-bg-color-hover: var(
        --sui-colors-primary-b-high-contrast
      );
    }
.sui-icon-button-contained-success {
      --sui-icon-button-bg-color: var(--sui-colors-success);
      --sui-icon-button-bg-color-hover: var(--sui-colors-success-high-contrast);
    }
.sui-icon-button-contained-danger {
      --sui-icon-button-bg-color: var(--sui-colors-danger);
      --sui-icon-button-bg-color-hover: var(--sui-colors-danger-high-contrast);
    }
.sui-icon-button-contained-warning {
      --sui-icon-button-bg-color: var(--sui-colors-warning);
      --sui-icon-button-bg-color-hover: var(--sui-colors-warning-high-contrast);
    }
.sui-icon-button-contained-secondary {
      --sui-icon-button-bg-color: var(--sui-colors-neutral-base);
      --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-b5);
      --sui-icon-button-bg-color-active: var(--sui-colors-neutral-b3);
      --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-base);
      --sui-icon-button-text-color: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
      border-style: solid;
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--tw-border-opacity)));
      border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
    }
.sui-icon-button-contained-secondary.sui-squircle {

    border-style: none;

    --sui-focus-ring-border-width-recoup: 0;

        --sui-squircle-border-width: var(--sui-border-width-1);
        --sui-icon-button-border-color: var(--sui-colors-neutral-high-contrast);
        --sui-icon-button-border-color-hover: var(
          --sui-colors-neutral-high-contrast
        );
        --sui-icon-button-border-color-active: var(
          --sui-colors-neutral-high-contrast
        );
}
.sui-icon-button-contained-neutral {
      --sui-icon-button-bg-color: var(--sui-colors-neutral-b0-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-b0-t20);
      --sui-icon-button-bg-color-active: var(--sui-colors-neutral-b0-t30);
      --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-b0-t10);
      --sui-icon-button-text-color: var(--sui-colors-neutral-b1);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
    }
.sui-icon-button-contained-hide-background {

    border-style: none;

    background-color: transparent;

    --sui-focus-ring-border-width-recoup: 0;
}
.sui-icon-button-contained-hide-background.sui-disabled {

    background-color: transparent;
}
.sui-icon-button-outlined {

    border-style: solid;

    padding-left: var(--sui-spacing-0);

    padding-right: var(--sui-spacing-0);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    background-color: var(--sui-icon-button-bg-color);
    border-color: var(--sui-icon-button-border-color);
    color: var(
      --sui-icon-button-text-color,
      var(--sui-colors-neutral-static-w0)
    );

    --sui-icon-button-bg-color: var(--sui-colors-neutral-base);
    --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-b5);
    --sui-icon-button-bg-color-active: var(--sui-colors-neutral-b3);
    --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-base);
    --sui-icon-button-border-color-active: var(--sui-colors-neutral-b0);
    --sui-icon-button-border-color-disabled: var(--sui-colors-neutral-b0-t20);
    --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
}
@media (hover: hover) {
.sui-icon-button-outlined:hover {
      background-color: var(--sui-icon-button-bg-color-hover);
      border-color: var(--sui-icon-button-border-color-hover);
      color: var(--sui-icon-button-text-color-hover);
    }
}
.sui-icon-button-outlined.sui-active,
    .sui-icon-button-outlined:active {
      background-color: var(--sui-icon-button-bg-color-active);
      border-color: var(--sui-icon-button-border-color-active);
      color: var(--sui-icon-button-text-color-active);
    }
.sui-icon-button-outlined.sui-disabled {
      background-color: var(--sui-icon-button-bg-color-disabled);
      border-color: var(--sui-icon-button-border-color-disabled);
      color: var(--sui-icon-button-text-color-disabled);
    }
.sui-icon-button-outlined-primary {
      --sui-icon-button-border-color: var(--sui-colors-primary-f);
      --sui-icon-button-border-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
      --sui-icon-button-text-color: var(--sui-colors-primary-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
    }
.sui-icon-button-outlined-success {
      --sui-icon-button-border-color: var(--sui-colors-success-f);
      --sui-icon-button-border-color-hover: var(
        --sui-colors-success-high-contrast
      );
      --sui-icon-button-text-color: var(--sui-colors-success-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-success-high-contrast
      );
    }
.sui-icon-button-outlined-danger {
      --sui-icon-button-border-color: var(--sui-colors-danger-f);
      --sui-icon-button-border-color-hover: var(
        --sui-colors-danger-high-contrast
      );
      --sui-icon-button-text-color: var(--sui-colors-danger-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-danger-high-contrast
      );
    }
.sui-icon-button-outlined-warning {
      --sui-icon-button-border-color: var(--sui-colors-warning-f);
      --sui-icon-button-border-color-hover: var(
        --sui-colors-warning-high-contrast
      );
      --sui-icon-button-text-color: var(--sui-colors-warning-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-warning-high-contrast
      );
    }
.sui-icon-button-outlined-secondary {
      --sui-icon-button-border-color: var(--sui-colors-neutral-b0-t20);
      --sui-icon-button-border-color-hover: var(--sui-colors-neutral-b0-t30);
      --sui-icon-button-border-color-active: var(--sui-colors-neutral-b0-t50);
      --sui-icon-button-text-color: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-outlined-neutral {
      --sui-icon-button-text-color: var(--sui-colors-neutral-b1);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-b0-t10);
      --sui-icon-button-bg-color-active: var(--sui-colors-neutral-b0-t20);
      --sui-icon-button-border-color: var(--sui-colors-neutral-b0-t20);
      --sui-icon-button-border-color-hover: var(--sui-colors-neutral-b0-t30);
      --sui-icon-button-border-color-active: var(--sui-colors-neutral-b0-t50);
    }
.sui-icon-button-outlined-squircle {

    border-style: none;

    --sui-focus-ring-border-width-recoup: 0;

      --sui-squircle-border-width: var(--sui-border-width-1);
}
.sui-icon-button-outlined-hide-background {

    background-color: transparent;
}
.sui-icon-button-outlined-hide-background.sui-disabled {

    background-color: transparent;
}
.sui-icon-button-icon {

    background-color: transparent;

    padding-left: var(--sui-spacing-0);

    padding-right: var(--sui-spacing-0);

    color: var(--sui-icon-button-text-color);

    --sui-icon-button-bg-color: transparent;
    --sui-icon-button-bg-color-hover: transparent;
    --sui-icon-button-bg-color-active: transparent;
    --sui-icon-button-bg-color-disabled: transparent;
    --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
}
@media (hover: hover) {
.sui-icon-button-icon:hover {
      color: var(--sui-icon-button-text-color-hover);
    }
}
.sui-icon-button-icon.sui-active,
    .sui-icon-button-icon:active {
      color: var(--sui-icon-button-text-color-active);
    }
.sui-icon-button-icon.sui-disabled {
      color: var(--sui-icon-button-text-color-disabled);
    }
.sui-icon-button-icon-primary {
      --sui-icon-button-text-color: var(--sui-colors-primary-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-icon-success {
      --sui-icon-button-text-color: var(--sui-colors-success-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-success-high-contrast
      );
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-icon-danger {
      --sui-icon-button-text-color: var(--sui-colors-danger-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-danger-high-contrast
      );
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-icon-warning {
      --sui-icon-button-text-color: var(--sui-colors-warning-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-warning-high-contrast
      );
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-icon-secondary {
      --sui-icon-button-text-color: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-icon-neutral {
      --sui-icon-button-text-color: var(--sui-colors-neutral-b1);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
    }
.sui-icon-button-inverted {

    padding-left: var(--sui-spacing-0);

    padding-right: var(--sui-spacing-0);

    background-color: var(--sui-icon-button-bg-color);
    color: var(--sui-icon-button-text-color);

    --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-b4-t50);
    --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
    --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
}
@media (hover: hover) {
.sui-icon-button-inverted:hover {
      background-color: var(--sui-icon-button-bg-color-hover);
      color: var(--sui-icon-button-text-color-hover);
    }
}
.sui-icon-button-inverted.sui-active,
    .sui-icon-button-inverted:active {
      background-color: var(
        --sui-icon-button-bg-color-active,
        var(--sui-icon-button-bg-color)
      );
      color: var(--sui-icon-button-text-color-active);
    }
.sui-icon-button-inverted.sui-disabled {
      background-color: var(--sui-icon-button-bg-color-disabled);
      color: var(--sui-icon-button-text-color-disabled);
    }
.sui-icon-button-inverted-primary {
      --sui-icon-button-bg-color: var(--sui-colors-primary-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-primary-b-t20);
      --sui-icon-button-text-color: var(--sui-colors-primary-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-primary-f-high-contrast
      );
    }
.sui-icon-button-inverted-success {
      --sui-icon-button-bg-color: var(--sui-colors-success-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-success-t20);
      --sui-icon-button-text-color: var(--sui-colors-success-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-success-high-contrast
      );
    }
.sui-icon-button-inverted-danger {
      --sui-icon-button-bg-color: var(--sui-colors-danger-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-danger-t20);
      --sui-icon-button-text-color: var(--sui-colors-danger-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-danger-high-contrast
      );
    }
.sui-icon-button-inverted-warning {
      --sui-icon-button-bg-color: var(--sui-colors-warning-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-warning-t20);
      --sui-icon-button-text-color: var(--sui-colors-warning-f);
      --sui-icon-button-text-color-hover: var(
        --sui-colors-warning-high-contrast
      );
    }
.sui-icon-button-inverted-secondary {
      --sui-icon-button-bg-color: var(--sui-colors-neutral-w0-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-w0-t20);
      --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-w0-t10);
      --sui-icon-button-text-color: var(--sui-colors-neutral-w0);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-w0);
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-w0);
      --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-w0-t20);
    }
.sui-icon-button-inverted-secondary:focus-visible,
      .sui-icon-button-inverted-secondary.sui-focus-visible {
        --sui-focus-ring-color: var(--sui-colors-neutral-w0);
        --sui-squircle-ring-color: var(--sui-colors-neutral-w0);
      }
.sui-icon-button-inverted-neutral {
      --sui-icon-button-bg-color: var(--sui-colors-neutral-b0-t10);
      --sui-icon-button-bg-color-hover: var(--sui-colors-neutral-b0-t20);
      --sui-icon-button-bg-color-disabled: var(--sui-colors-neutral-b0-t10);
      --sui-icon-button-text-color: var(--sui-colors-neutral-b1);
      --sui-icon-button-text-color-hover: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-active: var(--sui-colors-neutral-b0);
      --sui-icon-button-text-color-disabled: var(--sui-colors-neutral-b3);
    }
.sui-icon-button-inverted-squircle {
      --sui-icon-button-border-color: transparent;
      --sui-icon-button-border-color-hover: transparent;
      --sui-icon-button-border-color-active: transparent;
      --sui-icon-button-bg-color-active: var(--sui-icon-button-bg-color);
    }
.sui-icon-button-inverted-hide-background {

    background-color: transparent;
}
.sui-icon-button-inverted-hide-background.sui-disabled {

    background-color: transparent;
}
.sui-icon-button-rectangular {

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}
.sui-icon-button-squircle {

    background-color: transparent;

    --sui-squircle-bg-color: var(--sui-icon-button-bg-color);
    --sui-squircle-bg-color-hover: var(--sui-icon-button-bg-color-hover);
    --sui-squircle-bg-color-active: var(--sui-icon-button-bg-color-active);
    --sui-squircle-border-color: var(--sui-icon-button-border-color);
    --sui-squircle-border-color-hover: var(
      --sui-icon-button-border-color-hover
    );
    --sui-squircle-border-color-active: var(
      --sui-icon-button-border-color-active
    );
}
.sui-icon-button-squircle.sui-disabled {
      --sui-squircle-bg-color: var(--sui-icon-button-bg-color-disabled);
      --sui-squircle-border-color: var(--sui-icon-button-border-color-disabled);

      color: var(--sui-icon-button-text-color-disabled);
    }
.sui-icon-button-squircle-hide-background {
      --sui-squircle-bg-color: transparent;
    }
@media (hover: hover) {
.sui-icon-button-squircle-hide-background:hover {
        --sui-squircle-bg-color: var(--sui-icon-button-bg-color);
        --sui-squircle-border-color: var(--sui-icon-button-border-color);
      }
}
.sui-icon-button-squircle-hide-background.sui-disabled {
        --sui-squircle-bg-color: transparent;
      }
.sui-icon-button-squircle.sui-active,
    .sui-icon-button-squircle:active,
    .sui-icon-button-squircle.sui-disabled {

    background-color: transparent;
}
@media (hover: hover) {
.sui-icon-button-squircle:hover,
    .sui-icon-button-squircle:active:hover {

        background-color: transparent;
    }
}
.sui-icon-button-squircle-label {
      transition: inherit;
      background-color: var(--sui-squircle-label-bg-color, transparent);
    }
@media (hover: hover) {
.sui-icon-button-squircle:hover .sui-icon-button-squircle-label {
      background-color: var(--sui-squircle-label-bg-color-hover, transparent);
    }
}
.sui-icon-button-squircle.sui-active .sui-icon-button-squircle-label,
    .sui-icon-button-squircle:active .sui-icon-button-squircle-label {
      background-color: var(--sui-squircle-label-bg-color-active, transparent);
    }
.sui-icon-button-xsmall {

    padding-left: var(--sui-spacing-0\.5);

    padding-right: var(--sui-spacing-0\.5);
}
.sui-icon-button-xsmall-circular,
    .sui-icon-button-xsmall-inverted,
    .sui-icon-button-xsmall-squircle,
    .sui-icon-button-xsmall-rectangular {

    height: var(--sui-spacing-5);

    width: var(--sui-spacing-5);
}
.sui-icon-button-small {

    padding-left: var(--sui-spacing-0\.5);

    padding-right: var(--sui-spacing-0\.5);
}
.sui-icon-button-small-circular,
    .sui-icon-button-small-inverted,
    .sui-icon-button-small-squircle,
    .sui-icon-button-small-rectangular {

    height: var(--sui-spacing-6);

    width: var(--sui-spacing-6);
}
.sui-icon-button-small-rectangular,
  .sui-icon-button-xsmall-rectangular {

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}
.sui-icon-button-medium {

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1);
}
.sui-icon-button-medium-circular,
    .sui-icon-button-medium-inverted,
    .sui-icon-button-medium-squircle,
    .sui-icon-button-medium-rectangular {

    height: var(--sui-spacing-8);

    width: var(--sui-spacing-8);
}
.sui-icon-button-large {

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1);
}
.sui-icon-button-large-circular,
    .sui-icon-button-large-inverted,
    .sui-icon-button-large-squircle,
    .sui-icon-button-large-rectangular {

    height: var(--sui-spacing-9);

    width: var(--sui-spacing-9);
}
.sui-icon-button-xlarge {

    padding-left: var(--sui-spacing-1\.5);

    padding-right: var(--sui-spacing-1\.5);
}
.sui-icon-button-xlarge-circular,
    .sui-icon-button-xlarge-inverted,
    .sui-icon-button-xlarge-squircle,
    .sui-icon-button-xlarge-rectangular {

    height: var(--sui-spacing-12);

    width: var(--sui-spacing-12);
}
.sui-icon-button-xxlarge {

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);
}
.sui-icon-button-xxlarge-circular,
    .sui-icon-button-xxlarge-inverted,
    .sui-icon-button-xxlarge-squircle {

    height: var(--sui-spacing-14);

    width: var(--sui-spacing-14);
}
.sui-icon-button-xxlarge-label {

    max-width: var(--sui-spacing-14);
}
.sui-icon-button-xxlarge-rectangular {

    height: var(--sui-spacing-14);

    min-width: var(--sui-spacing-14);

    max-width: var(--sui-spacing-64);
}
.sui-icon-button-xxlarge-rectangular-label {

    max-width: var(--sui-spacing-64);
}
.sui-icon-button-xxxlarge {

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);
}
.sui-icon-button-xxxlarge-label {

    max-width: var(--sui-spacing-16);
}
.sui-icon-button-xxxlarge-circular,
    .sui-icon-button-xxxlarge-inverted,
    .sui-icon-button-xxxlarge-squircle {

    height: var(--sui-spacing-16);

    width: var(--sui-spacing-16);
}
.sui-icon-button-xxxlarge-rectangular {

    height: var(--sui-spacing-16);

    min-width: var(--sui-spacing-16);

    max-width: var(--sui-spacing-64);
}
.sui-icon-button-xxxlarge-rectangular-label {

    max-width: var(--sui-spacing-64);
}

.sui-icon-button-outer-label-root {

    margin-top: var(--sui-spacing-0);

    display: inline-flex;

    user-select: none;

    flex-direction: column;

    align-items: center
}

.sui-icon-button-outer-label-text {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);

    margin-top: var(--sui-spacing-1);

    width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    white-space: pre-wrap;

    text-align: center
}

.sui-icon-button-group-root {
    display: inline-flex;
    align-items: center;
    gap: var(--sui-spacing-1);
    border-style: solid;
    border-color: transparent;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
    --tw-shadow: var(--sui-box-shadow-xs);
    --tw-shadow-colored: var(--sui-box-shadow-xs);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    border-radius: var(--sui-border-radius-lg);
    --sui-focus-ring-border-radius: var(--sui-border-radius-lg);
    border-width: var(--sui-border-width-1);
    --sui-focus-ring-border-width: var(--sui-border-width-1);
    --sui-focus-ring-border-width-recoup: 1
}
  .sui-icon-button-group-border {
    border-color: var(--sui-colors-neutral-b0-t20)
}
  .sui-icon-button-group-horizontal {
    flex-direction: row
}
  .sui-icon-button-group-vertical {
    flex-direction: column
}

.sui-divider-root {
    position: relative;
    display: block;
    overflow: visible;
    border-color: var(--sui-colors-neutral-b0-t10);
    border-width: var(--sui-border-width-0);
    --sui-focus-ring-border-width: var(--sui-border-width-0);
    border-style: solid;
    --sui-focus-ring-border-width-recoup: 1
}
  .sui-divider-horizontal {
    border-bottom-width: var(--sui-border-width-1)
}
  .sui-divider-horizontal::after {
    --tw-content: attr(data-title);
    content: var(--tw-content);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-divider-horizontal-has-title::after {
    position: absolute;
    left: 50%;
    top: 50%;
    --tw-translate-x: -50%;
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    font-size: var(--sui-typography-descriptor-mini-font-size);
    font-weight: var(--sui-typography-descriptor-mini-font-weight);
    line-height: var(--sui-typography-descriptor-mini-line-height);
    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
    text-transform: var(--sui-typography-descriptor-mini-text-transform);
    font-family: var(--sui-font-family);
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: var(--sui-spacing-4);
    padding-right: var(--sui-spacing-4);
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-divider-vertical {
    height: 100%;
    border-bottom-width: var(--sui-border-width-0);
    border-right-width: var(--sui-border-width-1)
}
  .sui-divider-flex-item {
    height: auto;
    align-self: stretch
}
  .sui-divider-full {
    margin: var(--sui-spacing-0)
}
  .sui-divider-middle-horizontal {
    margin-left: var(--sui-spacing-4);
    margin-right: var(--sui-spacing-4)
}
  .sui-divider-middle-vertical {
    margin-top: var(--sui-spacing-4);
    margin-bottom: var(--sui-spacing-4)
}

.sui-popover-popper {

    outline: 2px solid transparent;

    outline-offset: 2px
}

.sui-popover-paper {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm)
}

.sui-popover-paper[data-sui-popper-placement^='top'] .sui-popover-widget {

    transform-origin: bottom
}

.sui-popover-paper[data-sui-popper-placement^='bottom'] .sui-popover-widget {

    transform-origin: top
}

.sui-popover-paper[data-sui-popper-placement^='left'] .sui-popover-widget {

    transform-origin: right
}

.sui-popover-paper[data-sui-popper-placement^='right'] .sui-popover-widget {

    transform-origin: left
}

.sui-popover-bordered {

    border-style: solid;

    border-color: var(--sui-colors-neutral-b0-t20);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1
}

.sui-popover-shadow {

    --tw-shadow: var(--sui-box-shadow-md);

    --tw-shadow-colored: var(--sui-box-shadow-md);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-menu-paper {

    min-width: var(--sui-spacing-50);

    max-width: var(--sui-spacing-112);

    overflow: hidden;

    padding-top: var(--sui-spacing-2);

    padding-bottom: var(--sui-spacing-2)
}

/* Compact Mode */

:where(.sui-menu-root.sui-compact) .sui-menu-paper {

    min-width: var(--sui-spacing-25);

    padding-top: var(--sui-spacing-1);

    padding-bottom: var(--sui-spacing-1)
}

.sui-list-root {
    width: 100%;
    overflow: auto;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
    outline: 2px solid transparent;
    outline-offset: 2px
}

.sui-menu-item-container {

    position: relative;

    box-sizing: border-box;

    display: flex;

    min-height: var(--sui-spacing-10);

    user-select: none;

    align-items: center;

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);

    padding-top: var(--sui-spacing-2\.5);

    padding-bottom: var(--sui-spacing-2\.5);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}
  .sui-menu-item-select-indicator {

    margin-top: 0.5px;

    display: flex;

    align-items: center;

    align-self: flex-start;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

    opacity: 0;

    height: var(--sui-typography-subtitle-mini-line-height);
}
  .sui-menu-item-select-dot {

    display: flex;

    height: var(--sui-spacing-4);

    width: var(--sui-spacing-4);

    align-items: center;

    justify-content: center;
}
  .sui-menu-item-select-dot::after {

    height: var(--sui-spacing-1\.5);

    width: var(--sui-spacing-1\.5);

    background-color: currentColor;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

      content: '';
}
  .sui-menu-item-root {

    box-sizing: border-box;

    width: 100%;

    cursor: pointer;

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);

    outline: 2px solid transparent;

    outline-offset: 2px;

    font-size: var(--sui-typography-subtitle-mini-font-size);

    font-weight: var(--sui-typography-subtitle-mini-font-weight);

    line-height: var(--sui-typography-subtitle-mini-line-height);

    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

    text-transform: var(--sui-typography-subtitle-mini-text-transform);

    font-family: var(--sui-font-family);

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}
  @media (hover: hover) {
  .sui-menu-item-root:hover .sui-menu-item-container {

        --tw-bg-opacity: 1;

        background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
    }
}
  .sui-menu-item-root.sui-selected {

    font-size: var(--sui-typography-subtitle-mini-font-size);

    font-weight: var(--sui-typography-subtitle-mini-font-weight);

    line-height: var(--sui-typography-subtitle-mini-line-height);

    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

    text-transform: var(--sui-typography-subtitle-mini-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-menu-item-root.sui-selected .sui-menu-item-select-indicator {

    opacity: 1;
}
  .sui-menu-item-root.sui-disabled {

    pointer-events: none;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-menu-item-root.sui-disabled.sui-spruno .sui-list-item-text > span {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-menu-item-root.sui-disabled .sui-menu-item-select-indicator {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-menu-item-root.sui-focus-visible,
    .sui-menu-item-root.sui-focused {

    outline: 2px solid transparent;

    outline-offset: 2px;
}
  .sui-menu-item-root.sui-focus-visible .sui-menu-item-container, .sui-menu-item-root.sui-focused .sui-menu-item-container {

    --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}
  .sui-menu-item-root.sui-focus-visible .sui-menu-item-container::after, .sui-menu-item-root.sui-focused .sui-menu-item-container::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: var(--sui-focus-ring-border-radius, 0px);

    box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}
  .sui-menu-item-root.sui-focus-visible .sui-menu-item-container, .sui-menu-item-root.sui-focused .sui-menu-item-container {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-menu-item-root:not(:focus-within):active .sui-menu-item-container, .sui-menu-item-root:not(:focus-within).sui-active .sui-menu-item-container, .sui-menu-item-root:focus:active .sui-menu-item-container, .sui-menu-item-root:focus.sui-active .sui-menu-item-container, .sui-menu-item-root.sui-focused:active .sui-menu-item-container, .sui-menu-item-root.sui-focused.sui-active .sui-menu-item-container {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-menu-item-nowrap .sui-menu-item-container {

    height: var(--sui-spacing-10);

    padding-top: var(--sui-spacing-0);

    padding-bottom: var(--sui-spacing-0);
}
  .sui-menu-item-nowrap .sui-menu-item-select-indicator {

    align-self: center;
}
  .sui-menu-item-nowrap .sui-menu-item-text {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;
}
  .sui-menu-item-selectable {

    font-size: var(--sui-typography-main-text-font-size);

    font-weight: var(--sui-typography-main-text-font-weight);

    line-height: var(--sui-typography-main-text-line-height);

    text-decoration: var(--sui-typography-main-text-text-decoration);

    text-transform: var(--sui-typography-main-text-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-menu-item-highlighted .sui-menu-item-container {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
}
  /* Compact Mode */
  .sui-menu-item-root:where(.sui-compact) {

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1);
}
  :where(.sui-menu-item.sui-compact) .sui-menu-item-container {

    min-height: var(--sui-spacing-8);

    padding-top: var(--sui-spacing-1\.5);

    padding-bottom: var(--sui-spacing-1\.5);

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}
  .sui-menu-item-nowrap:where(.sui-menu-item.sui-compact) .sui-menu-item-container {

    height: var(--sui-spacing-8);
}

.sui-menu-list-root {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-virtualized-menu-paper {
    min-width: var(--sui-spacing-50);
    max-width: var(--sui-spacing-112);
    overflow: hidden;
}

.sui-virtualized-menu-paper-content-container {
    width: 100%;
}

.sui-virtualized-menu-list::before {
    content: '';
    display: block;
    height: var(--sui-virtualized-menu-vertical-padding, 0px);
    width: 0;
  }

.sui-virtualized-menu-list::after {
    content: '';
    display: block;
    height: var(--sui-virtualized-menu-vertical-padding, 0px);
    width: 0;
  }

.sui-select-chevron {

  height: var(--sui-spacing-6);

  width: var(--sui-spacing-6);

  flex-shrink: 0;

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

  --sui-squircle-bg-color: transparent;

  --sui-squircle-border-color: transparent;

  --sui-squircle-border-width: var(--sui-border-width-0)
}

.sui-select-placeholder {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

@media (prefers-reduced-motion: no-preference) {

  .sui-select-placeholder {

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    transition-duration: 150ms;

    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}

.sui-select-placeholder,
.sui-select-value {

  font-size: var(--sui-typography-main-text-font-size);

  font-weight: var(--sui-typography-main-text-font-weight);

  line-height: var(--sui-typography-main-text-line-height);

  text-decoration: var(--sui-typography-main-text-text-decoration);

  text-transform: var(--sui-typography-main-text-text-transform);

  font-family: var(--sui-font-family);

  flex-grow: 1;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  text-align: left
}

.sui-select-value {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-select-error .sui-select-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-text-opacity)))
}

.sui-select-selector {

  display: flex;

  cursor: pointer;

  align-items: center;

  justify-content: flex-start;

  height: 100%;

  width: 100%;

  min-width: var(--sui-spacing-24);

  padding: var(--sui-spacing-0);

  outline: 2px solid transparent;

  outline-offset: 2px;

  border-style: none;

  background-color: transparent;

  --sui-focus-ring-border-width-recoup: 0
}

.sui-select-menu {

  max-width: none
}

.sui-select-native-input {

  display: none
}

.sui-select-content {

  padding: var(--sui-spacing-0)
}

.sui-select-outlined-selector-xlarge, .sui-select-contained-selector-xlarge {

  padding-left: var(--sui-spacing-4);

  padding-right: var(--sui-spacing-3)
}

.sui-select-outlined-selector-large, .sui-select-contained-selector-large {

  padding-left: var(--sui-spacing-3);

  padding-right: var(--sui-spacing-2)
}

.sui-select-outlined-selector-medium, .sui-select-contained-selector-medium {

  padding-left: var(--sui-spacing-2\.5);

  padding-right: var(--sui-spacing-1\.5)
}

@media (prefers-reduced-motion: no-preference) {

  .sui-select-outlined-selector, .sui-select-contained-selector {

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    transition-duration: 150ms;

    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
  }
}

.sui-select-outlined-selector.sui-expanded {

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-select-outlined-selector.sui-expanded .sui-select-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)));

  --s-squircle-bg-color-opacity: 1;

  --sui-squircle-bg-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--s-squircle-bg-color-opacity)))
}

.sui-select-error .sui-select-contained-selector.sui-expanded {

  background-color: transparent
}

.sui-select-error .sui-select-contained-selector.sui-expanded .sui-select-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-select-contained-selector.sui-expanded {

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-select-contained-selector.sui-expanded .sui-select-chevron {

  --s-squircle-bg-color-opacity: 1;

  --sui-squircle-bg-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--s-squircle-bg-color-opacity)))
}

.sui-select-standard-selector.sui-expanded .sui-select-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)))
}

.sui-select-root {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

@media (hover: hover) {

.sui-select-root:hover .sui-select-placeholder {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
  }
}

.sui-select-root.sui-disabled .sui-select-selector {

  pointer-events: none
}

.sui-select-root.sui-disabled .sui-select-selector,
    .sui-select-root.sui-disabled .sui-select-placeholder,
    .sui-select-root.sui-disabled .sui-select-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-select-root.sui-disabled .sui-select-value {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-split-button-root {
      position: relative;
      display: inline-flex;
}
  .sui-split-button-bg {
      position: absolute;
      inset: var(--sui-spacing-0);
      box-sizing: border-box;
      padding-left: var(--sui-spacing-0);
      padding-right: var(--sui-spacing-0);
}
  .sui-split-button-bg.sui-button-outlined {
      border-color: transparent;
}
  .sui-split-button-action-button-root {
      border-top-right-radius: var(--sui-border-radius-none);
      border-bottom-right-radius: var(--sui-border-radius-none);
      border-right-width: var(--sui-border-width-0);
}
  .sui-split-button-action-button-root:focus-visible::after,
    .sui-split-button-action-button-root.sui-focus-visible::after {
      border-top-right-radius: var(--sui-border-radius-none);
      border-bottom-right-radius: var(--sui-border-radius-none);
}
  .sui-split-button-divider-contained-primary,
    .sui-split-button-divider-contained-danger,
    .sui-split-button-divider-contained-warning,
    .sui-split-button-divider-contained-success {
      border-color: var(--sui-colors-neutral-w0-t20);
}
  .sui-split-button-divider-contained-secondary,
    .sui-split-button-divider-contained-neutral {
      border-color: var(--sui-colors-neutral-b0-t10);
}
  .sui-split-button-divider-inverted-primary,
    .sui-split-button-divider-outlined-primary {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-inverted-danger,
    .sui-split-button-divider-outlined-danger {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-inverted-warning,
    .sui-split-button-divider-outlined-warning {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-inverted-success,
    .sui-split-button-divider-outlined-success {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-inverted-secondary,
    .sui-split-button-divider-inverted-neutral {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-outlined-primary.sui-disabled,
    .sui-split-button-divider-outlined-danger.sui-disabled,
    .sui-split-button-divider-outlined-warning.sui-disabled,
    .sui-split-button-divider-outlined-success.sui-disabled,
    .sui-split-button-divider-outlined-secondary,
    .sui-split-button-divider-outlined-neutral {
      border-color: var(--sui-colors-neutral-b0-t20);
}
  .sui-split-button-divider-inverted-primary.sui-disabled,
    .sui-split-button-divider-inverted-danger.sui-disabled,
    .sui-split-button-divider-inverted-warning.sui-disabled,
    .sui-split-button-divider-inverted-success.sui-disabled,
    .sui-split-button-divider-inverted-neutral.sui-disabled {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-inverted-secondary.sui-disabled {
      border-color: var(--sui-colors-neutral-w0-t20);
}
  .sui-split-button-divider-inverted-neutral {
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-border-opacity)));
}
  .sui-split-button-divider-text,
    .sui-split-button-divider-text.sui-disabled {
      visibility: hidden;
}
  .sui-split-button-menu-button-root {
      width: auto;
      border-top-left-radius: var(--sui-border-radius-none);
      border-bottom-left-radius: var(--sui-border-radius-none);
      border-left-width: var(--sui-border-width-0);
}
  .sui-split-button-menu-button-root:focus-visible::after,
    .sui-split-button-menu-button-root.sui-focus-visible::after {
      border-top-left-radius: var(--sui-border-radius-none);
      border-bottom-left-radius: var(--sui-border-radius-none);
}
  .sui-split-button-menu-button-root.sui-disabled {
      /* We use hideBackground on the IconButton and instead put a button BG div behind,
      so the button visually does have a background. This means we need to reset the
      text color to its usual non-hideBackground color */
      color: var(--sui-icon-button-text-color-disabled);
    }

.sui-fab-button-root {

    cursor: pointer;

    user-select: none;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-style: none;

    background-color: transparent;

    --sui-focus-ring-border-width-recoup: 0;

    /* default */

    --s-squircle-bg-color-opacity: 1;

    --sui-squircle-bg-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--s-squircle-bg-color-opacity)));

    --sui-squircle-border-color: var(--sui-squircle-fill);

    /* hover */

    --s-squircle-bg-color-hover-opacity: 1;

    --sui-squircle-bg-color-hover: rgb(var(--s-primary-b-high-contrast), calc(var(--s-primary-b-high-contrast-opacity, 1) * var(--s-squircle-bg-color-hover-opacity)));

    --sui-squircle-border-color-hover: var(--sui-colors-primary-t0);

    --s-squircle-bg-color-active-opacity: 1;

    --sui-squircle-bg-color-active: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--s-squircle-bg-color-active-opacity)));

    /* focus */

    --s-squircle-ring-color-opacity: 1;

    --sui-squircle-ring-color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--s-squircle-ring-color-opacity)));

    --sui-squircle-ring-offset: var(--sui-border-width-2);

    --sui-squircle-ring-width: var(--sui-border-width-2)
}
  .sui-fab-button-large {

    height: var(--sui-spacing-12);

    width: var(--sui-spacing-12)
}
  .sui-fab-button-small {

    height: var(--sui-spacing-8);

    width: var(--sui-spacing-8)
}
  .sui-fab-button-activated {

    --tw-text-opacity: 1;

    color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)));

    --s-squircle-bg-color-opacity: 1;

    --sui-squircle-bg-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--s-squircle-bg-color-opacity)));

    --s-squircle-border-color-opacity: 1;

    --sui-squircle-border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--s-squircle-border-color-opacity)));

    --sui-squircle-border-width: var(--sui-border-width-1\.2);

    /* hover */

    --s-squircle-bg-color-hover-opacity: 1;

    --sui-squircle-bg-color-hover: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--s-squircle-bg-color-hover-opacity)));

    --s-squircle-border-color-hover-opacity: 1;

    --sui-squircle-border-color-hover: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--s-squircle-border-color-hover-opacity)));

    /* pressed */

    --s-squircle-bg-color-active-opacity: 1;

    --sui-squircle-bg-color-active: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--s-squircle-bg-color-active-opacity)))
}
  @media (hover: hover) {
  .sui-fab-button-activated:hover {

        --tw-text-opacity: 1;

        color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)))
    }
}
  .sui-fab-button-activated.sui-active,
    .sui-fab-button-activated:active {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-call-button-end svg {
    transform: rotate(135deg);
  }

.sui-checkbox-input {

    position: absolute;

    inset: var(--sui-spacing-0);

    margin: var(--sui-spacing-0);

    height: 100%;

    width: 100%;

    cursor: pointer;

    opacity: 0;
}
  .sui-checkbox-root {

    position: relative;

    display: inline-flex;

    height: var(--sui-spacing-5);

    width: var(--sui-spacing-5);

    flex: none;

    align-items: center;

    justify-content: center;

    vertical-align: middle;

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

    box-sizing: border-box;

    border-style: none;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));

    --sui-focus-ring-border-width-recoup: 0;
}
  @media (prefers-reduced-motion: no-preference) {
    .sui-checkbox-root {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

        transition-duration: 300ms;
    }
}
  .sui-checkbox-root {

    --sui-checkbox-bg-color: var(--sui-colors-neutral-base);
    --sui-checkbox-bg-color-hover: var(--sui-colors-neutral-b5);
    --sui-checkbox-bg-color-active: var(--sui-colors-neutral-b4);
    --sui-checkbox-bg-color-disabled: var(--sui-colors-neutral-base);
    --sui-checkbox-border-color: var(--sui-colors-neutral-b2);
    --sui-checkbox-border-color-hover: var(--sui-colors-neutral-b1);
    --sui-checkbox-border-color-active: var(--sui-colors-neutral-b1);
    --sui-checkbox-border-color-disabled: var(--sui-colors-neutral-b0-t20);
  }
  .sui-checkbox-root.sui-disabled {

    pointer-events: none;
}
  .sui-checkbox-rectangular {
    background-color: var(--sui-checkbox-bg-color);
  }
  @media (hover: hover) {
  .sui-checkbox-rectangular:hover {
      background-color: var(--sui-checkbox-bg-color-hover);
    }
}
  @media (hover: hover) {
  .sui-checkbox-rectangular:hover .sui-checkbox-inner {
        border-color: var(--sui-checkbox-border-color-hover);
      }
}
  .sui-checkbox-rectangular:active {
      background-color: var(--sui-checkbox-bg-color-active);
    }
  .sui-checkbox-rectangular:active .sui-checkbox-inner {
        border-color: var(--sui-checkbox-border-color-active);
      }
  .sui-checkbox-rectangular.sui-disabled {
      background-color: var(--sui-checkbox-bg-color-disabled);
    }
  .sui-checkbox-rectangular.sui-disabled .sui-checkbox-inner {
        border-color: var(--sui-checkbox-border-color-disabled);
      }
  .sui-checkbox-rectangular:focus-visible,
    .sui-checkbox-rectangular.sui-focus-visible {

    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}
  .sui-checkbox-rectangular:focus-visible::after,
    .sui-checkbox-rectangular.sui-focus-visible::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  .sui-checkbox-squircle {
    --sui-squircle-border-width: var(--sui-border-width-1);
    --sui-squircle-bg-color: var(--sui-checkbox-bg-color);
    --sui-squircle-bg-color-hover: var(--sui-checkbox-bg-color-hover);
    --sui-squircle-border-color: var(--sui-checkbox-border-color);
    --sui-squircle-border-color-hover: var(--sui-checkbox-border-color-hover);
    --sui-squircle-border-color-active: var(--sui-checkbox-border-color-active);
    --sui-squircle-bg-color-active: var(--sui-checkbox-bg-color-active);
  }
  .sui-checkbox-squircle.sui-disabled {
      --sui-squircle-bg-color: var(--sui-checkbox-bg-color-disabled);
      --sui-squircle-border-color: var(--sui-checkbox-border-color-disabled);
    }
  .sui-checkbox.sui-checked,
  .sui-checkbox-indeterminate {
    --sui-checkbox-bg-color: var(--sui-colors-primary-b);
    --sui-checkbox-border-color: transparent;
    --sui-checkbox-border-color-hover: transparent;
    --sui-checkbox-border-color-active: transparent;
    --sui-checkbox-border-color-disabled: transparent;
    --sui-checkbox-bg-color-hover: var(--sui-colors-primary-b-high-contrast);
    --sui-checkbox-bg-color-active: var(--sui-colors-neutral-high-contrast-w0);
    --sui-checkbox-bg-color-disabled: var(--sui-colors-primary-b-t20);
  }
  .sui-checkbox-inner-rectangular {

    pointer-events: none;

    position: absolute;

    box-sizing: border-box;

    height: 100%;

    width: 100%;

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

    border-style: solid;

    border-width: var(--sui-border-width-1\.2);

    --sui-focus-ring-border-width: var(--sui-border-width-1\.2);

    --sui-focus-ring-border-width-recoup: 1;

      border-color: var(--sui-checkbox-border-color);
}

.sui-chip-root {

  font-size: var(--sui-typography-subtitle-mini-font-size);

  font-weight: var(--sui-typography-subtitle-mini-font-weight);

  line-height: var(--sui-typography-subtitle-mini-line-height);

  text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

  text-transform: var(--sui-typography-subtitle-mini-text-transform);

  font-family: var(--sui-font-family);

  box-sizing: border-box;

  display: inline-flex;

  align-items: center;

  border-style: solid;

  --tw-border-opacity: 1;

  border-color: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--tw-border-opacity)));

  border-radius: var(--sui-border-radius-full);

  --sui-focus-ring-border-radius: var(--sui-border-radius-full);

  border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width-recoup: 1;
}@media (prefers-reduced-motion: no-preference) {.sui-chip-root {

    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}.sui-chip-root {

  background-color: var(--sui-chip-bg-color);
}

  .sui-chip-root.sui-disabled {

  pointer-events: none;

  opacity: 0.35;
}

.sui-chip-truncate {

  max-width: var(--sui-spacing-36);
}

.sui-chip-label {

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  padding-left: var(--sui-spacing-1);

  padding-right: var(--sui-spacing-1);
}

@media (prefers-reduced-motion: no-preference) {.sui-chip-label {

    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}

.sui-chip-label {

  color: var(--sui-chip-text-color);
}

.sui-chip-large {

  height: var(--sui-spacing-8);

  padding: var(--sui-spacing-1);
}

.sui-chip-medium {

  height: var(--sui-spacing-7);

  padding: var(--sui-spacing-0\.5);
}

.sui-chip-small {

  height: var(--sui-spacing-6);

  padding: var(--sui-spacing-0\.5);
}

.sui-chip-delete-icon {

  flex-shrink: 0;

  /* --sui-squircle-bg-color: transparent; */

  color: var(--sui-chip-text-color);
}

.sui-chip-default {
  --sui-chip-bg-color: var(--sui-colors-neutral-b4);
  --sui-chip-text-color: var(--sui-colors-neutral-b1);
  --sui-chip-hover-bg-color: var(--sui-colors-neutral-b2);
  --sui-chip-active-bg-color: var(--sui-colors-neutral-b0);
}

.sui-chip-error {
  --sui-chip-bg-color: var(--sui-colors-danger-t10);
  --sui-chip-text-color: var(--sui-colors-danger-high-contrast);
  --sui-chip-hover-bg-color: var(--sui-colors-danger);
  --sui-chip-active-bg-color: var(--sui-colors-danger-high-contrast);
}

.sui-chip-clickable {

  position: relative;

  outline: 2px solid transparent;

  outline-offset: 2px;
}

.sui-chip-clickable:not(.sui-disabled) {

  cursor: pointer;
}

.sui-chip-clickable:not(.sui-disabled):focus-visible {

  --sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}

.sui-chip-clickable:not(.sui-disabled):focus-visible::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));

  box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);

  margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

@media (hover: hover) {

.sui-chip-clickable:not(.sui-disabled):hover {
      background-color: var(--sui-chip-hover-bg-color);
    }
}

@media (hover: hover) {

.sui-chip-clickable:not(.sui-disabled):hover .sui-chip-label,
      .sui-chip-clickable:not(.sui-disabled):hover .sui-chip-delete-icon {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
  }
}

.sui-chip-clickable:not(.sui-disabled):not(:focus-within):active, .sui-chip-clickable:not(.sui-disabled):focus:active {
        background-color: var(--sui-chip-active-bg-color);
      }

.sui-chip-clickable:not(.sui-disabled):not(:focus-within):active .sui-chip-label, .sui-chip-clickable:not(.sui-disabled):focus:active .sui-chip-label {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
}

.sui-inline-editable-root {
  font-size: var(--sui-typography-main-text-font-size);
  font-weight: var(--sui-typography-main-text-font-weight);
  line-height: var(--sui-typography-main-text-line-height);
  text-decoration: var(--sui-typography-main-text-text-decoration);
  text-transform: var(--sui-typography-main-text-text-transform);
  font-family: var(--sui-font-family);
  position: relative;
  box-sizing: border-box;
  display: inline-flex;
  width: auto;
  min-width: var(--sui-spacing-8);
  vertical-align: middle;
}
  .sui-inline-editable-full-width {
  width: 100%;
}
  .sui-inline-editable-input,
  .sui-inline-editable-textarea {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-transform: inherit;
  text-decoration: inherit;
  letter-spacing: inherit;
  font-family: inherit;
  width: 100%;
  border-style: solid;
  border-color: transparent;
  background-color: transparent;
  padding: var(--sui-spacing-0);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  --sui-focus-ring-border-width-recoup: 1;
}
  @media (prefers-reduced-motion: no-preference) {
  .sui-inline-editable-input,
  .sui-inline-editable-textarea {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}
  .sui-inline-editable-input::selection, .sui-inline-editable-textarea::selection {
  background-color: var(--sui-colors-primary-b-t20);
}
  .sui-inline-editable-input::placeholder, .sui-inline-editable-textarea::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  @media (prefers-reduced-motion: no-preference) {
  .sui-inline-editable-input::placeholder, .sui-inline-editable-textarea::placeholder {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}
  @media (hover: hover) {
  .sui-inline-editable-input:hover, .sui-inline-editable-textarea:hover {
    --tw-border-opacity: 1;
    border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));
  }
}
  @media (hover: hover) {
  .sui-inline-editable-input:hover::placeholder, .sui-inline-editable-textarea:hover::placeholder {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  }
}
  .sui-inline-editable-input:focus, .sui-inline-editable-textarea:focus {
  --tw-border-opacity: 1;
  border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-border-opacity)));
  outline: 2px solid transparent;
  outline-offset: 2px;
}
  .sui-inline-editable-input.sui-disabled, .sui-inline-editable-textarea.sui-disabled {
  border-color: transparent;
  background-color: transparent;
}
  .sui-inline-editable-input.sui-disabled::placeholder, .sui-inline-editable-textarea.sui-disabled::placeholder {
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-inline-editable-text {
  user-select: none;
  border-style: solid;
  --sui-focus-ring-border-width-recoup: 1;
}
  .sui-inline-editable-input {
  position: absolute;
  top: var(--sui-spacing-0);
  box-sizing: border-box;
}
  .sui-inline-editable-input + .sui-inline-editable-text {
  display: inline-block;
  height: var(--sui-spacing-0);
  overflow: hidden;
  white-space: pre;
  border-color: transparent;
}
  .sui-inline-editable-textarea {
  resize: none;
}
  .sui-inline-editable-textarea + .sui-inline-editable-text {
  display: none;
}
  .sui-inline-editable-standard {
    min-height: 1.4375rem;
  }
  .sui-inline-editable-standard-input,
    .sui-inline-editable-standard-textarea {
  padding-top: var(--sui-spacing-0\.5);
  border-width: var(--sui-border-width-0);
  --sui-focus-ring-border-width: var(--sui-border-width-0);
  border-bottom-width: var(--sui-border-width-1);

      padding-bottom: calc(var(--sui-spacing-0\.5) + var(--sui-border-width-1));
}
  .sui-inline-editable-standard-input:focus, .sui-inline-editable-standard-textarea:focus {
  padding-bottom: var(--sui-spacing-0\.5);
  border-bottom-width: var(--sui-border-width-2);
}
  .sui-inline-editable-outlined {
    min-height: 1.5625rem;
  }
  .sui-inline-editable-outlined-input,
    .sui-inline-editable-outlined-textarea {
  border-radius: var(--sui-border-radius-xs);
  --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
  border-width: var(--sui-border-width-1);
  --sui-focus-ring-border-width: var(--sui-border-width-1);

      padding: calc(var(--sui-spacing-0\.5) + var(--sui-border-width-1));
}
  .sui-inline-editable-outlined-input:focus, .sui-inline-editable-outlined-textarea:focus {
  padding: var(--sui-spacing-0\.5);
  border-width: var(--sui-border-width-2);
  --sui-focus-ring-border-width: var(--sui-border-width-2);
}
  .sui-inline-editable-outlined-input + .sui-inline-editable-text {
  padding: var(--sui-spacing-0\.5);
  border-left-width: var(--sui-border-width-2);
  border-right-width: var(--sui-border-width-2);
}

.sui-tag-root {

    font-size: var(--sui-typography-descriptor-mini-semi-bold-font-size);

    font-weight: var(--sui-typography-descriptor-mini-semi-bold-font-weight);

    line-height: var(--sui-typography-descriptor-mini-semi-bold-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-semi-bold-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-semi-bold-text-transform);

    font-family: var(--sui-font-family);

    box-sizing: border-box;

    display: inline-block;

    height: var(--sui-spacing-4);

    min-width: var(--sui-spacing-6);

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    border-style: solid;

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1);

    border-radius: var(--sui-border-radius-xs);

    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

    border-width: var(--sui-border-width-1\.2);

    --sui-focus-ring-border-width: var(--sui-border-width-1\.2);

    --sui-focus-ring-border-width-recoup: 1;

    line-height: var(
      --sui-spacing-3\.5
    ) /* Override the line height to vertically center the text within the tag container. */
}
  .sui-tag-has-start-icon {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);

    display: inline-flex;

    align-items: center;

    padding-left: var(--sui-spacing-1);

    padding-right: var(--sui-spacing-1\.5)
}
  /* color */
  .sui-tag-default {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-neutral {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-secondary {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-primary {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-success {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-warning {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-danger {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)))
}
  /* variant */
  .sui-tag-outlined {

    background-color: var(--sui-colors-neutral-w0-t0)
}
  .sui-tag-filled-default {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-neutral {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-secondary {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-primary {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-success {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-warning {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-warning), calc(var(--s-warning-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-filled-danger {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-default {

    border-color: transparent;

    background-color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-neutral {

    border-color: transparent;

    background-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-secondary {

    border-color: transparent;

    background-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-primary {

    border-color: transparent;

    background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-success {

    border-color: transparent;

    background-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-warning {

    border-color: transparent;

    background-color: rgb(var(--s-warning), calc(var(--s-warning-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-tag-inverted-danger {

    border-color: transparent;

    background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * 0.1));

    --tw-text-opacity: 1;

    color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)))
}
  /* label */
  .sui-tag-label {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap
}
  /* start icon */
  .sui-tag-start-icon {

    margin-right: var(--sui-spacing-1)
}

.sui-link-root {position: relative;cursor: pointer;text-decoration-style: solid;border-radius: var(--sui-border-radius-xs);--sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}@media (prefers-reduced-motion: no-preference) {.sui-link-root {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 300ms;
    }
}

    @media (hover: hover) {

    .sui-link-root:hover {--tw-text-opacity: 1;color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)));
    }
}

    .sui-link-root:active {--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}

    .sui-link-root:focus-visible,
    .sui-link-root.sui-focus-visible {--sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}

    .sui-link-root:focus-visible::after,
    .sui-link-root.sui-focus-visible::after {pointer-events: none;content: '';position: absolute;inset: 0;border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  .sui-link-none {text-decoration-line: none;
}
  .sui-link-hover {text-decoration-line: none;
}
  @media (hover: hover) {
  .sui-link-hover:hover {text-decoration-line: underline;
    }
}
  .sui-link-always {text-decoration-line: underline;
}
  .sui-link:focus-visible,
  .sui-link.sui-focus-visible {text-decoration-line: none;
}
  .sui-link-primary {--tw-text-opacity: 1;color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-link-secondary {--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-link-inverted {--tw-text-opacity: 1;color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-link-inverted:active {--tw-text-opacity: 1;color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
}
  @media (hover: hover) {
  .sui-link-inverted:hover {--tw-text-opacity: 1;color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
    }
}

.sui-badge-root {

      position: relative;

      display: inline-flex;
}
  .sui-badge-content {

      box-sizing: border-box;
}
  .sui-badge-primary {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-cobranding), calc(var(--s-cobranding-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-danger {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-success {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-success), calc(var(--s-success-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-warning {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-warning), calc(var(--s-warning-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-secondary {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-absolute {

      position: absolute;

      height: 100%;

      width: 100%;
}
  .sui-badge-standard {

      display: inline-flex;

      width: fit-content;

      align-items: center;

      justify-content: center;

      padding: var(--sui-spacing-1);

      --tw-text-opacity: 1;

      color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
}
  @media (prefers-reduced-motion: no-preference) {
      .sui-badge-standard {

            transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

            transition-duration: 150ms;

            transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

            transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
      }
}
  .sui-badge-standard-small {

      font-size: var(--sui-typography-detail-bold-font-size);

      font-weight: var(--sui-typography-detail-bold-font-weight);

      line-height: var(--sui-typography-detail-bold-line-height);

      text-decoration: var(--sui-typography-detail-bold-text-decoration);

      text-transform: var(--sui-typography-detail-bold-text-transform);

      font-family: var(--sui-font-family);
}
  .sui-badge-standard-medium {

      font-size: var(--sui-typography-descriptor-mini-semi-bold-font-size);

      font-weight: var(--sui-typography-descriptor-mini-semi-bold-font-weight);

      line-height: var(--sui-typography-descriptor-mini-semi-bold-line-height);

      text-decoration: var(--sui-typography-descriptor-mini-semi-bold-text-decoration);

      text-transform: var(--sui-typography-descriptor-mini-semi-bold-text-transform);

      font-family: var(--sui-font-family);
}
  .sui-badge-standard-primary {

      --tw-text-opacity: 1;

      color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-badge-standard-contained {

      border-radius: var(--sui-border-radius-md);

      --sui-focus-ring-border-radius: var(--sui-border-radius-md);
}
  .sui-badge-standard-contained-small {

      height: var(--sui-spacing-4);

      min-width: var(--sui-spacing-4);
}
  .sui-badge-standard-contained-medium {

      height: var(--sui-spacing-5);

      min-width: var(--sui-spacing-5);
}
  .sui-badge-standard-outlined {

      border-style: solid;

      --tw-border-opacity: 1;

      border-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-border-opacity)));

      border-radius: var(--sui-border-radius-lg);

      --sui-focus-ring-border-radius: var(--sui-border-radius-lg);

      border-width: var(--sui-border-width-1);

      --sui-focus-ring-border-width: var(--sui-border-width-1);

      --sui-focus-ring-border-width-recoup: 1;
}
  .sui-badge-standard-outlined-small {

      height: var(--sui-spacing-4);

      min-width: var(--sui-spacing-4);
}
  .sui-badge-standard-outlined-medium {

      height: var(--sui-spacing-5\.5);

      min-width: var(--sui-spacing-5\.5);
}
  .sui-badge-dot {

      border-radius: var(--sui-border-radius-full);

      --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
  .sui-badge-dot-primary {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-dot-danger {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-dot-success {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-dot-warning {

      --tw-bg-opacity: 1;

      background-color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-badge-dot-contained-small {

      height: var(--sui-spacing-1\.5);

      width: var(--sui-spacing-1\.5);
}
  .sui-badge-dot-contained-medium {

      height: var(--sui-spacing-2);

      width: var(--sui-spacing-2);
}
  .sui-badge-dot-outlined {

      border-style: solid;

      --tw-border-opacity: 1;

      border-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-border-opacity)));

      border-width: var(--sui-border-width-1);

      --sui-focus-ring-border-width: var(--sui-border-width-1);

      --sui-focus-ring-border-width-recoup: 1;
}
  .sui-badge-dot-outlined-small {

      height: var(--sui-spacing-2);

      width: var(--sui-spacing-2);
}
  .sui-badge-dot-outlined-medium {

      height: var(--sui-spacing-2\.5);

      width: var(--sui-spacing-2\.5);
}
  .sui-badge-rectangular,
  .sui-badge-circular {

      position: absolute;

      display: flex;

      align-items: center;

      justify-content: center;
}
  .sui-badge-rectangular-top-right {

      top: var(--sui-spacing-0);

      right: var(--sui-spacing-0);

      transform: translate(50%, -50%);
}
  .sui-badge-rectangular-bottom-right {

      bottom: var(--sui-spacing-0);

      right: var(--sui-spacing-0);

      transform: translate(50%, 50%);
}
  .sui-badge-rectangular-top-left {

      top: var(--sui-spacing-0);

      left: var(--sui-spacing-0);

      transform: translate(-50%, -50%);
}
  .sui-badge-rectangular-bottom-left {

      bottom: var(--sui-spacing-0);

      left: var(--sui-spacing-0);

      transform: translate(-50%, 50%);
}
  .sui-badge-circular-top-right {
      top: 14%;
      right: 14%;
      transform: translate(50%, -50%);
    }
  .sui-badge-circular-bottom-right {
      bottom: 14%;
      right: 14%;
      transform: translate(50%, 50%);
    }
  .sui-badge-circular-top-left {
      top: 14%;
      left: 14%;
      transform: translate(-50%, -50%);
    }
  .sui-badge-circular-bottom-left {
      bottom: 14%;
      left: 14%;
      transform: translate(-50%, 50%);
    }

.sui-text-root {
    font-family: var(--sui-font-family);
    font-weight: 400;
    margin: 0;
    overflow: hidden;
  }
  .sui-text-no-wrap {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .sui-text-flex-full {
    flex: 1 1 auto;
  }
  .sui-text-highlight-term {
    background-color: var(--sui-colors-warning-t10);
    --tw-text-opacity: 1;
    color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-text-opacity)));
}

.sui-text-field-clear {

display: none;

flex-shrink: 0
}

  /* iOS-specific fix: Mobile browsers don't focus buttons on click, causing :focus-within to fail.
   :active state ensures button stays visible during touch interaction for click events to fire */
  .sui-text-field-clear:active {

display: inline-flex
}

.sui-text-field-mask-value-button {

flex-shrink: 0
}

.sui-text-field-form-field-content {

cursor: text;

overflow: visible
}

@media (hover: hover) {

.sui-text-field-form-field-content:hover ::placeholder {

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
}

@media (hover: hover) {

.sui-text-field-form-field-content:hover .sui-text-field-clear {

display: inline-flex
}
}

.sui-text-field-root {

display: inline-flex;

width: var(--sui-spacing-80);

flex-direction: column;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-text-field-root:focus .sui-text-field-clear, .sui-text-field-root:focus-within .sui-text-field-clear, .sui-text-field-root.sui-focused .sui-text-field-clear {

display: inline-flex
}

.sui-text-field-root ::placeholder {

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-text-field-root.sui-disabled {

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-text-field-root.sui-disabled ::placeholder {

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-text-field-root.sui-disabled .sui-text-field-clear {

display: none
}

.sui-text-field-full-width {

width: 100%
}

.sui-text-field-input {

font-size: var(--sui-typography-main-text-font-size);

font-weight: var(--sui-typography-main-text-font-weight);

line-height: var(--sui-typography-main-text-line-height);

text-decoration: var(--sui-typography-main-text-text-decoration);

text-transform: var(--sui-typography-main-text-text-transform);

font-family: var(--sui-font-family);

width: 100%;

background-color: transparent;

vertical-align: middle;

color: inherit;

caret-color: rgb(var(--s-neutral-b0), var(--s-neutral-b0-opacity, 1));

outline: 2px solid transparent;

outline-offset: 2px;

border-style: none;

padding: var(--sui-spacing-0);

--sui-focus-ring-border-width-recoup: 0
}

@media (prefers-reduced-motion: no-preference) {
.sui-text-field-input::placeholder {

transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

transition-duration: 150ms;

transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
}
}

.sui-text-field-input:placeholder-shown + .sui-text-field-clear {

display: none
}

.sui-text-field-end-adornment {

margin-left: var(--sui-spacing-1);

display: flex
}

.sui-text-field-start-adornment {

margin-right: var(--sui-spacing-1);

display: flex
}

.sui-text-field-outlined ::selection {

background-color: var(--sui-colors-primary-b-t20)
}

.sui-text-field-standard ::selection {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-text-field-standard.sui-disabled {

--tw-border-opacity: 1;

border-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-border-opacity)))
}

.sui-text-field-quiet .sui-text-field-input {

font-size: var(--sui-typography-display1-font-size);

font-weight: var(--sui-typography-display1-font-weight);

line-height: var(--sui-typography-display1-line-height);

text-decoration: var(--sui-typography-display1-text-decoration);

text-transform: var(--sui-typography-display1-text-transform);

font-family: var(--sui-font-family);

z-index: 0;

height: var(--sui-spacing-12);

width: 100%;

border-style: none;

padding: var(--sui-spacing-0);

text-align: center;

outline: 2px solid transparent;

outline-offset: 2px;

--sui-focus-ring-border-width-recoup: 0
}

.sui-text-field-quiet .sui-text-field-input::placeholder {

font-size: var(--sui-typography-subtitle-font-size);

font-weight: var(--sui-typography-subtitle-font-weight);

line-height: var(--sui-typography-subtitle-line-height);

text-decoration: var(--sui-typography-subtitle-text-decoration);

text-transform: var(--sui-typography-subtitle-text-transform);

font-family: var(--sui-font-family);

position: relative;

z-index: -10;

text-align: center;

      transform: translateY(
        calc(
          -1 * ((
                  var(--sui-typography-display1-line-height) -
                    var(--sui-typography-subtitle-line-height)
                ) / 2)
        )
      )
}

.sui-text-field-helper-text {

display: flex;

flex-direction: row;

justify-content: space-between
}

.sui-text-field-hide-native-clear .sui-text-field-input[type='search']::-webkit-search-cancel-button,
  .sui-text-field-hide-native-clear .sui-text-field-input[type='search']::-webkit-search-decoration {

display: none;

    appearance: none
}

/* firefox */

.sui-text-field-hide-native-clear .sui-text-field-input[type='search']::-moz-search-cancel-button {

display: none
}

.sui-textarea-form-field-content {

    height: auto;

    padding: var(--sui-spacing-0)
}

    .sui-textarea-form-field-content-xlarge {

    min-height: var(--sui-spacing-12)
}

    .sui-textarea-form-field-content-large {

    min-height: var(--sui-spacing-9)
}

    .sui-textarea-form-field-content-medium {

    min-height: var(--sui-spacing-8)
}
  .sui-textarea-input {

    resize: none
}
  .sui-textarea-input-xlarge {

    padding-left: var(--sui-spacing-4);

    padding-right: var(--sui-spacing-4);

    padding-top: 15px;

    padding-bottom: 14px
}
  .sui-textarea-input-large {

    padding-left: var(--sui-spacing-3);

    padding-right: var(--sui-spacing-3);

    padding-top: 9px;

    padding-bottom: 8px
}
  .sui-textarea-input-medium {

    padding-left: var(--sui-spacing-2\.5);

    padding-right: var(--sui-spacing-2\.5);

    padding-top: 7px;

    padding-bottom: 6px
}
  .sui-textarea-standard-input {

    padding-left: var(--sui-spacing-0);

    padding-right: var(--sui-spacing-0)
}
  .sui-textarea-clear {

    position: absolute
}
  .sui-textarea-clear-xlarge {

    right: var(--sui-spacing-4);

    bottom: var(--sui-spacing-3)
}
  .sui-textarea-clear-large {

    right: var(--sui-spacing-3);

    bottom: var(--sui-spacing-1\.5)
}
  .sui-textarea-clear-medium {

    right: var(--sui-spacing-2\.5);

    bottom: var(--sui-spacing-1)
}
  .sui-textarea-clear-standard {

    right: var(--sui-spacing-0)
}

.sui-picker-text-field-form-field-content,
  .sui-picker-text-field-input {
  cursor: pointer
}
  .sui-picker-text-field-has-value:focus .sui-picker-text-field-end-icon, .sui-picker-text-field-has-value:focus-within .sui-picker-text-field-end-icon, .sui-picker-text-field-has-value.sui-focused .sui-picker-text-field-end-icon {
  display: none
}
  @media (hover: hover) {
  .sui-picker-text-field-has-value:hover .sui-picker-text-field-end-icon {
    display: none
  }
}

/* stylelint-disable custom-property-pattern */
.sui-alert-root {

  box-sizing: border-box;

  display: flex;

  min-width: var(--sui-spacing-65);

  border-style: solid;

  --tw-border-opacity: 1;

  border-color: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--tw-border-opacity)));

  padding: var(--sui-spacing-4);

  border-radius: var(--sui-border-radius-sm);

  --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

  border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width-recoup: 1;

  background: var(--s-gradient-stop), var(--s-gradient-base);

  --s-gradient-stop: linear-gradient(0deg, var(--s-gradient-cover) 0%, var(--s-gradient-cover) 100%);

  --s-gradient-base-opacity: 1;

  --s-gradient-base: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--s-gradient-base-opacity)))
}
.sui-alert-icon {

  margin-right: var(--sui-spacing-3);

  display: flex;

  align-items: flex-start;

  align-self: flex-start
}
.sui-alert-body {

  flex-grow: 1
}
.sui-alert-content {

  font-size: var(--sui-typography-subtitle-mini-font-size);

  font-weight: var(--sui-typography-subtitle-mini-font-weight);

  line-height: var(--sui-typography-subtitle-mini-line-height);

  text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

  text-transform: var(--sui-typography-subtitle-mini-text-transform);

  font-family: var(--sui-font-family);

  word-break: break-word
}
.sui-alert-action {

  margin-top: var(--sui-spacing-2)
}
.sui-alert-close {

  margin-left: var(--sui-spacing-3);

  height: var(--sui-spacing-5);

  flex-shrink: 0
}
.sui-alert-info {

  --tw-text-opacity: 1;

  color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)));

  --s-gradient-stop: linear-gradient(
      0deg,
      var(--sui-colors-primary-t10) 0%,
      var(--sui-colors-primary-t10) 100%
    ),
    linear-gradient(
      0deg,
      var(--sui-colors-neutral-static-w0-t10) 0%,
      var(--sui-colors-neutral-static-w0-t10) 100%
    )
}
.sui-alert-info-icon {

  --tw-text-opacity: 1;

  color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
.sui-alert-error {

  --tw-text-opacity: 1;

  color: rgb(var(--s-danger-high-contrast), calc(var(--s-danger-high-contrast-opacity, 1) * var(--tw-text-opacity)));

  --s-gradient-stop: linear-gradient(
      0deg,
      var(--sui-colors-danger-t10) 0%,
      var(--sui-colors-danger-t10) 100%
    ),
    linear-gradient(
      0deg,
      var(--sui-colors-neutral-static-w0-t10) 0%,
      var(--sui-colors-neutral-static-w0-t10) 100%
    )
}
.sui-alert-error-icon {

  --tw-text-opacity: 1;

  color: rgb(var(--s-danger-high-contrast), calc(var(--s-danger-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
.sui-alert-warning {

  --tw-text-opacity: 1;

  color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-text-opacity)));

  --s-gradient-stop: linear-gradient(
      0deg,
      var(--sui-colors-warning-t10) 0%,
      var(--sui-colors-warning-t10) 100%
    ),
    linear-gradient(
      0deg,
      var(--sui-colors-neutral-static-w0-t10) 0%,
      var(--sui-colors-neutral-static-w0-t10) 100%
    )
}
.sui-alert-warning-icon {

  --tw-text-opacity: 1;

  color: rgb(var(--s-warning-high-contrast), calc(var(--s-warning-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
.sui-alert-success {

  --tw-text-opacity: 1;

  color: rgb(var(--s-success-high-contrast), calc(var(--s-success-high-contrast-opacity, 1) * var(--tw-text-opacity)));

  --s-gradient-stop: linear-gradient(
      0deg,
      var(--sui-colors-success-t10) 0%,
      var(--sui-colors-success-t10) 100%
    ),
    linear-gradient(
      0deg,
      var(--sui-colors-neutral-static-w0-t10) 0%,
      var(--sui-colors-neutral-static-w0-t10) 100%
    )
}
.sui-alert-success-icon {

  --tw-text-opacity: 1;

  color: rgb(var(--s-success-high-contrast), calc(var(--s-success-high-contrast-opacity, 1) * var(--tw-text-opacity)))
}
.sui-alert-neutral {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

  --s-gradient-stop: linear-gradient(
      0deg,
      var(--sui-colors-neutral-b4-t50) 0%,
      var(--sui-colors-neutral-b4-t50) 100%
    ),
    linear-gradient(
      0deg,
      var(--sui-colors-neutral-static-w0-t10) 0%,
      var(--sui-colors-neutral-static-w0-t10) 100%
    )
}
.sui-alert-neutral-icon {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
/* Compact Mode */
.sui-alert-root:where(.sui-compact) {

  padding-left: var(--sui-spacing-3);

  padding-right: var(--sui-spacing-3);

  padding-top: var(--sui-spacing-2);

  padding-bottom: var(--sui-spacing-2)
}
:where(.sui-alert-root.sui-compact) .sui-alert-icon {

  margin-right: var(--sui-spacing-1\.5);

  margin-top: var(--sui-spacing-0\.25)
}
:where(.sui-alert-root.sui-compact) .sui-alert-content {

  font-size: var(--sui-typography-descriptor-mini-font-size);

  font-weight: var(--sui-typography-descriptor-mini-font-weight);

  line-height: var(--sui-typography-descriptor-mini-line-height);

  text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

  text-transform: var(--sui-typography-descriptor-mini-text-transform);

  font-family: var(--sui-font-family);

  gap: var(--sui-spacing-1)
}
:where(.sui-alert-root.sui-compact) .sui-alert-close {

  margin-left: var(--sui-spacing-1\.5);

  height: var(--sui-spacing-4)
}

.sui-alert-title-root {
    font-size: var(--sui-typography-subtitle-bold-font-size);
    font-weight: var(--sui-typography-subtitle-bold-font-weight);
    line-height: var(--sui-typography-subtitle-bold-line-height);
    text-decoration: var(--sui-typography-subtitle-bold-text-decoration);
    text-transform: var(--sui-typography-subtitle-bold-text-transform);
    font-family: var(--sui-font-family);
    margin-bottom: var(--sui-spacing-1)
}

  /* Compact Mode */
  .sui-alert-title-root:where(.sui-compact) {
    font-size: var(--sui-typography-subtitle-mini-semi-bold-font-size);
    font-weight: var(--sui-typography-subtitle-mini-semi-bold-font-weight);
    line-height: var(--sui-typography-subtitle-mini-semi-bold-line-height);
    text-decoration: var(--sui-typography-subtitle-mini-semi-bold-text-decoration);
    text-transform: var(--sui-typography-subtitle-mini-semi-bold-text-transform);
    font-family: var(--sui-font-family);
    margin-bottom: var(--sui-spacing-0)
}

.sui-announcement-icon,
.sui-announcement-close,
.sui-announcement-action {
  display: flex;
  height: var(--sui-spacing-8);
  align-items: center;
}

.sui-announcement-root {
  /*
   * Reset the background style as the Alert component sets a background: linear-gradient,
   * using @apply bg-color only sets the background-color, causing the backgrounds to stack
   */
  background: transparent;
  border-style: none;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));
  padding-top: var(--sui-spacing-1);
  padding-bottom: var(--sui-spacing-1);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
  border-radius: var(--sui-border-radius-none);
  --sui-focus-ring-border-radius: var(--sui-border-radius-none);
  --sui-focus-ring-border-width-recoup: 0;
}

.sui-announcement-neutral {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-announcement-info {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-announcement-error {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-announcement-success {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-announcement-warning {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-announcement-icon,
.sui-announcement-close {
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
}

.sui-announcement-body {
  display: flex;
  min-height: var(--sui-spacing-8);
  justify-content: space-between;
  gap: var(--sui-spacing-2);
}

.sui-announcement-content {
  margin-top: var(--sui-spacing-1\.5);
  margin-bottom: var(--sui-spacing-1\.5);
}

.sui-announcement-action {
  margin-top: var(--sui-spacing-0);
}

/* Compact Mode */

.sui-announcement-root:where(.sui-compact) {
  padding-top: var(--sui-spacing-0);
  padding-bottom: var(--sui-spacing-0);
}

:where(.sui-announcement-root.sui-compact) .sui-announcement-content {
  margin-top: var(--sui-spacing-2);
  margin-bottom: var(--sui-spacing-2);
}

.sui-snackbar-content-root {

    pointer-events: auto;

    position: relative;

    min-height: var(--sui-spacing-12);

    width: fit-content;

    max-width: var(--sui-spacing-150);

    border-style: solid;

    padding-top: var(--sui-spacing-2);

    padding-bottom: var(--sui-spacing-2);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    overflow: hidden
}

.sui-snackbar-content-icon,
.sui-snackbar-content-close,
.sui-snackbar-content-action {

    display: flex;

    height: var(--sui-spacing-8);

    align-items: center
}

.sui-snackbar-content-body {

    display: flex;

    align-items: center;

    gap: var(--sui-spacing-2)
}

.sui-snackbar-content-action {

    margin-left: var(--sui-spacing-1);

    margin-top: var(--sui-spacing-0)
}

.sui-snackbar-content-info {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-border-opacity)));

    --tw-shadow: var(--sui-box-shadow-sm-primary);

    --tw-shadow-colored: var(--sui-box-shadow-sm-primary);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-snackbar-content-error {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-shadow: var(--sui-box-shadow-sm-danger);

    --tw-shadow-colored: var(--sui-box-shadow-sm-danger);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-snackbar-content-warning {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-warning-f), calc(var(--s-warning-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-shadow: var(--sui-box-shadow-sm-warning);

    --tw-shadow-colored: var(--sui-box-shadow-sm-warning);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-snackbar-content-success {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-success-f), calc(var(--s-success-f-opacity, 1) * var(--tw-border-opacity)));

    --tw-shadow: var(--sui-box-shadow-sm-success);

    --tw-shadow-colored: var(--sui-box-shadow-sm-success);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-snackbar-content-neutral {

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));

    --tw-shadow: var(--sui-box-shadow-md);

    --tw-shadow-colored: var(--sui-box-shadow-md);

    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sui-snackbar-root {
    pointer-events: none;
    position: fixed;
    bottom: var(--sui-spacing-0);
    z-index: 1400;
    margin-bottom: var(--sui-spacing-4);
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: var(--sui-spacing-3);
    padding-left: var(--sui-spacing-4);
    padding-right: var(--sui-spacing-4)
}

.sui-rating-root {

    font-size: var(--sui-typography-display1-font-size);

    font-weight: var(--sui-typography-display1-font-weight);

    line-height: var(--sui-typography-display1-line-height);

    text-decoration: var(--sui-typography-display1-text-decoration);

    text-transform: var(--sui-typography-display1-text-transform);

    font-family: var(--sui-font-family);

    position: relative;

    display: inline-flex;

    width: min-content;

    cursor: pointer;

    text-align: left;

    --sui-color: var(--sui-colors-warning);
}

    .sui-rating-root.sui-disabled {
      --sui-color: var(--sui-colors-neutral-b3);
      pointer-events: none;
    }

    .sui-rating-root.sui-disabled .sui-rating-icon-empty {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-rating-squircle {
    /* default */
    --sui-squircle-bg-color: transparent;
    --sui-squircle-bg-color-hover: transparent;
    --sui-squircle-bg-color-active: transparent;
    --sui-squircle-ring-offset: 0px;
  }
  .sui-rating-squircle .sui-rating-squircle-content {

    opacity: 0.2;
}
  .sui-rating-squircle {

    position: absolute;

    top: var(--sui-spacing-0);

    left: var(--sui-spacing-0);

    height: 100%;

    width: 100%;
}
  .sui-rating-icon-hover {
    --sui-squircle-bg-color: var(--sui-color);
    --sui-squircle-bg-color-hover: var(--sui-color);
    --sui-squircle-bg-color-active: var(--sui-color);
  }
  .sui-rating-icon-hover:active .sui-rating-squircle-content, .sui-rating-icon-hover.sui-active .sui-rating-squircle-content {

    opacity: 0.1;
}
  .sui-rating-read-only {

    pointer-events: none;
}
  .sui-rating-decimal {

    position: relative;
}
  .sui-rating-label {
    cursor: inherit;
    position: relative;
  }
  .sui-rating-label.sui-disabled {

    pointer-events: none;

    cursor: not-allowed;
}
  .sui-rating-label-container {

    padding: var(--sui-spacing-0\.5);
}
  .sui-rating-label-empty-value {
    cursor: inherit;
  }
  .sui-rating-empty-value-focused {
    --sui-focus-ring-normal-offset: 0px;
    --sui-focus-ring-border-radius: 10px;
    position: absolute;
    top: var(--sui-spacing-0);
    bottom: var(--sui-spacing-0);
    width: 100%;
    padding: var(--sui-spacing-0);
    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
  }
  .sui-rating-empty-value-focused::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  .sui-rating-visually-hidden {

    position: absolute;

    width: 1px;

    height: 1px;

    padding: 0;

    margin: -1px;

    overflow: hidden;

    clip: rect(0, 0, 0, 0);

    white-space: nowrap;

    border-width: 0;
}
  .sui-rating-icon {

    pointer-events: none;

    display: flex;
}
  @media (prefers-reduced-motion: no-preference) {

    .sui-rating-icon {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

        transition-duration: 150ms;
    }
}
  .sui-rating-icon-empty {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-rating-icon-filled {

    color: var(--sui-color);
}

.sui-list-item-text-root {flex-grow: 1;display: grid;grid-template-columns: repeat(1, minmax(0, 1fr));margin-right: var(--sui-spacing-4)
}.sui-list-item-text-root:first-child {margin-left: var(--sui-spacing-0)
}.sui-list-item-text-root:last-child {margin-right: var(--sui-spacing-0)
}
  .sui-list-item-text-primary-text {--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));overflow: hidden;text-overflow: ellipsis;white-space: nowrap
}
  .sui-list-item-text-secondary-text {font-size: var(--sui-typography-descriptor-font-size);font-weight: var(--sui-typography-descriptor-font-weight);line-height: var(--sui-typography-descriptor-line-height);text-decoration: var(--sui-typography-descriptor-text-decoration);text-transform: var(--sui-typography-descriptor-text-transform);font-family: var(--sui-font-family);--tw-text-opacity: 1;color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));overflow: hidden;text-overflow: ellipsis;white-space: nowrap
}
  .sui-list-item-text-primary {margin-left: var(--sui-spacing-3)
}
  .sui-list-item-text-primary-primary-text {font-size: var(--sui-typography-subtitle-font-size);font-weight: var(--sui-typography-subtitle-font-weight);line-height: var(--sui-typography-subtitle-line-height);text-decoration: var(--sui-typography-subtitle-text-decoration);text-transform: var(--sui-typography-subtitle-text-transform);font-family: var(--sui-font-family)
}
  .sui-list-item-text-secondary {margin-left: var(--sui-spacing-2)
}
  .sui-list-item-text-secondary-primary-text {font-size: var(--sui-typography-subtitle-mini-font-size);font-weight: var(--sui-typography-subtitle-mini-font-weight);line-height: var(--sui-typography-subtitle-mini-line-height);text-decoration: var(--sui-typography-subtitle-mini-text-decoration);text-transform: var(--sui-typography-subtitle-mini-text-transform);font-family: var(--sui-font-family)
}

.sui-list-item-root {

  box-sizing: border-box;

  width: 100%;

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

  padding-left: var(--sui-spacing-1);

  padding-right: var(--sui-spacing-1);

  outline: 2px solid transparent;

  outline-offset: 2px;

  --sui-list-item-container-bg-color: var(--sui-colors-neutral-base);
  --sui-list-item-container-bg-color-focus: var(--sui-colors-neutral-b5);
  --sui-list-item-container-bg-color-hover: var(--sui-colors-neutral-b5);
  --sui-list-item-container-bg-color-active: var(--sui-colors-neutral-b4);

  /* TODO: Color with opacity casts an overlay during transitions */
  --sui-list-item-container-bg-color-selected: var(--sui-colors-neutral-b4-t50);
  --sui-list-item-container-bg-color-selected-hover: var(
    --sui-colors-neutral-b4
  );
}

.sui-list-item-content {

  display: flex;

  align-items: center;

  box-sizing: border-box;

  height: 100%;

  width: 100%;

  overflow: hidden;

  padding-left: var(--sui-spacing-3);

  padding-right: var(--sui-spacing-3);
}

.sui-list-item-content > * {

  flex-shrink: 0;
}

.sui-list-item-content > .sui-list-item-text {

  flex-shrink: 1;
}

.sui-list-item-divider {

  margin-left: var(--sui-spacing-3);

  margin-right: var(--sui-spacing-3);
}

@media (prefers-reduced-motion: no-preference) {

  .sui-list-item-divider {

    transition-property: opacity;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    transition-duration: 150ms;
  }
}

.sui-list-item-container {

  width: 100%;

  overflow: hidden;

  border-radius: var(--sui-border-radius-sm);

  --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}

@media (prefers-reduced-motion: no-preference) {

  .sui-list-item-container {

    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    transition-duration: 300ms;
  }
}

.sui-list-item-container {

  display: flex;

  flex-direction: column;

  position: relative;

  /* Prevent the divider from being covered by the container */
  height: calc(100% - 1px);
  background-color: var(--sui-list-item-container-bg-color);
}

.sui-list-item-hover-actions {

  position: absolute;

  right: var(--sui-spacing-0);

  display: flex;

  flex-direction: row;

  align-items: center;

  top: var(--sui-spacing-0);

  bottom: var(--sui-spacing-0);

  overflow: hidden;

  background-color: inherit;

  padding-left: var(--sui-spacing-4);

  padding-right: var(--sui-spacing-2);

  /* prevent container outline be covered */

  margin-top: var(--sui-spacing-1);

  margin-bottom: var(--sui-spacing-1);

  margin-right: var(--sui-spacing-1);
}

.sui-list-item-small {

  height: var(--sui-spacing-11);
}

.sui-list-item-large {

  height: var(--sui-spacing-16);
}

.sui-list-item-auto .sui-list-item-content {

  height: auto;

  padding-top: var(--sui-spacing-3\.5);

  padding-bottom: var(--sui-spacing-3\.5);
}

.sui-list-item-root.sui-focus-visible .sui-list-item-container, .sui-list-item-root.sui-focused .sui-list-item-container {

  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

.sui-list-item-root.sui-focus-visible .sui-list-item-container::after, .sui-list-item-root.sui-focused .sui-list-item-container::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: var(--sui-focus-ring-border-radius, 0px);

  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

.sui-list-item-root.sui-focus-visible .sui-list-item-container, .sui-list-item-root.sui-focused .sui-list-item-container {

    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-focus
    );
  }

.sui-list-item-hoverable.sui-focus-visible-within .sui-list-item-container, .sui-list-item-clickable.sui-focus-visible-within .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-focus
    );
  }

.sui-list-item-clickable.sui-selected.sui-focus-visible-within .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-selected-hover
    );
  }

.sui-list-item-highlighted .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-hover
    );
  }

@media (hover: hover) {

.sui-list-item-hoverable:hover .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-hover
    );
  }
}

.sui-list-item-clickable {

  cursor: pointer;
}

.sui-list-item-clickable.sui-selected .sui-list-item-container {
    box-shadow: inset 0 0 0 1px var(--sui-colors-neutral-high-contrast);

    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-selected
    );
  }

@media (hover: hover) {

.sui-list-item-clickable.sui-selected:hover .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-selected-hover
    );
  }
}

/* Hide the before-and-after divider when selected, ensuring it does not interfere with the layout. */

.sui-list-item-clickable:has(+ .sui-list-item-clickable.sui-selected) .sui-list-item-divider, .sui-list-item-clickable.sui-selected .sui-list-item-divider {

  opacity: 0;
}

.sui-list-item-root.sui-dragged {

  cursor: grabbing;

  background-color: transparent;
}

.sui-list-item-root.sui-dragged .sui-list-item-container {

  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

.sui-list-item-root.sui-dragged .sui-list-item-container::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: var(--sui-focus-ring-border-radius, 0px);

  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

.sui-list-item-root.sui-dragged .sui-list-item-container {

  --tw-shadow: var(--sui-box-shadow-md);

  --tw-shadow-colored: var(--sui-box-shadow-md);

  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);

    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-focus
    );
}

.sui-list-item-root.sui-dragged.sui-selected .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-selected
    );
  }

@media (hover: hover) {

.sui-list-item-root.sui-dragged.sui-selected:hover .sui-list-item-container {
    --sui-list-item-container-bg-color: var(
      --sui-list-item-container-bg-color-selected-hover
    );
  }
}

.sui-list-item-clickable:not(:focus-within).sui-active .sui-list-item-container, .sui-list-item-clickable:not(:focus-within):active .sui-list-item-container, .sui-list-item-clickable:focus.sui-active .sui-list-item-container, .sui-list-item-clickable:focus:active .sui-list-item-container, .sui-list-item-clickable.sui-focused.sui-active .sui-list-item-container, .sui-list-item-clickable.sui-focused:active .sui-list-item-container {
      --sui-list-item-container-bg-color: var(
        --sui-list-item-container-bg-color-active
      );
    }

/* Compact Mode */

.sui-list-item-large:where(.sui-compact) {

  height: var(--sui-spacing-14);
}

.sui-list-item-auto:where(.sui-compact) .sui-list-item-content {

  padding-top: var(--sui-spacing-2);

  padding-bottom: var(--sui-spacing-2);
}

.sui-menu-actions-root {

    box-sizing: border-box;

    display: flex;

    height: var(--sui-spacing-10);

    width: 100%;

    align-items: center;

    justify-content: space-between;

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2)
}

.sui-menu-actions-group-root {

    display: flex;

    gap: var(--sui-spacing-1)
}

.sui-menu-divider-root {
    margin-top: var(--sui-spacing-2);
    margin-bottom: var(--sui-spacing-2)
}

  /* Compact Mode */
  .sui-menu-divider-root:where(.sui-compact) {
    margin-top: var(--sui-spacing-1);
    margin-bottom: var(--sui-spacing-1)
}

.sui-menu-footer-root {
    display: flex;
    height: var(--sui-spacing-10);
    align-items: center;
    justify-content: center;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
    padding-left: var(--sui-spacing-4);
    padding-right: var(--sui-spacing-4)
}

  /* Compact Mode */
  .sui-menu-footer-root:where(.sui-compact) {
    height: var(--sui-spacing-8);
    padding-left: var(--sui-spacing-3);
    padding-right: var(--sui-spacing-3)
}

.sui-menu-header-root {

    font-size: var(--sui-typography-subtitle-font-size);

    font-weight: var(--sui-typography-subtitle-font-weight);

    line-height: var(--sui-typography-subtitle-line-height);

    text-decoration: var(--sui-typography-subtitle-text-decoration);

    text-transform: var(--sui-typography-subtitle-text-transform);

    font-family: var(--sui-font-family);

    position: relative;

    box-sizing: border-box;

    height: var(--sui-spacing-12);

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

    padding-left: var(--sui-spacing-14);

    padding-right: var(--sui-spacing-14);

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

    display: flex;

    align-items: center;

    justify-content: center;

    gap: var(--sui-spacing-3)
}

.sui-menu-header-title {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap
}

.sui-menu-header-start,
.sui-menu-header-end {

    position: absolute;

    top: var(--sui-spacing-0);

    display: flex;

    height: 100%;

    flex-direction: row;

    align-items: center;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-menu-header-start {

    left: var(--sui-spacing-4)
}

.sui-menu-header-end {

    right: var(--sui-spacing-4)
}

/* Compact Mode */

.sui-menu-header-root:where(.sui-compact) {

    height: var(--sui-spacing-9);

    padding-left: var(--sui-spacing-3);

    padding-right: var(--sui-spacing-3)
}

.sui-menu-item-text-root {display: flex;height: 100%;min-width: var(--sui-spacing-0);flex-grow: 1;align-items: center;justify-content: space-between;margin-left: var(--sui-spacing-3)
}.sui-menu-item-text-root:first-child {margin-left: var(--sui-spacing-0)
}.sui-menu-item-text-root:last-child {margin-right: calc(var(--sui-spacing-1) * -1)
}

.sui-menu-item-text-primary-text {margin-right: var(--sui-spacing-2)
}

.sui-menu-item-text-info-text {font-size: var(--sui-typography-descriptor-mini-font-size);font-weight: var(--sui-typography-descriptor-mini-font-weight);line-height: var(--sui-typography-descriptor-mini-line-height);text-decoration: var(--sui-typography-descriptor-mini-text-decoration);text-transform: var(--sui-typography-descriptor-mini-text-transform);font-family: var(--sui-font-family);margin-right: var(--sui-spacing-1);max-width: var(--sui-spacing-22);flex-shrink: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;--tw-text-opacity: 1;color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

/* Compact Mode */

.sui-menu-item-text-root:where(.sui-compact) {margin-left: var(--sui-spacing-2)
}

.sui-popper-menu-root {

    z-index: 1300
}

.sui-popper-menu-paper {

    min-width: var(--sui-spacing-50);

    max-width: var(--sui-spacing-112);

    overflow: hidden;

    padding-top: var(--sui-spacing-2);

    padding-bottom: var(--sui-spacing-2);

    border-style: solid;

    border-color: var(--sui-colors-neutral-b0-t20);

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1
}

.sui-radio-root {position: relative;box-sizing: border-box;display: inline-flex;align-items: center;justify-content: center;border-style: solid;--sui-focus-ring-border-width-recoup: 1;height: var(--sui-spacing-5);width: var(--sui-spacing-5);vertical-align: middle;border-radius: var(--sui-border-radius-full);--sui-focus-ring-border-radius: var(--sui-border-radius-full);--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));border-width: var(--sui-border-width-1\.2);--sui-focus-ring-border-width: var(--sui-border-width-1\.2);
}@media (prefers-reduced-motion: no-preference) {.sui-radio-root {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 300ms;
  }
}

  .sui-radio-root:focus-visible,
  .sui-radio-root.sui-focus-visible {--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

  .sui-radio-root:focus-visible::after,
  .sui-radio-root.sui-focus-visible::after {pointer-events: none;content: '';position: absolute;inset: 0;border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

  .sui-radio-root:focus-visible,
  .sui-radio-root.sui-focus-visible {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-border-opacity)));
}

  .sui-radio-root.sui-disabled {pointer-events: none;border-color: var(--sui-colors-neutral-b0-t20);--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
}

  @media (hover: hover) {

  .sui-radio-root:hover {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-border-opacity)));--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
  }
}

  .sui-radio-root:active {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-border-opacity)));--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-radio-input {position: absolute;inset: var(--sui-spacing-0);margin: var(--sui-spacing-0);cursor: pointer;opacity: 0;
}

.sui-radio-dot {height: var(--sui-spacing-3);width: var(--sui-spacing-3);border-radius: var(--sui-border-radius-full);--sui-focus-ring-border-radius: var(--sui-border-radius-full);
}

.sui-radio-root.sui-checked {--tw-border-opacity: 1;border-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-border-opacity)));--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-radio-root.sui-checked .sui-radio-dot {--tw-bg-opacity: 1;background-color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-radio-root.sui-checked.sui-disabled {border-color: var(--sui-colors-primary-t10);
}

.sui-radio-root.sui-checked.sui-disabled .sui-radio-dot {background-color: var(--sui-colors-primary-b-t20);
}

@media (hover: hover) {

.sui-radio-root.sui-checked:hover {--tw-border-opacity: 1;border-color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-border-opacity)));
  }
}

@media (hover: hover) {

.sui-radio-root.sui-checked:hover .sui-radio-dot {--tw-bg-opacity: 1;background-color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
  }
}

.sui-radio-root.sui-checked:active {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-border-opacity)));
}

.sui-radio-root.sui-checked:active .sui-radio-dot {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-radio-group-root {

    display: flex;

    flex-direction: column
}

  .sui-radio-group-root > :not(:last-child) {

    margin-bottom: var(--sui-spacing-4)
}

.sui-radio-group-row {

    display: flex;

    flex-direction: row
}

.sui-radio-group-row > :not(:last-child) {

    margin-bottom: var(--sui-spacing-0)
}

.sui-slider-root {
    --sui-slider-thumb-size: var(--sui-spacing-4\.5);
    --sui-slider-thumb-offset: calc(var(--sui-slider-thumb-border-width) / -2);
    --sui-slider-thumb-border-width: 1px;
    --sui-slider-thumb-border-color: var(--sui-colors-neutral-b2);
    --sui-slider-thumb-bg-color: var(--sui-colors-neutral-high-contrast-b0);
    --sui-slider-cross-size: var(--sui-spacing-1\.5);
    --sui-slider-rail-flow-size: calc(
      (100% + var(--sui-slider-thumb-size)) -
        var(--sui-slider-thumb-border-width)
    );
    --sui-slider-min-flow-size: calc(
      var(--sui-spacing-10) - var(--sui-slider-thumb-size)
    );
    --sui-slider-rail-color: var(--sui-colors-neutral-b4);
    --sui-slider-track-color: var(--sui-colors-neutral-b2);
    --sui-slider-padding-block: var(--sui-spacing-4);
    --sui-slider-marks-gap: calc(
      var(--sui-slider-padding-block) + (var(--sui-slider-cross-size) / 2) +
        var(--sui-spacing-2)
    );
    position: relative;
    box-sizing: content-box;
    display: inline-block;
    cursor: pointer;
    touch-action: none;

    padding-block: var(--sui-slider-padding-block);

    /* sets the color of the highlight to transparent that appears over the slider while it's being tapped on mobile.  */
    -webkit-tap-highlight-color: transparent;
  }

    .sui-slider-root.sui-disabled {
    pointer-events: none;

      --sui-slider-rail-color: var(--sui-colors-neutral-b5);
      --sui-slider-track-color: var(--sui-colors-neutral-b4);
      --sui-slider-thumb-border-color: var(--sui-colors-neutral-b3);
      --sui-slider-thumb-bg-color: var(--sui-colors-neutral-b3);
}

    .sui-slider-root.sui-disabled .sui-slider-thumb {
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

    .sui-slider-root.sui-disabled .sui-slider-mark {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

    .sui-slider-root.sui-disabled .sui-slider-mark-label {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

    .sui-slider-root.sui-disabled .sui-slider-value-label-paper {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-neutral, .sui-slider-root:active.sui-slider-neutral {
        --sui-slider-thumb-border-color: var(--sui-colors-primary-f);
        --sui-slider-track-color: var(--sui-colors-primary-f);
      }

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-neutral {
        --sui-slider-thumb-border-color: var(--sui-colors-primary-f);
        --sui-slider-track-color: var(--sui-colors-primary-f);
      }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-neutral .sui-slider-thumb, .sui-slider-root:active.sui-slider-neutral .sui-slider-thumb {
    --tw-shadow: var(--sui-box-shadow-xs-primary);
    --tw-shadow-colored: var(--sui-box-shadow-xs-primary);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-neutral .sui-slider-thumb {
        --tw-shadow: var(--sui-box-shadow-xs-primary);
        --tw-shadow-colored: var(--sui-box-shadow-xs-primary);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-success, .sui-slider-root:active.sui-slider-success {
        --sui-slider-thumb-border-color: var(--sui-colors-success-f);
        --sui-slider-track-color: var(--sui-colors-success-f);
      }

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-success {
        --sui-slider-thumb-border-color: var(--sui-colors-success-f);
        --sui-slider-track-color: var(--sui-colors-success-f);
      }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-success .sui-slider-thumb, .sui-slider-root:active.sui-slider-success .sui-slider-thumb {
    --tw-shadow: var(--sui-box-shadow-xs-success);
    --tw-shadow-colored: var(--sui-box-shadow-xs-success);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-success .sui-slider-thumb {
        --tw-shadow: var(--sui-box-shadow-xs-success);
        --tw-shadow-colored: var(--sui-box-shadow-xs-success);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-danger, .sui-slider-root:active.sui-slider-danger {
        --sui-slider-thumb-border-color: var(--sui-colors-danger-f);
        --sui-slider-track-color: var(--sui-colors-danger-f);
      }

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-danger {
        --sui-slider-thumb-border-color: var(--sui-colors-danger-f);
        --sui-slider-track-color: var(--sui-colors-danger-f);
      }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-danger .sui-slider-thumb, .sui-slider-root:active.sui-slider-danger .sui-slider-thumb {
    --tw-shadow: var(--sui-box-shadow-xs-danger);
    --tw-shadow-colored: var(--sui-box-shadow-xs-danger);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-danger .sui-slider-thumb {
        --tw-shadow: var(--sui-box-shadow-xs-danger);
        --tw-shadow-colored: var(--sui-box-shadow-xs-danger);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-warning, .sui-slider-root:active.sui-slider-warning {
        --sui-slider-thumb-border-color: var(--sui-colors-warning-f);
        --sui-slider-track-color: var(--sui-colors-warning-f);
      }

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-warning {
        --sui-slider-thumb-border-color: var(--sui-colors-warning-f);
        --sui-slider-track-color: var(--sui-colors-warning-f);
      }
}

    .sui-slider-root.sui-slider-show-color-at-rest.sui-slider-warning .sui-slider-thumb, .sui-slider-root:active.sui-slider-warning .sui-slider-thumb {
    --tw-shadow: var(--sui-box-shadow-xs-warning);
    --tw-shadow-colored: var(--sui-box-shadow-xs-warning);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

    @media (hover: hover) {

    .sui-slider-root:hover.sui-slider-warning .sui-slider-thumb {
        --tw-shadow: var(--sui-box-shadow-xs-warning);
        --tw-shadow-colored: var(--sui-box-shadow-xs-warning);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }
}

    .sui-slider-root.sui-disabled.sui-slider-show-color-at-rest.sui-slider-neutral {
        --sui-slider-thumb-border-color: var(--sui-colors-primary-f-t20);
        --sui-slider-track-color: var(--sui-colors-primary-f-t20);
      }

    .sui-slider-root.sui-disabled.sui-slider-show-color-at-rest.sui-slider-success {
        --sui-slider-thumb-border-color: var(--sui-colors-success-t20);
        --sui-slider-track-color: var(--sui-colors-success-t20);
      }

    .sui-slider-root.sui-disabled.sui-slider-show-color-at-rest.sui-slider-danger {
        --sui-slider-thumb-border-color: var(--sui-colors-danger-t20);
        --sui-slider-track-color: var(--sui-colors-danger-t20);
      }

    .sui-slider-root.sui-disabled.sui-slider-show-color-at-rest.sui-slider-warning {
        --sui-slider-thumb-border-color: var(--sui-colors-warning-t20);
        --sui-slider-track-color: var(--sui-colors-warning-t20);
      }

    .sui-slider-root:active.sui-slider-neutral {
        --sui-slider-thumb-bg-color: var(--sui-colors-primary-t10);
      }

    .sui-slider-root:active.sui-slider-success {
        --sui-slider-thumb-bg-color: var(--sui-colors-success-t10);
      }

    .sui-slider-root:active.sui-slider-danger {
        --sui-slider-thumb-bg-color: var(--sui-colors-danger-t10);
      }

    .sui-slider-root:active.sui-slider-warning {
        --sui-slider-thumb-bg-color: var(--sui-colors-warning-t10);
      }
  .sui-slider-horizontal {
    width: 100%;

    padding-top: var(--sui-slider-padding-block);
    min-width: var(--sui-slider-min-flow-size);
}
  .sui-slider-vertical {
    height: 100%;

    padding-left: var(--sui-slider-padding-block);
    min-height: var(--sui-slider-min-flow-size);
}
  .sui-slider-has-marks {
    margin-bottom: var(--sui-spacing-4);
}
  .sui-slider-rail,
  .sui-slider-track {
    position: absolute;
    box-sizing: content-box;
    display: block;
}
  @media (prefers-reduced-motion: no-preference) {

    .sui-slider-rail,
  .sui-slider-track {
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
    }
}
  .sui-slider-rail,
  .sui-slider-track {

    background-color: var(--sui-slider-track-color);
  }
  .sui-slider-rail {
    border-radius: var(--sui-border-radius-full);
    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--sui-slider-rail-color);
}
  .sui-slider-rail-horizontal {
      height: var(--sui-slider-cross-size);
      width: var(--sui-slider-rail-flow-size);
    }
  .sui-slider-rail-vertical {
      height: var(--sui-slider-rail-flow-size);
      width: var(--sui-slider-cross-size);
    }
  .sui-slider-track-horizontal {
    left: var(--sui-spacing-0);
    border-top-left-radius: var(--sui-border-radius-full);
    border-bottom-left-radius: var(--sui-border-radius-full);

      top: 50%;
      height: var(--sui-slider-cross-size);
      transform: translate(calc(var(--sui-slider-thumb-size) / -2), -50%);
}
  .sui-slider-track-vertical {
    bottom: var(--sui-spacing-0);
    border-bottom-right-radius: var(--sui-border-radius-full);
    border-bottom-left-radius: var(--sui-border-radius-full);

      left: 50%;
      width: var(--sui-slider-cross-size);
      transform: translate(-50%, calc(var(--sui-slider-thumb-size) / 2));
}
  .sui-slider-thumb {
    position: absolute;
    z-index: 10;
    box-sizing: border-box;
    outline: 2px solid transparent;
    outline-offset: 2px;
    border-radius: var(--sui-border-radius-full);
    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
    border-style: solid;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-bg-opacity)));
    --tw-shadow: var(--sui-box-shadow-xs);
    --tw-shadow-colored: var(--sui-box-shadow-xs);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    --sui-focus-ring-border-width-recoup: 1;
}
  @media (prefers-reduced-motion: no-preference) {

    .sui-slider-thumb {
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
    }
}
  .sui-slider-thumb {

    width: var(--sui-slider-thumb-size);
    height: var(--sui-slider-thumb-size);
    border-width: var(--sui-slider-thumb-border-width);
    border-color: var(--sui-slider-thumb-border-color);
  }
  .sui-slider-thumb:focus-visible,
    .sui-slider-thumb.sui-focus-visible {
    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}
  .sui-slider-thumb:focus-visible::after,
    .sui-slider-thumb.sui-focus-visible::after {
    pointer-events: none;
    content: '';
    position: absolute;
    inset: 0;
    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));
    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);
    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  .sui-slider-thumb-horizontal {
      margin-left: var(--sui-slider-thumb-offset);
      transform: translate(-50%, -50%);
    }
  .sui-slider-thumb-vertical {
      left: calc(var(--sui-slider-thumb-border-width) / -1);
      margin-bottom: var(--sui-slider-thumb-offset);
      transform: translateY(50%);
    }
  .sui-slider-thumb-inner {
    position: absolute;
    inset: var(--sui-spacing-0);
    border-radius: var(--sui-border-radius-full);
    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

      background-color: var(--sui-slider-thumb-bg-color);
}
  .sui-slider-marks {
    position: absolute;
    display: block;
}
  /*
      The thumb needs to be perfectly centered alongside a 1px wide mark so we must offset
      the thumb towards the start of the slider by 0.5px. We also need to offset the thumb
      another 0.5px due to its border radius revealing a gap between the track and the thumb
      which shows the rail behind. As such we offset the marks container 1px towards the
      start of the slider. Due to the offset of the thumb being towards the start of the
      slider, we also need to offset the end edge of the marks container away from the
      end of the slider by 1px to account for the start offset.
    */
  .sui-slider-marks-horizontal {
    left: -1px;
    right: 1px;

      top: var(--sui-slider-marks-gap);
}
  .sui-slider-marks-vertical {
    bottom: -1px;
    top: 1px;

      left: var(--sui-slider-marks-gap);
}
  .sui-slider-mark-container {
    position: absolute;
    display: flex;
    align-items: center;
    gap: var(--sui-spacing-2);
}
  .sui-slider-mark-container-horizontal {
    width: var(--sui-spacing-0\.25);
    flex-direction: column;
}
  .sui-slider-mark-container-vertical {
    height: var(--sui-spacing-0\.25);
    flex-direction: row;
}
  .sui-slider-mark {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-slider-mark-vertical {
    height: 100%;
    width: var(--sui-spacing-1);
}
  .sui-slider-mark-horizontal {
    height: var(--sui-spacing-1);
    width: 100%;
}
  .sui-slider-mark-label {
    font-size: var(--sui-typography-descriptor-mini-font-size);
    font-weight: var(--sui-typography-descriptor-mini-font-weight);
    line-height: var(--sui-typography-descriptor-mini-line-height);
    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
    text-transform: var(--sui-typography-descriptor-mini-text-transform);
    font-family: var(--sui-font-family);
    text-align: center;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}

.sui-switch-root {

position: relative;

z-index: 0;

display: inline-flex;

height: var(--sui-spacing-6);

width: var(--sui-spacing-10);

flex: none;

align-items: center;

border-radius: var(--sui-border-radius-full);

--sui-focus-ring-border-radius: var(--sui-border-radius-full);
}

  .sui-switch-root:focus-visible,
  .sui-switch-root.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

  .sui-switch-root:focus-visible::after,
  .sui-switch-root.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-switch-track {

height: 100%;

width: 100%;

border-radius: var(--sui-border-radius-full);

--sui-focus-ring-border-radius: var(--sui-border-radius-full);

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

@media (prefers-reduced-motion: no-preference) {

.sui-switch-track {

transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

transition-duration: 300ms;
}
}

.sui-switch-dot {

position: absolute;
}

@media (prefers-reduced-motion: no-preference) {

.sui-switch-dot {

transition-property: all;

transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

transition-duration: 300ms;
}
}

.sui-switch-dot {

margin-left: var(--sui-spacing-0\.5);

margin-right: var(--sui-spacing-0\.5);

height: var(--sui-spacing-5);

width: var(--sui-spacing-5);

border-radius: var(--sui-border-radius-full);

--sui-focus-ring-border-radius: var(--sui-border-radius-full);

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-bg-opacity)));
}

/* use `General sibling combinator` because keyboard can trigger :active in input element */

.sui-switch-input {

position: absolute;

z-index: 10;

inset: var(--sui-spacing-0);

height: 100%;

width: 100%;

cursor: pointer;

opacity: 0;
}

.sui-switch-input:disabled {

pointer-events: none;
}

.sui-switch-input:disabled ~ .sui-switch-track {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-switch-input:disabled ~ .sui-switch-dot {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

@media (hover: hover) {

.sui-switch-input:hover~.sui-switch-track {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-switch-input:active ~ .sui-switch-track {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-switch-input.sui-checked ~ .sui-switch-track {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-switch-input.sui-checked ~ .sui-switch-dot {

--tw-translate-x: var(--sui-spacing-4);

transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@media (hover: hover) {

.sui-switch-input.sui-checked:hover~.sui-switch-track {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b-high-contrast), calc(var(--s-primary-b-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-switch-input.sui-checked:disabled ~ .sui-switch-track {

background-color: var(--sui-colors-primary-b-t20);
}

.sui-switch-input.sui-checked:disabled ~ .sui-switch-dot {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-dropdown-value {
  max-width: var(--sui-spacing-28);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
  .sui-dropdown-chevron {
  margin-left: var(--sui-spacing-1);
  height: var(--sui-spacing-6);
  width: var(--sui-spacing-6);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  --sui-squircle-bg-color: transparent;
  --sui-squircle-border-color: transparent;
  --sui-squircle-border-width: var(--sui-border-width-0);
}
  .sui-dropdown-button {
  position: relative;
  display: flex;
  cursor: pointer;
  align-items: center;
  border-style: none;
  background-color: transparent;
  padding: var(--sui-spacing-1);
  outline: 2px solid transparent;
  outline-offset: 2px;
  border-radius: var(--sui-border-radius-xs);
  --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
  --sui-focus-ring-border-width-recoup: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-transform: inherit;
  text-decoration: inherit;
  letter-spacing: inherit;
  font-family: inherit;
}
  .sui-dropdown-button:focus-visible,
    .sui-dropdown-button.sui-focus-visible {
  --sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}
  .sui-dropdown-button:focus-visible::after,
    .sui-dropdown-button.sui-focus-visible::after {
  pointer-events: none;
  content: '';
  position: absolute;
  inset: 0;
  border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));
  box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);
  margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  @media (hover: hover) {
  .sui-dropdown-button:hover .sui-dropdown-chevron {
    --s-squircle-bg-color-opacity: 1;
    --sui-squircle-bg-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--s-squircle-bg-color-opacity)));
  }
}
  .sui-dropdown-label {
  margin-left: var(--sui-spacing-1);
  max-width: var(--sui-spacing-24);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
  .sui-dropdown-colon {
  margin-left: var(--sui-spacing-0\.5);
  margin-right: var(--sui-spacing-0\.5);
  display: inline-block;
  width: var(--sui-spacing-1);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-dropdown-activated .sui-dropdown-chevron {
  --s-squircle-bg-color-opacity: 1;
  --sui-squircle-bg-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--s-squircle-bg-color-opacity)));
}
  .sui-dropdown-root {
  font-size: var(--sui-typography-descriptor-mini-font-size);
  font-weight: var(--sui-typography-descriptor-mini-font-weight);
  line-height: var(--sui-typography-descriptor-mini-line-height);
  text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
  text-transform: var(--sui-typography-descriptor-mini-text-transform);
  font-family: var(--sui-font-family);
  display: inline-flex;
  flex-direction: row;
  align-items: center;
}
  .sui-dropdown-root.sui-disabled {
  pointer-events: none;
}
  .sui-dropdown-root.sui-disabled .sui-dropdown-chevron,
      .sui-dropdown-root.sui-disabled .sui-dropdown-value,
      .sui-dropdown-root.sui-disabled .sui-dropdown-label,
      .sui-dropdown-root.sui-disabled .sui-dropdown-colon {
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-date-picker-calendar {

box-sizing: border-box;

display: flex;

height: 328px;

width: 248px;

flex-direction: column;

align-items: center;

overflow: hidden;

padding-top: var(--sui-spacing-5);

padding-bottom: var(--sui-spacing-5);
}

.sui-date-picker-header {

box-sizing: border-box;

display: flex;

height: var(--sui-spacing-6);

width: 100%;

flex-shrink: 0;

align-items: center;

justify-content: space-between;

padding-left: var(--sui-spacing-5);

padding-right: var(--sui-spacing-5);
}

.sui-date-picker-header-action {

position: relative;

box-sizing: border-box;

cursor: pointer;

border-style: none;

background-color: transparent;

padding: var(--sui-spacing-0);

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

outline: 2px solid transparent;

outline-offset: 2px;

--sui-focus-ring-border-width-recoup: 0;
}

.sui-date-picker-header-action:focus-visible,
  .sui-date-picker-header-action.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

.sui-date-picker-header-action:focus-visible::after,
  .sui-date-picker-header-action.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

@media (hover: hover) {

.sui-date-picker-header-action:hover {

--tw-text-opacity: 1;

color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)));
}
}

.sui-date-picker-header-action:active {

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}

.sui-date-picker-header-action.sui-disabled {

pointer-events: none;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-date-picker-switch-year-action {

font-size: var(--sui-typography-subtitle-bold-font-size);

font-weight: var(--sui-typography-subtitle-bold-font-weight);

line-height: var(--sui-typography-subtitle-bold-line-height);

text-decoration: var(--sui-typography-subtitle-bold-text-decoration);

text-transform: var(--sui-typography-subtitle-bold-text-transform);

font-family: var(--sui-font-family);

display: flex;

height: 100%;

align-items: center;

position: relative;

outline: 2px solid transparent;

outline-offset: 2px;
}

.sui-date-picker-switch-year-action:focus-visible,
  .sui-date-picker-switch-year-action.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

.sui-date-picker-switch-year-action:focus-visible::after,
  .sui-date-picker-switch-year-action.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-date-picker-switch-year-action-caret {

margin-left: var(--sui-spacing-2);
}

.sui-date-picker-switch-month-actions-group {

display: flex;

justify-content: space-between;
}

.sui-date-picker-switch-month-action:not(:last-of-type) {

margin-right: var(--sui-spacing-2);
}

.sui-date-picker-date-button {

font-size: var(--sui-typography-descriptor-mini-font-size);

font-weight: var(--sui-typography-descriptor-mini-font-weight);

line-height: var(--sui-typography-descriptor-mini-line-height);

text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

text-transform: var(--sui-typography-descriptor-mini-text-transform);

font-family: var(--sui-font-family);

position: relative;

cursor: pointer;

background-color: transparent;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

border-radius: var(--sui-border-radius-full);

--sui-focus-ring-border-radius: var(--sui-border-radius-full);

box-sizing: border-box;

display: flex;

align-items: center;

justify-content: center;

border-style: none;

padding: var(--sui-spacing-0);

outline: 2px solid transparent;

outline-offset: 2px;

--sui-focus-ring-border-width-recoup: 0;
}

@media (prefers-reduced-motion: no-preference) {

.sui-date-picker-date-button {

transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

transition-duration: 150ms;

transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
}
}

@media (hover: hover) {

.sui-date-picker-date-button:hover {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-date-picker-date-button:active {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-date-picker-date-button:focus-visible,
  .sui-date-picker-date-button.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}

.sui-date-picker-date-button:focus-visible::after,
  .sui-date-picker-date-button.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-date-picker-date-button.sui-selected {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
}

@media (hover: hover) {

.sui-date-picker-date-button.sui-selected:hover {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b-high-contrast), calc(var(--s-primary-b-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-date-picker-date-button.sui-selected:active {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-date-picker-date-button.sui-selected.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

.sui-date-picker-date-button.sui-selected.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-date-picker-date-button.sui-disabled {

pointer-events: none;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-date-picker-current-date {

--tw-border-opacity: 1;

border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));

border-width: var(--sui-border-width-1);

--sui-focus-ring-border-width: var(--sui-border-width-1);
}

.sui-date-picker-current-date.sui-selected,
  .sui-date-picker-current-date:focus-visible,
  .sui-date-picker-current-date.sui-focus-visible {

border-style: none;

--sui-focus-ring-border-width-recoup: 0;
}

.sui-date-picker-day {

height: var(--sui-spacing-6);

width: var(--sui-spacing-6);
}

.sui-date-picker-year {

height: var(--sui-spacing-6);

width: var(--sui-spacing-12);
}

.sui-date-picker-years-panel {

margin-top: var(--sui-spacing-2\.5);

box-sizing: border-box;

display: grid;

grid-template-columns: repeat(4, minmax(0, 1fr));

row-gap: var(--sui-spacing-2\.5);

column-gap: var(--sui-spacing-2\.5);

overflow-y: auto;

padding-left: var(--sui-spacing-5);

padding-right: var(--sui-spacing-5);
}

.sui-date-picker-days-panel {

margin-top: var(--sui-spacing-3);

box-sizing: border-box;

width: 100%;

flex: 1 1 0%;

padding-left: var(--sui-spacing-5);

padding-right: var(--sui-spacing-5);
}

.sui-date-picker-days-grid {

margin-top: var(--sui-spacing-2);

display: grid;

justify-content: space-between;

row-gap: var(--sui-spacing-2);

  grid-template-columns: repeat(7, var(--sui-spacing-6));
}

.sui-date-picker-weekdays {

display: flex;

height: var(--sui-spacing-5);

width: 100%;

align-items: center;

justify-content: space-between;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));

font-size: var(--sui-typography-descriptor-mini-font-size);

font-weight: var(--sui-typography-descriptor-mini-font-weight);

line-height: var(--sui-typography-descriptor-mini-line-height);

text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

text-transform: var(--sui-typography-descriptor-mini-text-transform);

font-family: var(--sui-font-family);
}

.sui-date-picker-weekday {

display: inline-block;

width: var(--sui-spacing-6);

text-align: center;
}

.sui-date-picker-loading-container {

display: flex;

height: var(--sui-spacing-36);

align-items: center;

justify-content: center;
}

.sui-date-picker-today-button {

margin-top: var(--sui-spacing-4);
}

/* Compact Mode */

.sui-date-picker-calendar:where(.sui-compact) {

height: var(--sui-spacing-74);

padding-top: var(--sui-spacing-2);

padding-bottom: var(--sui-spacing-2);
}

:where(.sui-date-picker-calendar.sui-compact) .sui-date-picker-today-button {

margin-top: var(--sui-spacing-1);
}

.sui-time-picker-picker-root {

width: 15.5rem;

user-select: none;
}

.sui-time-picker-time-button {

font-size: var(--sui-typography-subtitle-bold-font-size);

font-weight: var(--sui-typography-subtitle-bold-font-weight);

line-height: var(--sui-typography-subtitle-bold-line-height);

text-decoration: var(--sui-typography-subtitle-bold-text-decoration);

text-transform: var(--sui-typography-subtitle-bold-text-transform);

font-family: var(--sui-font-family);

position: relative;

height: var(--sui-spacing-10);

width: var(--sui-spacing-10);

cursor: pointer;

background-color: transparent;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

border-radius: var(--sui-border-radius-full);

--sui-focus-ring-border-radius: var(--sui-border-radius-full);

box-sizing: border-box;

display: flex;

align-items: center;

justify-content: center;

border-style: none;

outline: 2px solid transparent;

outline-offset: 2px;

--sui-focus-ring-border-width-recoup: 0;
}

@media (prefers-reduced-motion: no-preference) {

.sui-time-picker-time-button {

transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

transition-duration: 150ms;

transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
}
}

@media (hover: hover) {

.sui-time-picker-time-button:hover {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-time-picker-time-button:active {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-time-picker-time-button:focus-visible,
  .sui-time-picker-time-button.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}

.sui-time-picker-time-button:focus-visible::after,
  .sui-time-picker-time-button.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-time-picker-time-button.sui-selected {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
}

@media (hover: hover) {

.sui-time-picker-time-button.sui-selected:hover {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-primary-b-high-contrast), calc(var(--s-primary-b-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
}
}

.sui-time-picker-time-button.sui-selected:active {

--tw-bg-opacity: 1;

background-color: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-time-picker-time-button.sui-selected.sui-focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

.sui-time-picker-time-button.sui-selected.sui-focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-time-picker-time-button.sui-disabled {

pointer-events: none;

--tw-text-opacity: 1;

color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-time-picker-number-picker {

display: flex;

flex-direction: column;

align-items: center;

justify-content: space-between;

position: relative;

height: 100%;

width: var(--sui-spacing-10);

outline: 2px solid transparent;

outline-offset: 2px;
}

.sui-time-picker-number-picker:focus-visible {

--sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}

.sui-time-picker-number-picker:focus-visible::after {

pointer-events: none;

content: '';

position: absolute;

inset: 0;

border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

.sui-time-picker-picker-view {

box-sizing: border-box;

height: var(--sui-spacing-44);

width: 15.5rem;

user-select: none;

padding: var(--sui-spacing-5);
}

.sui-time-picker-main-view {

display: flex;

align-items: center;

justify-content: space-between;
}

.sui-time-picker-main-view:not(.sui-time-picker-twelve-hour) {

padding-left: var(--sui-spacing-11);

padding-right: var(--sui-spacing-11);
}

.sui-time-picker-main-view .sui-time-picker-time-button {

height: var(--sui-spacing-10);

width: var(--sui-spacing-10);
}

.sui-time-picker-minute-selection-view {

display: flex;

align-items: center;

justify-content: space-between;
}

.sui-time-picker-hour-selection-view {

display: grid;

height: auto;

align-items: center;

justify-content: space-between;

  grid-template-columns: repeat(4, var(--sui-spacing-10));
}

/* Compact Mode */

.sui-time-picker-picker-view:where(.sui-compact) {

padding-top: var(--sui-spacing-1\.5);

padding-bottom: var(--sui-spacing-1\.5);
}

:where(.sui-time-picker-picker-view.sui-compact).sui-time-picker-main-view,
:where(.sui-time-picker-picker-view.sui-compact).sui-time-picker-minute-selection-view {

height: var(--sui-spacing-25);
}

.sui-linear-progress-indicator-root {
    display: flex;
    width: min-content;
    flex-direction: column;
    align-items: center;
    justify-content: center
}
  .sui-linear-progress-indicator-determinate-track {
    position: relative;
    inset: var(--sui-spacing-0);
    height: var(--sui-spacing-1\.5);
    width: var(--sui-spacing-40);
    overflow: hidden;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
    border-radius: var(--sui-border-radius-xs);
    --sui-focus-ring-border-radius: var(--sui-border-radius-xs)
}
  .sui-linear-progress-indicator-determinate-track-slim {
    height: var(--sui-spacing-1)
}
  .sui-linear-progress-indicator-determinate-bar {
    position: absolute;
    left: var(--sui-spacing-0);
    top: var(--sui-spacing-0);
    bottom: var(--sui-spacing-0);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));
    border-radius: var(--sui-border-radius-xs);
    --sui-focus-ring-border-radius: var(--sui-border-radius-xs)
}
  .sui-linear-progress-indicator-determinate-label {
    font-size: var(--sui-typography-descriptor-mini-font-size);
    font-weight: var(--sui-typography-descriptor-mini-font-weight);
    line-height: var(--sui-typography-descriptor-mini-line-height);
    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
    text-transform: var(--sui-typography-descriptor-mini-text-transform);
    font-family: var(--sui-font-family);
    margin-bottom: var(--sui-spacing-2)
}
  .sui-linear-progress-indicator-determinate-details-container {
    margin-top: var(--sui-spacing-2);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-self: stretch
}
  .sui-linear-progress-indicator-determinate-details-label {
    font-size: var(--sui-typography-descriptor-mini-font-size);
    font-weight: var(--sui-typography-descriptor-mini-font-weight);
    line-height: var(--sui-typography-descriptor-mini-line-height);
    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
    text-transform: var(--sui-typography-descriptor-mini-text-transform);
    font-family: var(--sui-font-family);
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-block-header-root {

    font-size: var(--sui-typography-subtitle-font-size);

    font-weight: var(--sui-typography-subtitle-font-weight);

    line-height: var(--sui-typography-subtitle-line-height);

    text-decoration: var(--sui-typography-subtitle-text-decoration);

    text-transform: var(--sui-typography-subtitle-text-transform);

    font-family: var(--sui-font-family);

    display: flex;

    width: 100%;

    align-items: center;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

  .sui-block-header-root:not(:only-child) {

    margin-bottom: var(--sui-spacing-3)
}

.sui-block-header-title {

    flex-grow: 1;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap
}

.sui-block-header-end-slot {

    margin-left: var(--sui-spacing-3);

    display: flex;

    flex-shrink: 0
}

.sui-block-header-divider {

    margin-bottom: var(--sui-spacing-3)
}

.sui-block-root {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    overflow: hidden
}
  .sui-block-row {
    flex-direction: row
}
  .sui-block-padding {
    padding-top: var(--sui-spacing-3);
    padding-bottom: var(--sui-spacing-3);
    padding-left: var(--sui-spacing-4);
    padding-right: var(--sui-spacing-4)
}
  .sui-block-bordered {
    border-style: solid;
    border-color: var(--sui-colors-neutral-b0-t10);
    border-width: var(--sui-border-width-1\.2);
    --sui-focus-ring-border-width: var(--sui-border-width-1\.2);
    --sui-focus-ring-border-width-recoup: 1
}
  .sui-block-border-radius-none {
    border-radius: var(--sui-border-radius-none);
    --sui-focus-ring-border-radius: var(--sui-border-radius-none)
}
  .sui-block-border-radius-xsmall {
    border-radius: var(--sui-border-radius-xs);
    --sui-focus-ring-border-radius: var(--sui-border-radius-xs)
}
  .sui-block-border-radius-small {
    border-radius: var(--sui-border-radius-sm);
    --sui-focus-ring-border-radius: var(--sui-border-radius-sm)
}
  .sui-block-border-radius-medium {
    border-radius: var(--sui-border-radius-md);
    --sui-focus-ring-border-radius: var(--sui-border-radius-md)
}
  .sui-block-default {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-block-neutral {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-block-hide-background {
    background-color: transparent
}

.sui-accordion-header-root {

  position: relative;

  display: flex;

  height: var(--sui-spacing-6);

  width: 100%;

  cursor: pointer;

  align-items: center;

  justify-content: space-between;

  padding-left: var(--sui-spacing-4);

  padding-right: var(--sui-spacing-4);

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));

  outline: 2px solid transparent;

  outline-offset: 2px;

  box-sizing: border-box;

  border-style: none;

  background-color: transparent;

  --sui-focus-ring-border-width-recoup: 0;
}

  @media (hover: hover) {

  .sui-accordion-header-root:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));

    --tw-text-opacity: 1;

    color: rgb(var(--s-primary-f-high-contrast), calc(var(--s-primary-f-high-contrast-opacity, 1) * var(--tw-text-opacity)));
  }
}

  .sui-accordion-header-root:active {

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}

  .sui-accordion-header-root:focus-visible,
  .sui-accordion-header-root.sui-focus-visible {

  --sui-focus-ring-color: var(--sui-focus-ring-tight-color);
}

  .sui-accordion-header-root:focus-visible::after,
  .sui-accordion-header-root.sui-focus-visible::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: calc(var(--sui-focus-ring-tight-offset) + var(--sui-focus-ring-border-radius, 0px));

  box-shadow: 0 0 0 var(--sui-focus-ring-tight-width) var(--sui-focus-ring-color);

  margin: calc(var(--sui-focus-ring-tight-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}

  .sui-accordion-header-root.sui-disabled {

  pointer-events: none;

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-accordion-header-content {

  display: flex;

  min-width: var(--sui-spacing-0);

  align-items: center;
}

.sui-accordion-header-primary-text {

  font-size: var(--sui-typography-subtitle-mini-font-size);

  font-weight: var(--sui-typography-subtitle-mini-font-weight);

  line-height: var(--sui-typography-subtitle-mini-line-height);

  text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

  text-transform: var(--sui-typography-subtitle-mini-text-transform);

  font-family: var(--sui-font-family);

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

.sui-accordion-header-secondary-slot {

  display: flex;

  flex-shrink: 0;

  padding-left: var(--sui-spacing-2);
}

.sui-accordion-header-expand-icon {

  margin-left: var(--sui-spacing-4);
}

.sui-accordion-root {

    min-width: var(--sui-spacing-75);

    max-width: var(--sui-spacing-150)
}

  .sui-accordion-root + .sui-accordion-root {

    margin-top: var(--sui-spacing-5)
}

.sui-accordion-panel-wrapper {

    overflow: hidden
}

.sui-accordion-panel-inner-wrapper {

    padding-top: var(--sui-spacing-1)
}

.sui-avatar-group-root {

    position: relative;

    height: var(--sui-spacing-9);

    width: var(--sui-spacing-9)
}

.sui-avatar-group-item::after {

    position: absolute;

    box-sizing: border-box;

    height: 100%;

    width: 100%;

    border-style: solid;

    --tw-border-opacity: 1;

    border-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-border-opacity)));

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    content: ''
}

.sui-avatar-group-item:nth-child(odd) {

    position: absolute;

    top: var(--sui-spacing-0);

    left: var(--sui-spacing-0)
}

.sui-avatar-group-item:nth-child(even) {

    position: absolute;

    bottom: var(--sui-spacing-0);

    right: var(--sui-spacing-0)
}

.sui-avatar-shape {

    pointer-events: auto;

    height: 100%;

    width: 100%;

    border-style: none;

    background-color: transparent;

    padding: var(--sui-spacing-0);

    --sui-focus-ring-border-width-recoup: 0;
}
  .sui-avatar-content {

    position: relative;

    display: flex;

    user-select: none;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    height: 100%;

    width: 100%;

    line-height: 1;
}
  .sui-avatar-default {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

    --sui-squircle-bg-color: var(--sui-colors-neutral-b4);
    --sui-squircle-bg-color-hover: var(--sui-colors-neutral-b4);
    --sui-squircle-bg-color-active: var(--sui-colors-neutral-b4);
}
  .sui-avatar-primary {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));

    --sui-squircle-bg-color: var(--sui-colors-primary-b);
    --sui-squircle-bg-color-hover: var(--sui-colors-primary-b);
    --sui-squircle-bg-color-active: var(--sui-colors-primary-b);
}
  .sui-avatar-circle {

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
  .sui-avatar-circle-content {

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
  .sui-avatar-circle-default {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-avatar-circle-primary {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-avatar-circle:focus-visible,
    .sui-avatar-circle.sui-focus-visible {

    --sui-focus-ring-color: var(--sui-focus-ring-normal-color);
}
  .sui-avatar-circle:focus-visible::after,
    .sui-avatar-circle.sui-focus-visible::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: calc(var(--sui-focus-ring-normal-offset) + var(--sui-focus-ring-border-radius, 0px));

    box-shadow: 0 0 0 var(--sui-focus-ring-normal-width) var(--sui-focus-ring-color);

    margin: calc(var(--sui-focus-ring-normal-offset)*-1 - var(--sui-focus-ring-border-width, 0px)*var(--sui-focus-ring-border-width-recoup, 1));
}
  .sui-avatar-img {

    height: 100%;

    width: 100%;

    object-fit: cover;

    text-align: center;

    /* Hide alt text. */

    color: transparent;

    /* Hide the image broken icon, only works on Chrome. */

    text-indent: 10000px;
}
  .sui-avatar-indicator {

    pointer-events: auto;

    z-index: 10;
}
  .sui-avatar-root {

    pointer-events: none;

    flex-shrink: 0;
}
  .sui-avatar-root.sui-disabled {

    opacity: 0.35;
}
  .sui-avatar-root.sui-disabled .sui-avatar-shape {

    pointer-events: none;
}
  .sui-avatar-xxlarge-content, .sui-avatar-xlarge-content {

    font-size: var(--sui-typography-display2-font-size);

    font-weight: var(--sui-typography-display2-font-weight);

    letter-spacing: var(--sui-typography-display2-letter-spacing);

    line-height: var(--sui-typography-display2-line-height);

    text-decoration: var(--sui-typography-display2-text-decoration);

    text-transform: var(--sui-typography-display2-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-avatar-xxlarge {

    height: var(--sui-spacing-16);

    width: var(--sui-spacing-16);
}
  .sui-avatar-xlarge {

    height: var(--sui-spacing-12);

    width: var(--sui-spacing-12);
}
  .sui-avatar-large {

    height: var(--sui-spacing-9);

    width: var(--sui-spacing-9);
}
  .sui-avatar-large-content {

    font-size: var(--sui-typography-subtitle-font-size);

    font-weight: var(--sui-typography-subtitle-font-weight);

    line-height: var(--sui-typography-subtitle-line-height);

    text-decoration: var(--sui-typography-subtitle-text-decoration);

    text-transform: var(--sui-typography-subtitle-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-avatar-medium {

    height: var(--sui-spacing-8);

    width: var(--sui-spacing-8);
}
  .sui-avatar-medium-content {

    font-size: var(--sui-typography-subtitle-mini-font-size);

    font-weight: var(--sui-typography-subtitle-mini-font-weight);

    line-height: var(--sui-typography-subtitle-mini-line-height);

    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

    text-transform: var(--sui-typography-subtitle-mini-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-avatar-small {

    height: var(--sui-spacing-6);

    width: var(--sui-spacing-6);
}
  .sui-avatar-small-content {

    font-size: var(--sui-typography-descriptor-mini-font-size);

    font-weight: var(--sui-typography-descriptor-mini-font-weight);

    line-height: var(--sui-typography-descriptor-mini-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-avatar-xsmall-content, .sui-avatar-xxsmall-content {

    font-size: var(--sui-typography-detail-font-size);

    font-weight: var(--sui-typography-detail-font-weight);

    line-height: var(--sui-typography-detail-line-height);

    text-decoration: var(--sui-typography-detail-text-decoration);

    text-transform: var(--sui-typography-detail-text-transform);

    font-family: var(--sui-font-family);
}
  .sui-avatar-xsmall {

    height: var(--sui-spacing-5);

    width: var(--sui-spacing-5);
}
  .sui-avatar-xxsmall {

    height: var(--sui-spacing-4);

    width: var(--sui-spacing-4);
}
  .sui-avatar-clickable-shape,
    .sui-avatar-clickable-indicator {

    cursor: pointer;
}
  .sui-avatar-clickable-hover-tint {

    position: absolute;

    left: var(--sui-spacing-0);

    right: var(--sui-spacing-0);

    top: var(--sui-spacing-0);

    bottom: var(--sui-spacing-0);

    height: 100%;

    width: 100%;

    opacity: 0;

    border-radius: var(--sui-border-radius-full);

    --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
  @media (prefers-reduced-motion: no-preference) {
    .sui-avatar-clickable-hover-tint {

        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);

        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
    }
}
  .sui-avatar-clickable-hover-tint-default-circle,
      .sui-avatar-clickable-hover-tint-primary-circle {

    background-color: var(--sui-colors-neutral-b0-t30);
}
  .sui-avatar-clickable-hover-tint {

      --sui-squircle-bg-color: var(--sui-colors-neutral-b0-t30);
      --sui-squircle-border-color: var(--sui-colors-neutral-b0-t0);
}
  @media (hover: hover) {
  .sui-avatar-clickable:hover .sui-avatar-hover-tint {

        opacity: 0.5;
    }
}
  .sui-avatar-clickable.sui-active .sui-avatar-hover-tint, .sui-avatar-clickable:active .sui-avatar-hover-tint {

    opacity: 1;
}

.sui-dial-pad-button-root .sui-icon {
      position: absolute;
      inset: var(--sui-spacing-0);
      margin: auto;
      aspect-ratio: 1 / 1;
}
    .sui-dial-pad-button-root svg {
      height: 100%;
      width: 100%;
    }
    .sui-dial-pad-button-root svg path:first-child {
      fill: rgb(var(--s-neutral-b0), var(--s-neutral-b0-opacity, 1));
}
    .sui-dial-pad-button-root svg path:nth-child(2) {
      fill: rgb(var(--s-neutral-b2), var(--s-neutral-b2-opacity, 1));
}
  .sui-dial-pad-button-medium .sui-icon {
      width: 32.25%;
    }
  .sui-dial-pad-button-large .sui-icon {
      width: 64.5%;
    }
  .sui-dial-pad-button-label-container {
      font-size: var(--sui-typography-descriptor-mini-font-size);
      font-weight: var(--sui-typography-descriptor-mini-font-weight);
      line-height: var(--sui-typography-descriptor-mini-line-height);
      text-decoration: var(--sui-typography-descriptor-mini-text-decoration);
      text-transform: var(--sui-typography-descriptor-mini-text-transform);
      font-family: var(--sui-font-family);
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: var(--sui-spacing-1);
}

.sui-dial-pad-root {
    display: inline-grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--sui-spacing-4)
}
  .sui-dial-pad-auto-size {
    display: flex;
    aspect-ratio: 224/304;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 7.145%
}
  .sui-dial-pad-auto-size .sui-dial-pad-button {
    aspect-ratio: 1 / 1;
    height: auto;
    width: 28.57%
}

.sui-bottom-navigation-item-button {

    --sui-squircle-bg-color: transparent;

    --sui-squircle-bg-color-hover: transparent
}

  .sui-bottom-navigation-item-button.sui-expanded {

    --s-squircle-bg-color-opacity: 1;

    --sui-squircle-bg-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--s-squircle-bg-color-opacity)))
}

.sui-bottom-navigation-item-activated {

    --tw-text-opacity: 1;

    color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-text-opacity)))
}

.sui-bottom-navigation-group-root {

  display: grid;

  padding-left: var(--sui-spacing-5);

  padding-right: var(--sui-spacing-5);

  grid-template-columns: 1fr 1fr 1fr 1fr 1fr var(--sui-spacing-6)
}

.sui-bottom-navigation-root {

    min-width: var(--sui-spacing-75);

    max-width: var(--sui-spacing-95\.75);

    overflow: hidden;

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-bottom-navigation-full-width {

    min-width: 100%;

    max-width: 100%
}

.sui-bottom-navigation-item-wrapper {

    margin-top: var(--sui-spacing-4);

    margin-bottom: var(--sui-spacing-4);

    display: flex;

    height: fit-content;

    align-items: center;

    justify-content: flex-start
}

.sui-bottom-navigation-description {

    font-size: var(--sui-typography-subtitle-mini-font-size);

    font-weight: var(--sui-typography-subtitle-mini-font-weight);

    line-height: var(--sui-typography-subtitle-mini-line-height);

    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);

    text-transform: var(--sui-typography-subtitle-mini-text-transform);

    font-family: var(--sui-font-family);

    display: flex;

    height: var(--sui-spacing-14);

    align-items: center;

    border-color: var(--sui-colors-neutral-b0-t10);

    padding-left: var(--sui-spacing-5);

    padding-right: var(--sui-spacing-5);

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

    border-top-width: var(--sui-border-width-1)
}

.sui-bottom-navigation-empty-slot {

    height: var(--sui-spacing-6);

    width: var(--sui-spacing-6);

    --sui-squircle-bg-color: transparent
}

@media (prefers-reduced-motion: no-preference) {

    .sui-bottom-navigation-empty-slot path {

        transition-property: none
    }
}

.sui-bottom-navigation-empty-slot path.sui-expanded {

    background-color: inherit
}

.sui-bottom-navigation-empty-slot.sui-expanded {

    --s-squircle-bg-color-opacity: 1;

    --sui-squircle-bg-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--s-squircle-bg-color-opacity)))
}

.sui-filter-button-root {

  font-size: var(--sui-typography-label-semi-bold-font-size);

  font-weight: var(--sui-typography-label-semi-bold-font-weight);

  letter-spacing: var(--sui-typography-label-semi-bold-letter-spacing);

  line-height: var(--sui-typography-label-semi-bold-line-height);

  text-decoration: var(--sui-typography-label-semi-bold-text-decoration);

  text-transform: var(--sui-typography-label-semi-bold-text-transform);

  font-family: var(--sui-font-family);

  position: relative;

  height: var(--sui-spacing-6);

  max-width: var(--sui-spacing-22);

  cursor: pointer;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  padding-left: var(--sui-spacing-1);

  padding-right: var(--sui-spacing-1);

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));

  outline: 2px solid transparent;

  outline-offset: 2px;

  border-style: none;

  background-color: transparent;

  border-radius: var(--sui-border-radius-xs);

  --sui-focus-ring-border-radius: var(--sui-border-radius-xs);

  --sui-focus-ring-border-width-recoup: 0;
}

  .sui-filter-button-root:focus-visible,
  .sui-filter-button-root.sui-focus-visible {

  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

  .sui-filter-button-root:focus-visible::after,
  .sui-filter-button-root.sui-focus-visible::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: var(--sui-focus-ring-border-radius, 0px);

  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

  .sui-filter-button-root.sui-selected {

  --tw-text-opacity: 1;

  color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-text-opacity)));
}

  @media (hover: hover) {

  .sui-filter-button-root:hover {

    --tw-text-opacity: 1;

    color: rgb(var(--s-cobranding-high-contrast), calc(var(--s-cobranding-high-contrast-opacity, 1) * var(--tw-text-opacity)));
  }
}

  .sui-filter-button-root:active {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}

  .sui-filter-button-root.sui-disabled {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-single-filter-root {

    display: flex
}

.sui-single-filter-more {

    margin-left: var(--sui-spacing-1)
}

.sui-step-icon-root {display: flex;height: var(--sui-spacing-6);width: var(--sui-spacing-6);align-items: center;justify-content: center;--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-bg-opacity)));--tw-text-opacity: 1;color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));border-radius: var(--sui-border-radius-full);--sui-focus-ring-border-radius: var(--sui-border-radius-full)
}@media (prefers-reduced-motion: no-preference) {.sui-step-icon-root {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
    }
}.sui-step-icon-root {position: relative;z-index: 10
}

.sui-step-icon-root.sui-completed,
.sui-step-icon-current {--tw-bg-opacity: 1;background-color: rgb(var(--s-primary-b), calc(var(--s-primary-b-opacity, 1) * var(--tw-bg-opacity)));--tw-text-opacity: 1;color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-step-icon-root.sui-disabled {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-step-icon-error {background-color: transparent;--tw-text-opacity: 1;color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)))
}

.sui-step-icon-error.sui-disabled {--tw-text-opacity: 1;color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-step-icon-outlined {box-sizing: border-box;border-style: solid;--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-border-opacity)));background-color: transparent;--tw-text-opacity: 1;color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));border-width: var(--sui-border-width-2);--sui-focus-ring-border-width: var(--sui-border-width-2);--sui-focus-ring-border-width-recoup: 1
}

.sui-step-icon-outlined-current {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-border-opacity)));--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-bg-opacity)));--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-step-icon-outlined-error {border-style: none;background-color: transparent;--tw-text-opacity: 1;color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)));--sui-focus-ring-border-width-recoup: 0
}

.sui-step-icon-outlined.sui-completed {border-style: none;background-color: transparent;--tw-text-opacity: 1;color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));--sui-focus-ring-border-width-recoup: 0
}

.sui-step-icon-outlined.sui-disabled {--tw-border-opacity: 1;border-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-border-opacity)));background-color: transparent;--tw-text-opacity: 1;color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-step-icon-text {font-size: var(--sui-typography-subtitle-mini-font-size);font-weight: var(--sui-typography-subtitle-mini-font-weight);line-height: var(--sui-typography-subtitle-mini-line-height);text-decoration: var(--sui-typography-subtitle-mini-text-decoration);text-transform: var(--sui-typography-subtitle-mini-text-transform);font-family: var(--sui-font-family)
}

.sui-step-icon-text-current {font-size: var(--sui-typography-subtitle-bold-font-size);font-weight: var(--sui-typography-subtitle-bold-font-weight);line-height: var(--sui-typography-subtitle-bold-line-height);text-decoration: var(--sui-typography-subtitle-bold-text-decoration);text-transform: var(--sui-typography-subtitle-bold-text-transform);font-family: var(--sui-font-family)
}

.sui-step-label-root {
    display: flex;
    align-items: center
}
  .sui-step-label-label {
    font-size: var(--sui-typography-subtitle-font-size);
    font-weight: var(--sui-typography-subtitle-font-weight);
    line-height: var(--sui-typography-subtitle-line-height);
    text-decoration: var(--sui-typography-subtitle-text-decoration);
    text-transform: var(--sui-typography-subtitle-text-transform);
    font-family: var(--sui-font-family);
    display: block
}
  @media (prefers-reduced-motion: no-preference) {
    .sui-step-label-label {
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
    }
}
  .sui-step-label-label.sui-completed {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-step-label-label.sui-disabled {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-step-label-icon-container {
    display: flex;
    flex-shrink: 0
}
  .sui-step-label-label-container {
    font-size: var(--sui-typography-descriptor-font-size);
    font-weight: var(--sui-typography-descriptor-font-weight);
    line-height: var(--sui-typography-descriptor-line-height);
    text-decoration: var(--sui-typography-descriptor-text-decoration);
    text-transform: var(--sui-typography-descriptor-text-transform);
    font-family: var(--sui-font-family);
    width: 100%;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}
  @media (prefers-reduced-motion: no-preference) {
    .sui-step-label-label-container {
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
        transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
        transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function)
    }
}
  .sui-step-label-label-container.sui-disabled {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-step-label-horizontal {
    flex-direction: column
}
  .sui-step-label-horizontal-label {
    margin-top: var(--sui-spacing-3)
}
  .sui-step-label-horizontal-label-container {
    text-align: center
}
  .sui-step-label-vertical {
    position: relative;
    text-align: left
}
  .sui-step-label-vertical-icon-container {
    padding-right: var(--sui-spacing-3)
}
  .sui-step-label-current-label {
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
    font-size: var(--sui-typography-subtitle-bold-font-size);
    font-weight: var(--sui-typography-subtitle-bold-font-weight);
    line-height: var(--sui-typography-subtitle-bold-line-height);
    text-decoration: var(--sui-typography-subtitle-bold-text-decoration);
    text-transform: var(--sui-typography-subtitle-bold-text-transform);
    font-family: var(--sui-font-family)
}
  .sui-step-label-error-label,
    .sui-step-label-error-label-container {
    --tw-text-opacity: 1;
    color: rgb(var(--s-danger-f), calc(var(--s-danger-f-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-step-label.sui-disabled {
    cursor: default
}

.sui-step-button-root {position: relative;display: flex;cursor: pointer;user-select: none;border-style: none;background-color: transparent;vertical-align: middle;outline: 2px solid transparent;outline-offset: 2px;--sui-focus-ring-border-width-recoup: 0;border-radius: var(--sui-border-radius-sm);--sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}@media (prefers-reduced-motion: no-preference) {.sui-step-button-root {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);transition-duration: 150ms;transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}

  @media (hover: hover) {

  .sui-step-button-root:hover {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
  }
}

  .sui-step-button-root.sui-active,
  .sui-step-button-root:active {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
}

  .sui-step-button-root:focus-visible,
  .sui-step-button-root.sui-focus-visible {--sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

  .sui-step-button-root:focus-visible::after,
  .sui-step-button-root.sui-focus-visible::after {pointer-events: none;content: '';position: absolute;inset: 0;border-radius: var(--sui-focus-ring-border-radius, 0px);box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

.sui-step-button-vertical {margin-left: calc(var(--sui-spacing-2) * -1);margin-right: calc(var(--sui-spacing-2) * -1);margin-top: calc(var(--sui-spacing-2) * -1);margin-bottom: calc(var(--sui-spacing-2) * -1);align-items: center;padding-left: var(--sui-spacing-2);padding-right: var(--sui-spacing-2);padding-top: var(--sui-spacing-2);padding-bottom: var(--sui-spacing-2);
}

.sui-step-button-horizontal {margin-top: calc(var(--sui-spacing-3) * -1);margin-bottom: calc(var(--sui-spacing-3) * -1);justify-content: center;padding: var(--sui-spacing-3);
}

.sui-step-button-fixed-width {flex: 1 1 0%;
}

.sui-step-button-highlighted {--tw-bg-opacity: 1;background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-step-button-hide-connector {min-height: var(--sui-spacing-11);
}

.sui-step-content-root {

    font-size: var(--sui-typography-descriptor-font-size);

    font-weight: var(--sui-typography-descriptor-font-weight);

    line-height: var(--sui-typography-descriptor-line-height);

    text-decoration: var(--sui-typography-descriptor-text-decoration);

    text-transform: var(--sui-typography-descriptor-text-transform);

    font-family: var(--sui-font-family);

    position: relative;

    padding-left: var(--sui-spacing-3);

    padding-right: var(--sui-spacing-3)
}

.sui-step-content-wrapper {

    z-index: 10;

    padding-left: var(--sui-spacing-6)
}

.sui-step-content-wrapper .sui-step-connector-root {

    top: var(--sui-spacing-4);

    bottom: calc(var(--sui-spacing-4) * -1);

    left: var(--sui-spacing-0)
}

.sui-step-content-last .sui-step-connector-root {

    display: none
}

.sui-step-connector-root {

    z-index: 10;

    flex-shrink: 1;

    flex-grow: 1
}

.sui-step-connector-horizontal {

    position: relative;

    top: var(--sui-spacing-9);

    flex: 1 1 auto
}

.sui-step-label .sui-step-connector-horizontal:last-child {

    position: absolute;

    right: var(--sui-spacing-0);

    left: calc(50% + var(--sui-spacing-4))
}

.sui-step-label .sui-step-connector-horizontal:first-child {

    position: absolute;

    left: var(--sui-spacing-0);

    right: calc(50% + var(--sui-spacing-4))
}

.sui-step-label .sui-step-connector-vertical:last-child {

    bottom: calc(var(--sui-spacing-4) * -1);

    top: calc(50% + var(--sui-spacing-4))
}

.sui-step-label .sui-step-connector-vertical:first-child {

    top: calc(var(--sui-spacing-4) * -1);

    bottom: calc(50% + var(--sui-spacing-4))
}

.sui-step-connector-vertical {

    position: absolute;

    margin-left: var(--sui-spacing-3);

    display: flex
}

.sui-step-connector-line {

    display: block;

    border-color: var(--sui-colors-neutral-b0-t10)
}

.sui-step-connector-line-horizontal {

    border-top-width: var(--sui-border-width-1);

  border-top-style: solid
}

.sui-step-connector-line-vertical {

    min-height: var(--sui-spacing-3);

    border-left-width: var(--sui-border-width-1);

  border-left-style: solid
}

.sui-step-button .sui-step-connector-horizontal {

    top: var(--sui-spacing-6)
}

.sui-step-button .sui-step-connector-horizontal:last-child {

    right: calc(var(--sui-spacing-1) * -1)
}

.sui-step-button .sui-step-connector-horizontal:first-child {

    left: calc(var(--sui-spacing-1) * -1)
}

.sui-step-root {

  position: relative;

  margin: var(--sui-spacing-0);

  display: flex;

  list-style-type: none;

  padding-top: var(--sui-spacing-0);

  padding-bottom: var(--sui-spacing-0);
}

.sui-step-horizontal {

  flex-direction: row;

  justify-content: center;

  padding-left: var(--sui-spacing-4);

  padding-right: var(--sui-spacing-4);

  padding-top: var(--sui-spacing-6);

  padding-bottom: var(--sui-spacing-6);
}

.sui-step-horizontal:has(.sui-step-button) {

  padding-left: var(--sui-spacing-1);

  padding-right: var(--sui-spacing-1);
}

.sui-step-horizontal {

  text-wrap: nowrap;
}

.sui-step-vertical {

  flex-direction: column;

  padding-top: var(--sui-spacing-4);

  padding-bottom: var(--sui-spacing-4);
}

.sui-step-vertical-hide-connector {

  padding-top: var(--sui-spacing-3);

  padding-bottom: var(--sui-spacing-3);
}

.sui-step-fixed-width {

  flex: 1 1 0%;

  text-wrap: unset;
}

.sui-stepper-root {

    position: relative;

    margin: var(--sui-spacing-0);

    box-sizing: border-box;

    display: flex;

    width: fit-content;

    min-width: 100%;

    list-style-type: none;

    overflow: auto;

    padding: var(--sui-spacing-0)
}

.sui-stepper-horizontal {

    flex-direction: row;

    align-items: flex-start;

    justify-content: space-between
}

.sui-stepper-vertical {

    flex-direction: column;

    overflow: hidden;

    padding-left: var(--sui-spacing-3);

    padding-right: var(--sui-spacing-3)
}

.sui-stepper-fixed-step-width {

    width: 100%
}

.sui-table-body-root {

  display: table-row-group;

  background: inherit
}

.sui-table-cell-root {

    font-size: var(--sui-typography-descriptor-font-size);

    font-weight: var(--sui-typography-descriptor-font-weight);

    line-height: var(--sui-typography-descriptor-line-height);

    text-decoration: var(--sui-typography-descriptor-text-decoration);

    text-transform: var(--sui-typography-descriptor-text-transform);

    font-family: var(--sui-font-family);

    display: table-cell;

    height: var(--sui-spacing-10);

    padding-left: var(--sui-spacing-2);

    text-align: left;

    vertical-align: middle;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

    border-style: solid;

    border-color: var(--sui-colors-neutral-b0-t10);

    border-width: var(--sui-border-width-0);

    --sui-focus-ring-border-width: var(--sui-border-width-0);

    border-bottom-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1;

    background: inherit;
}

    .sui-table-cell-root:first-child:not(.sui-table-cell-padding-checkbox) {

    padding-left: var(--sui-spacing-4);
}

    .sui-table-cell-root:last-child {

    padding-right: var(--sui-spacing-4);
}
  .sui-table-cell-root:last-child .sui-table-cell-content {

    margin-right: calc(var(--sui-spacing-2) * -1);

    width: 100%;
}
  /* variant */
  .sui-table-cell-head {

    font-size: var(--sui-typography-descriptor-mini-semi-bold-font-size);

    font-weight: var(--sui-typography-descriptor-mini-semi-bold-font-weight);

    line-height: var(--sui-typography-descriptor-mini-semi-bold-line-height);

    text-decoration: var(--sui-typography-descriptor-mini-semi-bold-text-decoration);

    text-transform: var(--sui-typography-descriptor-mini-semi-bold-text-transform);

    font-family: var(--sui-font-family);

    vertical-align: middle;
}
  .sui-table-cell-sortable {
    /* kept for backward compatibility */
  }
  .sui-table-cell-content-sortable {

    margin: var(--sui-spacing-0);

    box-sizing: content-box;

    cursor: pointer;

    user-select: none;

    background-color: transparent;

    padding: var(--sui-spacing-0);

    outline: 2px solid transparent;

    outline-offset: 2px;

    border-width: var(--sui-border-width-0);

    --sui-focus-ring-border-width: var(--sui-border-width-0);

    font-size: inherit;

    font-weight: inherit;

    line-height: inherit;

    text-transform: inherit;

    text-decoration: inherit;

    letter-spacing: inherit;

    font-family: inherit;

    color: inherit;

    text-align: inherit;
}
  @media (hover: hover) {
  .sui-table-cell-content-sortable:hover {

        --tw-bg-opacity: 1;

        background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
    }
}
  @media (hover: hover) {
  .sui-table-cell-content-sortable:hover .sui-table-cell-sort-icon {

        display: block;

        opacity: 0.5;
    }
}
  .sui-table-cell-content-sortable:active {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-table-cell-content-sortable:focus-visible,
    .sui-table-cell-content-sortable.sui-focus-visible {

    --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}
  .sui-table-cell-content-sortable:focus-visible::after,
    .sui-table-cell-content-sortable.sui-focus-visible::after {

    pointer-events: none;

    content: '';

    position: absolute;

    inset: 0;

    border-radius: var(--sui-focus-ring-border-radius, 0px);

    box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}
  .sui-table-cell-content-sortable:focus-visible .sui-table-cell-sort-icon, .sui-table-cell-content-sortable.sui-focus-visible .sui-table-cell-sort-icon {

    opacity: 0.5;
}
  /* padding */
  .sui-table-cell-padding-checkbox {
    /* prevent the checkbox column from growing */
    box-sizing: border-box;
    width: var(--sui-spacing-8);
    padding-left: var(--sui-spacing-2);
    padding-right: var(--sui-spacing-1);
  }
  .sui-table-cell-padding-none {

    padding: var(--sui-spacing-0);
}
  /* align */
  .sui-table-cell-align-left {

    text-align: left;
}
  .sui-table-cell-align-center {

    text-align: center;
}
  .sui-table-cell-align-right {

    flex-direction: row-reverse;

    text-align: right;
}
  .sui-table-cell-align-justify {

    text-align: justify;
}
  /* sticky header with default bg */
  .sui-table-cell-sticky-header-default-bg {

    border-bottom-width: var(--sui-border-width-1);
}
  .sui-table-cell-content {

    position: relative;

    margin-left: calc(var(--sui-spacing-2) * -1);

    display: inline-flex;

    align-items: center;

    gap: var(--sui-spacing-1);

    padding-left: var(--sui-spacing-2);

    padding-right: var(--sui-spacing-2);

    padding-top: var(--sui-spacing-2);

    padding-bottom: var(--sui-spacing-2);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}
  @media (prefers-reduced-motion: no-preference) {

    .sui-table-cell-content {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

        transition-duration: 150ms;
    }
}
  .sui-table-cell-content {

    width: calc(
      100% - var(--sui-spacing-2)
    ); /* We need to factor in the -2px margin when calculating the width */
  }
  .sui-table-cell-content-padding-checkbox {
    /* ensures the checkbox is correctly centered */
    margin: var(--sui-spacing-0);
    display: flex;
    width: auto;
    padding: var(--sui-spacing-0);
  }
  .sui-table-cell-content-align-center {

    margin-left: var(--sui-spacing-0);

    margin-right: var(--sui-spacing-0);

    justify-content: center;
}
  .sui-table-cell-content-align-right {

    flex-direction: row-reverse;
}
  .sui-table-cell-content-align-justify {

    margin-left: var(--sui-spacing-0);

    margin-right: var(--sui-spacing-0);
}
  .sui-table-cell-sorted:focus-visible .sui-table-cell-sort-icon, .sui-table-cell-sorted.sui-focus-visible .sui-table-cell-sort-icon {

    display: block;

    opacity: 1;
}
  @media (hover: hover) {
  .sui-table-cell-sorted:hover .sui-table-cell-sort-icon {

        display: block;

        opacity: 1;
    }
}
  .sui-table-cell-sort-icon {

    vertical-align: middle;

    opacity: 0;
}
  @media (prefers-reduced-motion: no-preference) {

    .sui-table-cell-sort-icon {

        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;

        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

        transition-duration: 150ms;
    }
}
  .sui-table-cell-sort-indicator {

    opacity: 0.3;
}
  .sui-table-cell-sort-icon-sorted {

    display: block;

    opacity: 1;
}
  .sui-table-cell-column-divider:not(:last-child) {

    border-right-width: var(--sui-border-width-1);
}
  [dir='rtl'] .sui-table-cell-column-divider:not(:last-child) {

    border-right-width: var(--sui-border-width-0);

    border-left-width: var(--sui-border-width-1);
}

/* stylelint-disable prettier/prettier */
.sui-table-head-root {

  box-sizing: border-box;

  display: table-header-group;

  border-style: solid;

  border-color: var(--sui-colors-neutral-b0-t10);

  border-width: var(--sui-border-width-0);

  --sui-focus-ring-border-width: var(--sui-border-width-0);

  border-bottom-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width-recoup: 1;

  background: inherit
}
.sui-table-head-background {

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)))
}
.sui-table-head-sticky {

  position: sticky;

  top: var(--sui-spacing-0);

  z-index: 10
}

.sui-table-row-root {

  display: table-row;

  vertical-align: middle;

  /* We disable the focus ring for mouse, touch and keyboard users. */

  outline-width: 0px;

  background: inherit;
}

@media (hover: hover) {

.sui-table-row-clickable:hover, .sui-table-row-hoverable:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
  }
}

.sui-table-row-clickable {

  position: relative;

  cursor: pointer;
}

@media (hover: hover) {

.sui-table-row-clickable.sui-selected:hover {

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--tw-bg-opacity)));
  }
}

/* Show focus ring or active state only when the row itself is interacted, not when a child element is interacted */

.sui-table-row-clickable:focus.sui-focus-visible,
    .sui-table-row-clickable:focus:focus-visible {

  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

.sui-table-row-clickable:focus.sui-focus-visible::after,
    .sui-table-row-clickable:focus:focus-visible::after {

  pointer-events: none;

  content: '';

  position: absolute;

  inset: 0;

  border-radius: var(--sui-focus-ring-border-radius, 0px);

  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

/* Raise the focus ring in case a sticky column exists */

.sui-table-row-clickable:focus.sui-focus-visible::after, .sui-table-row-clickable:focus:focus-visible::after {
        z-index: 1;
      }

.sui-table-row-clickable:focus.sui-active,
    .sui-table-row-clickable:focus:active {

  background: var(--s-gradient-stop), var(--s-gradient-base);

  --s-gradient-stop: linear-gradient(0deg, var(--s-gradient-cover) 0%, var(--s-gradient-cover) 100%);

  --s-gradient-base-opacity: 1;

  --s-gradient-base: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--s-gradient-base-opacity)));

  --s-gradient-cover: var(--sui-colors-neutral-b4-t50);
}

.sui-table-row-body.sui-selected {

  background: var(--s-gradient-stop), var(--s-gradient-base);

  --s-gradient-stop: linear-gradient(0deg, var(--s-gradient-cover) 0%, var(--s-gradient-cover) 100%);

  --s-gradient-base-opacity: 1;

  --s-gradient-base: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--s-gradient-base-opacity)));

  --s-gradient-cover: var(--sui-colors-neutral-b4-t50);
}

.sui-table-row-body:last-child .sui-table-cell {

  border-bottom-width: var(--sui-border-width-0);
}

.sui-table-pagination-content {

    display: flex;

    flex-direction: row;

    align-items: center;

    gap: var(--sui-spacing-5)
}

.sui-table-pagination-rows-per-page-controls {

    display: flex;

    flex-direction: row;

    align-items: center;

    gap: var(--sui-spacing-2)
}

.sui-table-pagination-rows-per-page-label {

    font-size: var(--sui-typography-main-text-font-size);

    font-weight: var(--sui-typography-main-text-font-weight);

    line-height: var(--sui-typography-main-text-line-height);

    text-decoration: var(--sui-typography-main-text-text-decoration);

    text-transform: var(--sui-typography-main-text-text-transform);

    font-family: var(--sui-font-family);

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-table-pagination-current-page-controls {

    display: flex;

    flex-direction: row;

    gap: var(--sui-spacing-1)
}

.sui-table-pagination-range-container {

    display: flex;

    min-width: var(--sui-spacing-16);

    flex-direction: row;

    align-items: center;

    justify-content: flex-end;

    gap: var(--sui-spacing-1)
}

.sui-table-pagination-range-container > span {

    font-size: var(--sui-typography-main-text-font-size);

    font-weight: var(--sui-typography-main-text-font-weight);

    line-height: var(--sui-typography-main-text-line-height);

    text-decoration: var(--sui-typography-main-text-text-decoration);

    text-transform: var(--sui-typography-main-text-text-transform);

    font-family: var(--sui-font-family);

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}

.sui-table-footer-root {

  display: table-footer-group;

  background: inherit
}

  .sui-table-footer-root > tr > td {

  border-style: solid;

  border-top-color: var(--sui-colors-neutral-b0-t10);

  border-width: var(--sui-border-width-0);

  --sui-focus-ring-border-width: var(--sui-border-width-0);

  border-top-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width-recoup: 1
}

.sui-table-footer-content {

  box-sizing: border-box;

  display: flex;

  min-height: var(--sui-spacing-10);

  flex-direction: column;

  align-items: flex-start;

  justify-content: center;

  padding-left: var(--sui-spacing-3\.5);

  padding-right: var(--sui-spacing-3\.5);

  padding-top: var(--sui-spacing-2);

  padding-bottom: var(--sui-spacing-2);

  font-size: var(--sui-typography-descriptor-font-size);

  font-weight: var(--sui-typography-descriptor-font-weight);

  line-height: var(--sui-typography-descriptor-line-height);

  text-decoration: var(--sui-typography-descriptor-text-decoration);

  text-transform: var(--sui-typography-descriptor-text-transform);

  font-family: var(--sui-font-family);

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-table-footer-padding-none {

  padding-left: var(--sui-spacing-0);

  padding-right: var(--sui-spacing-0)
}

.sui-table-footer-padding-checkbox {

  padding-left: var(--sui-spacing-2)
}

.sui-table-footer-sticky {

  position: sticky;

  bottom: var(--sui-spacing-0);

  z-index: 10;

  background-color: inherit
}

.sui-table-container {

    box-sizing: border-box
}

  .sui-table-container-root {

    width: 100%;

    overflow-x: auto
}

  .sui-table-container-standard-border {

    border-style: solid;

    border-color: var(--sui-colors-neutral-b0-t20);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1
}

  .sui-table-container-rounded-border {

    border-style: solid;

    border-color: var(--sui-colors-neutral-b0-t20);

    border-radius: var(--sui-border-radius-sm);

    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

    border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width: var(--sui-border-width-1);

    --sui-focus-ring-border-width-recoup: 1
}

.sui-table-root {

    display: table;

    width: 100%;

    border-collapse: collapse;

    --tw-border-spacing-x: var(--sui-spacing-0);

    --tw-border-spacing-y: var(--sui-spacing-0);

    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);

    --tw-bg-opacity: 1;

    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)))
}

.sui-table-sticky-header {

    border-collapse: separate
}

.sui-table-sticky-footer {

    height: 100%;

    border-collapse: separate
}

.sui-tray-root {

    position: relative;

    width: var(--sui-spacing-65);

    overflow: hidden;

    outline: 2px solid transparent;

    outline-offset: 2px
}

.sui-tray-panel-root {

    pointer-events: none;

    position: absolute;

    top: var(--sui-spacing-0);

    left: var(--sui-spacing-0);

    right: var(--sui-spacing-0)
}

.sui-tray-panel-activated {

    pointer-events: auto;

    position: static
}

.sui-dialog-body {
      display: flex;
      min-height: var(--sui-spacing-34);
      flex-direction: column;
      border-style: solid;
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--tw-border-opacity)));
      --tw-bg-opacity: 1;
      background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
      padding-top: var(--sui-spacing-6);
      padding-bottom: var(--sui-spacing-5);
      --tw-text-opacity: 1;
      color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
      --tw-shadow: var(--sui-box-shadow-md);
      --tw-shadow-colored: var(--sui-box-shadow-md);
      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      outline: 2px solid transparent;
      outline-offset: 2px;
      border-radius: var(--sui-border-radius-sm);
      --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
      border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
      position: fixed;
      max-height: 80vh;
      max-width: calc(100% - var(--sui-spacing-12));
      pointer-events: auto;
}
  .sui-dialog-root {
      display: flex;
      align-items: center;
      justify-content: center;
}
  .sui-dialog-non-blocking {
      pointer-events: none;
}
  .sui-dialog-small {
      width: var(--sui-spacing-71);
}
  .sui-dialog-medium {
      width: var(--sui-spacing-100);
}
  .sui-dialog-large {
      width: var(--sui-spacing-150);
}
  .sui-dialog-title-root {
      font-size: var(--sui-typography-title-font-size);
      font-weight: var(--sui-typography-title-font-weight);
      letter-spacing: var(--sui-typography-title-letter-spacing);
      line-height: var(--sui-typography-title-line-height);
      text-decoration: var(--sui-typography-title-text-decoration);
      text-transform: var(--sui-typography-title-text-transform);
      font-family: var(--sui-font-family);
      margin-bottom: var(--sui-spacing-3);
      display: flex;
      flex: none;
      align-items: center;
      justify-content: space-between;
      padding-left: var(--sui-spacing-6);
      padding-right: var(--sui-spacing-6);
}
  .sui-dialog-content-root {
      font-size: var(--sui-typography-main-text-font-size);
      font-weight: var(--sui-typography-main-text-font-weight);
      line-height: var(--sui-typography-main-text-line-height);
      text-decoration: var(--sui-typography-main-text-text-decoration);
      text-transform: var(--sui-typography-main-text-text-transform);
      font-family: var(--sui-font-family);
      flex: 1 1 0%;
      overflow: auto;
      padding-left: var(--sui-spacing-6);
      padding-right: var(--sui-spacing-6);
}
  .sui-dialog-actions-root {
      display: flex;
      flex: none;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: var(--sui-spacing-2);
      padding-left: var(--sui-spacing-6);
      padding-right: var(--sui-spacing-6);
      padding-top: var(--sui-spacing-5);
}
  .sui-dialog-right {
      position: fixed;
      top: 50%;
      left: 50%;
      --tw-translate-x: -50%;
      --tw-translate-y: -50%;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
      right: var(--sui-spacing-0);
      left: auto;
      border-top-right-radius: var(--sui-border-radius-none);
      border-bottom-right-radius: var(--sui-border-radius-none);
      border-right-width: var(--sui-border-width-0);
}
  .sui-dialog-right::after {
      right: calc(var(--sui-spacing-5) * -1);
}
  .sui-dialog-right-close-button {
      left: calc(var(--sui-spacing-4) * -1);
      --tw-translate-x: -100%;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
  .sui-dialog-left {
      position: fixed;
      top: 50%;
      left: 50%;
      --tw-translate-x: -50%;
      --tw-translate-y: -50%;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
      left: var(--sui-spacing-0);
      right: auto;
      border-top-left-radius: var(--sui-border-radius-none);
      border-bottom-left-radius: var(--sui-border-radius-none);
      border-left-width: var(--sui-border-width-0);
}
  .sui-dialog-left::after {
      left: calc(var(--sui-spacing-5) * -1);
}
  .sui-dialog-left-close-button {
      right: calc(var(--sui-spacing-4) * -1);
      --tw-translate-x: 100%;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
  .sui-dialog-full-height {
      top: var(--sui-spacing-0);
      bottom: var(--sui-spacing-0);
      max-height: max-content;
      width: var(--sui-spacing-150);
      --tw-translate-x: calc(var(--sui-spacing-0) * -1);
      --tw-translate-y: calc(var(--sui-spacing-0) * -1);
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
      transform: none;
      max-height: 100vh;
      max-width: calc(100% - var(--sui-spacing-18));
      padding-top: var(--sui-spacing-9);
}
  /* Expand the background color to the edge to prevent any see-through issues with the spring bounce animation. */
  .sui-dialog-full-height::after {
      content: '';
      position: absolute;
      top: -1px;
      height: 100%;
      width: var(--sui-spacing-5);
      border-style: solid;
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-border-opacity)));
      --tw-bg-opacity: 1;
      background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
      border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
    }
  .sui-dialog-full-height .sui-dialog-actions-root {
      border-style: solid;
      border-color: var(--sui-colors-neutral-b0-t10);
      border-width: var(--sui-border-width-0);
      --sui-focus-ring-border-width: var(--sui-border-width-0);
      border-top-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
}
  .sui-dialog-full-height .sui-dialog-title-root {
      font-size: var(--sui-typography-display1-font-size);
      font-weight: var(--sui-typography-display1-font-weight);
      line-height: var(--sui-typography-display1-line-height);
      text-decoration: var(--sui-typography-display1-text-decoration);
      text-transform: var(--sui-typography-display1-text-transform);
      font-family: var(--sui-font-family);
      margin-bottom: var(--sui-spacing-6);
      padding-left: var(--sui-spacing-9);
      padding-right: var(--sui-spacing-9);
}
  .sui-dialog-full-height .sui-dialog-content-root {
      padding-left: var(--sui-spacing-9);
      padding-right: var(--sui-spacing-9);
}
  .sui-dialog-full-height .sui-dialog-close-button {
      position: absolute;
      top: var(--sui-spacing-4);
}
  .sui-dialog-full-screen {
      inset: var(--sui-spacing-0);
      max-height: 100vh;
      width: 100vw;
      max-width: 100%;
      transform: none;
      border-style: none;
      padding: var(--sui-spacing-0);
      border-radius: var(--sui-border-radius-none);
      --sui-focus-ring-border-radius: var(--sui-border-radius-none);
      --sui-focus-ring-border-width-recoup: 0;
}
  .sui-dialog-full-screen .sui-dialog-title-root {
      border-style: solid;
      border-color: var(--sui-colors-neutral-b0-t10);
      padding-top: var(--sui-spacing-5);
      padding-bottom: var(--sui-spacing-5);
      border-width: var(--sui-border-width-0);
      --sui-focus-ring-border-width: var(--sui-border-width-0);
      border-bottom-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
}
  .sui-dialog-full-screen .sui-dialog-actions-root {
      border-style: solid;
      border-color: var(--sui-colors-neutral-b0-t10);
      padding-top: var(--sui-spacing-5);
      padding-bottom: var(--sui-spacing-5);
      border-width: var(--sui-border-width-0);
      --sui-focus-ring-border-width: var(--sui-border-width-0);
      border-top-width: var(--sui-border-width-1);
      --sui-focus-ring-border-width-recoup: 1;
}
  /* Compact Mode - applied via root */
  :where(.sui-dialog-root.sui-compact) .sui-dialog-body {
      min-height: var(--sui-spacing-0);
      padding-top: var(--sui-spacing-3);
      padding-bottom: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-title-root {
      padding-left: var(--sui-spacing-3);
      padding-right: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-content-root {
      padding-left: var(--sui-spacing-3);
      padding-right: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-actions-root {
      padding-left: var(--sui-spacing-3);
      padding-right: var(--sui-spacing-3);
      padding-top: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-height {
      width: var(--sui-spacing-100);
      padding-top: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-height .sui-dialog-title-root {
      font-size: var(--sui-typography-title-font-size);
      font-weight: var(--sui-typography-title-font-weight);
      letter-spacing: var(--sui-typography-title-letter-spacing);
      line-height: var(--sui-typography-title-line-height);
      text-decoration: var(--sui-typography-title-text-decoration);
      text-transform: var(--sui-typography-title-text-transform);
      font-family: var(--sui-font-family);
      margin-bottom: var(--sui-spacing-3);
      padding-left: var(--sui-spacing-3);
      padding-right: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-height .sui-dialog-content-root {
      padding-left: var(--sui-spacing-3);
      padding-right: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-screen {
      padding: var(--sui-spacing-0);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-screen .sui-dialog-title-root {
      padding-top: var(--sui-spacing-3);
      padding-bottom: var(--sui-spacing-3);
}
  :where(.sui-dialog-root.sui-compact) .sui-dialog-full-screen .sui-dialog-actions-root {
      padding-top: var(--sui-spacing-3);
      padding-bottom: var(--sui-spacing-3);
}

.sui-drawer-root {
    position: fixed;
    inset: var(--sui-spacing-0);
    z-index: 1200;
    display: flex
}
  /* Anchor positioning */
  .sui-drawer-anchor-left {
    align-items: center;
    justify-content: flex-start
}
  .sui-drawer-anchor-right {
    align-items: center;
    justify-content: flex-end
}
  .sui-drawer-anchor-top {
    align-items: flex-start;
    justify-content: center
}
  .sui-drawer-anchor-bottom {
    align-items: flex-end;
    justify-content: center
}
  /* Variant-anchor combinations */
  .sui-drawer-persistent-left {
    position: fixed;
    left: var(--sui-spacing-0);
    top: var(--sui-spacing-0);
    bottom: var(--sui-spacing-0)
}
  .sui-drawer-persistent-right {
    position: fixed;
    right: var(--sui-spacing-0);
    top: var(--sui-spacing-0);
    bottom: var(--sui-spacing-0)
}
  .sui-drawer-persistent-top {
    position: fixed;
    top: var(--sui-spacing-0);
    left: var(--sui-spacing-0);
    right: var(--sui-spacing-0)
}
  .sui-drawer-persistent-bottom {
    position: fixed;
    bottom: var(--sui-spacing-0);
    left: var(--sui-spacing-0);
    right: var(--sui-spacing-0)
}
  .sui-drawer-body {
    position: relative;
    display: flex;
    flex-direction: column;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
    --tw-shadow: var(--sui-box-shadow-md);
    --tw-shadow-colored: var(--sui-box-shadow-md);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    pointer-events: auto;
    outline: 2px solid transparent;
    outline-offset: 2px;
    border-style: solid;
    --tw-border-opacity: 1;
    border-color: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--tw-border-opacity)));
    border-width: var(--sui-border-width-0);
    --sui-focus-ring-border-width: var(--sui-border-width-0);
    --sui-focus-ring-border-width-recoup: 1
}
  .sui-drawer-body-left {
    height: 100%;
    width: auto;
    max-width: 100%;
    border-right-width: var(--sui-border-width-1)
}
  .sui-drawer-body-right {
    height: 100%;
    width: auto;
    max-width: 100%;
    border-left-width: var(--sui-border-width-1)
}
  .sui-drawer-body-top {
    max-height: calc(100% - var(--sui-spacing-2));
    width: 100%;
    padding-bottom: var(--sui-spacing-2);
    border-bottom-right-radius: var(--sui-border-radius-sm);
    border-bottom-left-radius: var(--sui-border-radius-sm)
}
  @media (min-width: 768px) {
    .sui-drawer-body-top {
        border-radius: var(--sui-border-radius-none);
        --sui-focus-ring-border-radius: var(--sui-border-radius-none)
    }
}
  .sui-drawer-body-top {
    border-bottom-width: var(--sui-border-width-1)
}
  .sui-drawer-body-bottom {
    max-height: calc(100% - var(--sui-spacing-2));
    width: 100%;
    padding-top: var(--sui-spacing-2);
    border-top-left-radius: var(--sui-border-radius-sm);
    border-top-right-radius: var(--sui-border-radius-sm)
}
  @media (min-width: 768px) {
    .sui-drawer-body-bottom {
        border-radius: var(--sui-border-radius-none);
        --sui-focus-ring-border-radius: var(--sui-border-radius-none)
    }
}
  .sui-drawer-body-bottom {
    border-top-width: var(--sui-border-width-1)
}
  /* Content element */
  .sui-drawer-content {
    overflow-y: auto;

    /* Add safe area padding for mobile devices */
    padding-bottom: env(safe-area-inset-bottom, 0)
}
  .sui-drawer-non-blocking {
    pointer-events: none
}
  .sui-drawer-header {
    position: static
}

.sui-drag-handle-root {
    position: absolute;
    z-index: 10;
    display: flex;
    height: var(--sui-spacing-4);
    width: 100%;
    cursor: grab;
    touch-action: none
}
  .sui-drag-handle-root:active {
    cursor: grabbing
}
  .sui-drag-handle-top {
    bottom: var(--sui-spacing-2);
    align-items: flex-end;
    justify-content: center
}
  .sui-drag-handle-bottom {
    top: var(--sui-spacing-2);
    justify-content: center
}
  .sui-drag-handle-bar {
    pointer-events: auto;
    height: var(--sui-spacing-1);
    width: var(--sui-spacing-8);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
    border-radius: var(--sui-border-radius-full);
    --sui-focus-ring-border-radius: var(--sui-border-radius-full)
}
  @media (prefers-reduced-motion: no-preference) {
    .sui-drag-handle-bar {
        transition-property: opacity;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms
    }
}
  @media (hover: hover) and (pointer: fine) {
    .sui-drag-handle-bar:hover {
        opacity: 0.8
    }
}

.sui-swipeable-drawer-header-drag {
    cursor: grab;
    touch-action: none
}
.sui-swipeable-drawer-header-drag:active {
    cursor: grabbing
}

.sui-suggestion-list-root {
    position: relative;
    padding-left: var(--sui-spacing-2);
    padding-right: var(--sui-spacing-2);
}

  .sui-suggestion-list-root::before {
    content: '';
    display: block;
    height: var(--sui-suggestion-list-vertical-padding, 0px);
    width: 0;
  }

  .sui-suggestion-list-root::after {
    content: '';
    display: block;
    height: var(--sui-suggestion-list-vertical-padding, 0px);
    width: 0;
  }

.sui-suggestion-list-item {
    font-size: var(--sui-typography-subtitle-mini-font-size);
    font-weight: var(--sui-typography-subtitle-mini-font-weight);
    line-height: var(--sui-typography-subtitle-mini-line-height);
    text-decoration: var(--sui-typography-subtitle-mini-text-decoration);
    text-transform: var(--sui-typography-subtitle-mini-text-transform);
    font-family: var(--sui-font-family);
    display: flex;
    min-height: var(--sui-spacing-8);
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    padding-left: var(--sui-spacing-2);
    padding-right: var(--sui-spacing-2);
    padding-top: var(--sui-spacing-1);
    padding-bottom: var(--sui-spacing-1);
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
    border-radius: var(--sui-border-radius-sm);
    --sui-focus-ring-border-radius: var(--sui-border-radius-sm);
}

.sui-suggestion-list-item:not(.sui-suggestion-list-readonly, .sui-disabled) {
    cursor: pointer;
}

@media (hover: hover) {

.sui-suggestion-list-item:hover:not(.sui-disabled) {
        --tw-bg-opacity: 1;
        background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
    }
}

.sui-suggestion-list-item.sui-disabled:not(.sui-suggestion-list-readonly) {
    pointer-events: none;
    cursor: default;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-suggestion-list-item:focus-visible,
  .sui-suggestion-list-item.sui-focus-visible {
    --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}

.sui-suggestion-list-item:focus-visible::after,
  .sui-suggestion-list-item.sui-focus-visible::after {
    pointer-events: none;
    content: '';
    position: absolute;
    inset: 0;
    border-radius: var(--sui-focus-ring-border-radius, 0px);
    box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}

.sui-suggestion-list-selected,
.sui-suggestion-list-highlighted {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-suggestion-list-group-title-readonly {
    font-size: var(--sui-typography-subtitle-bold-font-size);
    font-weight: var(--sui-typography-subtitle-bold-font-weight);
    line-height: var(--sui-typography-subtitle-bold-line-height);
    text-decoration: var(--sui-typography-subtitle-bold-text-decoration);
    text-transform: var(--sui-typography-subtitle-bold-text-transform);
    font-family: var(--sui-font-family);
}

.sui-suggestion-list-expand-icon {
    margin-left: auto;
    margin-right: var(--sui-spacing-1);
}

.sui-suggestion-list-root:where(.sui-compact) {
    padding-left: var(--sui-spacing-1);
    padding-right: var(--sui-spacing-1);
}

.sui-suggestion-list-item:where(.sui-compact) {
    min-height: var(--sui-spacing-6);
    border-radius: var(--sui-border-radius-xs);
    --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}

.sui-autocomplete-chevron {

  height: var(--sui-spacing-6);

  width: var(--sui-spacing-6);

  flex-shrink: 0;

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));

  /* default */

  --sui-squircle-bg-color: transparent;

  /* pressed */

  --s-squircle-bg-color-active-opacity: 1;

  --sui-squircle-bg-color-active: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--s-squircle-bg-color-active-opacity)));

  /* hover */

  --s-squircle-bg-color-hover-opacity: 1;

  --sui-squircle-bg-color-hover: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--s-squircle-bg-color-hover-opacity)));
}

  .sui-autocomplete-chevron:not(:first-child) {

  margin-left: var(--sui-spacing-2);
}

.sui-autocomplete-clear {

  opacity: 0;
}

@media (hover: hover) {

.sui-autocomplete-root:hover .sui-autocomplete-clear {

    opacity: 1;
  }
}

.sui-autocomplete-root:focus .sui-autocomplete-clear, .sui-autocomplete-root:focus-within .sui-autocomplete-clear, .sui-autocomplete-root.sui-focused .sui-autocomplete-clear {

  opacity: 1;
}

.sui-autocomplete-root.sui-disabled .sui-autocomplete-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)));
}

.sui-autocomplete-root.sui-disabled .sui-autocomplete-clear {

  opacity: 0;
}

/* Allow scrolling for tags container when disabled */

.sui-autocomplete-root.sui-disabled .sui-autocomplete-input-container {

  pointer-events: auto;
}

.sui-autocomplete-form-field-content {

  height: auto;

  overflow: visible;
}

.sui-autocomplete-form-field-content-xlarge {

  min-height: var(--sui-spacing-12);
}

.sui-autocomplete-form-field-content-large {

  min-height: var(--sui-spacing-9);
}

.sui-autocomplete-form-field-content-medium {

  min-height: var(--sui-spacing-8);
}

.sui-autocomplete-input-container {

  margin-left: calc(var(--sui-spacing-0\.5) * -1);

  margin-right: calc(var(--sui-spacing-0\.5) * -1);

  display: flex;

  height: 100%;

  max-height: var(--sui-spacing-42);

  flex-grow: 1;

  flex-wrap: wrap;

  align-items: center;

  gap: var(--sui-spacing-1);

  overflow-y: auto;

  padding-left: var(--sui-spacing-0\.5);

  padding-right: var(--sui-spacing-0\.5);
}

.sui-autocomplete-input-container-xlarge {

  padding-top: 7px;

  padding-bottom: 7px;
}

.sui-autocomplete-input-container-large {

  gap: var(--sui-spacing-0\.75);

  padding-top: var(--sui-spacing-0\.75);

  padding-bottom: var(--sui-spacing-0\.75);
}

.sui-autocomplete-input-container-medium {

  gap: var(--sui-spacing-0\.75);

  padding-top: var(--sui-spacing-0\.75);

  padding-bottom: var(--sui-spacing-0\.75);
}

.sui-autocomplete-input {

  min-width: var(--sui-spacing-7);

  flex: 1 1 0%;
}

.sui-autocomplete-input-xlarge {

  height: var(--sui-spacing-8);
}

.sui-autocomplete-input-large {

  height: var(--sui-spacing-7);
}

.sui-autocomplete-input-medium {

  height: var(--sui-spacing-6);
}

.sui-autocomplete-outlined-expanded {

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
}

.sui-autocomplete-outlined-expanded-chevron {
      --sui-squircle-bg-color: var(--sui-colors-neutral-b3);
    }

.sui-autocomplete-standard-expanded-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-primary-f), calc(var(--s-primary-f-opacity, 1) * var(--tw-text-opacity)));
}

.sui-autocomplete-error-chevron {

  --tw-text-opacity: 1;

  color: rgb(var(--s-danger), calc(var(--s-danger-opacity, 1) * var(--tw-text-opacity)));
}

.sui-autocomplete-end-adornment {

  margin-left: var(--sui-spacing-2);
}

/* popper */

.sui-autocomplete-popper-root {

  z-index: 1300;

  outline: 2px solid transparent;

  outline-offset: 2px;
}

.sui-autocomplete-popper-root[data-sui-popper-placement^='bottom'] .sui-popper-widget {

  transform-origin: top;
}

.sui-autocomplete-popper-root[data-sui-popper-placement^='top'] .sui-popper-widget {

  transform-origin: bottom;
}

.sui-autocomplete-popper-paper {

  border-style: solid;

  border-color: var(--sui-colors-neutral-b0-t20);

  --tw-bg-opacity: 1;

  background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));

  --tw-shadow: var(--sui-box-shadow-md);

  --tw-shadow-colored: var(--sui-box-shadow-md);

  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);

  border-radius: var(--sui-border-radius-sm);

  --sui-focus-ring-border-radius: var(--sui-border-radius-sm);

  border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width: var(--sui-border-width-1);

  --sui-focus-ring-border-width-recoup: 1;
}

.sui-autocomplete-popper-empty {

  border-style: none;

  --sui-focus-ring-border-width-recoup: 0;
}

.sui-empty-state-root {

    display: flex;

    min-width: var(--sui-spacing-65);

    max-width: var(--sui-spacing-115);

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: var(--sui-spacing-6);

    padding-left: var(--sui-spacing-8);

    padding-right: var(--sui-spacing-8)
}

.sui-empty-state-icon {

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-text-opacity)))
}

.sui-empty-state-icon > span {

    font-size: 64px
}

.sui-empty-state-text-container {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: var(--sui-spacing-3)
}

.sui-empty-state-title {

    font-size: var(--sui-typography-title-font-size);

    font-weight: var(--sui-typography-title-font-weight);

    letter-spacing: var(--sui-typography-title-letter-spacing);

    line-height: var(--sui-typography-title-line-height);

    text-decoration: var(--sui-typography-title-text-decoration);

    text-transform: var(--sui-typography-title-text-transform);

    font-family: var(--sui-font-family);

    text-align: center;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b1), calc(var(--s-neutral-b1-opacity, 1) * var(--tw-text-opacity)))
}

.sui-empty-state-description {

    font-size: var(--sui-typography-main-text-font-size);

    font-weight: var(--sui-typography-main-text-font-weight);

    line-height: var(--sui-typography-main-text-line-height);

    text-decoration: var(--sui-typography-main-text-text-decoration);

    text-transform: var(--sui-typography-main-text-text-transform);

    font-family: var(--sui-font-family);

    text-align: center;

    --tw-text-opacity: 1;

    color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)))
}

.sui-empty-state-actions {

    display: flex;

    flex-direction: row;

    align-items: flex-start;

    gap: var(--sui-spacing-4)
}

/* stylelint-disable no-empty-source */

.sui-tab-container {
  display: flex;
}
  .sui-tab-pill-badge {
  position: absolute;
  top: calc(var(--sui-spacing-0\.5) * -1);
  right: var(--sui-spacing-0);
}
  .sui-tab-badge-root {
  z-index: 10;
}
  .sui-tab-root {
  font-size: var(--sui-typography-label-semi-bold-font-size);
  font-weight: var(--sui-typography-label-semi-bold-font-weight);
  letter-spacing: var(--sui-typography-label-semi-bold-letter-spacing);
  line-height: var(--sui-typography-label-semi-bold-line-height);
  text-decoration: var(--sui-typography-label-semi-bold-text-decoration);
  text-transform: var(--sui-typography-label-semi-bold-text-transform);
  font-family: var(--sui-font-family);
  position: relative;
  height: var(--sui-spacing-12);
  cursor: pointer;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
  @media (prefers-reduced-motion: no-preference) {
  .sui-tab-root {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    transition-duration: var(--sui-transition-neutral-01-fast-transition-duration);
    transition-timing-function: var(--sui-transition-neutral-01-fast-transition-timing-function);
  }
}
  .sui-tab-root {
  display: flex;
  flex-grow: 1;
  flex-basis: var(--sui-spacing-0);
  align-items: flex-end;
  justify-content: center;
  padding-bottom: var(--sui-spacing-3\.5);
  border-style: none;
  background-color: transparent;
  --sui-focus-ring-border-width-recoup: 0;
}
  .sui-tab-root.sui-selected {
  position: relative;
  --tw-text-opacity: 1;
  color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-tab-root:focus-visible,
    .sui-tab-root.sui-focus-visible {
  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}
  .sui-tab-root:focus-visible::after,
    .sui-tab-root.sui-focus-visible::after {
  pointer-events: none;
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--sui-focus-ring-border-radius, 0px);
  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}
  .sui-tab-root:focus-visible,
    .sui-tab-root.sui-focus-visible {
  border-radius: var(--sui-border-radius-xs);
  --sui-focus-ring-border-radius: var(--sui-border-radius-xs);
}
  @media (hover: hover) {
  .sui-tab-root:hover {
    --tw-text-opacity: 1;
    color: rgb(var(--s-cobranding-high-contrast), calc(var(--s-cobranding-high-contrast-opacity, 1) * var(--tw-text-opacity)));
  }
}
  @media (hover: hover) {
  .sui-tab-root:hover .sui-tab-badge {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-cobranding-high-contrast), calc(var(--s-cobranding-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-w0), calc(var(--s-neutral-w0-opacity, 1) * var(--tw-text-opacity)));
  }
}
  /* Use :active pseudo-class for pressed state.
       .sui-active class is still applied by JS for backward compatibility. */
  .sui-tab-root:active {
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-tab-root:active .sui-tab-badge {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-tab-label {
  min-width: var(--sui-spacing-25);
  max-width: var(--sui-spacing-60);
  padding-left: var(--sui-spacing-2);
  padding-right: var(--sui-spacing-2);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b2), calc(var(--s-neutral-b2-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-tab-label-container {
  height: var(--sui-spacing-3\.5);
  width: 100%;
  align-items: center;
  justify-content: center;
}
  .sui-tab-label-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
  .sui-tab-label-badge-root {
  margin-left: var(--sui-spacing-1);
  flex-shrink: 0;
}
  .sui-tab-icon {
  min-width: var(--sui-spacing-9\.5);
  max-width: var(--sui-spacing-24\.75);
  padding-left: var(--sui-spacing-1);
  padding-right: var(--sui-spacing-1);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
}
  .sui-tab-icon-container {
  height: var(--sui-spacing-5\.5);
  align-items: flex-end;
}
  .sui-tab-icon-pill {
  min-width: var(--sui-spacing-14);
}
  .sui-tab-icon-pill .sui-tab-container {
  height: auto;
}
  .sui-tab-icon-badge-root {
  align-self: flex-start;
}
  .sui-tab-large {
  font-size: var(--sui-typography-subtitle-mini-font-size);
  font-weight: var(--sui-typography-subtitle-mini-font-weight);
  line-height: var(--sui-typography-subtitle-mini-line-height);
  text-decoration: var(--sui-typography-subtitle-mini-text-decoration);
  text-transform: var(--sui-typography-subtitle-mini-text-transform);
  font-family: var(--sui-font-family);
  height: var(--sui-spacing-13);
  padding-bottom: var(--sui-spacing-4\.5);
}
  .sui-tab-pill {
  font-size: var(--sui-typography-subtitle-mini-font-size);
  font-weight: var(--sui-typography-subtitle-mini-font-weight);
  line-height: var(--sui-typography-subtitle-mini-line-height);
  text-decoration: var(--sui-typography-subtitle-mini-text-decoration);
  text-transform: var(--sui-typography-subtitle-mini-text-transform);
  font-family: var(--sui-font-family);
  height: var(--sui-spacing-9);
  min-width: var(--sui-spacing-18);
  align-items: center;
  justify-content: center;
  border-style: solid;
  border-color: var(--sui-colors-neutral-b0-t20);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)));
  padding-left: var(--sui-spacing-4);
  padding-right: var(--sui-spacing-4);
  padding-top: var(--sui-spacing-0);
  padding-bottom: var(--sui-spacing-0);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  border-radius: var(--sui-border-radius-full);
  --sui-focus-ring-border-radius: var(--sui-border-radius-full);
  border-width: var(--sui-border-width-1);
  --sui-focus-ring-border-width: var(--sui-border-width-1);
  --sui-focus-ring-border-width-recoup: 1;
}
  .sui-tab-pill-small {
  height: var(--sui-spacing-8);
}
  .sui-tab-pill:not(:first-child) {
  margin-left: var(--sui-spacing-1);
}
  .sui-tab-pill:focus-visible,
    .sui-tab-pill.sui-focus-visible {
  --sui-focus-ring-color: var(--sui-focus-ring-inset-color);
}
  .sui-tab-pill:focus-visible::after,
    .sui-tab-pill.sui-focus-visible::after {
  pointer-events: none;
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--sui-focus-ring-border-radius, 0px);
  box-shadow: inset 0 0 0 var(--sui-focus-ring-inset-width) var(--sui-focus-ring-color);
}
  .sui-tab-pill:focus-visible,
    .sui-tab-pill.sui-focus-visible {
  border-radius: var(--sui-border-radius-full);
  --sui-focus-ring-border-radius: var(--sui-border-radius-full);
}
  @media (hover: hover) {
  .sui-tab-pill:hover {
    border-color: var(--sui-colors-neutral-b0-t30);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b5), calc(var(--s-neutral-b5-opacity, 1) * var(--tw-bg-opacity)));
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)));
  }
}
  .sui-tab-pill:active {
  --tw-border-opacity: 1;
  border-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-border-opacity)));
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
}
  .sui-tab-pill.sui-selected {
  background: var(--s-gradient-stop), var(--s-gradient-base);
  border-color: var(--sui-colors-neutral-b0-t20);
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-high-contrast-inverted-b0), calc(var(--s-neutral-high-contrast-inverted-b0-opacity, 1) * var(--tw-text-opacity)));
  --s-gradient-stop: linear-gradient(0deg, var(--s-gradient-cover) 0%, var(--s-gradient-cover) 100%);
  --s-gradient-base-opacity: 1;
  --s-gradient-base: rgb(var(--s-neutral-b4), calc(var(--s-neutral-b4-opacity, 1) * var(--s-gradient-base-opacity)));
  --s-gradient-cover-opacity: 1;
  --s-gradient-cover: rgb(var(--s-neutral-high-contrast), calc(var(--s-neutral-high-contrast-opacity, 1) * var(--s-gradient-cover-opacity)));
}
  @media (hover: hover) {
  .sui-tab-pill.sui-selected:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-b3), calc(var(--s-neutral-b3-opacity, 1) * var(--tw-bg-opacity)));
  }
}
  /* Label and icon pill cobranding */
  .sui-tab-label-pill-cobranding.sui-selected, .sui-tab-icon-pill-cobranding.sui-selected {
      background: none;
      --tw-border-opacity: 1;
      border-color: rgb(var(--s-cobranding), calc(var(--s-cobranding-opacity, 1) * var(--tw-border-opacity)));
      --tw-bg-opacity: 1;
      background-color: rgb(var(--s-cobranding), calc(var(--s-cobranding-opacity, 1) * var(--tw-bg-opacity)));
      --tw-text-opacity: 1;
      color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
    }
  @media (hover: hover) {
  .sui-tab-label-pill-cobranding.sui-selected:hover, .sui-tab-icon-pill-cobranding.sui-selected:hover {
    --tw-border-opacity: 1;
    border-color: rgb(var(--s-cobranding-high-contrast), calc(var(--s-cobranding-high-contrast-opacity, 1) * var(--tw-border-opacity)));
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-cobranding-high-contrast), calc(var(--s-cobranding-high-contrast-opacity, 1) * var(--tw-bg-opacity)));
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
  }
}
  .sui-tab-label-pill-cobranding.sui-selected:active, .sui-tab-icon-pill-cobranding.sui-selected:active {
  --tw-border-opacity: 1;
  border-color: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--tw-border-opacity)));
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-neutral-high-contrast-w0), calc(var(--s-neutral-high-contrast-w0-opacity, 1) * var(--tw-bg-opacity)));
  --tw-text-opacity: 1;
  color: rgb(var(--s-neutral-high-contrast-b0), calc(var(--s-neutral-high-contrast-b0-opacity, 1) * var(--tw-text-opacity)));
}
  /* compact mode */
  .sui-tab-root:where(.sui-compact) {
  height: var(--sui-spacing-7);
  padding-bottom: var(--sui-spacing-1\.5);
}
  .sui-tab-pill:where(.sui-compact) {
  height: var(--sui-spacing-8);
  min-width: var(--sui-spacing-9);
  padding-top: var(--sui-spacing-0);
  padding-bottom: var(--sui-spacing-0);
}

/* stylelint-disable property-no-vendor-prefix */
.sui-tabs-root {
  position: relative;
  z-index: 0;
  box-sizing: border-box;
  height: var(--sui-spacing-12);
}
.sui-tabs-large {
  height: var(--sui-spacing-13);
}
.sui-tabs-scroller {
  position: relative;
  height: 100%;
  width: 100%;

  /* Hide dimensionless scrollbar on macOS */
  scrollbar-width: none;
}
/* Firefox */
.sui-tabs-scroller::-webkit-scrollbar {
    display: none; /* Safari + Chrome */
  }
.sui-tabs-scrollable .sui-tabs-scroller {
  overflow-x: auto;
  overflow-y: hidden;
}
.sui-tabs-scrollable .sui-tab {
  flex: 1 1 auto;
  flex-grow: 0;
}
.sui-tabs-tab-list {
  position: relative;
  display: flex;
  min-width: fit-content;
  flex-direction: row;
}
.sui-tabs-underline {
  position: absolute;
  bottom: var(--sui-spacing-0);
  left: var(--sui-spacing-0);
  right: var(--sui-spacing-0);
  z-index: -10;
  height: var(--sui-spacing-0\.25);
  width: 100%;
  background-color: var(--sui-colors-neutral-b0-t10);
}
.sui-tabs-indicator {
  position: absolute;
  bottom: var(--sui-spacing-0);
  height: var(--sui-spacing-0\.5);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-bg-opacity)));
}
.sui-tabs-compact .sui-tab {
  min-width: var(--sui-spacing-0);
  flex: 1 1 auto;
  flex-grow: 0;
}
.sui-tabs-pill {
  height: auto;
}
.sui-tabs-pill .sui-tabs-scroller {
  overflow-x: visible;
}
.sui-tabs-pill {

  --sui-tabs-tab-list-padding-top: var(--sui-spacing-0\.5);
}
.sui-tabs-pill .sui-tabs-tab-list {
  padding-left: var(--sui-spacing-1);
  padding-right: var(--sui-spacing-1);
  padding-bottom: var(--sui-spacing-2\.5);

    padding-top: var(--sui-tabs-tab-list-padding-top);
}
.sui-tabs-pill .sui-tab-more-menu-root {
  padding-bottom: var(--sui-spacing-0);
}
.sui-tabs-pill .sui-tab-more-menu-button {
  margin-bottom: var(--sui-spacing-0);
  margin-right: var(--sui-spacing-0);
}
.sui-tabs-pill .sui-tabs-underline {
  display: none;
}
/* with scroll button */
.sui-tabs-pill.sui-tabs-scroll-left .sui-tabs-scroller {
      -webkit-mask-image: linear-gradient(
        to right,
        transparent var(--sui-spacing-10),
        var(--sui-colors-neutral-b0) var(--sui-spacing-20)
      );
      mask-image: linear-gradient(
        to right,
        transparent var(--sui-spacing-10),
        var(--sui-colors-neutral-b0) var(--sui-spacing-20)
      );
    }
.sui-tabs-pill.sui-tabs-scroll-right .sui-tabs-scroller {
      -webkit-mask-image: linear-gradient(
        to right,
        var(--sui-colors-neutral-b0) calc(100% - var(--sui-spacing-20)),
        transparent calc(100% - var(--sui-spacing-10))
      );
      mask-image: linear-gradient(
        to right,
        var(--sui-colors-neutral-b0) calc(100% - var(--sui-spacing-20)),
        transparent calc(100% - var(--sui-spacing-10))
      );
    }
.sui-tabs-pill.sui-tabs-scroll-both .sui-tabs-scroller {
      -webkit-mask-image: linear-gradient(
        to right,
        transparent var(--sui-spacing-10),
        var(--sui-colors-neutral-b0) var(--sui-spacing-20),
        var(--sui-colors-neutral-b0) calc(100% - var(--sui-spacing-20)),
        transparent calc(100% - var(--sui-spacing-10))
      );
      mask-image: linear-gradient(
        to right,
        transparent var(--sui-spacing-10),
        var(--sui-colors-neutral-b0) var(--sui-spacing-20),
        var(--sui-colors-neutral-b0) calc(100% - var(--sui-spacing-20)),
        transparent calc(100% - var(--sui-spacing-10))
      );
    }
.sui-tabs-floating-underline {
  position: absolute;
  left: var(--sui-spacing-0);
  bottom: var(--sui-spacing-0);
  height: var(--sui-spacing-0\.5);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--s-cobranding-f), calc(var(--s-cobranding-f-opacity, 1) * var(--tw-bg-opacity)));
}
/* more menu */
.sui-tab-more-menu-root {
  position: relative;
  margin-left: auto;
  display: flex;
  flex-shrink: 0;
  align-items: flex-end;
  padding-bottom: var(--sui-spacing-3\.5);
}
.sui-tab-more-menu-button {
  margin-bottom: calc(var(--sui-spacing-1\.5) * -1);
}
.sui-tab-more-menu-badge-root .sui-badge-dot.sui-badge-content {
  margin-bottom: var(--sui-spacing-0\.5);
}
.sui-tab-more-menu-pill-badge {
  position: absolute;
  top: calc(var(--sui-spacing-0\.5) * -1);
  right: var(--sui-spacing-0);
}
/* scroll button */
.sui-tab-scroll-button-root {
  position: absolute;
  top: var(--sui-spacing-0);
  bottom: var(--sui-spacing-0);
  z-index: 10;
  right: var(--sui-spacing-0);

  padding-top: var(--sui-tabs-tab-list-padding-top);
}
.sui-tab-scroll-button-start {
  right: auto;
  left: var(--sui-spacing-0);
}
/* compact mode */
.sui-tabs-root:where(.sui-compact) {
  height: var(--sui-spacing-7);
}
.sui-tabs-pill:where(.sui-compact) {
  height: auto;
}

.sui-page-header-root {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    --tw-bg-opacity: 1;
    background-color: rgb(var(--s-neutral-base), calc(var(--s-neutral-base-opacity, 1) * var(--tw-bg-opacity)))
}
  .sui-page-header-left-root,
  .sui-page-header-right-root {
    position: absolute;
    top: var(--sui-spacing-0);
    display: flex;
    height: 100%;
    align-items: center
}
  .sui-page-header-left-root {
    left: var(--sui-spacing-4);
    justify-content: flex-start
}
  .sui-page-header-right-root {
    right: var(--sui-spacing-4);
    justify-content: flex-end
}
  .sui-page-header-center-root {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center
}
  .sui-page-header-title-root {
    font-size: var(--sui-typography-subtitle-font-size);
    font-weight: var(--sui-typography-subtitle-font-weight);
    line-height: var(--sui-typography-subtitle-line-height);
    text-decoration: var(--sui-typography-subtitle-text-decoration);
    text-transform: var(--sui-typography-subtitle-text-transform);
    font-family: var(--sui-font-family);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    --tw-text-opacity: 1;
    color: rgb(var(--s-neutral-b0), calc(var(--s-neutral-b0-opacity, 1) * var(--tw-text-opacity)))
}
  .sui-page-header-title-root:not(:only-child) {
    margin-right: var(--sui-spacing-1)
}
  .sui-page-header-integrated {
    height: var(--sui-spacing-15);
    padding-left: var(--sui-spacing-25);
    padding-right: var(--sui-spacing-25)
}
  .sui-page-header-integrated .sui-page-header-left-root,
    .sui-page-header-integrated .sui-page-header-right-root {
    gap: var(--sui-spacing-3)
}
  .sui-page-header-detached {
    height: var(--sui-spacing-10);
    padding-left: var(--sui-spacing-21);
    padding-right: var(--sui-spacing-21)
}
  .sui-page-header-detached .sui-page-header-left-root,
    .sui-page-header-detached .sui-page-header-right-root {
    gap: var(--sui-spacing-2)
}
  /* Compact Mode */
  .sui-page-header-root:where(.sui-compact) {
    height: var(--sui-spacing-9)
}
  :where(.sui-page-header-root.sui-compact) .sui-page-header-left-root {
    left: var(--sui-spacing-3)
}
  :where(.sui-page-header-root.sui-compact) .sui-page-header-right-root {
    right: var(--sui-spacing-3)
}



/* inter-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-ext-400-normal.39fbf8d2c4abc46f721f.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-ext-400-normal.818b84180553acc613f3.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-400-normal.89455522650c3fb3654c.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-400-normal.dd21c71421d58232ef03.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-greek-ext-400-normal.f2ef63e732b18d636044.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-greek-ext-400-normal.fc80974ec6969ee03fd2.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-greek-400-normal.e685387f69602567b1da.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-greek-400-normal.b412faded087fbcfa4ff.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-vietnamese-400-normal.44c9df135eec470b0ab6.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-vietnamese-400-normal.aaa15d735e3826061950.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-latin-ext-400-normal.210fb826cb25acbd4094.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-latin-ext-400-normal.c616205185f0d3677df9.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://wcdn.ringcentral.com/_whc/inter-latin-400-normal.eca1e21531598d5db58f.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-latin-400-normal.2ea1079c0069eb040a52.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-ext-500-normal.b2740f247d3be4a05ca0.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-ext-500-normal.e9974e820735012b025b.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-500-normal.33a76a7cbcfcb7076534.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-cyrillic-500-normal.72f7a9db87626ca30c76.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-greek-ext-500-normal.4c6d520b97e3bb4ef613.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-greek-ext-500-normal.47cc2391a7edf82cf4e1.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-greek-500-normal.e7cec4ef4f6780e90a52.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-greek-500-normal.6d34bacda2be54829b97.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-vietnamese-500-normal.63d02ea896a7406849b6.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-vietnamese-500-normal.296d66c0bba9086788b9.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-latin-ext-500-normal.cdb4dd5dc508fe6e7398.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-latin-ext-500-normal.2f93aaa35e870cec4704.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(https://wcdn.ringcentral.com/_whc/inter-latin-500-normal.b7c27c60f848f2083f45.woff2?appVersion=23.2.30) format('woff2'), url(https://wcdn.ringcentral.com/_whc/inter-latin-500-normal.5014db633e71a7741bf5.woff?appVersion=23.2.30) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/*# sourceMappingURL=vendors.c053e83ea791aef1181dv1.css.map?appVersion=23.2.30*/