html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html, button {
  line-height: 1;
}

body {
  font-family: serif;
  line-height: 1;
  font-size: 14px;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
}
ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

img {
  max-width: 100%;
  height: auto;
  border: none;
}

a {
  text-decoration: none;
}

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

:focus {
  outline: none;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

.cf:before, .cf:after {
  content: ".";
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.cf:after {
  clear: both;
}

[data-simplebar] {
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.simplebar-wrapper {
  overflow: hidden;
  width: inherit;
  height: inherit;
  max-width: inherit;
  max-height: inherit;
}

.simplebar-mask {
  direction: inherit;
  position: absolute;
  overflow: hidden;
  padding: 0;
  margin: 0;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: auto !important;
  height: auto !important;
  z-index: 0;
}

.simplebar-offset {
  direction: inherit !important;
  -webkit-box-sizing: inherit !important;
          box-sizing: inherit !important;
  resize: none !important;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 0;
  margin: 0;
  -webkit-overflow-scrolling: touch;
}

.simplebar-content-wrapper {
  direction: inherit;
  -webkit-box-sizing: border-box !important;
          box-sizing: border-box !important;
  position: relative;
  display: block;
  height: 100%; /* Required for horizontal native scrollbar to not appear if parent is taller than natural height */
  width: auto;
  max-width: 100%; /* Not required for horizontal scroll to trigger */
  max-height: 100%; /* Needed for vertical scroll to trigger */
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.simplebar-content-wrapper::-webkit-scrollbar,
.simplebar-hide-scrollbar::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.simplebar-content:before,
.simplebar-content:after {
  content: " ";
  display: table;
}

.simplebar-placeholder {
  max-height: 100%;
  max-width: 100%;
  width: 100%;
  pointer-events: none;
}

.simplebar-height-auto-observer-wrapper {
  -webkit-box-sizing: inherit !important;
          box-sizing: inherit !important;
  height: 100%;
  width: 100%;
  max-width: 1px;
  position: relative;
  float: left;
  max-height: 1px;
  overflow: hidden;
  z-index: -1;
  padding: 0;
  margin: 0;
  pointer-events: none;
  -webkit-box-flex: inherit;
      -ms-flex-positive: inherit;
          flex-grow: inherit;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
}

.simplebar-height-auto-observer {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
  display: block;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  height: 1000%;
  width: 1000%;
  min-height: 1px;
  min-width: 1px;
  overflow: hidden;
  pointer-events: none;
  z-index: -1;
}

.simplebar-track {
  z-index: 1;
  position: absolute;
  right: 0;
  bottom: 0;
  pointer-events: none;
  overflow: hidden;
}

[data-simplebar].simplebar-dragging {
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

[data-simplebar].simplebar-dragging .simplebar-content {
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

[data-simplebar].simplebar-dragging .simplebar-track {
  pointer-events: all;
}

.simplebar-scrollbar {
  position: absolute;
  left: 0;
  right: 0;
  min-height: 10px;
}

.simplebar-scrollbar:before {
  position: absolute;
  content: "";
  background: black;
  border-radius: 7px;
  left: 2px;
  right: 2px;
  opacity: 0;
  -webkit-transition: opacity 0.2s 0.5s linear;
  -o-transition: opacity 0.2s 0.5s linear;
  transition: opacity 0.2s 0.5s linear;
}

.simplebar-scrollbar.simplebar-visible:before {
  opacity: 0.5;
  -webkit-transition-delay: 0s;
       -o-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

.simplebar-track.simplebar-vertical {
  top: 0;
  width: 11px;
}

.simplebar-scrollbar:before {
  top: 2px;
  bottom: 2px;
  left: 2px;
  right: 2px;
}

.simplebar-track.simplebar-horizontal {
  left: 0;
  height: 11px;
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
  right: auto;
  left: 0;
  top: 0;
  bottom: 0;
  min-height: 0;
  min-width: 10px;
  width: auto;
}

/* Rtl support */
[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
  right: auto;
  left: 0;
}

.simplebar-dummy-scrollbar-size {
  direction: rtl;
  position: fixed;
  opacity: 0;
  visibility: hidden;
  height: 500px;
  width: 500px;
  overflow-y: hidden;
  overflow-x: scroll;
  -ms-overflow-style: scrollbar !important;
}

.simplebar-dummy-scrollbar-size > div {
  width: 200%;
  height: 200%;
  margin: 10px 0;
}

.simplebar-hide-scrollbar {
  position: fixed;
  left: 0;
  visibility: hidden;
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

:root {
  --bb180: #04102E;
  --bb160: #09205C;
  --bb140: #0D3089;
  --bb120: #1240B7;
  --bb110: #1448CE;
  --bb100: #1650E5;
  --bb80: #4573EA;
  --bb70: #5C85ED;
  --bb60: #7396EF;
  --bb50: #8BA8F2;
  --bb40: #A2B9F5;
  --bb30: #B9CBF7;
  --bb20: #D0DCFA;
  --bb10: #E8EEFC;
  --bb180-rgb: 4, 16, 46;
  --bb160-rgb: 9, 32, 92;
  --bb140-rgb: 13, 48, 137;
  --bb120-rgb: 18, 64, 183;
  --bb110-rgb: 20, 72, 206;
  --bb100-rgb: 22, 80, 229;
  --bb80-rgb: 69, 115, 234;
  --bb70-rgb: 92, 133, 237;
  --bb60-rgb: 115, 150, 239;
  --bb50-rgb: 139, 168, 242;
  --bb40-rgb: 162, 185, 245;
  --bb30-rgb: 185, 203, 247;
  --bb20-rgb: 208, 220, 250;
  --bb10-rgb: 232, 238, 252;
  --nw: #ffffff;
  --nb: #000000;
  --n10: #F8F9FA;
  --n20: #F1F3F5;
  --n30: #E9ECEF;
  --n40: #DEE2E6;
  --n50: #CED4DA;
  --n60: #ADB5BD;
  --n70: #868E96;
  --n75: #5F676E;
  --n80: #495057;
  --n90: #343A40;
  --n100: #212529;
  --red: #E03131;
  --font: "Rubik", "Segoe UI", "Roboto", sans-serif;
}

.besida-ui-kit__page {
  max-width: 1400px;
  width: 100%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.besida-ui-kit__cover {
  margin-top: 20px;
  background: var(--bb100);
  border-radius: 12px;
  padding: 20px;
}
.besida-ui-kit__cover__logo {
  width: 32px;
  height: 32px;
}
.besida-ui-kit__cover__logo path {
  fill: var(--nw);
}
.besida-ui-kit__cover h1 {
  font-size: 28px;
  font-weight: 600;
  color: var(--nw);
  margin-top: 12px;
  margin-bottom: 4px;
}
.besida-ui-kit__cover .date {
  font-size: 16px;
  font-weight: 400;
  color: var(--nw);
  opacity: 0.6;
}
.besida-ui-kit__section {
  padding: 0 20px;
  margin: 32px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.besida-ui-kit__section__title {
  font-size: 24px;
  font-weight: 600;
  color: #000;
  margin-bottom: 12px;
  width: 100%;
}
.besida-ui-kit__section__navbar {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding-top: 8px;
  padding: 8px;
  width: 180px;
  margin-right: 40px;
  position: sticky;
  top: 20px;
  height: calc(100vh - 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.besida-ui-kit__section__navbar a {
  font-size: 14px;
  color: var(--n80);
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  margin-bottom: 16px;
}
.besida-ui-kit__section__navbar a:hover {
  opacity: 0.6;
}
.besida-ui-kit__section__navbar a.active {
  color: var(--bb100);
}
.besida-ui-kit__section__body {
  width: calc(100% - 220px);
}
.besida-ui-kit__section.page-links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 16px;
  width: 100%;
}
.besida-ui-kit__section.page-links .page-links-card {
  padding: 20px;
  border-radius: 10px;
  border: solid 1px var(--n40);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: calc(25% - 12px);
  min-width: 200px;
}
.besida-ui-kit__section.page-links .page-links-title {
  font-weight: 500;
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 12px;
}
.besida-ui-kit__section.page-links .b-pl__footer__usefull-links-item {
  font-size: 14px;
  margin-bottom: 8px;
}
.besida-ui-kit__element {
  margin-bottom: 40px;
}
.besida-ui-kit__element__name {
  font-size: 18px;
  font-weight: 400;
  color: var(--n80);
  margin-bottom: 12px;
}
.besida-ui-kit__element__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 16px;
  border: solid 1px var(--n30);
  border-radius: 8px;
}
.besida-ui-kit__element__list-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--n30);
}
.besida-ui-kit__element__list-header div {
  font-size: 12px;
  font-weight: 500;
  color: var(--n70);
}
.besida-ui-kit__element__list-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--n30);
}
.besida-ui-kit__element__list-item:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.besida-ui-kit__element__list-item__preview {
  margin-right: 16px;
}
.besida-ui-kit__element__list-item__classes {
  font-family: "Source Code Pro", monospace;
  font-size: 14px;
  font-weight: 400;
  color: var(--n80);
}
.besida-ui-kit__element#button .besida-ui-kit__element__list-item__preview,
.besida-ui-kit__element#button .besida-ui-kit__element__list-header-left {
  width: 140px;
  margin-right: 16px;
}
.besida-ui-kit__element#text-field .besida-ui-kit__element__list-item__preview,
.besida-ui-kit__element#text-field .besida-ui-kit__element__list-header-left {
  width: 260px;
  margin-right: 24px;
}

body {
  font-family: var(--font);
}

.be-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 100%;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  font-family: "Rubik", sans-serif;
  font-style: normal;
  font-weight: 400;
  padding: 8px 20px;
  border-radius: 8px;
  max-height: 36px;
  background: var(--bb100);
  color: var(--nw);
  -webkit-transition: background 0.35s ease;
  -o-transition: background 0.35s ease;
  transition: background 0.35s ease;
}
.be-button:hover {
  background: var(--bb120);
}
.be-button:active {
  background: var(--bb140);
}
.be-button:disabled, .be-button.disabled {
  background: var(--n50);
  color: var(--n70);
  cursor: not-allowed;
}
.be-button:disabled .be-icon, .be-button.disabled .be-icon {
  fill: var(--n70);
}
.be-button label {
  pointer-events: none;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  overflow: hidden;
}
.be-button--big {
  padding: 12px 28px;
  max-height: 44px;
}
.be-button--small {
  padding: 4px 16px;
  max-height: 28px;
}
.be-button--primary .be-icon {
  fill: var(--nw);
}
.be-button.--fw {
  width: 100%;
}
.be-button--secondary {
  background: var(--n20);
  color: var(--nb);
}
.be-button--secondary:hover {
  background: var(--n40);
}
.be-button--secondary:active {
  background: var(--n60);
}
.be-button--secondary .be-icon {
  fill: var(--nb);
}
.be-button--secondary.transparent {
  border: 1px solid #DEE2E6;
  background: transparent;
}
.be-button--secondary.transparent:hover {
  background: var(--n20);
}
.be-button--secondary.transparent:active {
  background: var(--n40);
}
.be-button--tertiatry {
  background: var(--bb10);
  color: var(--bb120);
}
.be-button--tertiatry:hover {
  background: var(--bb20);
}
.be-button--tertiatry:active {
  background: var(--bb40);
}
.be-button--tertiatry .be-icon {
  fill: var(--bb120);
}
.be-button--tertiatry.be-button.danger {
  background: #FFF5F5;
  color: #C92A2A;
}
.be-button--tertiatry.be-button.danger svg {
  fill: #C92A2A;
}
.be-button--tertiatry.be-button.danger:hover {
  background: #FEE3E3;
}
.be-button--tertiatry.be-button.danger:active {
  background: #EED3D3;
}
.be-button--tertiatry.be-button.success {
  background: #E5F6F1;
  color: #137C5A;
}
.be-button--tertiatry.be-button.success svg {
  fill: #137C5A;
}
.be-button--tertiatry.be-button.success:hover {
  background: #CAE4DD;
}
.be-button--tertiatry.be-button.success:active {
  background: #B9D3CC;
}
.be-button .be-icon {
  display: none;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-button.w-left-icon .be-icon.left {
  margin-right: 8px;
  display: inline-block;
}
.be-button.w-right-icon .be-icon.right {
  margin-left: 8px;
  display: inline-block;
}
.be-button.w-icon {
  padding: 8px 8px;
  max-width: 36px;
}
.be-button.w-icon .be-icon.left {
  display: inline-block;
}
.be-button.w-icon label {
  display: none;
}
.be-button.w-icon.be-button--big {
  padding: 12px;
  max-width: 44px;
}
.be-button.w-icon.be-button--small {
  padding: 4px;
  max-width: 28px;
}
.be-button.danger {
  background: #E51616;
}
.be-button.danger:hover {
  background: #c60f0f;
}
.be-button.danger:active {
  background: #b10f0f;
}
.be-button.success {
  background: #137C5A;
  color: #fff;
}
.be-button.success svg {
  fill: #fff;
}
.be-button.success:hover {
  background: #0D5D43;
}
.be-button.success:active {
  background: #083F2D;
}
.be-button.loading {
  background: var(--bb70);
  color: var(--bb10);
  cursor: not-allowed;
}
.be-button.loading .be-icon.left {
  margin-right: 8px;
  display: inline-block;
  -webkit-animation: spin 4s infinite linear;
          animation: spin 4s infinite linear;
  fill: var(--bb10);
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.be-button.loading.be-button--secondary {
  background: var(--n20);
  color: var(--n70);
}
.be-button.loading.be-button--secondary .be-icon.left {
  fill: var(--n70);
}
.be-button.loading.be-button--tertiatry {
  background: var(--bb10);
  color: var(--bb60);
}
.be-button.loading.be-button--tertiatry .be-icon.left {
  fill: var(--bb60);
}

.be-text-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 100%;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  font-family: "Rubik", sans-serif;
  font-style: normal;
  font-weight: 400;
  color: var(--bb100);
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
}
.be-text-button:hover {
  color: var(--bb60);
}
.be-text-button:hover .be-icon {
  fill: var(--bb60);
}
.be-text-button:active {
  color: var(--bb100);
}
.be-text-button:active .be-icon {
  fill: var(--bb100);
}
.be-text-button:disabled, .be-text-button.disabled {
  cursor: not-allowed;
  color: var(--n70);
}
.be-text-button:disabled .be-icon, .be-text-button.disabled .be-icon {
  fill: var(--n70);
}
.be-text-button label {
  pointer-events: none;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  overflow: hidden;
}
.be-text-button .be-icon {
  display: none;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  fill: var(--bb100);
}
.be-text-button.w-left-icon .be-icon.left {
  margin-right: 8px;
  display: inline-block;
}
.be-text-button.w-right-icon .be-icon.right {
  margin-left: 8px;
  display: inline-block;
}
.be-text-button.w-icon .be-icon.left {
  display: inline-block;
}
.be-text-button.w-icon label {
  display: none;
}
.be-text-button.--fw {
  width: 100%;
}

.be-input-row {
  width: 100%;
}
.be-input-row.w-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.be-input-row.w-button .be-select, .be-input-row.w-button .be-text-field {
  width: 100%;
}
.be-input-row.w-button.w-label {
  gap: 4px;
}
.be-input-row.w-button.w-label .be-text-field.w-label {
  margin-bottom: 0;
}
.be-input-row.w-button.w-label .be-text-field.w-label .be-text-field__label {
  margin-bottom: 0;
}

.be-input-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-input-group > .be-text-field__label {
  display: block;
  width: 100%;
}
.be-input-group .inputs-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-input-group.vertical .inputs-wrap {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
}

.be-input-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 8px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  gap: 8px;
  border-radius: 4px;
  background: var(--n20);
}
.be-input-box__footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-input-box__footer .be-icon {
  fill: var(--bb100);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-input-box__footer .txt {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: var(--n100);
}

.be-icon-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: none;
  background: none;
  cursor: pointer;
  padding: 6px;
  border-radius: 8px;
  max-height: 36px;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-icon-button .be-icon {
  fill: var(--n100);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-icon-button:hover:not(.grey) {
  background: var(--bb10);
}
.be-icon-button:hover:not(.grey) .be-icon {
  fill: var(--bb100);
}
.be-icon-button:hover.grey {
  background: var(--n30);
}
.be-icon-button:active:not(.grey) {
  background: var(--bb20);
}
.be-icon-button:active.grey {
  background: var(--n50);
}
.be-icon-button.disabled, .be-icon-button:disabled {
  cursor: not-allowed;
}
.be-icon-button.disabled:hover, .be-icon-button:disabled:hover {
  background: var(--n10);
}
.be-icon-button.disabled .be-icon, .be-icon-button:disabled .be-icon {
  fill: var(--n70);
}

.be-link {
  cursor: pointer;
  font-size: 14px;
  color: var(--bb100);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0% 1.5px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(var(--bb100-rgb), 0.1)), to(rgba(var(--bb100-rgb), 0.1)));
  background-image: -o-linear-gradient(rgba(var(--bb100-rgb), 0.1), rgba(var(--bb100-rgb), 0.1));
  background-image: linear-gradient(rgba(var(--bb100-rgb), 0.1), rgba(var(--bb100-rgb), 0.1));
}
.be-link:hover {
  background-size: 100% 1.5px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(var(--bb100-rgb), 1)), to(rgba(var(--bb100-rgb), 1)));
  background-image: -o-linear-gradient(rgba(var(--bb100-rgb), 1), rgba(var(--bb100-rgb), 1));
  background-image: linear-gradient(rgba(var(--bb100-rgb), 1), rgba(var(--bb100-rgb), 1));
}

.be-icon {
  width: 24px;
  height: 24px;
  fill: var(--n100);
}
.be-icon.--sz16 {
  width: 16px;
  height: 16px;
}
.be-icon.--sz20 {
  width: 20px;
  height: 20px;
}

.be-text-field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-text-field__label {
  display: none;
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: var(--n90);
  margin-bottom: 4px;
}
.be-text-field__helper {
  display: none;
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: var(--n70);
  margin-top: 4px;
}
.be-text-field__input {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-text-field__input--wrap {
  position: relative;
  width: 100%;
}
.be-text-field__input textarea,
.be-text-field__input input {
  display: inline-block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  background: var(--nw);
  border: none;
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  border-radius: 4px;
  max-height: 36px;
  padding: 8px;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  -webkit-appearance: none;
}
.be-text-field__input textarea::-webkit-input-placeholder, .be-text-field__input input::-webkit-input-placeholder {
  color: var(--n70);
}
.be-text-field__input textarea::-moz-placeholder, .be-text-field__input input::-moz-placeholder {
  color: var(--n70);
}
.be-text-field__input textarea:-ms-input-placeholder, .be-text-field__input input:-ms-input-placeholder {
  color: var(--n70);
}
.be-text-field__input textarea::-ms-input-placeholder, .be-text-field__input input::-ms-input-placeholder {
  color: var(--n70);
}
.be-text-field__input textarea::placeholder,
.be-text-field__input input::placeholder {
  color: var(--n70);
}
.be-text-field__input textarea:hover,
.be-text-field__input input:hover {
  -webkit-box-shadow: inset 0 0 0 1px var(--n70);
          box-shadow: inset 0 0 0 1px var(--n70);
}
.be-text-field__input textarea:focus,
.be-text-field__input input:focus {
  -webkit-box-shadow: inset 0 0 0 2px var(--n100);
          box-shadow: inset 0 0 0 2px var(--n100);
}
.be-text-field__input textarea:disabled,
.be-text-field__input input:disabled {
  cursor: not-allowed;
  background: var(--n10);
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
}
.be-text-field__input .be-icon {
  display: none;
  position: absolute;
  fill: var(--n80);
  pointer-events: none;
  padding: 6px;
}
.be-text-field__input .be-icon.clickable {
  cursor: pointer;
  pointer-events: initial;
}
.be-text-field__input--prefix {
  display: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: var(--n20);
  border: solid 1px var(--n40);
  border-radius: 2px 0px 0px 2px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 4px 8px;
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: var(--n90);
  margin-right: -1px;
}
.be-text-field--big .be-text-field__input input {
  padding: 12px 8px;
  max-height: 40px;
}
.be-text-field--small .be-text-field__input input {
  padding: 4px 8px;
  max-height: 28px;
}
.be-text-field.w-left-icon .be-text-field__input input {
  padding-left: 32px;
}
.be-text-field.w-left-icon .be-text-field__input .be-icon.left {
  display: block;
  left: 3px;
  top: calc(50% - 14px);
}
.be-text-field.w-right-icon .be-text-field__input input {
  padding-right: 32px;
}
.be-text-field.w-right-icon .be-text-field__input .be-icon.right {
  display: block;
  right: 3px;
  top: calc(50% - 14px);
}
.be-text-field.disabled .be-text-field__input {
  cursor: not-allowed;
}
.be-text-field.disabled .be-text-field__input input {
  background: var(--n10);
  pointer-events: none;
  color: var(--n75);
}
.be-text-field.error .be-text-field__input input {
  -webkit-box-shadow: inset 0 0 0 1.5px var(--red);
          box-shadow: inset 0 0 0 1.5px var(--red);
}
.be-text-field.error .be-text-field__helper {
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  color: var(--red);
}
.be-text-field.textarea .be-text-field__input textarea {
  height: 60px;
  max-height: 60px;
  resize: none;
}
.be-text-field.required .be-text-field__label:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: super;
  margin-left: 4px;
  background: url("../img/svg/asterisk.svg") no-repeat;
}
.be-text-field.w-label .be-text-field__label {
  display: block;
}
.be-text-field.w-helper .be-text-field__helper {
  display: block;
}
.be-text-field.w-prefix .be-text-field__input--prefix {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-text-field.w-prefix .be-text-field__input input {
  border-radius: 0px 4px 4px 0px;
}

.be-connected-inputs input[type=number] {
  -webkit-appearance: none;
}
.be-connected-inputs input[type=number]::-webkit-outer-spin-button, .be-connected-inputs input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.be-select .be-select__options {
  max-height: 160px;
  max-width: 100%;
}
.be-select__input {
  position: relative;
}
.be-select__input input {
  pointer-events: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  background: var(--nw);
  border: none;
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  border-radius: 4px;
  max-height: 36px;
  padding: 8px;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  padding-right: 32px;
  -webkit-appearance: none;
}
.be-select__input input::-webkit-input-placeholder {
  color: var(--n70);
}
.be-select__input input::-moz-placeholder {
  color: var(--n70);
}
.be-select__input input:-ms-input-placeholder {
  color: var(--n70);
}
.be-select__input input::-ms-input-placeholder {
  color: var(--n70);
}
.be-select__input input::placeholder {
  color: var(--n70);
}
.be-select__input > .be-icon {
  display: block;
  position: absolute;
  fill: var(--n80);
  pointer-events: none;
  padding: 6px;
  right: 3px;
  top: calc(50% - 14px);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-select:hover .be-select__input input {
  -webkit-box-shadow: inset 0 0 0 1px var(--n70);
          box-shadow: inset 0 0 0 1px var(--n70);
}
.be-select:hover.multiselect .selections-row {
  -webkit-box-shadow: inset 0 0 0 1px var(--n70);
          box-shadow: inset 0 0 0 1px var(--n70);
}
.be-select:not(.active) .be-select__options {
  pointer-events: none;
}
.be-select.active .be-select__input input {
  -webkit-box-shadow: inset 0 0 0 2px var(--n100);
          box-shadow: inset 0 0 0 2px var(--n100);
}
.be-select.active .be-select__input .be-icon {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.be-select.active.multiselect .selections-row {
  -webkit-box-shadow: inset 0 0 0 2px var(--n100);
          box-shadow: inset 0 0 0 2px var(--n100);
}
.be-select.multiselect .selections-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  background: var(--nw);
  border: none;
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  border-radius: 4px;
  min-height: 36px;
  padding: 8px 28px 8px 8px;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
}
.be-select--big .be-select__input input {
  padding: 12px 8px;
  max-height: 40px;
}
.be-select--small .be-select__input input {
  padding: 4px 8px;
  max-height: 28px;
}
.be-select.error .be-select__input input {
  -webkit-box-shadow: inset 0 0 0 1.5px var(--red);
          box-shadow: inset 0 0 0 1.5px var(--red);
}
.be-select.error .be-text-field__helper {
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  color: var(--red);
}
.be-select.required .be-text-field__label:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: super;
  margin-left: 4px;
  background: url("../img/svg/asterisk.svg") no-repeat;
}
.be-select.disabled {
  cursor: not-allowed;
}
.be-select.disabled .be-select__input {
  pointer-events: none;
}
.be-select.disabled .be-select__input input {
  background: var(--n10);
  color: var(--n75);
}
.be-select.w-label .be-text-field__label {
  display: block;
}
.be-select.w-helper .be-text-field__helper {
  display: block;
}

.be-checkbox {
  min-width: 20px;
  position: relative;
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-checkbox__check {
  position: absolute;
  top: 0;
  left: 0;
  vertical-align: top;
  margin-top: 2px;
  width: 16px;
  height: 16px;
  display: inline-block;
  cursor: pointer;
  border: solid 1px var(--n50);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  overflow: hidden;
  border-radius: 2px;
  background: var(--nw);
}
.be-checkbox__check:hover {
  border-color: var(--n60);
  background: var(--n20);
}
.be-checkbox__check:before {
  content: "";
  height: 1.5px;
  width: 5px;
  border-radius: 1px;
  display: block;
  -webkit-transform: rotateZ(45deg) scaleX(0);
      -ms-transform: rotate(45deg) scaleX(0);
          transform: rotateZ(45deg) scaleX(0);
  top: 6.5px;
  left: 3px;
  position: absolute;
  background: var(--n50);
  -webkit-transition: -webkit-transform 0.1s;
  transition: -webkit-transform 0.1s;
  -o-transition: transform 0.1s;
  transition: transform 0.1s;
  transition: transform 0.1s, -webkit-transform 0.1s;
  -webkit-transition-delay: 0.1s;
       -o-transition-delay: 0.1s;
          transition-delay: 0.1s;
  -webkit-transform-origin: 0% 0%;
      -ms-transform-origin: 0% 0%;
          transform-origin: 0% 0%;
}
.be-checkbox__check:after {
  content: "";
  height: 1.5px;
  width: 10px;
  border-radius: 1px;
  display: block;
  -webkit-transform: rotateZ(135deg) scaleX(0);
      -ms-transform: rotate(135deg) scaleX(0);
          transform: rotateZ(135deg) scaleX(0);
  top: 8.5px;
  right: 9.4px;
  position: absolute;
  background: var(--n50);
  -webkit-transition: -webkit-transform 0.1s;
  transition: -webkit-transform 0.1s;
  -o-transition: transform 0.1s;
  transition: transform 0.1s;
  transition: transform 0.1s, -webkit-transform 0.1s;
  -webkit-transition-delay: 0s;
       -o-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-transform-origin: 100% 100%;
      -ms-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}
.be-checkbox input[type=checkbox] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  z-index: -10;
  -webkit-appearance: checkbox;
}
.be-checkbox label {
  cursor: pointer;
  display: inline-block;
  position: relative;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-checkbox label span {
  font: 14px var(--font);
  color: var(--n90);
  line-height: 20px;
  padding-left: 24px;
  display: inline-block;
}
.be-checkbox input[type=checkbox]:checked + label .be-checkbox__check {
  background: var(--bb100);
  border-color: var(--bb100);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.be-checkbox input[type=checkbox]:checked + label .be-checkbox__check:after {
  background: #fff;
  -webkit-transform: rotateZ(135deg) scaleX(1);
      -ms-transform: rotate(135deg) scaleX(1);
          transform: rotateZ(135deg) scaleX(1);
  -webkit-transition-delay: 0.05s;
       -o-transition-delay: 0.05s;
          transition-delay: 0.05s;
}
.be-checkbox input[type=checkbox]:checked + label .be-checkbox__check:before {
  background: #fff;
  -webkit-transform: rotateZ(45deg) scaleX(1);
      -ms-transform: rotate(45deg) scaleX(1);
          transform: rotateZ(45deg) scaleX(1);
  -webkit-transition-delay: 0s;
       -o-transition-delay: 0s;
          transition-delay: 0s;
}
.be-checkbox--small .be-checkbox__check {
  width: 12px;
  height: 12px;
}
.be-checkbox--small .be-checkbox__check:before {
  width: 4px;
  top: 4.5px;
  left: 2px;
}
.be-checkbox--small .be-checkbox__check:after {
  width: 8px;
  top: 6px;
  right: 7.4px;
}
.be-checkbox--small label span {
  font: 12px var(--font);
  line-height: 16px;
  padding-left: 20px;
}
.be-checkbox.w-border label {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  border-radius: 8px;
  padding: 8px 12px 8px 8px;
}
.be-checkbox.w-border label:hover {
  -webkit-box-shadow: inset 0 0 0 1px var(--n50);
          box-shadow: inset 0 0 0 1px var(--n50);
  background: var(--n20);
}
.be-checkbox.w-border .be-checkbox__check {
  top: 8px;
  left: 8px;
}
.be-checkbox.w-border input[type=checkbox]:checked + label {
  -webkit-box-shadow: inset 0 0 0 1px var(--bb100);
          box-shadow: inset 0 0 0 1px var(--bb100);
}
.be-checkbox.w-border.be-checkbox--small label {
  padding: 6px 12px 6px 8px;
}
.be-checkbox.w-border.be-checkbox--small .be-checkbox__check {
  top: 6px;
}
.be-checkbox.disabled {
  cursor: not-allowed;
}
.be-checkbox.disabled .be-checkbox__check {
  border-color: var(--n30);
  background: var(--n10);
}
.be-checkbox.disabled label span {
  color: var(--n60);
}
.be-checkbox.disabled > * {
  cursor: not-allowed;
  pointer-events: none;
}
.be-checkbox.disabled.w-border .be-checkbox__check {
  border-color: var(--n50);
  background: var(--n10);
}
.be-checkbox.disabled.w-border label {
  background: var(--n10);
  -webkit-box-shadow: inset 0 0 0 1px var(--n30);
          box-shadow: inset 0 0 0 1px var(--n30);
}
.be-checkbox.disabled.w-border label span {
  color: var(--n70);
}
.be-checkbox.error .be-checkbox__check {
  border-color: var(--red);
  -webkit-box-shadow: inset 0 0 0 0.5px var(--red);
          box-shadow: inset 0 0 0 0.5px var(--red);
}
.be-checkbox.error .be-text-field__helper {
  width: 100%;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  color: var(--red);
}
.be-checkbox.w-label .be-text-field__label {
  display: block;
  width: 100%;
}
.be-checkbox.w-helper .be-text-field__helper {
  display: block;
  width: 100%;
}
.be-checkbox.required .be-text-field__label:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: super;
  margin-left: 4px;
  background: url("../img/svg/asterisk.svg") no-repeat;
}
.be-checkbox.--full-width {
  width: 100%;
}
.be-checkbox.--full-width .be-checkbox__wrap,
.be-checkbox.--full-width label {
  width: 100%;
}
.be-checkbox--group .be-checkbox__wrap {
  margin-right: 4px;
}
.be-checkbox.tag-style .be-checkbox__check {
  display: none;
}
.be-checkbox.tag-style label {
  border-radius: 4px;
  padding: 6px !important;
  background: var(--n30);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.be-checkbox.tag-style label span {
  padding-left: 0;
}
.be-checkbox.tag-style label:hover {
  background: var(--n50);
}
.be-checkbox.tag-style input[type=checkbox]:checked + label {
  -webkit-box-shadow: none;
          box-shadow: none;
  background: var(--bb100);
}
.be-checkbox.tag-style input[type=checkbox]:checked + label span {
  color: var(--nw);
}
.be-checkbox.tag-style.square label {
  width: 28px;
  text-align: center;
}
.be-checkbox.tag-style.month {
  width: 30%;
}
.be-checkbox.tag-style.month .be-checkbox__wrap {
  width: 100%;
}
.be-checkbox.tag-style.month label {
  width: 100%;
  text-align: center;
}

.be-radio-button {
  min-width: 20px;
  position: relative;
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-radio-button__check {
  position: absolute;
  top: 0;
  left: 0;
  vertical-align: top;
  margin-top: 2px;
  width: 16px;
  height: 16px;
  display: inline-block;
  cursor: pointer;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  overflow: hidden;
  border-radius: 20px;
  background: var(--nw);
  -webkit-box-shadow: inset 0 0 0 1px var(--n50);
          box-shadow: inset 0 0 0 1px var(--n50);
}
.be-radio-button__check:hover {
  -webkit-box-shadow: inset 0 0 0 1px var(--n60);
          box-shadow: inset 0 0 0 1px var(--n60);
  background: var(--n20);
}
.be-radio-button input[type=radio] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  z-index: -10;
  -webkit-appearance: checkbox;
}
.be-radio-button label {
  cursor: pointer;
  display: inline-block;
  position: relative;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-radio-button label span {
  font: 14px var(--font);
  color: var(--n90);
  line-height: 20px;
  padding-left: 24px;
  display: inline-block;
}
.be-radio-button input[type=radio]:checked + label .be-radio-button__check {
  -webkit-box-shadow: inset 0 0 0 5px var(--bb100);
          box-shadow: inset 0 0 0 5px var(--bb100);
}
.be-radio-button--small label span {
  font: 12px var(--font);
  line-height: 16px;
  padding-left: 20px;
}
.be-radio-button.w-border label {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  border-radius: 8px;
  padding: 8px 12px 8px 8px;
}
.be-radio-button.w-border label:hover {
  -webkit-box-shadow: inset 0 0 0 1px var(--n50);
          box-shadow: inset 0 0 0 1px var(--n50);
  background: var(--n20);
}
.be-radio-button.w-border .be-radio-button__check {
  top: 8px;
  left: 8px;
}
.be-radio-button.w-border input[type=radio]:checked + label {
  -webkit-box-shadow: inset 0 0 0 1px var(--bb100);
          box-shadow: inset 0 0 0 1px var(--bb100);
}
.be-radio-button.w-border.be-radio-button--small label {
  padding: 6px 12px 6px 8px;
}
.be-radio-button.w-border.be-radio-button--small input[type=radio]:checked + label .be-radio-button__check {
  -webkit-box-shadow: inset 0 0 0 4px var(--bb100);
          box-shadow: inset 0 0 0 4px var(--bb100);
}
.be-radio-button.w-border.be-radio-button--small .be-radio-button__check {
  width: 14px;
  height: 14px;
  top: 5px;
  left: 8px;
}
.be-radio-button.w-border.be-radio-button--big label {
  padding: 12px 8px 12px 12px;
}
.be-radio-button.w-border.be-radio-button--big .be-radio-button__check {
  top: 12px;
  left: 12px;
}
.be-radio-button.disabled {
  cursor: not-allowed;
}
.be-radio-button.disabled .be-checkbox__check {
  border-color: var(--n30);
  background: var(--n10);
}
.be-radio-button.disabled label span {
  color: var(--n60);
}
.be-radio-button.disabled > * {
  cursor: not-allowed;
  pointer-events: none;
}
.be-radio-button.disabled.w-border .be-checkbox__check {
  border-color: var(--n50);
  background: var(--n10);
}
.be-radio-button.disabled.w-border label {
  background: var(--n10);
  -webkit-box-shadow: inset 0 0 0 1px var(--n30);
          box-shadow: inset 0 0 0 1px var(--n30);
}
.be-radio-button.disabled.w-border label span {
  color: var(--n70);
}
.be-radio-button.error .be-checkbox__check {
  border-color: var(--red);
  -webkit-box-shadow: inset 0 0 0 0.5px var(--red);
          box-shadow: inset 0 0 0 0.5px var(--red);
}
.be-radio-button.error .be-text-field__helper {
  width: 100%;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  color: var(--red);
}
.be-radio-button.w-label .be-text-field__label {
  display: block;
  width: 100%;
}
.be-radio-button.w-helper .be-text-field__helper {
  display: block;
  width: 100%;
}
.be-radio-button.required .be-text-field__label:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: super;
  margin-left: 4px;
  background: url("../img/svg/asterisk.svg") no-repeat;
}
.be-radio-button.--full-width {
  width: 100%;
}
.be-radio-button.--full-width .be-checkbox__wrap,
.be-radio-button.--full-width label {
  width: 100%;
}
.be-radio-button--group .be-checkbox__wrap {
  margin-right: 4px;
}

.be-tooltip {
  position: relative;
}
.be-tooltip__trigger .be-icon {
  fill: var(--n70);
  -webkit-transition: fill 0.35s ease;
  -o-transition: fill 0.35s ease;
  transition: fill 0.35s ease;
}
.be-tooltip:hover .be-tooltip__trigger .be-icon {
  fill: var(--n90) !important;
}
.be-tooltip:hover .be-tooltip__content {
  opacity: 1;
  visibility: visible;
}
.be-tooltip__content {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.35s ease;
  -o-transition: opacity 0.35s ease;
  transition: opacity 0.35s ease;
  top: calc(100% + 4px);
  left: 0;
  padding: 4px 8px;
  border-radius: 6px;
  background: var(--nb);
  z-index: 2;
  max-width: 220px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  color: var(--nw);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}
.be-tooltip__content .bold {
  font-weight: 500;
}
.be-tooltip__content > * {
  width: 100%;
}
.be-tooltip__content ul li {
  padding-left: 4px;
}
.be-tooltip__content ul li:before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 3px;
  background: #fff;
  border-radius: 12px;
  margin-right: 8px;
  vertical-align: middle;
}

.be-tag {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: 2px 4px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  border-radius: 3px;
  background: var(--bb100);
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  max-height: 22px;
}
.be-tag.w-right-icon .be-icon.right {
  display: inline-block;
}
.be-tag.w-left-icon .be-icon.left {
  display: inline-block;
}
.be-tag.clickable {
  cursor: pointer;
}
.be-tag.clickable:hover.--light.--grey {
  background: var(--n40);
}
.be-tag.clickable .be-icon {
  pointer-events: none;
}
.be-tag label {
  font-size: 12px;
  line-height: 16px;
  color: inherit;
  pointer-events: none;
}
.be-tag svg {
  display: none;
}
.be-tag.--dark {
  color: var(--nw);
}
.be-tag.--dark .be-icon {
  fill: var(--nw);
}
.be-tag.--dark.--blue {
  background: var(--bb100);
}
.be-tag.--dark.--green {
  background: #137C5A;
}
.be-tag.--dark.--red {
  background: #C92A2A;
}
.be-tag.--dark.--orange {
  background: #D87400;
}
.be-tag.--dark.--grey {
  background: #495057;
}
.be-tag.--light.--blue {
  background: var(--bb20);
  color: var(--bb120);
}
.be-tag.--light.--green {
  background: #E5F6F1;
  color: #137C5A;
}
.be-tag.--light.--red {
  background: #FFF5F5;
  color: #C92A2A;
}
.be-tag.--light.--orange {
  background: #FAEEE0;
  color: #D87400;
}
.be-tag.--light.--grey {
  background: var(--n20);
  color: var(--n80);
}
.be-tag.--light.--grey .be-icon {
  fill: var(--n80);
}

.be-tabs__tablist {
  padding: 0 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 36px;
  border-bottom: solid 1px var(--n30);
}
.be-tabs__tablist.data-simplebar {
  overflow-y: hidden;
}
.be-tabs__tablist.data-simplebar .simplebar-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.be-tabs__tablist.data-simplebar .simplebar-content .be-tabs__item {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  margin-right: 36px;
}
.be-tabs__tablist.data-simplebar .simplebar-track.simplebar-horizontal {
  opacity: 0;
}
.be-tabs__item {
  font-size: 14px;
  line-height: 20px;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  padding-bottom: 8px;
  color: var(--n80);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  cursor: pointer;
}
.be-tabs__item.active {
  color: var(--n100);
}
.be-tabs__item.active:after {
  background: var(--bb100);
}
.be-tabs__item:hover {
  color: var(--bb100);
}
.be-tabs__item:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: transparent;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-tabs__item.w-icon {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
}
.be-tabs__item.w-icon .be-icon {
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  fill: var(--n80);
}
.be-tabs__item.w-icon.active .be-icon {
  fill: var(--n100);
}
.be-tabs__item.w-icon:hover .be-icon {
  fill: var(--bb100);
}
.be-tabs__body-item {
  display: none;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-tabs:not(.--links) .be-tabs__body-item.active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-tabs.wizzard .be-tabs__tablist {
  padding: 0;
  border: none;
  gap: 20px;
}
.be-tabs.wizzard .be-tabs__item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-bottom: 16px;
  cursor: inherit;
  pointer-events: none;
}
.be-tabs.wizzard .be-tabs__item.completed .be-icon.left {
  display: inline-block;
  fill: #137C5A;
}
.be-tabs.wizzard .be-tabs__item.completed:hover:after {
  background: var(--bb70);
}
.be-tabs.wizzard .be-tabs__item:after {
  background: var(--n40);
  border-radius: 8px;
}
.be-tabs.wizzard .be-tabs__item.active {
  cursor: inherit;
}
.be-tabs.wizzard .be-tabs__item.active .be-tag {
  cursor: inherit;
  background: var(--bb100);
  color: var(--nw);
}
.be-tabs.wizzard .be-tabs__item.active:after {
  background: var(--bb100);
}
.be-tabs.wizzard .be-tabs__body-item {
  width: 100%;
  padding-top: 28px;
  gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.be-tabs.wizzard .be-tabs__body-item.form .form-container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 28px;
  max-height: 100%;
  height: calc(100% - 81px);
}
.be-tabs.wizzard .be-tabs__body-item .be-popup__footer {
  width: 100%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-tabs.toggle-bar .be-tabs__tablist {
  height: 40px;
  padding: 4px;
  gap: 8px;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  border-radius: 10px;
  background: var(--n20);
  border-bottom: none;
}
.be-tabs.toggle-bar .be-tabs__item {
  width: 100%;
  padding: 4px 20px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 8px;
}
.be-tabs.toggle-bar .be-tabs__item:after {
  display: none;
}
.be-tabs.toggle-bar .be-tabs__item .be-icon {
  fill: var(--n100);
}
.be-tabs.toggle-bar .be-tabs__item:hover {
  background: var(--n40);
}
.be-tabs.toggle-bar .be-tabs__item.active {
  background: var(--bb100);
}
.be-tabs.toggle-bar .be-tabs__item.active .be-icon {
  fill: #fff;
}

.be-cascade-level {
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
}
.be-cascade-level.active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-cascade-level--header {
  width: 100%;
}
.be-cascade-level--header .be-text-button {
  color: var(--n75);
}
.be-cascade-level--header .be-text-button .be-icon {
  fill: var(--n75);
}
.be-cascade-level--header .be-text-button .be-icon.left {
  margin-right: 4px;
}
.be-cascade-level--header .be-text-button:hover {
  color: var(--n60);
}
.be-cascade-level--header .be-text-button:hover .be-icon {
  fill: var(--n60);
}
.be-cascade-level--label {
  margin: 12px 0 4px 0;
  font-weight: 500;
}
.be-cascade-level .be-button {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-right: 8px;
  padding-left: 12px;
}
.be-cascade-level .be-button.be-button--primary {
  pointer-events: none;
}

.be-popover {
  background: var(--nw);
  border: 1px solid var(--n40);
  -webkit-box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}

.be-dropdown {
  position: relative;
}
.be-dropdown .be-dropdown-link {
  border-radius: 7px;
  cursor: pointer;
}
.be-dropdown .be-popover {
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  -webkit-transform: translateY(6px);
      -ms-transform: translateY(6px);
          transform: translateY(6px);
  opacity: 0;
  visibility: hidden;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 2;
}
.be-dropdown.to-left .be-popover {
  left: 0;
  right: auto;
}
.be-dropdown-menu {
  padding: 8px 4px;
  min-width: 100%;
  max-width: 340px;
}
.be-dropdown-menu_empty_item {
  min-height: 32px;
  line-height: 32px;
}
.be-dropdown-menu__item {
  display: block;
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  position: relative;
  color: var(--n100);
}
.be-dropdown-menu__item:hover {
  background: var(--n30);
}
.be-dropdown-menu__item.active {
  color: var(--bb100);
  padding-right: 28px;
}
.be-dropdown-menu__item.active:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 16px;
  height: 16px;
  right: 8px;
  background: url("../img/svg/check--clr.svg") no-repeat;
}
.be-dropdown-feed {
  padding: 8px 4px;
  width: 364px;
}
.be-dropdown-feed .be-divider.horizontal {
  margin: 4px auto;
  width: calc(100% - 16px);
}
.be-dropdown-feed__title {
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: var(--n70);
  padding: 8px 0 0 12px;
  margin-bottom: 8px;
}
.be-dropdown-feed__item {
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  position: relative;
  color: var(--n100);
  overflow-wrap: break-word;
}
.be-dropdown-feed__item:hover {
  background: var(--n30);
}
.be-dropdown-feed__item.unread {
  font-weight: 600;
  padding-right: 36px;
}
.be-dropdown-feed__item.unread:after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  top: calc(50% - 11px - 4px);
  right: 8px;
  background: var(--bb100);
  border-radius: 12px;
}
.be-dropdown.active > .be-popover {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

.be-datepicker:not(.integrated) .be-button.be-dropdown-link {
  padding: 4px 8px;
}
.be-datepicker:not(.integrated) .be-button.be-dropdown-link span {
  color: var(--n80);
}
.be-datepicker .be-datepicker-box {
  padding: 16px;
}
.be-datepicker .be-datepicker-box.be-popover {
  width: 760px !important;
}
.be-datepicker .be-datepicker-box_body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 12px;
}
.be-datepicker .be-datepicker-box_footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 12px;
  gap: 12px;
  border-top: solid 1px var(--n30);
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.be-datepicker .be-datepicker-box_quick-links {
  width: 184px;
  padding-right: 12px;
  border-right: solid 1px var(--n30);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-datepicker .be-datepicker-box_quick-link {
  font-family: Rubik;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  cursor: pointer;
  -webkit-transition: color 0.3s ease;
  -o-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
.be-datepicker .be-datepicker-box_quick-link:hover {
  color: var(--bb100);
}
.be-datepicker .be-datepicker-box_calendar {
  width: calc(100% - 184px);
  padding-left: 28px;
  gap: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  gap: 12px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row .be-text-field {
  width: 100%;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row .be-text-field .be-text-field__label {
  display: none !important;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row.w-time .fields-wrap {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row.w-time .fields-wrap .be-text-field.time {
  width: 128px;
}
.be-datepicker .be-datepicker-box_calendar .inputs-row .divider {
  width: 12px;
  height: 1px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: var(--n30);
}
.be-datepicker .be-datepicker-box_calendar .calendars {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 36px;
}
.be-datepicker.active > .be-button.be-dropdown-link {
  background: var(--n90);
}
.be-datepicker.active > .be-button.be-dropdown-link .be-icon {
  fill: var(--nw);
}
.be-datepicker.active > .be-button.be-dropdown-link span {
  color: var(--nw);
}
.be-datepicker.active > .be-text-field__input.be-dropdown-link input {
  -webkit-box-shadow: inset 0 0 0 2px var(--n100) !important;
          box-shadow: inset 0 0 0 2px var(--n100) !important;
}
.be-datepicker.range .be-calendar {
  width: 240px;
}
.be-datepicker .be-text-field__input.be-dropdown-link input {
  -webkit-box-shadow: inset 0 0 0 1px var(--n40);
          box-shadow: inset 0 0 0 1px var(--n40);
  background: var(--nw);
  pointer-events: none;
}
.be-datepicker .be-text-field__input.be-dropdown-link:hover input {
  -webkit-box-shadow: inset 0 0 0 1px var(--n70);
          box-shadow: inset 0 0 0 1px var(--n70);
}

.be-calendar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0px;
}
.be-calendar .month-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.be-calendar .month-header .be-button {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-calendar .month-header .month-title {
  color: var(--nb);
  text-align: center;
  font-size: 13px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.be-calendar .year-selector.active .be-dropdown-link,
.be-calendar .month-selector.active .be-dropdown-link {
  background: var(--bb20);
}
.be-calendar .year-selector .be-popover,
.be-calendar .month-selector .be-popover {
  max-height: 220px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.be-calendar .year-selector .be-popover .be-dropdown-menu__item,
.be-calendar .month-selector .be-popover .be-dropdown-menu__item {
  text-align: left;
  width: 100%;
}
.be-calendar .month-selector .be-popover {
  width: 124px !important;
}
.be-calendar .year-selector .be-popover {
  width: 92px !important;
}
.be-calendar-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.be-calendar-row div {
  width: 14.285%;
  height: 28px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: var(--n60);
  pointer-events: none;
  border-radius: 4px;
}
.be-calendar-row div.available {
  pointer-events: initial;
  color: var(--n100);
  cursor: pointer;
  -webkit-transition: background 0.3s ease;
  -o-transition: background 0.3s ease;
  transition: background 0.3s ease;
}
.be-calendar-row div.available:hover {
  background: var(--bb10);
}
.be-calendar-row div.available.in-range {
  background: var(--bb10);
  border-radius: 0px;
}
.be-calendar-row div.available.in-range.start-date, .be-calendar-row div.available.in-range.end-date {
  background: var(--bb100);
  border-radius: 4px;
  color: var(--nw);
}
.be-calendar-row.weekdays div {
  font-weight: 500;
  color: var(--n100);
}

@media (max-width: 900px) {
  .be-datepicker .be-datepicker-box.be-popover {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    z-index: 20;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 20px;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_body .be-datepicker-box_quick-links {
    width: 100%;
    border-right: none;
    border-bottom: solid 1px var(--n30);
    padding-right: 0;
    padding-bottom: 12px;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_body .be-datepicker-box_calendar {
    width: 100%;
    padding-left: 0;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_body .be-datepicker-box_calendar .calendars .be-calendar {
    width: 100%;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_body .be-datepicker-box_calendar .calendars .be-calendar:first-child .month-header .be-button.next {
    visibility: visible;
  }
  .be-datepicker .be-datepicker-box .be-datepicker-box_footer {
    margin-bottom: 0;
    margin-top: auto;
  }
  .be-datepicker.range .be-datepicker-box .be-datepicker-box_body .be-datepicker-box_calendar .calendars .be-calendar:last-child {
    display: none;
  }
}
.be-box {
  border-radius: 8px;
  background: var(--nw);
  -webkit-box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.02);
          box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.02);
}
.be-box.--pd24 {
  padding: 24px;
}
.be-box.--pd16 {
  padding: 16px;
}

.be-divider {
  display: block;
  background: var(--n30);
  margin: 0;
  border: none;
}
.be-divider.horizontal {
  width: 100%;
  height: 1px;
}
.be-divider.vertical {
  width: 1px;
  height: 100%;
}
.be-divider.dashed {
  background: transparent;
  background-image: -webkit-gradient(linear, left top, right top, from(var(--n30)), color-stop(50%, var(--n30)), color-stop(50%, transparent), to(transparent));
  background-image: -o-linear-gradient(left, var(--n30), var(--n30) 50%, transparent 50%, transparent 100%);
  background-image: linear-gradient(90deg, var(--n30), var(--n30) 50%, transparent 50%, transparent 100%);
  background-size: 8px 1px;
}

.be-update-row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 24px;
}

.be-pagination {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 24px;
}
.be-pagination__navigation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.be-pagination__navigation .arrow-btn-left {
  margin-right: 12px;
}
.be-pagination__navigation .arrow-btn-right {
  margin-left: 12px;
}
.be-pagination__navigation .page-btn {
  padding: 4px;
  width: 28px;
}
.be-pagination__navigation .page-btn.active {
  background: var(--bb100);
  color: var(--nw);
  cursor: default;
}
.be-pagination__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-pagination__total {
  color: var(--n70);
  font-size: 14px;
  line-height: 20px;
}
.be-pagination__page-size .be-button {
  padding: 8px;
}
.be-pagination__page-size .be-dropdown {
  position: relative;
}
.be-pagination__page-size .be-dropdown-menu__item {
  padding: 5px 12px;
}
.be-pagination__page-size .be-dropdown-menu__item.active {
  padding-right: 12px;
}
.be-pagination__page-size .be-dropdown-menu__item.active:after {
  display: none;
}

.be-file-input input {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
.be-file-input__label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 16px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 16px;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  border-radius: 5px;
  background: var(--n10);
  cursor: pointer;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-file-input__label:hover {
  -webkit-box-shadow: inset 0 0 0 1.5px var(--n70);
          box-shadow: inset 0 0 0 1.5px var(--n70);
}
.be-file-input__label > .be-icon {
  border-radius: 20px;
  padding: 4px;
  background: var(--n40);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-file-input .txt {
  width: 100%;
  font-size: 12px;
  line-height: 16px;
  color: var(--n90);
}
.be-file-input .txt .label {
  width: 100%;
  display: inline-block;
}
.be-file-input .txt .desc {
  display: inline-block;
  width: 100%;
  margin-top: 2px;
  color: var(--n75);
}
.be-file-input.attached-file .be-file-input__label {
  background: #EBFBEE;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.be-file-input.attached-file .be-file-input__label > .be-icon {
  padding: 0;
  background: none;
  width: 32px;
  height: 32px;
  fill: #37B24D;
}

.be-player {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-player .be-player__buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-player .be-player__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  gap: 8px;
}
.be-player .be-player__controls .be-player__player-track {
  width: 100%;
  border-radius: 8px;
  background: var(--bb100);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 4px 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
  color: var(--nw);
  font-size: 11px;
  line-height: 20px;
}
.be-player .be-player__controls .be-player__player-track .current-time,
.be-player .be-player__controls .be-player__player-track .total-time {
  white-space: nowrap;
}
.be-player .be-player__controls .be-player__player-track .track-line {
  width: 100%;
  height: 4px;
  background: var(--bb60);
  position: relative;
  border-radius: 2px;
}
.be-player .be-player__controls .be-player__player-track .track-line-trigger {
  width: 10px;
  height: 10px;
  border-radius: 4px;
  background: var(--nw);
  position: absolute;
  top: -3px;
  -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
          transform: translateX(-10px);
  cursor: pointer;
}
.be-player .be-player__controls .be-player__player-track .track-line .current-lenght {
  position: absolute;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 2px;
  background: var(--nw);
}
.be-player.playing .be-player__buttons {
  display: none;
}
.be-player.playing .be-player__player {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-player .td-data {
  width: 100%;
}
.be-player .td-data .be-button {
  width: 100%;
}

.be-collapse-body {
  height: 0px;
  overflow: hidden;
  visibility: hidden;
  display: none;
}
.be-collapse.--inversed .be-collapse-body {
  height: initial;
}
.be-collapse.be-collapse--open .be-collapse-body {
  -webkit-transition: 0.4s ease;
  -o-transition: 0.4s ease;
  transition: 0.4s ease;
  visibility: visible;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.be-toggle {
  display: inline-block;
}
.be-toggle.required .be-text-field__label:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  vertical-align: super;
  margin-left: 4px;
  background: url("../img/svg/asterisk.svg") no-repeat;
}
.be-toggle input[type=checkbox] {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  z-index: -10;
  -webkit-appearance: checkbox !important;
}
.be-toggle input[type=checkbox]:checked ~ label .be-toggle-button {
  border-color: var(--bb100);
  background: var(--bb100);
}
.be-toggle input[type=checkbox]:checked ~ label .be-toggle-button:hover {
  background: var(--bb80);
}
.be-toggle input[type=checkbox]:checked ~ label .be-toggle-button .o {
  background: #fff;
  -webkit-transform: translateY(-50%) translateX(20px);
      -ms-transform: translateY(-50%) translateX(20px);
          transform: translateY(-50%) translateX(20px);
}
.be-toggle label {
  cursor: pointer;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-toggle__caption {
  display: none;
  vertical-align: top;
  width: 100%;
  font-size: 14px;
  font-family: Rubik;
  line-height: 20px;
  color: var(--n100);
}
.be-toggle .be-toggle-button {
  width: 40px;
  height: 20px;
  background: var(--n70);
  border: solid 2px var(--n70);
  border-radius: 50px;
  display: inline-block;
  vertical-align: top;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-toggle .be-toggle-button:hover {
  background: var(--n60);
}
.be-toggle .be-toggle-button .o {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: var(--nw);
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 0px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-toggle.w-label .be-text-field__label {
  display: block;
}
.be-toggle.w-caption .be-toggle__caption {
  display: inline-block;
}
.be-toggle.green input[type=checkbox]:checked ~ label .be-toggle-button {
  background: #137C5A;
  border-color: #137C5A;
}

.be-table {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  border-top: solid 1px var(--n30);
  border-bottom: solid 1px var(--n30);
}
.be-table.--full-width {
  width: 100%;
}
.be-table.standalone {
  border: none;
  border-radius: 8px;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-shadow: inset 0 0 0 1px var(--n30);
          box-shadow: inset 0 0 0 1px var(--n30);
}
.be-table thead tr {
  border-bottom: solid 1px var(--n30);
}
.be-table thead td {
  color: var(--n80);
  font-weight: 500;
  line-height: 20px;
}
.be-table tbody tr:not(:last-child) {
  border-bottom: solid 1px var(--n30);
}
.be-table tr.w-color-bar td:first-child {
  position: relative;
}
.be-table tr.w-color-bar td:first-child::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 100%;
  left: 0;
  top: 0;
}
.be-table tr.w-color-bar.blue td:first-child::before {
  background: var(--bb100);
}
.be-table tr.w-color-bar.green td:first-child::before {
  background: #2ABB8D;
}
.be-table tr.w-color-bar.grey td:first-child::before {
  background: var(--n50);
}
.be-table tr.w-color-bar.red td:first-child::before {
  background: #C33737;
}
.be-table tr.w-color-bar.orange td:first-child::before {
  background: #D87400;
}
.be-table td {
  padding: 12px 16px;
  color: var(--n100);
  font-size: 14px;
  line-height: 20px;
  word-break: break-word;
}
.be-table td:not(:last-child) {
  border-right: solid 1px var(--n30);
}
.be-table td.w-button {
  font-size: 0;
}
.be-table td.w-button span {
  display: inline-block;
  vertical-align: middle;
  color: var(--n80);
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  margin-right: 4px;
  width: calc(100% - 28px);
}
.be-table td.w-button .be-dropdown {
  display: inline-block;
  vertical-align: middle;
}
.be-table td.w-button .be-dropdown .be-button .be-icon {
  width: 16px;
  height: 16px;
}
.be-table td.w-button .be-dropdown .be-dropdown-menu__item {
  text-wrap: nowrap;
}
.be-table td .description {
  font-size: 12px;
  line-height: 14px;
  color: var(--n75);
}
.be-table td.email-verification-status, .be-table td.verification-status, .be-table .td.email-verification-status, .be-table .td.verification-status {
  font-size: 0;
}
.be-table td.email-verification-status span, .be-table td.verification-status span, .be-table .td.email-verification-status span, .be-table .td.verification-status span {
  display: inline-block;
  margin-right: 8px;
  vertical-align: middle;
  font-size: 14px;
  line-height: 20px;
  width: calc(100% - 16px - 8px);
}
.be-table td.email-verification-status span.grey, .be-table td.verification-status span.grey, .be-table .td.email-verification-status span.grey, .be-table .td.verification-status span.grey {
  color: var(--n70);
}
.be-table td.email-verification-status svg, .be-table td.verification-status svg, .be-table .td.email-verification-status svg, .be-table .td.verification-status svg {
  display: inline-block;
  vertical-align: middle;
  fill: var(--n75);
}
.be-table td.email-verification-status.active svg, .be-table td.verification-status.active svg, .be-table .td.email-verification-status.active svg, .be-table .td.verification-status.active svg {
  fill: #137C5A;
}
.be-table td.actions, .be-table .td.actions {
  font-size: 0;
  padding: 5px 16px;
}
.be-table td.actions .be-button, .be-table .td.actions .be-button {
  display: inline-block;
  vertical-align: middle;
}
.be-table td.actions .be-button:not(:last-child), .be-table .td.actions .be-button:not(:last-child) {
  margin-right: 8px;
}
.be-table td.password, .be-table .td.password {
  font-size: 0;
}
.be-table td.password .be-text-field .be-text-field__input--wrap, .be-table .td.password .be-text-field .be-text-field__input--wrap {
  font-size: 0;
}
.be-table td.password .be-text-field .be-text-field__input input, .be-table .td.password .be-text-field .be-text-field__input input {
  -webkit-box-shadow: none;
          box-shadow: none;
  padding: 0;
  cursor: text;
  background: none;
  color: var(--n100);
  display: inline-block;
  vertical-align: middle;
  width: calc(100% - 28px);
}
.be-table td.password .be-text-field .be-text-field__input .be-icon.left, .be-table .td.password .be-text-field .be-text-field__input .be-icon.left {
  padding: 2px;
  position: relative;
  fill: var(--n70);
  left: 0;
  top: 0;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}
.be-table td.file-controls, .be-table .td.file-controls {
  width: 308px;
}
.be-table td.file-controls .file-controls__buttons, .be-table .td.file-controls .file-controls__buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-table td.file-controls .file-controls__player, .be-table .td.file-controls .file-controls__player {
  display: none;
  gap: 8px;
}
.be-table td.file-controls .file-controls__player .file-controls__player-track, .be-table .td.file-controls .file-controls__player .file-controls__player-track {
  width: 100%;
  border-radius: 8px;
  background: var(--bb100);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 4px 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
  color: var(--nw);
  font-size: 11px;
  line-height: 20px;
}
.be-table td.file-controls .file-controls__player .file-controls__player-track .current-time,
.be-table td.file-controls .file-controls__player .file-controls__player-track .total-time, .be-table .td.file-controls .file-controls__player .file-controls__player-track .current-time,
.be-table .td.file-controls .file-controls__player .file-controls__player-track .total-time {
  white-space: nowrap;
}
.be-table td.file-controls .file-controls__player .file-controls__player-track .track-line, .be-table .td.file-controls .file-controls__player .file-controls__player-track .track-line {
  width: 100%;
  height: 4px;
  background: var(--bb60);
  position: relative;
  border-radius: 2px;
}
.be-table td.file-controls .file-controls__player .file-controls__player-track .track-line-trigger, .be-table .td.file-controls .file-controls__player .file-controls__player-track .track-line-trigger {
  width: 10px;
  height: 10px;
  border-radius: 4px;
  background: var(--nw);
  position: absolute;
  top: -3px;
  -webkit-transform: translateX(-10px);
      -ms-transform: translateX(-10px);
          transform: translateX(-10px);
  cursor: pointer;
}
.be-table td.file-controls .file-controls__player .file-controls__player-track .track-line .current-lenght, .be-table .td.file-controls .file-controls__player .file-controls__player-track .track-line .current-lenght {
  position: absolute;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 2px;
  background: var(--nw);
}
.be-table td.file-controls.playing .file-controls__buttons, .be-table .td.file-controls.playing .file-controls__buttons {
  display: none;
}
.be-table td.file-controls.playing .file-controls__player, .be-table .td.file-controls.playing .file-controls__player {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-table td.file-controls .td-data, .be-table .td.file-controls .td-data {
  width: 100%;
}
.be-table td.file-controls .td-data .be-button, .be-table .td.file-controls .td-data .be-button {
  width: 100%;
}
.be-table.--mobile {
  display: none;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-table.--mobile .tr {
  width: 100%;
  padding: 8px 0;
}
.be-table.--mobile .tr:not(:last-child) {
  border-bottom: solid 1px var(--n30);
}
.be-table.--mobile .tr.be-collapse.be-collapse--open .be-collapse-trigger > .be-icon {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.be-table.--mobile .tr.be-collapse .be-collapse-body {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-table.--mobile .tr.be-collapse .be-collapse-body .td:first-child {
  padding-top: 12px;
}
.be-table.--mobile .tr.w-color-bar {
  position: relative;
}
.be-table.--mobile .tr.w-color-bar::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 100%;
  left: 0;
  top: 0;
}
.be-table.--mobile .tr.w-color-bar.blue::before {
  background: var(--bb100);
}
.be-table.--mobile .tr.w-color-bar.green::before {
  background: #2ABB8D;
}
.be-table.--mobile .tr.w-color-bar.grey::before {
  background: var(--n50);
}
.be-table.--mobile .tr.w-color-bar.red::before {
  background: #C33737;
}
.be-table.--mobile .tr.w-color-bar.orange::before {
  background: #D87400;
}
.be-table.--mobile .td {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 0 12px;
  margin-bottom: 12px;
  font-size: 14px;
  line-height: 20px;
  color: var(--n100);
  font-weight: 400;
}
.be-table.--mobile .td.be-collapse-trigger {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  margin-bottom: 0;
}
.be-table.--mobile .td.be-collapse-trigger > .be-icon {
  fill: var(--n80);
  background: var(--n30);
  border-radius: 8px;
  border: 4px solid var(--n30);
  -webkit-transition: 0.15s ease;
  -o-transition: 0.15s ease;
  transition: 0.15s ease;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-table.--mobile .td-label {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: var(--n70);
  margin-bottom: 2px;
  width: 100%;
}
.be-table.--mobile .td-data {
  width: 100%;
}
.be-table.--mobile .td-subdata {
  color: var(--n80);
  font-size: 12px;
  line-height: 20px;
}
.be-table.--mobile .td.email-verification-status span, .be-table.--mobile .td.verification-status span {
  width: auto;
}
.be-table.--mobile .td.actions {
  padding: 0;
  gap: 8px;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  padding-top: 12px;
  width: calc(100% - 24px);
  margin: 0 auto;
  border-top: 1px dashed var(--n30);
}
.be-table.--mobile .td.actions .be-button {
  width: 100%;
  max-width: 100%;
  margin-right: 0;
}

.be-statistics-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  width: 100%;
}
.be-statistics-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-radius: 8px;
  background: var(--n10);
  gap: 4px;
  padding: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  min-width: 212px;
}
.be-statistics-item .label {
  color: var(--n80);
  font-size: 12px;
  line-height: 16px;
}
.be-statistics-item .data {
  color: var(--n100);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

.be-spinner {
  position: relative;
}
.be-spinner:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.8);
}
.be-spinner:after {
  content: "";
  position: absolute;
  top: calc(50% - 16px);
  left: calc(50% - 16px);
  z-index: 10;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: block;
  border-top: 3px solid rgba(22, 80, 229, 0.2);
  border-right: 3px solid rgba(22, 80, 229, 0.2);
  border-bottom: 3px solid rgba(22, 80, 229, 0.2);
  border-left: 3px solid var(--bb100);
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-animation: be-spinner 1.1s infinite linear;
          animation: be-spinner 1.1s infinite linear;
}
.be-spinner.be-button--primary {
  pointer-events: none;
  cursor: not-allowed;
}
.be-spinner.be-button--primary label {
  opacity: 0;
}
.be-spinner.be-button--primary:before {
  display: none;
}
.be-spinner.be-button--primary:after {
  top: calc(50% - 10px);
  left: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  border-right: 2px solid rgba(255, 255, 255, 0.2);
  border-bottom: 2px solid rgba(255, 255, 255, 0.2);
  border-left: 2px solid var(--nw);
}

.be-volume-control .be-popover {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 28px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 8px;
  gap: 8px;
}
.be-volume-control .be-popover .be-icon {
  fill: var(--n80);
}
.be-volume-control .volume-track {
  height: 72px;
  width: 4px;
  background: var(--bb20);
  border-radius: 2px;
  position: relative;
}
.be-volume-control .volume-track-fill {
  position: absolute;
  width: 4px;
  background: var(--bb100);
  border-radius: 2px;
  bottom: 0;
}
.be-volume-control .volume-track-trigger {
  width: 10px;
  height: 10px;
  border-radius: 4px;
  background: var(--bb100);
  position: absolute;
  left: calc(50% - 5px);
  cursor: pointer;
}

@-webkit-keyframes be-spinner {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes be-spinner {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.be-popup {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.45);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 40px;
  padding-bottom: 40px;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  z-index: -1;
}
.be-popup > .simplebar-wrapper > .simplebar-mask > .simplebar-offset > .simplebar-content-wrapper > .simplebar-content {
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-popup.opened {
  visibility: visible;
  opacity: 1;
  z-index: 100;
}
.be-popup.integrated {
  visibility: visible;
  opacity: 1;
  z-index: 10;
  background: none;
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}
.be-popup.integrated .be-popup__card {
  -webkit-box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.16);
}
.be-popup__card {
  width: 100%;
  max-width: 1136px;
  padding: 16px;
  position: relative;
  margin: 0 8px;
}
.be-popup__card.mcol-10 {
  max-width: 1104px;
}
.be-popup__card.mcol-8 {
  max-width: 752px;
}
.be-popup__card.mcol-6 {
  max-width: 560px;
}
.be-popup__card.mcol-4 {
  max-width: 368px;
}
.be-popup__title {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  color: var(--n100);
  margin-bottom: 20px;
  width: 100%;
  position: relative;
  padding-right: 36px;
}
.be-popup__title .be-popup-close {
  position: absolute;
  right: -4px;
  top: -4px;
}
.be-popup__footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 12px;
  margin-top: 20px;
  border-top: 1px solid var(--n30);
}
.be-popup__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 28px;
  width: 100%;
}
.be-popup__body .desc {
  color: var(--n80);
  line-height: 20px;
  padding-right: 10%;
}
.be-popup__body .be-text-field:not(:last-child),
.be-popup__body .be-select:not(:last-child) {
  margin-bottom: 20px;
}
.be-popup__body .inputs-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--n10);
  margin-bottom: 20px;
}
.be-popup__body .inputs-group .be-text-field, .be-popup__body .inputs-group .be-select {
  margin-bottom: 0;
}
.be-popup__body .inputs-group .title {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  color: var(--n90);
}
.be-popup .be-popup__inner-popup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 16px;
  border: 1px solid var(--n30);
  -webkit-box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.16);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  visibility: hidden;
  z-index: -1;
  opacity: 0;
}
.be-popup .be-popup__inner-popup .be-popup__body {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-popup .be-popup__inner-popup.email-validation {
  width: 300px;
}
.be-popup .be-popup__inner-popup .be-popup__body {
  gap: 20px;
}
.be-popup .be-popup__inner-popup .be-popup__body .be-text-field {
  width: 100%;
  margin-bottom: 0;
}
.be-popup .be-popup__inner-popup .be-popup__body .desc {
  font-size: 14px;
  line-height: 20px;
  color: var(--n90);
}
.be-popup .be-popup__inner-popup .be-popup__body .refresh-code.active .be-text-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-popup .be-popup__inner-popup .be-popup__body .refresh-code.active .counter {
  display: none;
}
.be-popup .be-popup__inner-popup .be-popup__body .refresh-code .counter {
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: var(--n75);
}
.be-popup .be-popup__inner-popup .be-popup__footer {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px;
  border: none;
  padding: 0;
}
.be-popup .be-popup__inner-popup .be-popup__footer .be-button {
  width: 100%;
}
.be-popup.inner-popup-active .be-popup__card > .be-popup__title,
.be-popup.inner-popup-active .be-popup__card > .be-popup__body,
.be-popup.inner-popup-active .be-popup__card > .be-popup__footer {
  pointer-events: none;
  opacity: 0.3;
}
.be-popup.inner-popup-active .be-popup__inner-popup {
  visibility: visible;
  opacity: 1;
  z-index: 11;
}

body.active-popup {
  height: 100vh;
  overflow-y: hidden;
}
body.active-popup .b-pl__body {
  height: 100vh;
  overflow-y: hidden;
}

@media (max-width: 800px) {
  .be-popup {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
.col-12 {
  width: 100%;
}

.col-9 {
  width: 75%;
}

.col-6 {
  width: 50%;
}

.col-4 {
  width: 33.3333333333%;
}

.col-3 {
  width: 25%;
}

.be-callwidget {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: fixed;
  right: 40px;
  bottom: 40px;
  background: var(--nw);
  border-radius: 8px;
  border: solid 2px var(--bb100);
  width: 336px;
  z-index: 5;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: calc(100% - 80px);
  max-height: 618px;
}
.be-callwidget.integrated {
  position: relative;
  right: inherit;
  left: inherit;
  bottom: inherit;
  width: 320px;
  background: #F8F9FA;
  border: none;
  height: 558px;
}
.be-callwidget.integrated .be-callwidget-user .be-dropdown-link,
.be-callwidget.integrated .be-callwidget-numpad .num-buttons .be-button:not(.transparent) {
  background: var(--n30);
}
.be-callwidget.integrated .be-callwidget-user .be-dropdown-link:hover,
.be-callwidget.integrated .be-callwidget-numpad .num-buttons .be-button:not(.transparent):hover {
  background: var(--n40);
}
.be-callwidget.integrated .be-callwidget-user .be-dropdown-link:active,
.be-callwidget.integrated .be-callwidget-numpad .num-buttons .be-button:not(.transparent):active {
  background: var(--n50);
}
.be-callwidget.integrated .be-callwidget-numpad {
  padding: 0 12px;
}
.be-callwidget.integrated .be-callwidget-numpad .simplebar-content {
  height: 100%;
}
.be-callwidget.integrated .be-callwidget-numpad .new-contact-flow {
  padding-bottom: 16px;
  height: 100%;
}
.be-callwidget.integrated .be-callwidget-numpad .new-contact-flow .be-button--secondary {
  background: var(--n30);
}
.be-callwidget.integrated .be-callwidget-numpad .new-contact-flow .be-button--secondary:hover {
  background: var(--n40);
}
.be-callwidget.integrated .be-callwidget-numpad .new-contact-flow .be-button--secondary:active {
  background: var(--n50);
}
.be-callwidget.integrated .be-callwidget-ongoing-call {
  background: var(--n10);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-ongoing-call--body .controls .be-button {
  background: var(--n30);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-ongoing-call--body .controls .be-button:hover {
  background: var(--n40);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-ongoing-call--body .controls .be-button:active {
  background: var(--n50);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active {
  background: var(--n80);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active:hover {
  background: var(--n75);
}
.be-callwidget.integrated .be-callwidget-ongoing-call .be-callwidget-numpad {
  padding: 0;
}
.be-callwidget.integrated .be-callwidget-incoming-call {
  background: var(--n10);
}
.be-callwidget-header {
  padding: 16px 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  gap: 8px;
  border-bottom: solid 1px #DEE2E6;
}
.be-callwidget-user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  position: relative;
}
.be-callwidget-user .user-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  width: 100%;
}
.be-callwidget-user .user-content img {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 8px;
}
.be-callwidget-user .user-content .txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2px;
}
.be-callwidget-user .user-content .txt .name {
  color: var(--nb);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
}
.be-callwidget-user .user-content .txt .number {
  color: #868686;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.be-callwidget-user .be-dropdown {
  position: initial;
}
.be-callwidget-user .be-dropdown-link {
  margin-left: auto;
  margin-right: 0;
}
.be-callwidget-body {
  padding-top: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: calc(100% - 69px);
  max-height: 549px;
}
.be-callwidget-numpad {
  width: 100%;
  height: 100%;
}
.be-callwidget-numpad .main-flow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-callwidget-numpad .main-flow .buttons-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-callwidget-numpad .main-flow .buttons-row .be-callwidget-call-btn {
  width: 100%;
  max-width: 100%;
}
.be-callwidget-numpad .input-wrap {
  width: 100%;
  position: relative;
}
.be-callwidget-numpad .new-contact-flow {
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
  height: 100%;
}
.be-callwidget-numpad .new-contact-flow-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 12px;
  width: 100%;
  padding-top: 12px;
  border-top: solid 1px var(--n40);
  margin-top: auto;
  margin-bottom: 0;
}
.be-callwidget-numpad .new-contact-flow .phone-num .data {
  color: var(--n100);
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  min-height: 24px;
}
.be-callwidget-numpad .new-contact-flow .phone-num > .be-text-field__label {
  display: block;
  font-weight: 500;
  font-size: 14px;
}
.be-callwidget-numpad-number-backspace {
  position: absolute;
  right: 4px;
  top: 4px;
  border-radius: 4px;
}
.be-callwidget-numpad-number-backspace .be-icon {
  fill: #E51616;
}
.be-callwidget-numpad-number-input {
  width: 100%;
}
.be-callwidget-numpad-number-input .be-text-field__input input {
  max-height: 44px;
  height: 44px;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  padding-left: 12px;
  padding-right: 44px;
}
.be-callwidget-numpad .num-buttons {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 16px 0;
}
.be-callwidget-numpad .num-buttons-wrap {
  max-width: 236px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px 28px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-callwidget-numpad .num-buttons .be-button {
  width: 60px;
  height: 60px;
  border-radius: 100%;
  max-height: 60px;
  padding: 12px 0 0 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.be-callwidget-numpad .num-buttons .be-button span {
  text-align: center;
}
.be-callwidget-numpad .num-buttons .be-button span.label {
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}
.be-callwidget-numpad .num-buttons .be-button span.decorative {
  color: #787878;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 12px;
}
.be-callwidget-numpad .on-off-line-bar {
  width: 100%;
  border-top: solid 1px var(--n40);
  padding-top: 12px;
  margin-top: 16px;
}
.be-callwidget-on-off-line label {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-callwidget-on-off-line label .be-toggle__caption .on {
  display: none;
}
.be-callwidget-on-off-line label .be-toggle__caption .off {
  display: inline-block;
  color: var(--n80);
}
.be-callwidget-on-off-line .be-toggle-button {
  width: 32px;
  height: 16px;
}
.be-callwidget-on-off-line .be-toggle-button .o {
  width: 12px;
  height: 12px;
}
.be-callwidget-on-off-line input[type=checkbox]:checked ~ label .be-toggle-button .o {
  -webkit-transform: translateY(-50%) translateX(16px);
      -ms-transform: translateY(-50%) translateX(16px);
          transform: translateY(-50%) translateX(16px);
}
.be-callwidget-on-off-line input[type=checkbox]:checked ~ label .be-toggle__caption .on {
  display: inline-block;
}
.be-callwidget-on-off-line input[type=checkbox]:checked ~ label .be-toggle__caption .off {
  display: none;
}
.be-callwidget.adding-new-contact .main-flow {
  display: none;
}
.be-callwidget.adding-new-contact .new-contact-flow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-callwidget .be-tabs {
  height: 100%;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-callwidget .be-tabs .be-tabs__body {
  height: calc(100% - 40px);
  position: relative;
}
.be-callwidget .be-tabs .be-tabs__body:before {
  content: "";
  position: absolute;
  width: 100%;
  z-index: 1;
  height: 20px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
  background: -o-linear-gradient(top, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
}
.be-callwidget .be-tabs .be-tabs__tablist {
  margin: auto;
  width: calc(100% - 24px);
}
.be-callwidget .be-tabs .be-tabs__body-item {
  padding: 20px 12px 16px;
  height: 100%;
}
.be-callwidget .be-tabs .be-tabs__body-item[data-tab=be-callwidget-numpad] .simplebar-content {
  height: 100%;
}
.be-callwidget-contacts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
}
.be-callwidget-contacts .group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
}
.be-callwidget-contacts .label {
  color: var(--n100);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
}
.be-callwidget-contacts .user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.be-callwidget-contacts .user .avatar {
  width: 36px;
  height: 36px;
  border-radius: 70px;
  background: #F4F4F4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-callwidget-contacts .user .avatar .be-icon {
  fill: var(--n70);
}
.be-callwidget-contacts .user .name {
  color: var(--n100);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
}
.be-callwidget-contacts .user .number {
  color: var(--n70);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}
.be-callwidget-contacts .user .text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-callwidget-contacts .user .be-button {
  margin-left: auto;
  margin-right: 0;
}
.be-callwidget-calls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  width: 100%;
}
.be-callwidget-calls .call {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  width: 100%;
}
.be-callwidget-calls .call > .be-icon,
.be-callwidget-calls .call .be-button {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-callwidget-calls .call .txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
  width: 100%;
}
.be-callwidget-calls .call .contact {
  color: #000;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
}
.be-callwidget-calls .call .datetime {
  color: var(--n70);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}
.be-callwidget-calls .call.income > .be-icon {
  fill: #137C5A;
}
.be-callwidget-calls .call.outgoing > .be-icon {
  fill: var(--bb100);
}
.be-callwidget-calls .call.missed > .be-icon {
  fill: #E51616;
}
.be-callwidget-ongoing-call {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  z-index: 5;
  padding: 16px 12px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s ease, visibility 0s 0.3s ease;
  -o-transition: opacity 0.3s ease, visibility 0s 0.3s ease;
  transition: opacity 0.3s ease, visibility 0s 0.3s ease;
}
.be-callwidget-ongoing-call--header {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
}
.be-callwidget-ongoing-call--header .txt {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
}
.be-callwidget-ongoing-call--header .txt .contact {
  color: var(--nb);
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}
.be-callwidget-ongoing-call--header .txt .number {
  color: var(--n70);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}
.be-callwidget-ongoing-call--body .info-bar {
  width: 100%;
  color: var(--n100);
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  margin-bottom: 24px;
}
.be-callwidget-ongoing-call--body .controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 24px;
}
.be-callwidget-ongoing-call--body .controls .be-button {
  width: calc(33% - 8px);
  height: 80px;
  max-height: 80px;
  padding: 12px 4px 8px 4px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  border-radius: 10px;
}
.be-callwidget-ongoing-call--body .controls .be-button .be-icon {
  margin-right: 0;
  width: 24px;
  height: 24px;
}
.be-callwidget-ongoing-call--body .controls .be-button label {
  color: var(--n80);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  white-space: normal;
  height: 28px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-callwidget-ongoing-call--body .controls .be-button.long-label label {
  font-size: 11px;
  letter-spacing: -0.55px;
}
.be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active {
  background: var(--n80);
}
.be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active:hover {
  background: var(--n75);
}
.be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active label {
  color: var(--n30);
}
.be-callwidget-ongoing-call--body .controls .be-button.be-callwidget-state-button.active .be-icon {
  fill: var(--nw);
}
.be-callwidget-ongoing-call--footer {
  margin-top: auto;
  margin-bottom: 0;
  width: 100%;
}
.be-callwidget-ongoing-call--footer .be-button {
  width: 100%;
  max-width: 100% !important;
}
.be-callwidget-ongoing-call .simplebar-content {
  min-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-callwidget-ongoing-call.calling .be-callwidget-ongoing-call--body .info-bar:after {
  content: "...";
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis-dot 1s infinite 0.3s;
          animation: ellipsis-dot 1s infinite 0.3s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  width: 1.25em;
}
@-webkit-keyframes ellipsis-dot {
  25% {
    content: "";
  }
  50% {
    content: ".";
  }
  75% {
    content: "..";
  }
  100% {
    content: "...";
  }
}
@keyframes ellipsis-dot {
  25% {
    content: "";
  }
  50% {
    content: ".";
  }
  75% {
    content: "..";
  }
  100% {
    content: "...";
  }
}
.be-callwidget-ongoing-call.calling .controls .be-button.after-call-started {
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  opacity: 0.4;
  pointer-events: none;
}
.be-callwidget-ongoing-call.end-call .controls .be-button {
  opacity: 0.4;
  pointer-events: none;
}
.be-callwidget-ongoing-call.end-call .be-callwidget-ongoing-call--footer {
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  opacity: 0;
  visibility: hidden;
}
.be-callwidget-ongoing-call .be-callwidget-numpad {
  display: none;
}
.be-callwidget-ongoing-call .be-callwidget-numpad .input-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-callwidget-ongoing-call .be-callwidget-numpad .input-wrap .be-callwidget-numpad-number-input .be-text-field__input input {
  padding-right: 8px;
}
.be-callwidget-ongoing-call .be-callwidget-numpad .input-wrap .be-button {
  padding: 8px;
  max-height: 44px;
  height: 44px;
}
.be-callwidget-ongoing-call.numpad-activated .be-callwidget-ongoing-call--body .controls {
  display: none;
}
.be-callwidget-ongoing-call.numpad-activated .be-callwidget-numpad {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.be-callwidget-incoming-call {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 8px;
  z-index: 4;
  padding: 16px 12px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s ease, visibility 0s 0.3s ease;
  -o-transition: opacity 0.3s ease, visibility 0s 0.3s ease;
  transition: opacity 0.3s ease, visibility 0s 0.3s ease;
}
.be-callwidget-incoming-call--header {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.be-callwidget-incoming-call--header .txt {
  width: 100%;
  color: var(--n70);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}
.be-callwidget-incoming-call--body {
  padding-top: 32px;
}
.be-callwidget-incoming-call--body .contact {
  color: var(--nb);
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 8px;
}
.be-callwidget-incoming-call--body .number {
  color: var(--n80);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.be-callwidget-incoming-call--footer {
  margin-top: auto;
  margin-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
}
.be-callwidget-incoming-call--footer .be-callwidget-incoming-call-btn {
  width: 100%;
  max-width: 100% !important;
}
.be-callwidget-incoming-call--footer .be-callwidget-incoming-end-call-btn {
  width: 72px;
  max-width: 72px !important;
}
.be-callwidget-incoming-call.end-call .be-callwidget-incoming-call--header .txt {
  color: var(--nb);
}
.be-callwidget-incoming-call.end-call .be-callwidget-incoming-call--body .contact,
.be-callwidget-incoming-call.end-call .be-callwidget-incoming-call--body .number {
  opacity: 0.5;
  opacity: 0.3s ease;
}
.be-callwidget-incoming-call.end-call .be-callwidget-incoming-call--footer {
  opacity: 0;
  visibility: hidden;
  opacity: 0.3s ease;
}
.be-callwidget.ongoing-call .be-callwidget-ongoing-call {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s 0s ease;
  -o-transition: opacity 0.3s ease, visibility 0.3s 0s ease;
  transition: opacity 0.3s ease, visibility 0.3s 0s ease;
}
.be-callwidget.incoming-call .be-callwidget-incoming-call {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s 0s ease;
  -o-transition: opacity 0.3s ease, visibility 0.3s 0s ease;
  transition: opacity 0.3s ease, visibility 0.3s 0s ease;
}

.be-callwidget-wrap {
  position: fixed;
  right: 40px;
  bottom: 40px;
  z-index: 10;
}
.be-callwidget-wrap .be-callwidget--trigger {
  width: 68px;
  height: 68px;
  max-height: 68px !important;
  max-width: 68px !important;
  border-radius: 120px;
  border: 1px solid rgba(255, 255, 255, 0.36);
  -webkit-box-shadow: 0px 6px 16px 0px rgba(22, 80, 229, 0.5);
          box-shadow: 0px 6px 16px 0px rgba(22, 80, 229, 0.5);
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
}
.be-callwidget-wrap .be-callwidget--trigger .be-icon {
  width: 28px;
  height: 28px;
}
.be-callwidget-wrap .be-callwidget--trigger .bars {
  position: absolute;
  width: 31px;
  height: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3px;
  border-radius: 12px;
  border: 2px solid #137C5A;
  background: #FFF;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  right: 0;
  top: 0;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.be-callwidget-wrap .be-callwidget--trigger .bars .bar {
  width: 3px;
  height: 8px;
  border-radius: 8px;
  background: #137C5A;
  -webkit-animation: sound 0ms -600ms linear infinite alternate;
          animation: sound 0ms -600ms linear infinite alternate;
}
@-webkit-keyframes sound {
  0% {
    opacity: 0.35;
    height: 3px;
  }
  100% {
    opacity: 1;
    height: 8px;
  }
}
@keyframes sound {
  0% {
    opacity: 0.35;
    height: 3px;
  }
  100% {
    opacity: 1;
    height: 8px;
  }
}
.be-callwidget-wrap .be-callwidget--trigger .bars .bar:nth-child(1) {
  -webkit-animation-duration: 674ms;
          animation-duration: 674ms;
}
.be-callwidget-wrap .be-callwidget--trigger .bars .bar:nth-child(2) {
  -webkit-animation-duration: 588ms;
          animation-duration: 588ms;
}
.be-callwidget-wrap .be-callwidget--trigger .bars .bar:nth-child(3) {
  -webkit-animation-duration: 632ms;
          animation-duration: 632ms;
}
.be-callwidget-wrap .be-callwidget--trigger.incoming-call {
  -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
  animation: heartbeat 1.5s ease-in-out infinite both;
}
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
.be-callwidget-wrap .be-callwidget--trigger.ongoing-call .bars {
  opacity: 1;
}
.be-callwidget-wrap .be-callwidget {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scale(0.1);
      -ms-transform: scale(0.1);
          transform: scale(0.1);
  -webkit-transform-origin: 100% 100%;
      -ms-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
  pointer-events: none;
  -webkit-box-shadow: 0px 8px 20px 0px rgba(22, 80, 229, 0.22);
          box-shadow: 0px 8px 20px 0px rgba(22, 80, 229, 0.22);
}
.be-callwidget-wrap.opened .be-callwidget {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  pointer-events: initial;
}
.be-callwidget-wrap.opened .be-callwidget--trigger {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
}

@media (max-width: 1040px) {
  .be-callwidget-wrap {
    right: 20px;
  }
}
@media (max-width: 480px) {
  .be-callwidget-wrap {
    right: 16px;
    bottom: 16px;
  }
  .be-callwidget-wrap .be-callwidget {
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.be-chart.without-datalabels .apexcharts-datalabels {
  display: none !important;
}
.be-chart-legend {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.be-chart-legend.vertical {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.be-chart-legend.vertical .legend-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.be-chart-legend--item {
  color: var(--n90);
  font-size: 12px;
  line-height: 18px;
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.be-chart-legend--item::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  vertical-align: middle;
  margin-right: 8px;
  border-radius: 3px;
}
.be-chart-legend--item b {
  font-weight: 600;
}
.be-chart-legend--item.green::before {
  background: #2ABB8D;
}
.be-chart-legend--item.light-green::before {
  background: #BED558;
}
.be-chart-legend--item.blue::before {
  background: var(--bb100);
}
.be-chart-legend--item.light-blue::before {
  background: #009FB7;
}
.be-chart-legend--item.red::before {
  background: #C33737;
}
.be-chart-legend--item.light-red::before {
  background: #C95D63;
}
.be-chart-legend--item.orange::before {
  background: #D87400;
}
.be-chart-legend--item.light-orange::before {
  background: #EE8434;
}
.be-chart-legend--item.grey::before {
  background: var(--n50);
}
.be-chart .apexcharts-tooltip,
.be-chart .apexcharts-tooltip.apexcharts-theme-light {
  border: none;
  background: rgba(0, 0, 0, 0.76);
  border-radius: 4px;
  font-family: var(--font);
  color: #fff;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.be-chart .apexcharts-tooltip .apexcharts-tooltip-series-group.apexcharts-active, .be-chart .apexcharts-tooltip .apexcharts-tooltip-series-group:last-child,
.be-chart .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-series-group.apexcharts-active,
.be-chart .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-series-group:last-child {
  padding-bottom: 1px;
}
.be-chart .apexcharts-tooltip .apexcharts-tooltip-marker,
.be-chart .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-marker {
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 3px;
}
.be-chart .apexcharts-xaxis text,
.be-chart .apexcharts-yaxis text {
  fill: #868E96;
}
.be-chart .apexcharts-xaxis text {
  font-size: 11px;
  letter-spacing: -0.03em;
  font-weight: 400 !important;
}

.b-pl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background: var(--n10);
  height: 100vh;
  overflow: hidden;
}
.b-pl__sidebar {
  width: 240px;
  height: 100vh;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background: var(--nw);
  -webkit-box-shadow: 1px 0px 0px var(--n30);
          box-shadow: 1px 0px 0px var(--n30);
  overflow: hidden auto;
  padding: 20px 8px;
}
.b-pl__sidebar .simplebar-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  min-height: 100vh;
  min-height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.b-pl__sidebar__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  margin-bottom: 32px;
}
.b-pl__sidebar__header .b-pl__sidebar-close {
  display: none;
}
.b-pl__sidebar__logo {
  max-height: 24px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl__sidebar__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 4px;
}
.b-pl__sidebar__list:not(:last-child) {
  margin-bottom: 52px;
}
.b-pl__sidebar__link {
  width: 100%;
}
.b-pl__sidebar__link-element {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  padding: 8px;
  border-radius: 4px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 12px;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: var(--n100);
  background: none;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  cursor: pointer;
}
.b-pl__sidebar__link-element > .be-icon {
  fill: var(--n70);
  -webkit-transition: 0.15s ease;
  -o-transition: 0.15s ease;
  transition: 0.15s ease;
}
.b-pl__sidebar__link-element:hover {
  background: var(--n20);
}
.b-pl__sidebar__link-element.b-pl__sidebar__link__group-reference {
  border: none;
  outline: none;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.b-pl__sidebar__link-element.b-pl__sidebar__link__group-reference > span {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 12px;
}
.b-pl__sidebar__link-element.b-pl__sidebar__link__group-reference .be-icon {
  fill: var(--n70);
  -webkit-transition: 0.15s ease;
  -o-transition: 0.15s ease;
  transition: 0.15s ease;
}
.b-pl__sidebar__link__group-menu {
  border-radius: 0px 0px 4px 4px;
}
.b-pl__sidebar__link__group-menu .container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding: 8px 8px 8px 40px;
  gap: 8px;
  background: var(--n20);
  position: relative;
}
.b-pl__sidebar__link__group-menu .container:before {
  content: "";
  position: absolute;
  top: 0;
  left: 8px;
  width: calc(100% - 16px);
  height: 1px;
  background: var(--n40);
}
.b-pl__sidebar__link__group-menu a {
  font-weight: 400;
  font-size: 13px;
  line-height: 22px;
  color: var(--n100);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl__sidebar__link__group-menu a:hover {
  color: var(--bb100);
}
.b-pl__sidebar__link.be-collapse--open .b-pl__sidebar__link__group-reference {
  border-radius: 4px 4px 0 0;
  background: var(--n20);
}
.b-pl__sidebar__link.be-collapse--open .b-pl__sidebar__link__group-reference:hover {
  background: var(--n30);
}
.b-pl__sidebar__link.be-collapse--open .b-pl__sidebar__link__group-reference > .be-icon {
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
.b-pl__sidebar__link.active .b-pl__sidebar__link-element .be-icon:first-child {
  fill: var(--bb100);
}
.b-pl__sidebar__link.active .b-pl__sidebar__link-element.b-pl__sidebar__link__group-reference span > .be-icon {
  fill: var(--bb100);
}
.b-pl__sidebar__promo {
  background: var(--bb100);
  border-radius: 8px;
  margin: auto 0 0 0;
  padding: 56px 16px 16px 16px;
  position: relative;
  z-index: 0;
}
.b-pl__sidebar__promo:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/svg/besida-logomark--120.svg") no-repeat;
  background-size: 200px;
  background-position: 375% 220%;
  border-radius: 10px;
  opacity: 0.3;
}
.b-pl__sidebar__promo__ico {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  width: 52px;
  height: 52px;
  left: 16px;
  top: -12px;
  background: #2ABB8D;
  -webkit-box-shadow: 0px 4px 8px rgba(122, 227, 192, 0.25);
          box-shadow: 0px 4px 8px rgba(122, 227, 192, 0.25);
  border-radius: 8px;
}
.b-pl__sidebar__promo__ico .be-icon {
  fill: var(--nw);
  width: 36px;
  height: 36px;
}
.b-pl__sidebar__promo__desc {
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: var(--nw);
  margin-bottom: 16px;
}
.b-pl__sidebar__promo__desc a {
  color: inherit;
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
  -webkit-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  transition: 0.3s ease;
}
.b-pl__sidebar__promo__desc a:hover {
  opacity: 0.56;
}
.b-pl__sidebar__promo__cta {
  padding: 4px 4px 4px 8px;
  background: var(--nw);
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.b-pl__sidebar__promo__cta-code {
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: var(--n100);
  letter-spacing: -0.02em;
  text-transform: uppercase;
}
.b-pl__sidebar__promo__cta .be-button {
  padding: 4px 8px;
}
.b-pl__body {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden auto;
}
.b-pl__body.data-simplebar > .simplebar-wrapper > .simplebar-mask > .simplebar-offset > .simplebar-content-wrapper > .simplebar-content {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.b-pl__body__wrap {
  max-width: 1136px;
  margin: 0 12px;
  width: 100%;
}
.b-pl__body__header {
  padding-top: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 24px;
}
.b-pl__body__header__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.b-pl__body__header__controls__item {
  background: var(--nw);
  border: 1px solid var(--n30);
  border-radius: 8px;
}
.b-pl__body__header__content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -ms-flex-line-pack: center;
      align-content: center;
}
.b-pl__body__header__content .b-pl__sidebar-trigger {
  display: none;
}
.b-pl__body__title {
  font-style: normal;
  font-weight: 400;
  font-size: 24px;
  line-height: 36px;
}
.b-pl__body__section {
  margin-bottom: 36px;
}
.b-pl__body__section__header {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.b-pl__body__section__header .actions-row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 16px;
}
.b-pl__body__section__header .actions-row .buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
}
.b-pl__body__section__header .actions-row .graph-controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.b-pl__body__section__header .actions-row .graph-controls .switcher {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 16px;
  color: var(--n100);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item {
  color: var(--n90);
  font-size: 12px;
  position: relative;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  vertical-align: middle;
  margin-right: 8px;
  border-radius: 3px;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item.green::before {
  background: #2ABB8D;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item.blue::before {
  background: var(--bb100);
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item.red::before {
  background: #C33737;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item.orange::before {
  background: #D87400;
}
.b-pl__body__section__header .actions-row .graph-controls .graph-legend--item.grey::before {
  background: var(--n50);
}
.b-pl__body__section__header .filters-row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  padding: 0 16px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.b-pl__body__section__header .top-row {
  width: 100%;
  border-bottom: solid 1px var(--n30);
  padding: 16px 16px 8px 16px;
}
.b-pl__body__section__header .top-row .title {
  color: var(--n100);
  font-size: 14px;
  line-height: 20px;
}
.b-pl__body__section__header .top-row.w-tabs {
  border-bottom: none;
  padding: 16px 0 0 0;
}
.b-pl__body__section__footer {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 24px 16px;
}
.b-pl__body__section__footer.update-row {
  padding: 16px;
}
.b-pl__body__section.empty-state {
  min-height: calc(100vh - 60px);
  max-height: 1000px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 40px;
}
.b-pl__body__section.empty-state p {
  max-width: 320px;
  color: var(--n80);
  text-align: center;
  font-size: 12px;
  line-height: 16px;
}
.b-pl__body__section.empty-state .empty-graph-img {
  max-width: 360px;
}
.b-pl .be-dropdown.notification .be-dropdown-feed .date {
  padding-top: 2px;
  display: block;
  width: 100%;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: var(--n70);
}
.b-pl .be-dropdown.notification.unread .be-dropdown-link:hover:after {
  border-color: var(--bb10);
}
.b-pl .be-dropdown.notification.unread .be-dropdown-link:after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  right: 7px;
  top: 4px;
  border-radius: 12px;
  background: #E61616;
  border: 2px solid var(--nw);
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl .be-dropdown.user-card .be-dropdown-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  height: 36px;
  padding: 4px 12px 4px 4px;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl .be-dropdown.user-card .be-dropdown-link:hover {
  background: var(--bb10);
}
.b-pl .be-dropdown.user-card .be-dropdown-link:hover .name {
  color: var(--bb100);
}
.b-pl .be-dropdown.user-card .be-dropdown-link:hover .be-divider {
  background: var(--n40);
}
.b-pl .be-dropdown.user-card .be-dropdown-link .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 4px;
  width: 28px;
  height: 28px;
  background: var(--bb160);
  border-radius: 28px;
}
.b-pl .be-dropdown.user-card .be-dropdown-link .icon .be-icon {
  fill: var(--nw);
}
.b-pl .be-dropdown.user-card .be-dropdown-link .be-divider {
  height: 16px;
}
.b-pl .be-dropdown.user-card .be-dropdown-link .name {
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: var(--n100);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl .be-dropdown.user-card .be-dropdown-link .account {
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  color: var(--n80);
}
.b-pl .be-dropdown.user-card .be-dropdown-menu .be-divider.horizontal {
  margin: 4px auto;
  width: calc(100% - 16px);
}
.b-pl .be-dropdown.user-card .be-dropdown-menu .sign-out-button {
  color: #BD1818;
}
.b-pl__footer {
  padding-bottom: 24px;
}
.b-pl__footer > .be-divider.horizontal {
  display: none;
}
.b-pl__footer.w-divider > .be-divider.horizontal {
  display: block;
  margin: 36px 0;
}
.b-pl__footer__top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 36px;
  gap: 16px;
}
.b-pl__footer__support {
  -webkit-box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.02);
          box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.02);
  width: 66.6666666667%;
}
.b-pl__footer__support__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
}
.b-pl__footer__support__icon {
  border-radius: 8px;
  width: 44px;
  height: 44px;
  background: var(--bb100);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl__footer__support__icon .be-icon {
  fill: var(--nw);
  height: 28px;
  width: 28px;
}
.b-pl__footer__support__title {
  font-weight: 500;
  font-size: 18px;
  line-height: 20px;
  color: var(--n100);
  margin-bottom: 4px;
}
.b-pl__footer__support__desc {
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: var(--n80);
}
.b-pl__footer__support__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
}
.b-pl__footer__support__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding: 16px;
  gap: 8px;
  background: var(--nw);
  border: 1px solid var(--n20);
  border-radius: 8px;
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl__footer__support__link img {
  max-height: 32px;
}
.b-pl__footer__support__link span {
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  color: var(--n100);
  text-align: center;
}
.b-pl__footer__support__link:hover {
  border-color: var(--n70);
  background: var(--n10);
}
.b-pl__footer__usefull-links {
  width: 33.3333333333%;
}
.b-pl__footer__usefull-links__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 20px;
}
.b-pl__footer__usefull-links__icon {
  width: 28px;
  height: 28px;
  background: var(--bb100);
  border-radius: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.b-pl__footer__usefull-links__icon .be-icon {
  fill: var(--nw);
}
.b-pl__footer__usefull-links__title {
  font-weight: 500;
  font-size: 18px;
  line-height: 20px;
}
.b-pl__footer__usefull-links__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
}
.b-pl__footer__usefull-links__body .col {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
}
.b-pl__footer__usefull-links-item {
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
  color: var(--n80);
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
  position: relative;
  padding-left: 12px;
}
.b-pl__footer__usefull-links-item:before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  left: 0px;
  top: 8px;
  background: var(--n40);
  border-radius: 1px;
}
.b-pl__footer__usefull-links-item:hover {
  color: var(--bb100);
}
.b-pl__footer__bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
}
.b-pl__footer__logo {
  max-height: 16px;
  margin-bottom: 6px;
}
.b-pl__footer__copyright .copy-text {
  font-style: normal;
  font-weight: 400;
  font-size: 11px;
  line-height: 20px;
  color: var(--n70);
}
.b-pl__footer__socials {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 24px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.b-pl__footer__socials a {
  -webkit-transition: 0.35s ease;
  -o-transition: 0.35s ease;
  transition: 0.35s ease;
}
.b-pl__footer__socials a:hover {
  opacity: 0.6;
}
.b-pl--members-table {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  width: 100%;
  border-radius: 8px;
  border: 2px solid var(--n30);
  height: 360px;
  position: relative;
  overflow: hidden;
}
.b-pl--members-table .thead .td {
  padding: 12px 16px;
}
.b-pl--members-table header {
  background: var(--n20);
  border-bottom: 1px solid var(--n30);
}
.b-pl--members-table .tbody {
  position: relative;
  width: 100%;
  padding-top: 8px;
}
.b-pl--members-table .tbody.data-simplebar {
  max-height: calc(100% - 41px);
}
.b-pl--members-table .tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}
.b-pl--members-table .td {
  display: inline-block;
  padding: 10px 16px;
}
.b-pl--members-table .td-num {
  width: 60px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl--members-table .td-name {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  word-break: break-word;
}
.b-pl--members-table .td-occupation {
  width: 100px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl--members-table .td-actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.b-pl--members-table .td-actions.--1 {
  width: 60px;
}
.b-pl--members-table .td-actions.--2 {
  width: 92px;
}
.b-pl--members-table.grey {
  border: none;
}
.b-pl--members-table.grey .tbody {
  background: var(--n10);
}
.b-pl--members-table.w-actions .tbody .td {
  padding: 6px 16px;
}
.b-pl--members-table.w-search .be-text-field {
  width: 100%;
}
.b-pl--members-table.w-search .be-text-field .be-text-field__input input {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 6px 6px 0 0;
}
.b-pl--members-table.w-search .be-text-field .be-text-field__input input:focus {
  -webkit-box-shadow: inset 0 0 0 2px var(--n100);
          box-shadow: inset 0 0 0 2px var(--n100);
}
.b-pl--members-table.w-search .tbody.data-simplebar {
  max-height: calc(100% - 36px);
}
.b-pl--members-table.without-header .tbody.data-simplebar {
  height: 100%;
  max-height: 100%;
}
.b-pl--members-table.--empty {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px;
  padding: 12px;
}
.b-pl--members-table.--empty .icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 8px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 20px;
  background: var(--n10);
}
.b-pl--members-table.--empty .icon .be-icon {
  fill: var(--n80);
}
.b-pl--members-table.--empty .txt {
  color: var(--n80);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

@media (max-width: 1300px) {
  .b-pl__footer__support__body {
    gap: 8px;
  }
  .b-pl__footer__support__link {
    padding: 16px 12px;
  }
}
@media (max-width: 1100px) {
  .b-pl__sidebar {
    position: fixed;
    z-index: -2;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: 0.35s ease;
    -o-transition: 0.35s ease;
    transition: 0.35s ease;
    -webkit-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
            transform: translateX(-20px);
  }
  .b-pl__sidebar.opened {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    z-index: 2;
  }
  .b-pl__body__header__content .b-pl__sidebar-trigger {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .b-pl__sidebar__header .b-pl__sidebar-close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  body.active-sidebar .b-pl__body {
    opacity: 0.4;
    pointer-events: none;
    height: 100vh;
    overflow: hidden;
  }
}
@media (max-width: 800px) {
  .b-pl__body__wrap {
    margin: 0;
    padding: 0 4px;
  }
  .be-table.--desktop {
    display: none;
  }
  .be-table.--mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
  }
  .b-pl__body__header {
    background: var(--nw);
    -webkit-box-shadow: 0px 1px 0px 0px #E9ECEF;
            box-shadow: 0px 1px 0px 0px #E9ECEF;
    padding: 8px 4px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20;
  }
  .b-pl__body__title {
    font-size: 18px;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
  }
  .b-pl__body__header__content {
    width: calc(100% - 130px);
  }
  .b-pl__body__header__controls {
    gap: 4px;
  }
  .b-pl__body__header__controls__item.user-card .name, .b-pl__body__header__controls__item.user-card .be-divider, .b-pl__body__header__controls__item.user-card .account {
    display: none;
  }
  .b-pl__body__header__controls__item.user-card .be-dropdown-link {
    padding-right: 4px !important;
  }
  .b-pl__body {
    padding-top: 70px;
  }
  .b-pl__sidebar {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    -webkit-box-shadow: none;
            box-shadow: none;
    width: 100%;
  }
  .b-pl__sidebar__promo {
    width: 100%;
  }
  .be-pagination {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .be-pagination .be-pagination__navigation {
    width: 100%;
  }
  .b-pl__body__section__header .actions-row {
    padding: 12px;
  }
  .b-pl__body__section__header .actions-row {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 8px;
  }
  .b-pl__body__section__header .actions-row .be-text-field {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    width: 100%;
  }
  .b-pl__body__section__header .actions-row .buttons {
    width: 100%;
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .b-pl__body__section__header .actions-row .buttons .be-button {
    width: 100%;
  }
  .b-pl__footer__top {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .b-pl__footer__top .be-box {
    width: 100%;
  }
  .b-pl__footer__bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 32px;
    padding-bottom: 28px;
  }
  .b-pl__footer__bottom .b-pl__footer__copyright {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    text-align: center;
  }
  .b-pl__footer__bottom .b-pl__footer__socials {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media (max-width: 600px) {
  .b-pl__footer__support__body {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .b-pl__footer__support__link {
    width: calc(50% - 4px);
  }
}
@media (max-width: 420px) {
  .be-dropdown.b-pl__body__header__controls__item.notification .be-popover.be-dropdown-feed {
    position: fixed;
    top: 53px;
    left: 4px;
    width: calc(100% - 8px);
  }
}