.ba-search-select-container {
  position: relative;
}
.ba-search-select-container::before {
  content: attr(data-name);
  position: absolute;
  margin-left: 4px;
  font-size: 13px;
  line-height: 1.4;
  pointer-events: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

#infinite-loader-outline {
  stroke-dasharray: 2.42777px, 242.77666px;
  stroke-dashoffset: 0;
  animation: anim 1.6s linear infinite;
}

@keyframes anim {
  12.5% {
    stroke-dasharray: 33.98873px, 242.77666px;
    stroke-dashoffset: -26.70543px;
  }
  43.75% {
    stroke-dasharray: 84.97183px, 242.77666px;
    stroke-dashoffset: -84.97183px;
  }
  100% {
    stroke-dasharray: 2.42777px, 242.77666px;
    stroke-dashoffset: -240.34889px;
  }
}

.mce-item-table:not([border]),
.mce-item-table:not([border]) caption,
.mce-item-table:not([border]) td,
.mce-item-table:not([border]) th,
.mce-item-table[border='0'],
.mce-item-table[border='0'] caption,
.mce-item-table[border='0'] td,
.mce-item-table[border='0'] th,
table[style*='border-width: 0px'],
table[style*='border-width: 0px'] caption,
table[style*='border-width: 0px'] td,
table[style*='border-width: 0px'] th {
  border: 1px solid #bbb;
}
.tox-notification {
  display: none !important;
}
.tox-notification--in {
  display: none !important;
}

.tox-notification--warning {
  display: none !important;
}

.tox .tox-statusbar {
  display: none !important;
}

.mce-content-body {
  font-family: Lato;
  font-size: 13px;
  line-height: 26px;
  color: #25213b;
  padding: 8px;
}

.mce-content-body:focus-visible {
  outline: none !important;
}
.mce-content-body p {
  margin: 0 0;
}
.mce-content-body li {
  margin: 8px 2px;
}
.mce-content-body a {
  cursor: default;
}
.mce-content-body:not([dir='rtl'])[data-mce-placeholder]:not(
    .mce-visualblocks
  )::before {
  padding: 0 8px;
}
.tox-tinymce-inline .tox-editor-header {
  border: none;
  border-bottom: 1px solid #ccc;
}
.tox .tox-tbtn--bespoke .tox-tbtn__select-label {
  width: 3em;
}
.tox-tinymce-inline {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  box-shadow: -10px -10px 40px 0px #c0cbed4a;
}

.mce-content-body table thead {
  background: #fafafa;
}
.mce-content-body table caption,
.mce-content-body table td,
.mce-content-body table th {
  padding: 8px;
}

.mce-content-body code {
  background-color: #e8e8e8;
  border-radius: 3px;
  padding: 0.1rem 0.2rem;
}

.mce-content-body:not([dir='rtl']) blockquote {
  border-left: 2px solid #ccc;
  margin-left: 1.5rem;
  padding-left: 1rem;
}

.mce-content-body[dir='rtl'] blockquote {
  border-right: 2px solid #ccc;
  margin-right: 1.5rem;
  padding-right: 1rem;
}

/* v6 addition */

.tox.tox-tinymce-inline {
  z-index: 1300;
}

/* Toolbar */

.tox .tox-toolbar__primary,
.tox-toolbar {
  background-image: none !important;
  border-bottom: 1px solid #dfdfdf !important;
  /* border-radius: 2px !important; */
}

.tox .tox-toolbar-overlord > .tox-toolbar__primary {
  background: none !important;
}

.tox-pop .tox-pop__dialog .tox-toolbar {
  background: #fff !important;
}

/* Toolbar buttons */
.tox .tox-tbtn {
  padding: 5px 0 !important;
  color: #59758a !important;
}

.tox .tox-split-button:hover {
  box-shadow: 0 0 0 1px #edf1f5 !important;
}

.tox .tox-split-button:focus,
.tox .tox-tbtn:hover,
.tox .tox-collection__item:hover,
.tox .tox-collection--toolbar .tox-collection__item--active {
  background-color: #edf1f5 !important;
}

.tox-tbtn .tox-tbtn--enabled,
.tox .tox-collection--toolbar .tox-collection__item--enabled,
.tox .tox-tbtn--enabled,
.tox .tox-tbtn--enabled:hover {
  background-color: #919df6 !important;
  color: white !important;
}
.tox
  .tox-collection--toolbar
  .tox-collection__item--active:not(.tox-collection__item--state-disabled):not(
    .tox-collection__item--enabled
  ) {
  color: #919df6 !important;
}
.tox .tox-tbtn svg {
  fill: #59758a !important;
}

.tox .tox-tbtn--enabled svg {
  fill: white !important;
}

.tox .tox-tbtn--select:not([title='Blocks']) {
  width: 50px !important;
}

/* Modal Inputs */
.tox .tox-listboxfield .tox-listbox--select:focus,
.tox .tox-textarea:focus,
.tox .tox-textfield:focus {
  border-color: #919df6 !important;
}

.tox .tox-collection--list .tox-collection__item--active {
  background-color: #edf1f5 !important;
}

.tox .tox-insert-table-picker .tox-insert-table-picker__selected {
  background-color: #edf1f5aa !important;
  border-color: #ddd !important;
}

.tox
  .tox-collection--list
  .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
  color: #919df6 !important;
  background-color: #edf1f5aa !important;
}

/* Modal Buttons */
.tox .tox-button:not(.tox-button--naked):not(.tox-button--secondary),
.tox .tox-button:not(.tox-button--naked):not(.tox-button--secondary):hover {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
  color: white;
}

.tox .tox-button:not(.tox-button--naked),
.tox .tox-button:not(.tox-button--naked) {
  border-radius: 4px !important;
}

.tox .tox-button--secondary {
  border-color: #919df6 !important;
  color: #919df6 !important;
}

.tox .tox-button--secondary:hover {
  background-color: #edf1f5aa !important;
}

.tox .tox-button--naked:hover,
.tox .tox-button--naked:focus {
  border-color: #919df6 !important;
  color: #919df6 !important;
}

/* Image */
.mce-content-body img {
  max-width: 80% !important;
  max-height: 300px !important;
}

/* Checkbox */

.tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before {
  content: '' !important;
  position: absolute;
  background-color: #919df6;
  height: 16px !important;
  width: 16px !important;
  border-radius: 4px !important;
  top: 3px;
}

.tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::after {
  content: '✓' !important;
  color: white;
  position: absolute;
  left: -16px;
  top: 0px;
}

.tox-checklist li {
  position: relative;
}

/* Mentions */
.ba-mention {
  color: #118def;
}

.ba-mention:hover {
  cursor: pointer;
}

.card {
  height: -moz-min-content !important;
  height: min-content !important;
  background-color: #fff !important;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px !important;
  padding: 0.75rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  border: #eee 1px solid !important;
}

.tox .email:not(svg):not(rect) {
  margin-top: 2px;
}

.avatar-text {
  text-transform: uppercase !important;
  font-size: 12px !important;
  text-align: center !important;
}

.avatar {
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  color: white !important;
  border-radius: 50% !important;
  background-color: #919df6 !important;
}

.text-container {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-around !important;
}

.name {
  font-size: 12px !important;
  font-weight: bold !important;
  padding: 0 !important;
}

.email {
  font-size: 12px !important;
  opacity: 0.8 !important;
  padding: 0 !important;
}

.tox
  .tox-autocompleter
  .tox-collection--list
  .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
  color: var(--color-primary) !important;
}

.tox .tox-toolbar__group {
  background-color: #fff !important;
  padding: 0 10px 0 10px !important;
}

.tox-toolbar__overflow > .tox-toolbar__group {
  margin-bottom: 0 !important;
  margin-top: 2px !important;
}
.tox-menu.tox-collection.tox-collection--list {
  max-height: 200px;
  overflow-y: hidden;
}

.tox-menu.tox-collection.tox-collection--list:hover {
  overflow-y: auto;
}

.tox.tox-tinymce {
  min-height: 40px;
  height: -moz-min-content !important;
  height: min-content !important;
}

.tox.tox-tinymce.tox-fullscreen {
  min-height: unset;
  height: 100vh !important;
}

.tox-pop__dialog > div > .tox-toolbar__group {
  margin: 0;
}

.react-flow__handle.connectable:hover {
  cursor: copy;
}

/* CSS variables. */
:root {
	--PhoneInput-color--focus: #03b2cb;
	--PhoneInputInternationalIconPhone-opacity: 0.8;
	--PhoneInputInternationalIconGlobe-opacity: 0.65;
	--PhoneInputCountrySelect-marginRight: 0.35em;
	--PhoneInputCountrySelectArrow-width: 0.3em;
	--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
	--PhoneInputCountrySelectArrow-borderWidth: 1px;
	--PhoneInputCountrySelectArrow-opacity: 0.45;
	--PhoneInputCountrySelectArrow-color: currentColor;
	--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountrySelectArrow-transform: rotate(45deg);
	--PhoneInputCountryFlag-aspectRatio: 1.5;
	--PhoneInputCountryFlag-height: 1em;
	--PhoneInputCountryFlag-borderWidth: 1px;
	--PhoneInputCountryFlag-borderColor: rgba(0,0,0,0.5);
	--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,0.1);
}

.PhoneInput {
	/* This is done to stretch the contents of this component. */
	display: flex;
	align-items: center;
}

.PhoneInputInput {
	/* The phone number input stretches to fill all empty space */
	flex: 1;
	/* The phone number input should shrink
	   to make room for the extension input */
	min-width: 0;
}

.PhoneInputCountryIcon {
	width: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));
	height: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--square {
	width: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--border {
	/* Removed `background-color` because when an `<img/>` was still loading
	   it would show a dark gray rectangle. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom. */
	background-color: var(--PhoneInputCountryFlag-backgroundColor--loading);
	/* Border is added via `box-shadow` because `border` interferes with `width`/`height`. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom,
	   so an additional "inset" border is added. */
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);
}

.PhoneInputCountryIconImg {
	/* Fixes weird vertical space above the flag icon. */
	/* https://gitlab.com/catamphetamine/react-phone-number-input/-/issues/7#note_348586559 */
	display: block;
	/* 3rd party <SVG/> flag icons won't stretch if they have `width` and `height`.
	   Also, if an <SVG/> icon's aspect ratio was different, it wouldn't fit too. */
	width: 100%;
	height: 100%;
}

.PhoneInputInternationalIconPhone {
	opacity: var(--PhoneInputInternationalIconPhone-opacity);
}

.PhoneInputInternationalIconGlobe {
	opacity: var(--PhoneInputInternationalIconGlobe-opacity);
}

/* Styling native country `<select/>`. */

.PhoneInputCountry {
	position: relative;
	align-self: stretch;
	display: flex;
	align-items: center;
	margin-right: var(--PhoneInputCountrySelect-marginRight);
}

.PhoneInputCountrySelect {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	border: 0;
	opacity: 0;
	cursor: pointer;
}

.PhoneInputCountrySelect[disabled],
.PhoneInputCountrySelect[readonly] {
	cursor: default;
}

.PhoneInputCountrySelectArrow {
	display: block;
	content: '';
	width: var(--PhoneInputCountrySelectArrow-width);
	height: var(--PhoneInputCountrySelectArrow-width);
	margin-left: var(--PhoneInputCountrySelectArrow-marginLeft);
	border-style: solid;
	border-color: var(--PhoneInputCountrySelectArrow-color);
	border-top-width: 0;
	border-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	border-left-width: 0;
	border-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	transform: var(--PhoneInputCountrySelectArrow-transform);
	opacity: var(--PhoneInputCountrySelectArrow-opacity);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon + .PhoneInputCountrySelectArrow {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon--border {
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}