@charset "UTF-8";.bs-button[data-v-b7ae95cb] {
  color: var(--color-text);
  border: none;
  border-radius: 2px;
  padding: 4px 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  height: 26px;
  vertical-align: middle;
  white-space: nowrap;
  text-decoration: none;
  margin-right: 1px;
}
.bs-button.border-0 > .font-icon.left[data-v-b7ae95cb] {
  margin-right: 0;
}
.bs-button.border-0 > .font-icon.right[data-v-b7ae95cb] {
  margin-left: 0;
}
.bs-button.bg-transparent[data-v-b7ae95cb]:not(:disabled):hover {
  opacity: 0.8;
}
.bs-button.bg-transparent[data-v-b7ae95cb]:not(:disabled):active {
  opacity: 0.8;
}
.bs-button[data-v-b7ae95cb]:disabled {
  cursor: default;
  opacity: 0.6;
}
.bs-button.default[data-v-b7ae95cb] {
  background-color: var(--button-default-bg);
  border: 1px solid var(--border);
  color: var(--button-default-text);
}
.bs-button.default[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: var(--gray-100);
}
.bs-button.default[data-v-b7ae95cb]:not(:disabled):active {
  background-color: var(--gray-200);
}
.bs-button.blue[data-v-b7ae95cb] {
  background-color: var(--blue);
  border: 1px solid var(--blue);
  color: var(--white);
}
.bs-button.blue[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--blue) 90%, black 10%);
}
.bs-button.blue[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--blue) 80%, black 20%);
}
.bs-button.red[data-v-b7ae95cb] {
  background-color: var(--red);
  color: var(--white);
}
.bs-button.red[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--red) 90%, black 10%);
}
.bs-button.red[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--red) 80%, black 20%);
}
.bs-button.orange[data-v-b7ae95cb] {
  background-color: var(--orange);
  color: var(--white);
}
.bs-button.orange[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--orange) 90%, black 10%);
}
.bs-button.orange[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--orange) 80%, black 20%);
}
.bs-button.green[data-v-b7ae95cb] {
  background-color: var(--green);
  color: var(--white);
}
.bs-button.green[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--green) 90%, black 10%);
}
.bs-button.green[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--green) 80%, black 20%);
}
.bs-button.gray[data-v-b7ae95cb] {
  background-color: var(--gray);
  color: var(--white);
}
.bs-button.gray[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--gray) 90%, black 10%);
}
.bs-button.gray[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--gray) 80%, black 20%);
}
.bs-button.underline[data-v-b7ae95cb] {
  padding: 0 8px;
  border: 0 none;
  border-radius: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
  background-color: var(--button-default-bg);
  color: var(--button-default-text);
}
.bs-button.underline.blue[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: color-mix(in srgb, var(--blue) 95%, black 5%);
}
.bs-button.underline.blue[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--blue) 90%, black 10%);
}
.bs-button.underline.red[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--red) 90%, black 10%);
}
.bs-button.underline.orange[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--orange) 90%, black 10%);
}
.bs-button.underline.green[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--green) 90%, black 10%);
}
.bs-button.underline.gray[data-v-b7ae95cb]:not(:disabled):active {
  background-color: color-mix(in srgb, var(--gray) 90%, black 10%);
}
[data-theme=dark] .bs-button.default[data-v-b7ae95cb]:not(:disabled):hover {
  background-color: var(--gray-800);
}
[data-theme=dark] .bs-button.default[data-v-b7ae95cb]:not(:disabled):active {
  background-color: var(--gray-700);
}.bs-form-label.required:after {
  content: "*";
  color: var(--primary);
  margin-left: 2px;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base, .bs-popup {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base, [data-theme=dark] .bs-popup {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-popup {
  position: fixed;
  border: 1px solid var(--border);
  border-radius: 4px;
  background-color: var(--body-bg);
  color: var(--body-text);
  z-index: 300;
  min-width: 48px;
  min-height: 24px;
}[data-theme=dark] .bs-select-popup > .popup-items > .popup-item.selected-item {
  color: var(--primary-400);
}
[data-theme=dark] .bs-select-popup > .popup-items > .popup-item.selected-item .checkbox::before {
  color: var(--primary-400);
}
.bs-select-popup {
  min-width: 120px;
  max-height: 300px;
  overflow: hidden;
  line-height: 1;
}
.bs-select-popup > .popup-search > input {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
  padding: 2px 4px;
  width: 100%;
  color: var(--body-text);
  outline: 0;
}
.bs-select-popup > .popup-search > input:focus {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-select-popup > .popup-items > .popup-item {
  padding: 6px 16px;
  height: 28px;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.bs-select-popup > .popup-items > .popup-item .checkbox {
  display: inline-flex;
  width: 20px;
  margin-left: -10px;
}
.bs-select-popup > .popup-items > .popup-item .checkbox::before {
  font-family: var(--icon-font-family);
  content: "";
  font-size: 16px;
  color: var(--color-text);
  margin-right: 2px;
}
.bs-select-popup > .popup-items > .popup-item .label {
  flex-grow: 1;
  white-space: nowrap;
  cursor: pointer;
}
.bs-select-popup > .popup-items > .popup-item .label.null-label {
  color: var(--color-text-light);
}
.bs-select-popup > .popup-items > .popup-item.hovered {
  background-color: var(--color-hover);
}
.bs-select-popup > .popup-items > .popup-item.selected-item {
  color: var(--primary);
  font-weight: bold;
}
.bs-select-popup > .popup-items > .popup-item.selected-item .checkbox::before {
  content: "check";
  color: var(--primary);
}.bs-box-component-wrap, .bs-select-wrap, .bs-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap, .bs-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected, .bs-select:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected, .bs-select:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected, .bs-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label, .bs-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder, .bs-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn, .bs-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-select .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected, .modified.bs-select > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected, .error.bs-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected, .disabled.bs-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode, .view-mode.bs-select {
  background-color: transparent;
}
.bs-select-wrap .small-progress, .bs-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-input-wrap .suffix .bs-context-menu > .menu.has-submenu::after,
.bs-input-wrap .prefix .font-icon,
.bs-input-wrap .prefix .bs-context-menu > .menu.has-submenu::after {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon, .bs-context-menu > .menu.has-submenu::after {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled, .bs-context-menu > .filled.menu.has-submenu::after {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-context-menu {
  padding: 4px 0;
  min-width: 120px;
  min-height: auto;
  max-height: 500px;
  overflow: auto;
  cursor: default;
}
.bs-context-menu > .menu {
  padding: 6px 12px;
  display: flex;
  align-items: flex-start;
  white-space: nowrap;
  cursor: pointer;
}
.bs-context-menu > .menu.disabled {
  color: var(--gray-400);
}
.bs-context-menu > .menu:not(.disabled):hover {
  background-color: var(--color-hover);
}
.bs-context-menu > .menu.has-submenu::after {
  content: "chevron_right";
  position: absolute;
  right: 2px;
}
.bs-context-menu > .menu.separator {
  padding: 0;
  margin: 4px 0;
  border-bottom: 1px solid var(--border);
}
.bs-context-menu > .menu.no-padding {
  padding: 0;
}
.bs-context-menu > .menu a {
  text-decoration: none;
  color: var(--body-text);
  width: 100%;
  padding: 6px 12px;
}.bs-popup-button {
  display: inline-block;
  position: relative;
}
.bs-popup-button .bs-context-menu {
  position: absolute;
  min-width: 100%;
}
.bs-popup-button.icon-only > button {
  border: 0 !important;
  padding: 4px 0;
}
.bs-popup-button.icon-only > button > .font-icon {
  font-size: 1.2rem;
}
.bs-popup-button.icon-only > button > .font-icon.right {
  display: none;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-text-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-text-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-input > .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-text-input .suffix,
.bs-input-wrap .prefix,
.bs-text-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-text-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-text-input .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-text-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-text-input .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-text-input .suffix img,
.bs-input-wrap .prefix img,
.bs-text-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-text-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-text-input .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-text-input > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-text-input > .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-text-input > .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-text-input > .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-text-input > .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-text-input > .input-area {
  width: 100%;
}
.bs-text-input.value-right input {
  text-align: right;
}
.bs-text-input.value-center input {
  text-align: center;
}.bs-link a[data-v-29df56e5] {
  color: var(--body-text);
}/* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}
.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}
.flex-column, .bs-layout-vertical, .bs-progressbar .inner-progressbar, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}
.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}
.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}
.flex-grow-0 {
  flex-grow: 0;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.flex-grow-1 {
  flex-grow: 1;
}
.flex-shrink-1 {
  flex-shrink: 1;
}
.flex-grow-2 {
  flex-grow: 2;
}
.flex-shrink-2 {
  flex-shrink: 2;
}
.flex-grow-3 {
  flex-grow: 3;
}
.flex-shrink-3 {
  flex-shrink: 3;
}
.flex-grow-4 {
  flex-grow: 4;
}
.flex-shrink-4 {
  flex-shrink: 4;
}
.flex-grow-5 {
  flex-grow: 5;
}
.flex-shrink-5 {
  flex-shrink: 5;
}
.flex-grow-6 {
  flex-grow: 6;
}
.flex-shrink-6 {
  flex-shrink: 6;
}
.flex-grow-7 {
  flex-grow: 7;
}
.flex-shrink-7 {
  flex-shrink: 7;
}
.flex-grow-8 {
  flex-grow: 8;
}
.flex-shrink-8 {
  flex-shrink: 8;
}
.gap-0 {
  gap: 0px;
}
.gap-1 {
  gap: 1px;
}
.gap-2 {
  gap: 2px;
}
.gap-3 {
  gap: 3px;
}
.gap-4 {
  gap: 4px;
}
.gap-5 {
  gap: 5px;
}
.gap-6 {
  gap: 6px;
}
.gap-7 {
  gap: 7px;
}
.gap-8 {
  gap: 8px;
}
.gap-9 {
  gap: 9px;
}
.gap-10 {
  gap: 10px;
}
.gap-11 {
  gap: 11px;
}
.gap-12 {
  gap: 12px;
}
.gap-13 {
  gap: 13px;
}
.gap-14 {
  gap: 14px;
}
.gap-15 {
  gap: 15px;
}
.gap-16 {
  gap: 16px;
}
.gap-17 {
  gap: 17px;
}
.gap-18 {
  gap: 18px;
}
.gap-19 {
  gap: 19px;
}
.gap-20 {
  gap: 20px;
}
.gap-21 {
  gap: 21px;
}
.gap-22 {
  gap: 22px;
}
.gap-23 {
  gap: 23px;
}
.gap-24 {
  gap: 24px;
}
.gap-25 {
  gap: 25px;
}
.gap-26 {
  gap: 26px;
}
.gap-27 {
  gap: 27px;
}
.gap-28 {
  gap: 28px;
}
.gap-29 {
  gap: 29px;
}
.gap-30 {
  gap: 30px;
}
.gap-31 {
  gap: 31px;
}
.gap-32 {
  gap: 32px;
}
.gap-33 {
  gap: 33px;
}
.gap-34 {
  gap: 34px;
}
.gap-35 {
  gap: 35px;
}
.gap-36 {
  gap: 36px;
}
.gap-37 {
  gap: 37px;
}
.gap-38 {
  gap: 38px;
}
.gap-39 {
  gap: 39px;
}
.gap-40 {
  gap: 40px;
}
.gap-41 {
  gap: 41px;
}
.gap-42 {
  gap: 42px;
}
.gap-43 {
  gap: 43px;
}
.gap-44 {
  gap: 44px;
}
.gap-45 {
  gap: 45px;
}
.gap-46 {
  gap: 46px;
}
.gap-47 {
  gap: 47px;
}
.gap-48 {
  gap: 48px;
}
.gap-49 {
  gap: 49px;
}
.gap-50 {
  gap: 50px;
}
.gap-51 {
  gap: 51px;
}
.gap-52 {
  gap: 52px;
}
.gap-53 {
  gap: 53px;
}
.gap-54 {
  gap: 54px;
}
.gap-55 {
  gap: 55px;
}
.gap-56 {
  gap: 56px;
}
.gap-57 {
  gap: 57px;
}
.gap-58 {
  gap: 58px;
}
.gap-59 {
  gap: 59px;
}
.gap-60 {
  gap: 60px;
}
.gap-61 {
  gap: 61px;
}
.gap-62 {
  gap: 62px;
}
.gap-63 {
  gap: 63px;
}
.gap-64 {
  gap: 64px;
}
.flex-align-start {
  align-items: flex-start;
}
.flex-align-center {
  align-items: center;
}
.flex-align-end {
  align-items: flex-end;
}
.flex-content-start {
  justify-content: flex-start;
}
.flex-content-center {
  justify-content: center;
}
.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}
.bs-layout-form > div {
  display: flex;
  align-items: center;
}
.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}
.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}
.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}
.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}
.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}
.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}
.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}
.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}
.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}
.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}
.bs-layout-table {
  border-collapse: collapse;
}
.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}
.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}
.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}
.bs-progressbar {
  height: 28px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--border-radius) !important;
  line-height: 24px;
  position: relative;
  background-color: var(--body-bg);
}
.bs-progressbar .inner-progressbar {
  background-color: var(--primary);
  height: 100%;
  line-height: 24px;
  position: relative;
  transition: width 500ms;
}
.bs-progressbar .show-percent {
  position: absolute;
  padding: 0 4px;
  height: 100%;
  transition: left 0.3s, right 0.3s;
}
.bs-progressbar .indeterminate {
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 24px;
  background-color: var(--body-bg);
}
.bs-progressbar .indeterminate .in-box {
  background-color: var(--primary);
  position: absolute;
  width: 20%;
  height: 100%;
  border-radius: var(--border-radius) !important;
  animation: moveBar 3s ease-in-out infinite;
}
@keyframes moveBar {
from {
    left: -20%;
}
to {
    left: 100%;
}
}.bs-console[data-v-f33a4477] {
  height: 100px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  overflow: auto;
  background-color: var(--body-bg);
  white-space: pre;
}
.bs-console > span[data-v-f33a4477] {
  display: block;
  line-height: 1.6em;
}.bs-loading-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.bs-loading-icon > .font-icon {
  animation: spin 1s linear infinite;
}.bs-date {
  display: inline-flex;
  gap: 4px;
}
.bs-date::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable, .page-navigation > span {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover, .page-navigation > span:hover {
  filter: opacity(75%);
}
.bs-clickable:active, .page-navigation > span:active {
  filter: opacity(50%);
}
.bs-clickable.disabled, .page-navigation > span.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.page-navigation {
  padding: 8px;
  display: flex;
  gap: 2px;
  align-items: center;
  justify-content: center;
  color: var(--body-text);
  line-height: 1;
}
.page-navigation > span {
  display: inline-flex;
  padding: 4px 6px;
  align-items: center;
  justify-content: center;
}
.page-navigation > span.on {
  background-color: var(--primary-300);
  border-radius: 2px;
}
.page-navigation > span:not(.page) {
  padding: 3px;
  font-size: 1.4em;
}
.page-navigation > span.disabled {
  color: var(--gray-400);
  cursor: initial;
}
.page-navigation > span:not(.disabled):hover {
  border-radius: 2px;
}.bs-calendar .year-month {
  padding: 8px 8px 8px 0;
}
.bs-calendar table {
  font-size: 0.75rem;
}
.bs-calendar table tr th, .bs-calendar table tr td {
  height: 34px;
  text-align: center;
  vertical-align: middle;
  padding-top: 4px;
}
.bs-calendar table tr th {
  font-weight: 500;
}
.bs-calendar table tr td {
  cursor: pointer;
  user-select: none;
}
.bs-calendar table tr td > div {
  min-width: 34px;
  height: 34px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.bs-calendar table tr td.today > div {
  background-color: var(--gray-200);
  border-radius: 50%;
}
.bs-calendar table tr td.other-month > div {
  opacity: 0.5;
}
.bs-calendar table tr td.dow-0 > div {
  color: var(--red);
}
.bs-calendar table tr td.dow-6 > div {
  color: var(--blue);
}
.bs-calendar table tr td.selected > div {
  background-color: var(--blue);
  color: var(--white);
  border-radius: 50%;
}
.bs-calendar table tr td.range-selected > div {
  background-color: var(--blue);
  color: var(--white);
  border-radius: 0;
}
.bs-calendar table tr td:first-child.range-selected > div, .bs-calendar table tr td.range-selected-start > div {
  border-radius: 50% 0 0 50%;
}
.bs-calendar table tr td:last-child.range-selected > div, .bs-calendar table tr td.range-selected-end > div {
  border-radius: 0 50% 50% 0;
}
.bs-calendar table tr td.range-selected-start.range-selected-end > div, .bs-calendar table tr td:first-child.range-selected-end > div, .bs-calendar table tr td:last-child.range-selected-start > div {
  border-radius: 50%;
}
.bs-calendar table tr.weekdays {
  border-bottom: 1px solid var(--gray-200);
}
.bs-calendar table.disabled {
  background-color: var(--gray-200);
  border-radius: 4px;
  opacity: 0.7;
}
.bs-calendar table.disabled tr > td {
  cursor: default;
}
.bs-calendar .select-wrap {
  background-color: var(--gray-100);
}.bs-calendar-range .tilde {
  font-size: 1.2rem;
  padding: 8px;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-number-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-number-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-number-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-number-input .suffix,
.bs-input-wrap .prefix,
.bs-number-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-number-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-number-input .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-number-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-number-input .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-number-input .suffix img,
.bs-input-wrap .prefix img,
.bs-number-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-number-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-number-input .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-number-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-number-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-number-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-number-input .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-number-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-number-input .input-area {
  width: 100%;
}
.bs-number-input.value-right input {
  text-align: right;
}
.bs-number-input.value-center input {
  text-align: center;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-price-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-price-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-price-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-price-input .suffix,
.bs-input-wrap .prefix,
.bs-price-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-price-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-price-input .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-price-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-price-input .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-price-input .suffix img,
.bs-input-wrap .prefix img,
.bs-price-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-price-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-price-input .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-price-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-price-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-price-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-price-input .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-price-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-price-input .input-area {
  width: 100%;
}
.bs-price-input .input-area input {
  text-align: right;
}
.bs-price-input .currency-code {
  font-size: 0.9em;
  margin-right: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
}.bs-color-input input[type=color] {
  width: 32px;
  height: 26px;
  margin-right: -1px;
  border-radius: 2px 0 0 2px;
  border-color: var(--border);
  background-color: var(--body-bg);
}
.bs-color-input input[type=color]:focus {
  outline: none;
  border-color: var(--color-focus);
  border-width: 1px;
  z-index: 1;
}
.bs-color-input .bs-text-input .input-area {
  border-radius: 0 2px 2px 0;
}
.bs-color-input.error input[type=color] {
  border-color: var(--danger);
}
.bs-color-input.error .bs-text-input .input-area {
  border-color: var(--danger);
}
.bs-color-input.modified input[type=color] {
  border-color: var(--purple);
}
.bs-color-input.modified .bs-text-input .input-area {
  border-color: var(--purple);
}
.bs-color-input.disabled input[type=color] {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-color-input .view-mode {
  line-height: 1;
}
.bs-color-input .view-mode .color-preview {
  width: 28px;
  height: 18px;
  border-radius: 2px;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-input {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-input .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-input .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-date-input .suffix,
.bs-input-wrap .prefix,
.bs-date-input .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-date-input .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-input .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-date-input .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-input .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-date-input .suffix img,
.bs-input-wrap .prefix img,
.bs-date-input .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-input .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-input .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-date-input .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-date-input .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-date-input .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-date-input .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-date-input .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-date-input {
  width: 200px;
}
.bs-date-input .input-area {
  width: 100%;
  display: flex;
  align-items: center;
}
.bs-date-input .input-area .font-icon {
  padding: 0 6px;
  min-width: 26px;
  font-size: 14px;
}
.bs-date-input .input-area input {
  border-left: 1px solid var(--border);
}
.bs-date-input.disabled .font-icon {
  color: var(--gray-400);
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-range {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-range .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-range .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-date-range .suffix,
.bs-input-wrap .prefix,
.bs-date-range .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-date-range .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-range .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-date-range .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-range .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-date-range .suffix img,
.bs-input-wrap .prefix img,
.bs-date-range .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-range .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-range .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-date-range .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-date-range .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-date-range .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-date-range .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-date-range .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-date-range .input-area {
  width: 100%;
  display: flex;
  align-items: center;
  padding-right: 8px;
}
.bs-date-range .input-area .font-icon {
  padding: 0 6px;
  min-width: 26px;
  font-size: 14px;
}
.bs-date-range .input-area .font-icon + input {
  border-left: 1px solid var(--border);
}
.bs-date-range .input-area input {
  border-radius: 0;
  padding-right: 0;
  width: 4em;
  flex-grow: 1;
}
.bs-date-range .input-area input:disabled {
  color: var(--gray-400);
  background-color: var(--gray-100) !important;
}
.bs-date-range.disabled .font-icon {
  color: var(--gray-400);
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base, .bs-radio-button {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input, .bs-radio-button input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before, .bs-radio-button input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover, .bs-radio-button input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label, .bs-radio-button input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before, .bs-radio-button input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label, .bs-radio-button input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before, .modified.bs-radio-button input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label, .modified.bs-radio-button input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before, .error.bs-radio-button input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label, .error.bs-radio-button input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before, .disabled.bs-radio-button input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label, .disabled.bs-radio-button input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label, .bs-radio-button label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-radio-button input::before {
  content: "radio_button_unchecked";
}
.bs-radio-button .font-icon {
  vertical-align: middle;
}
.bs-radio-button .text-label {
  vertical-align: middle;
}
.bs-radio-button.checked input::before {
  content: "radio_button_checked";
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-radio-button-group {
  display: inline-block;
}
.bs-radio-button-group > .radio-button-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}
.bs-radio-button-group.vertical > .radio-button-group {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.bs-radio-button-group.switch-style .radio-button-group {
  overflow: hidden;
  gap: 0;
  border-radius: 4px;
  background-color: var(--body-bg);
}
.bs-radio-button-group.switch-style .bs-radio-button {
  position: relative;
}
.bs-radio-button-group.switch-style .bs-radio-button input {
  display: none;
  position: absolute;
}
.bs-radio-button-group.switch-style .bs-radio-button label {
  position: relative;
  padding: 7px;
  color: #999;
  transition: color 0.4s;
}
.bs-radio-button-group.switch-style .bs-radio-button label:after {
  content: "";
  position: absolute;
  top: 0;
  transition: left 0.5s ease;
  height: 100%;
  width: 100%;
  border-radius: 4px;
  background-color: #000;
  z-index: -1;
}
.bs-radio-button-group.switch-style .bs-radio-button:nth-of-type(1) label:after {
  left: 100%;
}
.bs-radio-button-group.switch-style .bs-radio-button:nth-of-type(2) label:after {
  left: -100%;
}
.bs-radio-button-group.switch-style .bs-radio-button.checked label {
  position: relative;
  color: var(--white);
  font-weight: 500;
  z-index: 1;
}
.bs-radio-button-group.switch-style .bs-radio-button.checked label:after {
  left: 0;
}
.bs-radio-button-group.switch-style.disabled .bs-radio-button.checked label {
  color: var(--white) !important;
}
.bs-radio-button-group.switch-style.disabled .bs-radio-button.checked label:after {
  background-color: var(--gray-400);
}
.bs-radio-button-group.button-style .radio-button-group, .bs-radio-button-group.button-group-style .radio-button-group {
  gap: 4px;
}
.bs-radio-button-group.button-style .bs-radio-button input, .bs-radio-button-group.button-group-style .bs-radio-button input {
  display: none;
  position: absolute;
}
.bs-radio-button-group.button-style .bs-radio-button label, .bs-radio-button-group.button-group-style .bs-radio-button label {
  padding: 0 8px;
  border-radius: 2px;
  border: 1px solid var(--border);
  color: var(--body-text);
  line-height: 22.9px;
  white-space: nowrap;
}
.bs-radio-button-group.button-style .bs-radio-button.checked label, .bs-radio-button-group.button-group-style .bs-radio-button.checked label {
  background-color: var(--radio-group);
  border-color: var(--radio-group);
}
.bs-radio-button-group.button-style .bs-radio-button.checked label span, .bs-radio-button-group.button-group-style .bs-radio-button.checked label span {
  color: var(--white);
}
.bs-radio-button-group.button-style.disabled .bs-radio-button.checked label, .bs-radio-button-group.disabled.button-group-style .bs-radio-button.checked label {
  color: var(--white) !important;
}
.bs-radio-button-group.button-style.modified .bs-radio-button.checked label, .bs-radio-button-group.modified.button-group-style .bs-radio-button.checked label {
  background-color: var(--purple);
  border-color: var(--purple);
  color: var(--white) !important;
}
.bs-radio-button-group.button-group-style .radio-button-group {
  gap: 0;
}
.bs-radio-button-group.button-group-style .bs-radio-button:not(:first-child) {
  margin-left: -1px;
}
.bs-radio-button-group.button-group-style .bs-radio-button.checked {
  z-index: 1;
}
.bs-radio-button-group.button-group-style .bs-radio-button > label {
  border-radius: 0;
}
.bs-radio-button-group.button-group-style .bs-radio-button:first-child > label {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
.bs-radio-button-group.button-group-style .bs-radio-button:last-child > label {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}
.bs-radio-button-group.button-group-style.disabled .bs-radio-button.checked label {
  color: var(--white) !important;
}
.bs-radio-button-group.button-group-style.modified .radio-button-group {
  border-color: var(--purple);
}
.bs-radio-button-group.button-group-style.modified .bs-radio-button {
  border-color: var(--purple);
}
.bs-radio-button-group.button-group-style.modified .bs-radio-button.checked label {
  background-color: var(--purple);
  color: var(--white) !important;
}
.bs-radio-button-group.nowrap > .radio-button-group {
  flex-wrap: nowrap;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base, .bs-checkbox {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input, .bs-checkbox input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before, .bs-checkbox input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover, .bs-checkbox input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label, .bs-checkbox input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before, .bs-checkbox input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label, .bs-checkbox input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before, .modified.bs-checkbox input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label, .modified.bs-checkbox input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before, .error.bs-checkbox input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label, .error.bs-checkbox input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before, .disabled.bs-checkbox input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label, .disabled.bs-checkbox input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label, .bs-checkbox label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-checkbox input::before {
  content: "check_box_outline_blank";
}
.bs-checkbox.checked input::before {
  content: "check_box";
}
.bs-checkbox.reverted.checked input::before {
  font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 48;
}.bs-checkbox-group {
  display: inline-block;
}
.bs-checkbox-group > .items {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}
.bs-checkbox-group.vertical > .items {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.bs-checkbox-group.nowrap > .items {
  flex-wrap: nowrap;
}.bs-box-component-wrap, .bs-select-wrap, .bs-multi-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-multi-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-multi-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap, .bs-multi-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected, .bs-multi-select:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected, .bs-multi-select:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected, .bs-multi-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label, .bs-multi-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder, .bs-multi-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn, .bs-multi-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-multi-select .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected, .modified.bs-multi-select > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected, .error.bs-multi-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected, .disabled.bs-multi-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode, .view-mode.bs-multi-select {
  background-color: transparent;
}
.bs-select-wrap .small-progress, .bs-multi-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-multi-select .label {
  margin-right: 4px;
}
.bs-multi-select .label:not(:last-child)::after {
  content: ",";
}/* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-tree-row .row-caption, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}
.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}
.flex-column, .bs-layout-vertical, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}
.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}
.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}
.flex-grow-0 {
  flex-grow: 0;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.flex-grow-1 {
  flex-grow: 1;
}
.flex-shrink-1 {
  flex-shrink: 1;
}
.flex-grow-2 {
  flex-grow: 2;
}
.flex-shrink-2 {
  flex-shrink: 2;
}
.flex-grow-3 {
  flex-grow: 3;
}
.flex-shrink-3 {
  flex-shrink: 3;
}
.flex-grow-4 {
  flex-grow: 4;
}
.flex-shrink-4 {
  flex-shrink: 4;
}
.flex-grow-5 {
  flex-grow: 5;
}
.flex-shrink-5 {
  flex-shrink: 5;
}
.flex-grow-6 {
  flex-grow: 6;
}
.flex-shrink-6 {
  flex-shrink: 6;
}
.flex-grow-7 {
  flex-grow: 7;
}
.flex-shrink-7 {
  flex-shrink: 7;
}
.flex-grow-8 {
  flex-grow: 8;
}
.flex-shrink-8 {
  flex-shrink: 8;
}
.gap-0 {
  gap: 0px;
}
.gap-1 {
  gap: 1px;
}
.gap-2 {
  gap: 2px;
}
.gap-3 {
  gap: 3px;
}
.gap-4 {
  gap: 4px;
}
.gap-5 {
  gap: 5px;
}
.gap-6 {
  gap: 6px;
}
.gap-7 {
  gap: 7px;
}
.gap-8 {
  gap: 8px;
}
.gap-9 {
  gap: 9px;
}
.gap-10 {
  gap: 10px;
}
.gap-11 {
  gap: 11px;
}
.gap-12 {
  gap: 12px;
}
.gap-13 {
  gap: 13px;
}
.gap-14 {
  gap: 14px;
}
.gap-15 {
  gap: 15px;
}
.gap-16 {
  gap: 16px;
}
.gap-17 {
  gap: 17px;
}
.gap-18 {
  gap: 18px;
}
.gap-19 {
  gap: 19px;
}
.gap-20 {
  gap: 20px;
}
.gap-21 {
  gap: 21px;
}
.gap-22 {
  gap: 22px;
}
.gap-23 {
  gap: 23px;
}
.gap-24 {
  gap: 24px;
}
.gap-25 {
  gap: 25px;
}
.gap-26 {
  gap: 26px;
}
.gap-27 {
  gap: 27px;
}
.gap-28 {
  gap: 28px;
}
.gap-29 {
  gap: 29px;
}
.gap-30 {
  gap: 30px;
}
.gap-31 {
  gap: 31px;
}
.gap-32 {
  gap: 32px;
}
.gap-33 {
  gap: 33px;
}
.gap-34 {
  gap: 34px;
}
.gap-35 {
  gap: 35px;
}
.gap-36 {
  gap: 36px;
}
.gap-37 {
  gap: 37px;
}
.gap-38 {
  gap: 38px;
}
.gap-39 {
  gap: 39px;
}
.gap-40 {
  gap: 40px;
}
.gap-41 {
  gap: 41px;
}
.gap-42 {
  gap: 42px;
}
.gap-43 {
  gap: 43px;
}
.gap-44 {
  gap: 44px;
}
.gap-45 {
  gap: 45px;
}
.gap-46 {
  gap: 46px;
}
.gap-47 {
  gap: 47px;
}
.gap-48 {
  gap: 48px;
}
.gap-49 {
  gap: 49px;
}
.gap-50 {
  gap: 50px;
}
.gap-51 {
  gap: 51px;
}
.gap-52 {
  gap: 52px;
}
.gap-53 {
  gap: 53px;
}
.gap-54 {
  gap: 54px;
}
.gap-55 {
  gap: 55px;
}
.gap-56 {
  gap: 56px;
}
.gap-57 {
  gap: 57px;
}
.gap-58 {
  gap: 58px;
}
.gap-59 {
  gap: 59px;
}
.gap-60 {
  gap: 60px;
}
.gap-61 {
  gap: 61px;
}
.gap-62 {
  gap: 62px;
}
.gap-63 {
  gap: 63px;
}
.gap-64 {
  gap: 64px;
}
.flex-align-start {
  align-items: flex-start;
}
.flex-align-center {
  align-items: center;
}
.flex-align-end {
  align-items: flex-end;
}
.flex-content-start {
  justify-content: flex-start;
}
.flex-content-center {
  justify-content: center;
}
.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}
.bs-layout-form > div {
  display: flex;
  align-items: center;
}
.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}
.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}
.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}
.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}
.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}
.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}
.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}
.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}
.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}
.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}
.bs-layout-table {
  border-collapse: collapse;
}
.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}
.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}
.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}
.bs-tree-row .row-caption {
  position: relative;
  align-items: center;
  height: 28px;
  padding: 0 3px;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid transparent;
}
.bs-tree-row .row-caption.selected {
  background-color: var(--blue-bg);
}
.bs-tree-row .row-caption.selected .caption {
  color: var(--blue);
  font-weight: bold;
}
.bs-tree-row .row-caption.focused {
  border: 1px solid var(--blue);
}
.bs-tree-row .row-caption .caption {
  padding: 3px;
  cursor: pointer;
  user-select: none;
  flex-grow: 1;
  white-space: nowrap;
}
.bs-tree-row .row-caption > .expand-icon {
  transform: rotate(-90deg);
  transition: transform 300ms ease;
}
.bs-tree-row .row-caption > .expand-icon.open {
  transform: none;
}
.bs-tree-row .row-caption > .expand-icon:not(.need-expand) {
  visibility: hidden;
}
.bs-tree-row .row-caption > .move-buttons {
  display: none;
  position: absolute;
  right: 0;
}
.bs-tree-row .row-caption > .move-buttons > .font-icon {
  padding: 0 2px;
  border-radius: 50%;
  margin: 0 2px;
  background-color: var(--body-bg);
}
.bs-tree-row .row-caption > .move-buttons > .font-icon:hover {
  opacity: 1;
  filter: opacity(1);
}
.bs-tree-row .row-caption:hover {
  background-color: var(--gray-200);
}
.bs-tree-row .row-caption:hover > .move-buttons {
  display: inline;
}
.bs-tree-row .row-caption.selected {
  background-color: var(--primary-100);
}
.bs-tree-row .row-caption.disabled {
  color: var(--gray-400);
}
.bs-tree-row .row-caption.disabled .caption.selected {
  color: var(--primary-400);
}
.bs-tree-row .child-rows {
  margin-left: 12px;
}
.bs-tree.compact .bs-tree-row .row-caption {
  height: 24px;
}
.bs-tree.compact .bs-tree-row .row-caption .caption {
  padding: 2px 4px;
}.bs-tree {
  overflow: auto;
  position: relative;
  outline: 0;
}
.bs-tree > .tree-wrap {
  min-width: max-content;
}
.bs-tree .bs-tree-row .row-caption > .bs-tree-position-mark {
  border: 1px solid var(--primary);
  background-color: var(--primary-400);
  opacity: 0.3;
  border-radius: 2px;
  z-index: 1;
}
.bs-tree .bs-tree-row:first-child > .row-caption > .bs-tree-position-mark.top {
  transform: translateY(2px);
}
.bs-tree .bs-tree-row:last-child > .row-caption > .bs-tree-position-mark.bottom {
  transform: translateY(-2px);
}.bs-box-component-wrap, .bs-select-wrap, .bs-tree-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-tree-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-tree-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap, .bs-tree-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected, .bs-tree-select:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected, .bs-tree-select:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected, .bs-tree-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label, .bs-tree-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder, .bs-tree-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn, .bs-tree-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-tree-select .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected, .modified.bs-tree-select > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected, .error.bs-tree-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected, .disabled.bs-tree-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode, .view-mode.bs-tree-select {
  background-color: transparent;
}
.bs-select-wrap .small-progress, .bs-tree-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-tree-select .bs-popup {
  min-width: 200px;
}.bs-box-component-wrap, .bs-select-wrap, .bs-multi-tree-select, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-multi-tree-select .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-multi-tree-select > .selected, .bs-input-base {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap, .bs-multi-tree-select {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected, .bs-multi-tree-select:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected, .bs-multi-tree-select:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected, .bs-multi-tree-select > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label, .bs-multi-tree-select > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder, .bs-multi-tree-select > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn, .bs-multi-tree-select > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn, .popup-open.bs-multi-tree-select .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected, .modified.bs-multi-tree-select > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected, .error.bs-multi-tree-select > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected, .disabled.bs-multi-tree-select > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode, .view-mode.bs-multi-tree-select {
  background-color: transparent;
}
.bs-select-wrap .small-progress, .bs-multi-tree-select .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-multi-tree-select .bs-popup {
  min-width: 200px;
}.bs-popup-select[data-v-d74fd89c] {
  column-gap: 8px !important;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-text-area {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-text-area .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-area .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-text-area .suffix,
.bs-input-wrap .prefix,
.bs-text-area .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-text-area .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-text-area .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-text-area .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-text-area .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-text-area .suffix img,
.bs-input-wrap .prefix img,
.bs-text-area .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-text-area .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-text-area .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-text-area .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-text-area .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-text-area .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-text-area .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-text-area .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-text-area .input-area {
  width: 100%;
  height: 100%;
}
.bs-text-area .input-area .prefix,
.bs-text-area .input-area .suffix {
  margin-top: 6px;
  white-space: nowrap;
}
.bs-text-area .view-mode {
  white-space: pre;
  line-height: 1.5em;
}.tool-button-font-size[data-v-ef5774f0] {
  border: 1px solid var(--border);
  border-radius: 2px;
}
input[data-v-ef5774f0] {
  width: 48px;
  height: 24px;
  padding: 2px 4px;
  border: 0;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  background-color: var(--body-bg);
  color: var(--body-text);
}input[data-v-d556d8eb] {
  width: 48px;
  height: 26px;
  padding: 2px 4px;
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}span.table-property[data-v-537f70be] {
  position: relative;
}
span.table-property[data-v-537f70be]:after {
  content: "settings";
  position: absolute;
  font-size: 0.5em;
  right: -2px;
  bottom: 5px;
}div[data-v-c1655c12] {
  color: var(--color-text);
}.rich-text-toolbar {
  width: 100%;
  padding: 8px;
  line-height: 1;
  border-bottom: 1px solid var(--border);
  background-color: var(--body-bg);
  z-index: 1;
}
.rich-text-toolbar > div .separator {
  padding-right: 4px;
  margin-right: 4px;
  border-right: 1px solid var(--border);
  height: 100%;
}
.rich-text-toolbar > div div.font-icon {
  padding: 4px;
  max-width: 2em;
  border-radius: 4px;
}
.rich-text-toolbar > div div.font-icon.active {
  background-color: var(--gray-200);
}
.rich-text-toolbar > div div > span.font-icon {
  padding: 4px;
  max-width: 2em;
  border-radius: 4px;
}
.rich-text-toolbar > div div > span.font-icon.disabled {
  color: var(--gray-400);
}
.rich-text-toolbar .tool-button-group {
  border: 1px solid var(--border);
  border-radius: 2px;
}
.rich-text-toolbar .tool-button-group > div {
  border-right: 1px solid var(--border);
  border-radius: 0 !important;
}
.rich-text-toolbar .tool-button-group > div:last-child {
  border-right: 0 !important;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-rich-text {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-rich-text .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-rich-text > .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-rich-text .suffix,
.bs-input-wrap .prefix,
.bs-rich-text .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-rich-text .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-rich-text .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-rich-text .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-rich-text .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-rich-text .suffix img,
.bs-input-wrap .prefix img,
.bs-rich-text .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-rich-text .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-rich-text .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-rich-text > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-rich-text > .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-rich-text > .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-rich-text > .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-rich-text > .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-rich-text > .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition-property: all;
  transition-timing-function: ease;
}
.bs-rich-text > .input-area > .editor-container {
  background-color: var(--gray-200);
  flex-grow: 1;
  width: 100%;
  overflow: hidden;
  padding: 8px;
}
.bs-rich-text.disabled > .input-area {
  background-color: var(--gray-100);
}
.bs-rich-text > .view-mode {
  height: 100%;
  overflow: auto;
}.bs-media-preview {
  text-align: center;
  min-width: 50px;
  min-height: 50px;
}
.bs-media-preview .button {
  background-color: var(--white);
  position: absolute;
  border-radius: 4px;
  line-height: 1;
  opacity: 0.5;
  text-decoration: none;
  color: var(--color-text);
  font-size: 1.4em;
}
.bs-media-preview .show-on-hover {
  display: none;
}
.bs-media-preview:hover .show-on-hover {
  display: block;
}.bs-image-upload {
  display: inline-block;
}
.bs-image-upload.modified .image-box {
  border-color: var(--purple) !important;
}
.bs-image-upload.error .image-box {
  border-color: var(--red) !important;
}
.bs-image-upload .image-box {
  border: 1px solid var(--border);
  line-height: 0;
}
.bs-image-upload .image-box img {
  object-fit: contain;
}
.bs-image-upload > span.disabled {
  cursor: default;
  color: #999;
}
.bs-image-upload .upload-btn-wrapper {
  background-color: var(--gray-100);
}
.bs-image-upload .upload-btn-wrapper .upload-btn, .bs-image-upload .upload-btn-wrapper .youtube-btn {
  color: #999;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;
}
.bs-image-upload .upload-btn-wrapper .upload-btn .font-icon, .bs-image-upload .upload-btn-wrapper .youtube-btn .font-icon {
  font-size: 1.4em;
}
.bs-image-upload .upload-btn-wrapper .upload-btn:hover:not(.disabled), .bs-image-upload .upload-btn-wrapper .youtube-btn:hover:not(.disabled) {
  background-color: var(--gray-200);
  color: var(--color-text);
}
.bs-image-upload .upload-btn-wrapper .upload-btn:not(:first-child), .bs-image-upload .upload-btn-wrapper .youtube-btn:not(:first-child) {
  border-top: 1px solid var(--gray-200);
}
.bs-image-upload .upload-btn-wrapper.dropping {
  background-color: var(--primary-200);
  border: 3px dashed var(--primary);
  border-radius: 8px;
  transform: scale(110%);
}
.bs-image-upload .disabled .upload-btn-wrapper {
  opacity: 0.5;
}
.bs-image-upload .disabled .image-box {
  border-color: var(--border) !important;
}.image-upload-move[data-v-b7698f30],
.image-upload-enter-active[data-v-b7698f30],
.image-upload-leave-active[data-v-b7698f30] {
  transition: all 0.3s ease;
}
.image-upload-leave-from[data-v-b7698f30],
.image-upload-leave-to[data-v-b7698f30] {
  display: none;
}
.image-upload-enter-from[data-v-b7698f30] {
  opacity: 0;
}
.image-upload-leave-active[data-v-b7698f30] {
  position: absolute;
}.bs-positioned-image-upload .image-box {
  border: 1px solid var(--border);
}
.bs-positioned-image-upload .image-box img {
  object-fit: contain;
}
.bs-positioned-image-upload > span.disabled {
  cursor: default;
  color: #999;
}
.bs-positioned-image-upload .close-btn {
  background-color: var(--white);
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
}
.bs-positioned-image-upload .upload-btn {
  background-color: var(--gray-100);
  color: #999;
}.bs-file-upload {
  display: inline-block;
}
.bs-file-upload.modified .file-box {
  border-color: var(--purple) !important;
}
.bs-file-upload.error .file-box {
  border-color: var(--red) !important;
}
.bs-file-upload .file-box {
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
}
.bs-file-upload .file-box .file-icon {
  color: var(--gray-500);
  font-size: 1.2em;
}
.bs-file-upload .file-box .file-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bs-file-upload .file-box a.file-name {
  color: var(--primary);
  text-decoration: none;
}
.bs-file-upload .file-box a.file-name:hover {
  text-decoration: underline;
}
.bs-file-upload .file-box .remove-btn {
  border: none;
  background: none;
  padding: 4px;
  color: var(--gray-500);
  display: flex;
  align-items: center;
  justify-content: center;
}
.bs-file-upload .file-box .remove-btn:hover {
  color: var(--red);
}
.bs-file-upload .upload-btn-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bs-file-upload .upload-btn-wrapper .upload-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--gray-500);
  padding: 4px 8px;
  border-radius: 4px;
}
.bs-file-upload .upload-btn-wrapper .upload-btn:hover:not(.disabled) {
  background-color: var(--gray-100);
  color: var(--color-text);
}
.bs-file-upload .upload-btn-wrapper .no-file {
  color: var(--gray-400);
}
.bs-file-upload .upload-btn-wrapper.dropping {
  background-color: var(--primary-200);
  border: 2px dashed var(--primary);
  border-radius: 4px;
}
.bs-file-upload .disabled .file-box {
  opacity: 0.5;
  border-color: var(--border) !important;
}.resize-handle[data-v-f4cd842f] {
  position: absolute;
  width: 5px;
  right: -1px;
  top: 0;
  bottom: 0;
  cursor: col-resize;
  z-index: 10000;
  opacity: 0.2;
}
.resize-handle .resize-guide[data-v-f4cd842f] {
  position: absolute;
  border-left: 1px dashed #000000;
  top: 0;
  right: 0;
  bottom: -500px;
}.sort-icon[data-v-f129d656] {
  line-height: 1;
}
.sort-icon.descending[data-v-f129d656] {
  transform: rotate(180deg);
}.checked .font-icon {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
  color: var(--primary);
}.checked .font-icon[data-v-83bdbd76] {
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
  color: var(--primary);
}
.disabled[data-v-83bdbd76] {
  color: var(--gray-400);
}.drag-handle > .font-icon {
  font-size: 1.8em;
  margin-left: -2px;
  cursor: grab;
  user-select: none;
}
.drag-handle > .font-icon:active {
  cursor: grabbing;
}:root {
  --grid-cell-padding: 8px;
  --grid-row-odd-color: var(--body-bg);
  --grid-row-even-color: var(--gray-100);
}
.bs-grid {
  position: relative;
  display: flex;
  flex-direction: column;
}
.bs-grid > .table-wrap {
  overflow: auto;
  flex-grow: 1;
  background-color: var(--gray-100);
  border-top: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
}
.bs-grid > .table-wrap > table {
  flex-grow: 1;
  table-layout: fixed;
  border-collapse: collapse;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.03), 0 1px 4px rgba(0, 0, 0, 0.03);
}
.bs-grid > .table-wrap > table > thead > tr > td, .bs-grid > .table-wrap > table > thead > tr > th, .bs-grid > .table-wrap > table tbody > tr > td, .bs-grid > .table-wrap > table tbody > tr > th {
  vertical-align: middle;
}
.bs-grid > .table-wrap > table > thead > tr > td > div, .bs-grid > .table-wrap > table > thead > tr > th > div, .bs-grid > .table-wrap > table tbody > tr > td > div, .bs-grid > .table-wrap > table tbody > tr > th > div {
  padding: var(--grid-cell-padding);
  overflow: hidden;
  min-height: 1em;
}
.bs-grid > .table-wrap > table > thead > tr > td > div > a, .bs-grid > .table-wrap > table > thead > tr > th > div > a, .bs-grid > .table-wrap > table tbody > tr > td > div > a, .bs-grid > .table-wrap > table tbody > tr > th > div > a {
  color: var(--body-text) !important;
}
.bs-grid > .table-wrap > table > thead > tr > td.editing > div, .bs-grid > .table-wrap > table tbody > tr > td.editing > div {
  overflow: visible;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell {
  min-width: 32px;
  line-height: 1;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell > div {
  border-right: 1px solid var(--gray-200);
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell:last-child > div {
  border-right: 0 none;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.checkbox {
  color: var(--color-text-light);
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.checkbox.checked {
  color: var(--color-text);
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.serial-no {
  min-width: 40px;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > .func-cell.edit-icon {
  min-width: 33px;
}
.bs-grid > .table-wrap > table > thead > tr.header-row:has(.has-filter) th > div {
  height: 50px;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th {
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
  vertical-align: middle;
  background-color: var(--gray-100);
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) {
  background-color: var(--primary-100);
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th:last-child > div {
  border-right-color: transparent;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th > div {
  border-right: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
  min-height: 36.5px;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: visible;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select {
  margin-top: 4px;
  width: 100%;
  background-color: transparent;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select > .selected, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select > .selected, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select > .selected {
  width: 100%;
  border: 0;
  height: 16px;
  padding: 0;
  background-color: transparent;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-select > .bs-select-popup, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-multi-select > .bs-select-popup, .bs-grid > .table-wrap > table > thead > tr.header-row > th > div .bs-tree-select > .bs-select-popup {
  margin-top: 4px;
  margin-left: -4px;
}
.bs-grid > .table-wrap > table > thead > tr.header-row > th.fixed {
  z-index: 3;
}
.bs-grid > .table-wrap > table > tbody > tr > td.fixed {
  position: sticky;
  left: 0;
  z-index: 2;
  white-space: nowrap;
}
.bs-grid > .table-wrap > table > tbody > tr.data-row {
  position: relative;
}
.bs-grid > .table-wrap > table > tbody > tr.data-row > td > div {
  border-right: 1px solid transparent;
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(odd) > td {
  background-color: var(--grid-row-odd-color);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(odd) > td > div {
  border-color: var(--grid-row-odd-color);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(even) > td {
  background-color: var(--grid-row-even-color);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:nth-child(even) > td > div {
  border-color: var(--grid-row-even-color);
}
.bs-grid > .table-wrap > table > tbody > tr > td.func-cell {
  line-height: 1;
}
.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.serial-no {
  text-align: right;
}
.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.checkbox {
  color: var(--color-text-light);
}
.bs-grid > .table-wrap > table > tbody > tr > td.func-cell.checkbox.checked {
  color: var(--color-text);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td {
  background-color: var(--gray-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td > div {
  border-right-color: var(--gray-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td:first-child > div {
  border-right-color: var(--gray-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > td:last-child > div {
  border-right-color: var(--gray-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row.selected > td {
  background-color: var(--primary-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row.selected > td > div {
  border-right-color: var(--primary-200);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row.selected:hover td:first-child > div {
  border-right-color: var(--primary-200) !important;
}
.bs-grid > .table-wrap > table > tbody > tr.data-row.selected:hover td:last-child > div {
  border-right-color: var(--primary-200) !important;
}
.bs-grid.h-scrolled .header-row .fixed:after,
.bs-grid.h-scrolled .data-row .fixed:after {
  display: block;
  position: absolute;
  top: 0;
  right: -8px;
  width: 8px;
  height: 100%;
  content: "";
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
}
.bs-grid.v-scrolled .header-row > th > div {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07);
}
[data-theme=dark] .bs-grid.h-scrolled .header-row .fixed:after,
[data-theme=dark] .bs-grid.h-scrolled .data-row .fixed:after {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%);
}
[data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) {
  background-color: var(--primary-400);
  color: var(--dark);
}
[data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-multi-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-tree-select, [data-theme=dark] .bs-grid > .table-wrap > table > thead > tr.header-row > th:has(.bs-select, .bs-multi-select, .bs-tree-select, .bs-tree-multi-select):not(:has(.empty)) .bs-tree-multi-select {
  color: var(--dark);
}
.bs-grid.with-border > .table-wrap > table > tbody > tr {
  border-bottom: 1px solid var(--gray-200);
}
.bs-grid.with-border > .table-wrap > table > tbody > tr.data-row:nth-child(even):not(:hover) > td {
  background-color: var(--grid-row-odd-color);
}
.bs-grid.with-border > .table-wrap > table > tbody > tr.data-row:nth-child(even):not(:hover) > td > div {
  border-color: var(--grid-row-odd-color);
}
.bs-grid > .table-wrap > table > tbody > tr.data-row:hover > .bs-grid-merged-cell {
  background-color: var(--grid-row-odd-color);
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-text-filter .input-wrap, .bs-text-filter .textarea-wrap {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix,
.bs-input-wrap .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child,
.bs-input-wrap .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon,
.bs-input-wrap .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img,
.bs-input-wrap .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-text-filter .input-wrap, .bs-text-filter .textarea-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-text-filter .input-wrap > input, .bs-text-filter .textarea-wrap > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-text-filter .input-wrap > textarea, .bs-text-filter .textarea-wrap > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-text-filter .input-wrap:hover, .bs-text-filter .textarea-wrap:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-text-filter .input-wrap:has(:focus), .bs-text-filter .textarea-wrap:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-text-filter {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: start;
  width: 300px;
  min-width: 100px;
}
.bs-text-filter .input-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  align-items: start;
}
.bs-text-filter .textarea-wrap {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  height: 72px;
  align-items: start;
}
.bs-text-filter .textarea-wrap textarea {
  resize: none;
}
.bs-text-filter .filter-caption {
  margin-top: 8px;
  font-size: 0.923em;
  color: var(--gray-400);
}
.bs-text-filter .filter-caption > span {
  margin-right: 4px;
}
.bs-text-filter .filter-caption > span:not(:last-child)::after {
  content: ",";
}
.bs-text-filter.modified .input-wrap,
.bs-text-filter.modified .textarea-wrap {
  border-color: var(--primary) !important;
}
.bs-text-filter.modified .input-wrap input,
.bs-text-filter.modified .input-wrap textarea,
.bs-text-filter.modified .textarea-wrap input,
.bs-text-filter.modified .textarea-wrap textarea {
  color: var(--primary) !important;
}
.bs-text-filter.error .input-wrap,
.bs-text-filter.error .textarea-wrap {
  border-color: var(--danger) !important;
}
.bs-text-filter.error .input-wrap input,
.bs-text-filter.error .input-wrap textarea,
.bs-text-filter.error .textarea-wrap input,
.bs-text-filter.error .textarea-wrap textarea {
  color: var(--danger) !important;
}.bs-box-component-wrap, .bs-select-wrap, .bs-input-wrap, .bs-date-range-filter {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: left;
}
.bs-box-component-wrap .message, .bs-select-wrap .message, .bs-input-wrap .message, .bs-date-range-filter .message {
  margin-top: 4px;
  font-size: 0.9em;
}
.bs-box-component-base, .bs-select-wrap > .selected, .bs-input-base, .bs-date-range-filter .input-area {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: left;
  background-color: var(--body-bg);
}
.bs-input-wrap .suffix, .bs-date-range-filter .suffix,
.bs-input-wrap .prefix,
.bs-date-range-filter .prefix {
  font-size: 0.9em;
  margin-right: 4px;
  margin-left: 4px;
  background-color: var(--gray-200);
  color: var(--body-text);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1;
  white-space: nowrap;
}
.bs-input-wrap .suffix:first-child, .bs-date-range-filter .suffix:first-child,
.bs-input-wrap .prefix:first-child,
.bs-date-range-filter .prefix:first-child {
  margin-left: 4px;
}
.bs-input-wrap .suffix .font-icon, .bs-date-range-filter .suffix .font-icon,
.bs-input-wrap .prefix .font-icon,
.bs-date-range-filter .prefix .font-icon {
  font-size: 0.9em;
}
.bs-input-wrap .suffix img, .bs-date-range-filter .suffix img,
.bs-input-wrap .prefix img,
.bs-date-range-filter .prefix img {
  width: 0.9em;
  height: 0.9em;
}
[data-theme=dark] .bs-input-wrap .suffix img, [data-theme=dark] .bs-date-range-filter .suffix img,
[data-theme=dark] .bs-input-wrap .prefix img,
[data-theme=dark] .bs-date-range-filter .prefix img {
  filter: invert(1);
}
.bs-input-base, .bs-date-range-filter .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  background-color: var(--body-bg);
}
.bs-input-base > input, .bs-date-range-filter .input-area > input {
  border: 0;
  border-radius: 0;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  flex-basis: 1em;
  padding: 0 6px;
  background-color: transparent;
  width: 100%;
  color: var(--body-text);
}
.bs-input-base > textarea, .bs-date-range-filter .input-area > textarea {
  border: 0;
  border-radius: 4px;
  outline: 0;
  align-self: stretch;
  flex-grow: 1;
  padding: 6px;
  line-height: 1.4;
  font-family: sans-serif;
  background-color: var(--body-bg);
  color: var(--body-text);
}
.bs-input-base:hover, .bs-date-range-filter .input-area:hover {
  border-color: var(--border-hover);
}
.bs-input-base:has(:focus), .bs-date-range-filter .input-area:has(:focus) {
  border-color: var(--color-focus);
  border-width: 1px;
}
.bs-text-input.modified > .input-area,
.bs-number-input.modified > .input-area,
.bs-price-input.modified > .input-area,
.bs-date-input.modified > .input-area,
.bs-date-range.modified > .input-area,
.bs-multi-lang-text-input.modified > .input-area,
.bs-multi-lang-text-area.modified > .input-area,
.bs-multi-lang-rich-text.modified > .input-area,
.bs-text-area.modified > .input-area,
.bs-rich-text.modified > .input-area {
  border-color: var(--purple) !important;
}
.bs-text-input.error > .input-area,
.bs-number-input.error > .input-area,
.bs-price-input.error > .input-area,
.bs-date-input.error > .input-area,
.bs-date-range.error > .input-area,
.bs-multi-lang-text-input.error > .input-area,
.bs-multi-lang-text-area.error > .input-area,
.bs-multi-lang-rich-text.error > .input-area,
.bs-text-area.error > .input-area,
.bs-rich-text.error > .input-area {
  border-color: var(--danger) !important;
}
.bs-text-input.error > .input-area > input,
.bs-number-input.error > .input-area > input,
.bs-price-input.error > .input-area > input,
.bs-date-input.error > .input-area > input,
.bs-date-range.error > .input-area > input,
.bs-multi-lang-text-input.error > .input-area > input,
.bs-multi-lang-text-area.error > .input-area > input,
.bs-multi-lang-rich-text.error > .input-area > input,
.bs-text-area.error > .input-area > input,
.bs-rich-text.error > .input-area > input {
  color: var(--danger) !important;
}
.bs-text-input.disabled > .input-area,
.bs-number-input.disabled > .input-area,
.bs-price-input.disabled > .input-area,
.bs-date-input.disabled > .input-area,
.bs-date-range.disabled > .input-area,
.bs-multi-lang-text-input.disabled > .input-area,
.bs-multi-lang-text-area.disabled > .input-area,
.bs-multi-lang-rich-text.disabled > .input-area,
.bs-text-area.disabled > .input-area,
.bs-rich-text.disabled > .input-area {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-400) !important;
}
.bs-text-input.disabled > .input-area > input,
.bs-number-input.disabled > .input-area > input,
.bs-price-input.disabled > .input-area > input,
.bs-date-input.disabled > .input-area > input,
.bs-date-range.disabled > .input-area > input,
.bs-multi-lang-text-input.disabled > .input-area > input,
.bs-multi-lang-text-area.disabled > .input-area > input,
.bs-multi-lang-rich-text.disabled > .input-area > input,
.bs-text-area.disabled > .input-area > input,
.bs-rich-text.disabled > .input-area > input {
  color: var(--gray-400) !important;
  background-color: var(--gray-100) !important;
}
.bs-text-input.disabled > .input-area > textarea,
.bs-number-input.disabled > .input-area > textarea,
.bs-price-input.disabled > .input-area > textarea,
.bs-date-input.disabled > .input-area > textarea,
.bs-date-range.disabled > .input-area > textarea,
.bs-multi-lang-text-input.disabled > .input-area > textarea,
.bs-multi-lang-text-area.disabled > .input-area > textarea,
.bs-multi-lang-rich-text.disabled > .input-area > textarea,
.bs-text-area.disabled > .input-area > textarea,
.bs-rich-text.disabled > .input-area > textarea {
  background-color: var(--gray-100) !important;
}
.bs-date-input .view-mode,
.bs-date-range .view-mode {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
}
.bs-date-input .view-mode::before,
.bs-date-range .view-mode::before {
  content: "calendar_month";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-date-input .extra-dates,
.bs-date-range .extra-dates,
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  color: var(--body-text);
  margin-top: 4px;
}
.bs-date-input .extra-dates .extra-date,
.bs-date-range .extra-dates .extra-date,
.bs-calendar .extra-dates .extra-date,
.bs-calendar-range .extra-dates .extra-date {
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.8125rem;
}
.bs-date-input .extra-dates .extra-date::before,
.bs-date-range .extra-dates .extra-date::before,
.bs-calendar .extra-dates .extra-date::before,
.bs-calendar-range .extra-dates .extra-date::before {
  content: "globe";
  width: 1em;
  font-family: var(--icon-font-family);
}
.bs-calendar .extra-dates,
.bs-calendar-range .extra-dates {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bs-checkbox-base {
  display: inline-block;
  color: var(--body-text);
  white-space: nowrap;
}
.bs-checkbox-base input {
  appearance: none;
  margin: 0;
  outline: 0;
}
.bs-checkbox-base input::before {
  font-family: var(--icon-font-family);
  font-size: 20px;
  vertical-align: middle;
  cursor: pointer;
  color: var(--body-text);
}
.bs-checkbox-base input:hover {
  color: var(--gray-500);
}
.bs-checkbox-base input:hover ~ label {
  color: var(--gray-500);
}
.bs-checkbox-base input:focus::before {
  color: var(--color-focus);
}
.bs-checkbox-base input:focus ~ label {
  color: var(--color-focus);
}
.bs-checkbox-base.modified input::before {
  color: var(--purple) !important;
}
.bs-checkbox-base.modified input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-base.error input::before {
  color: var(--danger) !important;
}
.bs-checkbox-base.error input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-base.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-base.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-checkbox-base label {
  display: inline-block;
  vertical-align: middle;
  padding: 4px 2px;
  cursor: pointer;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input::before {
  color: var(--purple) !important;
}
.bs-checkbox-group.modified .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.modified .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.modified .bs-radio-button:not(.disabled) input ~ label {
  color: var(--purple) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input::before, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input::before,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input::before,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input::before {
  color: var(--danger) !important;
}
.bs-checkbox-group.error .bs-checkbox:not(.disabled) input ~ label, .bs-checkbox-group.error .bs-radio-button:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-checkbox:not(.disabled) input ~ label,
.bs-radio-button-group.error .bs-radio-button:not(.disabled) input ~ label {
  color: var(--danger) !important;
}
.bs-checkbox-group.disabled input::before,
.bs-radio-button-group.disabled input::before {
  color: var(--gray-400) !important;
}
.bs-checkbox-group.disabled input ~ label,
.bs-radio-button-group.disabled input ~ label {
  color: var(--gray-400) !important;
}
.bs-select-wrap {
  position: relative;
  outline: 0;
  background-color: var(--body-bg);
  color: var(--body-text);
  min-width: 64px;
}
.bs-select-wrap:hover > .selected {
  border-color: var(--border-hover);
}
.bs-select-wrap:focus > .selected {
  border-color: var(--color-focus);
}
.bs-select-wrap > .selected {
  border: 1px solid var(--border);
  border-radius: 2px;
  padding: 0 6px;
  min-width: 100%;
  cursor: pointer;
  display: flex;
}
.bs-select-wrap > .selected .label {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .placeholder {
  color: var(--gray-400);
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-select-wrap > .selected .dropdown-btn {
  font-family: var(--icon-font-family);
  margin-right: -4px;
  margin-left: 4px;
  user-select: none;
  transition: transform 0.2s linear;
}
.bs-select-wrap.popup-open .dropdown-btn {
  transform: rotate(180deg);
}
.bs-select-wrap.modified > .selected {
  border-color: var(--purple) !important;
}
.bs-select-wrap.error > .selected {
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}
.bs-select-wrap.disabled > .selected {
  border-color: var(--border) !important;
  background-color: var(--gray-100) !important;
  color: var(--gray-500) !important;
}
.bs-select-wrap.view-mode {
  background-color: transparent;
}
.bs-select-wrap .small-progress {
  font-family: var(--icon-font-family);
  font-size: 0.9em;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 0 2px;
  color: var(--gray-400);
  animation: spin 1s linear infinite;
}
.bs-field-error {
  color: var(--color-error);
  margin-top: 4px;
}
.bs-clickable {
  user-select: none;
  cursor: pointer;
}
.bs-clickable:hover {
  filter: opacity(75%);
}
.bs-clickable:active {
  filter: opacity(50%);
}
.bs-clickable.disabled {
  filter: opacity(40%);
}
.component-shadow-base {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
}
[data-theme=dark] .component-shadow-base {
  box-shadow: 2px 2px 8px rgba(255, 255, 255, 0.1);
}
.font-icon {
  font-family: var(--icon-font-family);
  font-size: 1rem;
  max-width: 1em;
}
.font-icon.filled {
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}
.fade-enter,
.fade-leave-to {
  opacity: 0;
}
.text-description {
  margin-top: 2px;
  color: var(--gray-400);
  font-size: 0.923em;
}
.bs-drop-position {
  position: absolute;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--primary-400);
  opacity: 0.7;
  z-index: 100;
}
.bs-drop-position.vertical {
  left: 0;
  width: 100%;
  height: 8px;
}
.bs-drop-position.vertical.before {
  top: -4px;
}
.bs-drop-position.vertical.after {
  bottom: -4px;
}
.bs-drop-position.horizontal {
  left: 0;
  width: 8px;
  height: 100%;
}
.bs-drop-position.horizontal.before {
  left: -4px;
}
.bs-drop-position.horizontal.after {
  right: -4px;
}
.bs-droppable-horizontal {
  transition: transform 0.3s ease;
}
.bs-droppable-horizontal.bs-dropping-before, .bs-droppable-horizontal.bs-dropping-after-following {
  transform: translateX(12px);
  z-index: 1;
}
.bs-droppable-horizontal.bs-dropping-after, .bs-droppable-horizontal.bs-dropping-before-preceding {
  transform: translateX(-12px);
  z-index: 1;
}
.bs-dragging-source {
  opacity: 0.5;
}
.bs-date-range-filter .input-area {
  border: 1px solid var(--border);
  border-radius: 2px;
  width: 100%;
  display: flex;
  align-items: center;
  padding-right: 8px;
}
.bs-date-range-filter .input-area .font-icon {
  margin: 0 6px;
  font-size: 14px;
}
.bs-date-range-filter .input-area input {
  border-radius: 0;
  padding-right: 0;
  width: 9em;
}.date-filters .bs-clickable {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 26px;
  border: 1px solid var(--border);
  border-radius: 2px;
}
.date-filters .input-area .bs-clickable {
  border: 0 none;
  margin: 0;
}.bs-grid-lookup {
  background-color: var(--body-bg);
  line-height: 1;
}.bs-grid-control {
  display: flex;
  align-items: center;
  color: var(--gray);
}
.bs-grid-control > div {
  padding-right: 8px;
}
.bs-grid-control .bs-select.page-length {
  min-width: auto;
}
.bs-grid-control .bs-select.page-length .selected {
  height: 18px;
  border: 0;
  padding: 0;
  border-radius: 0;
}.bs-card-layout {
  width: 100%;
}
.bs-card-layout .card-layout-header {
  height: 44px;
  border-bottom: 1px solid var(--border-light);
}
.bs-card-layout .card-layout-title {
  font-size: 1rem;
  margin-left: 6px;
}
.bs-card-layout .expand-btn {
  display: inline-block;
  transition: transform 0.2s linear;
  transform: rotate(0);
  font-size: 1.4rem;
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
  color: var(--gray-500);
}
.bs-card-layout.expanded .expand-btn {
  transform: rotate(90deg);
}
.bs-card-layout .title-icon {
  color: var(--gray-700);
  font-size: 1.4rem;
  font-variation-settings: "FILL" 1, "wght" 300, "GRAD" 0, "opsz" 48;
}
.bs-card-layout .title-icon-box {
  background-color: var(--gray-700);
  width: 1rem;
  height: 1rem;
  border-radius: 2px;
  margin: 0 6px 0 4px;
}/* Layout Utility */
.flex-row, .bs-layout-horizontal, .bs-tab-sheet .tab-bar .tabs, .bs-layout-horizontal-wrap {
  display: flex;
  flex-direction: row;
}
.flex-row-inline, .bs-layout-horizontal-inline {
  display: inline-flex;
  flex-direction: row;
}
.flex-column, .bs-layout-vertical, .bs-layout-vertical-wrap {
  display: flex;
  flex-direction: column;
}
.flex-column-inline, .bs-layout-vertical-inline {
  display: inline-flex;
  flex-direction: column;
}
.flex-wrap, .bs-layout-vertical-wrap, .bs-layout-horizontal-wrap {
  flex-wrap: wrap;
}
.flex-grow-0 {
  flex-grow: 0;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.flex-grow-1 {
  flex-grow: 1;
}
.flex-shrink-1 {
  flex-shrink: 1;
}
.flex-grow-2 {
  flex-grow: 2;
}
.flex-shrink-2 {
  flex-shrink: 2;
}
.flex-grow-3 {
  flex-grow: 3;
}
.flex-shrink-3 {
  flex-shrink: 3;
}
.flex-grow-4 {
  flex-grow: 4;
}
.flex-shrink-4 {
  flex-shrink: 4;
}
.flex-grow-5 {
  flex-grow: 5;
}
.flex-shrink-5 {
  flex-shrink: 5;
}
.flex-grow-6 {
  flex-grow: 6;
}
.flex-shrink-6 {
  flex-shrink: 6;
}
.flex-grow-7 {
  flex-grow: 7;
}
.flex-shrink-7 {
  flex-shrink: 7;
}
.flex-grow-8 {
  flex-grow: 8;
}
.flex-shrink-8 {
  flex-shrink: 8;
}
.gap-0 {
  gap: 0px;
}
.gap-1 {
  gap: 1px;
}
.gap-2 {
  gap: 2px;
}
.gap-3 {
  gap: 3px;
}
.gap-4 {
  gap: 4px;
}
.gap-5 {
  gap: 5px;
}
.gap-6 {
  gap: 6px;
}
.gap-7 {
  gap: 7px;
}
.gap-8 {
  gap: 8px;
}
.gap-9 {
  gap: 9px;
}
.gap-10 {
  gap: 10px;
}
.gap-11 {
  gap: 11px;
}
.gap-12 {
  gap: 12px;
}
.gap-13 {
  gap: 13px;
}
.gap-14 {
  gap: 14px;
}
.gap-15 {
  gap: 15px;
}
.gap-16 {
  gap: 16px;
}
.gap-17 {
  gap: 17px;
}
.gap-18 {
  gap: 18px;
}
.gap-19 {
  gap: 19px;
}
.gap-20 {
  gap: 20px;
}
.gap-21 {
  gap: 21px;
}
.gap-22 {
  gap: 22px;
}
.gap-23 {
  gap: 23px;
}
.gap-24 {
  gap: 24px;
}
.gap-25 {
  gap: 25px;
}
.gap-26 {
  gap: 26px;
}
.gap-27 {
  gap: 27px;
}
.gap-28 {
  gap: 28px;
}
.gap-29 {
  gap: 29px;
}
.gap-30 {
  gap: 30px;
}
.gap-31 {
  gap: 31px;
}
.gap-32 {
  gap: 32px;
}
.gap-33 {
  gap: 33px;
}
.gap-34 {
  gap: 34px;
}
.gap-35 {
  gap: 35px;
}
.gap-36 {
  gap: 36px;
}
.gap-37 {
  gap: 37px;
}
.gap-38 {
  gap: 38px;
}
.gap-39 {
  gap: 39px;
}
.gap-40 {
  gap: 40px;
}
.gap-41 {
  gap: 41px;
}
.gap-42 {
  gap: 42px;
}
.gap-43 {
  gap: 43px;
}
.gap-44 {
  gap: 44px;
}
.gap-45 {
  gap: 45px;
}
.gap-46 {
  gap: 46px;
}
.gap-47 {
  gap: 47px;
}
.gap-48 {
  gap: 48px;
}
.gap-49 {
  gap: 49px;
}
.gap-50 {
  gap: 50px;
}
.gap-51 {
  gap: 51px;
}
.gap-52 {
  gap: 52px;
}
.gap-53 {
  gap: 53px;
}
.gap-54 {
  gap: 54px;
}
.gap-55 {
  gap: 55px;
}
.gap-56 {
  gap: 56px;
}
.gap-57 {
  gap: 57px;
}
.gap-58 {
  gap: 58px;
}
.gap-59 {
  gap: 59px;
}
.gap-60 {
  gap: 60px;
}
.gap-61 {
  gap: 61px;
}
.gap-62 {
  gap: 62px;
}
.gap-63 {
  gap: 63px;
}
.gap-64 {
  gap: 64px;
}
.flex-align-start {
  align-items: flex-start;
}
.flex-align-center {
  align-items: center;
}
.flex-align-end {
  align-items: flex-end;
}
.flex-content-start {
  justify-content: flex-start;
}
.flex-content-center {
  justify-content: center;
}
.flex-content-end {
  justify-content: flex-end;
}

/* Bluesea Layout */
.bs-layout-form {
  border-bottom: 1px solid var(--border);
}
.bs-layout-form > div {
  display: flex;
  align-items: center;
}
.bs-layout-form > div > .title {
  padding: 8px 16px;
  width: 12.3076em;
  line-height: 1.2em;
  color: var(--body-text);
}
.bs-layout-form > div > :not(.title) {
  padding: 8px;
  width: 10em;
  flex-grow: 1;
  color: var(--body-text);
}
.bs-layout-form > div:nth-child(odd) {
  background-color: var(--gray-100);
}
.bs-layout-form.title-w-8 > div > .title {
  width: 8em;
}
.bs-layout-form.title-w-10 > div > .title {
  width: 10em;
}
.bs-layout-form.title-w-14 > div > .title {
  width: 14em;
}
.bs-layout-form.title-w-16 > div > .title {
  width: 16em;
}
.bs-layout-form.title-w-18 > div > .title {
  width: 18em;
}
.bs-layout-form.title-w-20 > div > .title {
  width: 20em;
}
.bs-layout-card > .card-title {
  padding: 16px 0;
  border-bottom: 0.8px solid var(--border-light);
  font-size: 1.2em;
  font-weight: 500;
}
.bs-layout-table {
  border-collapse: collapse;
}
.bs-layout-table > tr > td, .bs-layout-table > tr > th, .bs-layout-table > tbody > tr > td, .bs-layout-table > tbody > tr > th {
  padding: 8px;
  border: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}
.bs-layout-table > tr > td:first-child, .bs-layout-table > tr > th:first-child, .bs-layout-table > tbody > tr > td:first-child, .bs-layout-table > tbody > tr > th:first-child {
  border-left: 0;
}
.bs-layout-table > tr > td:last-child, .bs-layout-table > tr > th:last-child, .bs-layout-table > tbody > tr > td:last-child, .bs-layout-table > tbody > tr > th:last-child {
  border-right: 0;
}
.bs-tab-sheet {
  height: 200px;
}
.bs-tab-sheet .tab-bar {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
.bs-tab-sheet .tab-bar::-webkit-scrollbar {
  display: none;
}
.bs-tab-sheet .tab-bar .tabs {
  padding-top: 8px;
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: var(--border);
}
.bs-tab-sheet .tab-bar .tabs .tab {
  position: relative;
  padding: 11px 16px 10px;
  color: var(--body-text);
  margin-bottom: -1px;
  white-space: nowrap;
  cursor: pointer;
  overflow-x: hidden;
}
.bs-tab-sheet .tab-bar .tabs .tab + .tab:before {
  content: "|";
  display: block;
  position: absolute;
  top: 10px;
  left: 0;
  width: 1px;
  height: 14px;
  color: var(--border);
}
.bs-tab-sheet .tab-bar .tabs .tab:hover {
  color: var(--primary);
}
.bs-tab-sheet .tab-bar .tabs .tab.selected {
  position: relative;
  z-index: 1;
  padding: 10px 15px 10px;
  border-width: 1px 1px 0 1px;
  border-style: solid;
  border-color: var(--border);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  color: var(--primary);
  background-color: var(--body-bg);
}
.bs-tab-sheet .tab-bar .tabs .tab.selected:before, .bs-tab-sheet .tab-bar .tabs .tab.selected + .tab:before {
  content: "";
  display: none;
}
.bs-tab-sheet .tab-bar .tabs .tab.disabled {
  color: var(--gray-400);
  cursor: default;
}
.bs-tab-sheet.detail-top {
  padding: 43px 16px 16px 16px;
}
.bs-tab-sheet.detail-top > .tab-bar {
  position: fixed;
  z-index: 5;
}
.bs-tab-sheet.detail-top > .tab-bar .tabs {
  border: 0 none;
  background-color: var(--colored-bg);
}
.bs-tab-sheet.detail-top > .tab-bar .tabs .tab {
  border: 0 none;
  margin-bottom: 0;
}
.bs-tab-sheet.detail-top > .tab-bar .tabs .tab:hover {
  color: var(--primary);
}
.bs-tab-sheet.detail-top > .tab-bar .tabs .tab.selected {
  color: var(--primary);
  background-color: var(--body-bg);
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}
.bs-tab-sheet.detail-top > .tab-bar ~ div {
  margin-top: 48px;
  background-color: var(--body-bg);
  border-radius: 10px;
}
.bs-tab-sheet.detail-top > .tab-bar.first-tab ~ div {
  border-top-left-radius: 0;
}
.bs-tab-sheet.compact .tab-bar .tabs .tab {
  padding: 5px 12px 4px;
  border-top-right-radius: 6px;
  border-top-left-radius: 6px;
}
.bs-tab-sheet.compact .tab-bar .tabs .tab.selected {
  padding: 4px 11px 4px;
}
.bs-tab-sheet.compact .tab-bar .tabs .tab + .tab:before {
  top: 4px;
}
.bs-tab-sheet.border-bottom-0 .tab-bar .tabs {
  border-bottom: 0;
}.bs-list-layout-item {
  position: relative;
  background-color: var(--body-bg);
  border: 1px solid var(--gray-300);
  margin-top: -1px;
}
.bs-list-layout-item.selected {
  border-color: var(--primary);
  z-index: 1;
}
.bs-list-layout-item.selected > .list-item-title {
  background-color: var(--primary-200);
}
.bs-list-layout-item.selected > .list-item-title .font-icon {
  color: var(--primary);
}
.bs-list-layout-item > .list-item-title {
  padding: 8px;
  background-color: var(--gray-200);
}
.bs-list-layout-item:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.bs-list-layout-item:first-child > .list-item-title {
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
}
.bs-list-layout-item:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.bs-list-layout-item:last-child:not(.expanded) > .list-item-title {
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
}
.bs-list-layout-item.expanded > .list-item-title {
  border-bottom: 1px solid var(--gray-300);
}
.bs-list-layout-item .bs-checkbox.checked input::before {
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
}
.bs-list-layout-item > .list-item-content {
  padding: 8px;
}.bs-button[data-v-487255f8] {
  padding: 3px;
  height: auto;
}
.bs-button[data-v-487255f8] .font-icon {
  font-size: 12px;
}.bs-horizontal-layout-resizer {
  cursor: ew-resize;
  transform: scaleX(4);
  user-select: none;
}
.bs-horizontal-layout-resizer .resize-line {
  background-color: var(--gray-200);
  width: 1px;
  height: 100%;
  transform: scaleX(0.25);
}.bs-vertical-layout-resizer {
  cursor: ns-resize;
  transform: scaleY(4);
  user-select: none;
}
.bs-vertical-layout-resizer .resize-line {
  background-color: var(--gray-200);
  width: 100%;
  height: 1px;
  transform: scaleY(0.25);
}.remove-btn[data-v-bb93c689],
.add-btn[data-v-bb93c689] .bs-button {
  width: 28px;
  height: auto;
}
.remove-btn[data-v-bb93c689] .font-icon,
.add-btn[data-v-bb93c689] .bs-button ::v-deep(.font-icon) {
  font-size: 12px;
}.bs-multi-lang-text-input > div {
  display: flex;
}
.bs-multi-lang-text-input .bs-text-input > .input-area > .prefix {
  min-width: 2.4em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}
.bs-multi-lang-text-input .bs-text-input.required-locale > .input-area > .prefix:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}.bs-multi-lang-text-area > div {
  display: flex;
}
.bs-multi-lang-text-area .bs-text-area > .input-area > .prefix {
  min-width: 2.4em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}
.bs-multi-lang-text-area .bs-text-area.required-locale > .input-area > .prefix:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}.bs-multi-lang-rich-text > div {
  padding-bottom: 4px;
  display: flex;
}
.bs-multi-lang-rich-text .locale-tag {
  align-self: center;
  font-size: 0.9em;
  background-color: var(--gray-200);
  padding: 4px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
}
.bs-multi-lang-rich-text .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}[data-v-f2c0b0b0] .font-icon.left {
  margin-right: 0 !important;
}.bs-multi-lang-image-upload > .images > div {
  padding-bottom: 4px;
  display: flex;
}
.bs-multi-lang-image-upload > .images .locale-tag {
  font-size: 0.9em;
  margin-bottom: 4px;
  background-color: var(--gray-200);
  padding: 2px 4px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
  align-self: start;
}
.bs-multi-lang-image-upload > .images .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}
.bs-code-editor {
  height: 100%;
}
.bs-code-editor .cm-editor {
  border: 1px solid var(--border);
  background-color: var(--body-bg);
}
.bs-code-editor.modified .cm-editor {
  border-color: var(--purple);
}
.bs-code-editor.disabled .cm-editor {
  border-color: var(--gray-400);
  background-color: var(--gray-100);
}
.bs-code-editor.error .cm-editor {
  border-color: var(--danger);
}
.bs-code-editor .cm-focused {
  outline: 0;
}
.bs-code-editor .cm-panel.cm-search {
  font-size: var(--font-size);
}
.bs-code-editor .cm-panel.cm-search input, .bs-code-editor .cm-panel.cm-search .cm-button, .bs-code-editor .cm-panel.cm-search label {
  font-size: 100%;
}
.bs-code-editor .cm-panel.cm-search label > input {
  vertical-align: middle;
}
.bs-code-editor .ͼ2 .cm-gutters {
  background-color: var(--gray-200) !important;
  border-right-color: var(--border) !important;
}
.bs-code-editor .ͼ2 .cm-activeLineGutter {
  background-color: var(--primary-200);
}
[data-theme=dark] .ͼ2 .cm-activeLineGutter {
  background-color: var(--primary-400);
}.bs-html-editor .bs-tab-sheet .tabs {
  padding-top: 0;
}
.bs-html-editor.modified .bs-code-editor .cm-editor {
  border-color: var(--purple);
}
.bs-html-editor.disabled .bs-code-editor .cm-editor {
  border-color: var(--gray-400);
  background-color: var(--gray-100);
}
.bs-html-editor.error .bs-code-editor .cm-editor {
  border-color: var(--danger);
}.bs-multi-lang-html-editor > div {
  padding-bottom: 4px;
  display: flex;
}
.bs-multi-lang-html-editor .locale-tag-wrapper {
  padding-top: 3px;
  padding-right: 2px;
}
.bs-multi-lang-html-editor .locale-tag-wrapper .locale-tag {
  align-self: center;
  font-size: 0.9em;
  background-color: var(--gray-200);
  padding: 2px 8px;
  border-radius: 2px;
  line-height: 1.2;
  min-width: 2.4em;
  text-align: center;
}
.bs-multi-lang-html-editor .locale-tag-wrapper .locale-tag.required-locale:after {
  content: "*";
  color: var(--primary);
  margin-left: 1px;
}.bs-name-input .label {
  font-size: 0.9em;
  color: var(--gray-400);
}.bs-address-input .address-caption {
  font-size: 0.9em;
  color: var(--gray-400);
}.modal-wrapper {
  position: fixed;
  z-index: 201;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.modal-wrapper > .modal-panel {
  background-color: var(--body-bg);
  color: var(--body-text);
  border: 1px solid var(--border);
  padding: 24px;
  border-radius: 4px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  outline: 0;
  cursor: move;
  position: relative;
}
.modal-wrapper > .modal-panel.maximized {
  width: calc(100% - 16px) !important;
  height: calc(100% - 16px) !important;
  margin: 8px;
  cursor: default;
}
[data-theme=dark] .modal-wrapper > .modal-panel {
  box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
}.bs-modal-container .modal-curtain {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.3;
  z-index: 200;
}.bs-modal-frame {
  cursor: default;
  height: 100%;
}
.bs-modal-frame .title-bar {
  padding-bottom: 24px;
}
.bs-modal-frame .title-bar .title {
  font-size: 1.3846em;
}
.bs-modal-frame .title-bar .title-buttons {
  text-align: right;
}
.bs-modal-frame .title-bar .close-btn {
  padding: 4px;
}
.bs-modal-frame .title-bar .close-btn .font-icon {
  font-size: 1.6em;
}
.bs-modal-frame > .buttons {
  padding-top: 24px;
}.bs-tooltip {
  position: fixed;
  z-index: 10000;
  max-width: 240px;
  padding: 8px;
  border: 1px solid var(--primary);
  background-color: var(--body-bg);
  color: var(--body-text);
  border-radius: 4px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 2px -1px rgba(0, 0, 0, 0.2);
}
.bs-tooltip:before {
  content: " ";
  position: absolute;
  width: 12px;
  height: 12px;
  left: calc(50% - 6px);
  top: -6px;
  border: 1px solid var(--primary);
  border-radius: 2px;
  background-color: var(--body-bg);
  transform: rotate(135deg);
  clip-path: polygon(0% 10%, 0% 100%, 90% 100%);
  z-index: -1;
}
.bs-tooltip.center {
  transform: translateX(-50%);
}
.bs-tooltip > div {
  overflow: auto;
}.bs-notification-container > .top-notification {
  position: fixed;
  z-index: 250;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
}
.bs-notification-container > .top-notification > div {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 12px;
  border: 1px solid var(--green);
  border-radius: 4px;
  color: var(--green);
  background-color: var(--body-bg);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
  line-height: 1.4;
}
.bs-notification-container > .top-notification > div:before {
  content: "check_circle";
  display: inline-block;
  width: 1.0769em;
  height: 1.0769em;
  margin-right: 6px;
  font-family: var(--icon-font-family);
  font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 48;
}
.bs-notification-container > .top-notification > div.error {
  border: 1px solid var(--red);
  color: var(--red);
}
.bs-notification-container > .top-notification > div.error:before {
  content: "cancel";
}
.bs-notification-container > .bottom-notification {
  position: fixed;
  z-index: 250;
  bottom: 20px;
  right: 20px;
}
.bs-notification-container > .bs-loading-icon {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
  opacity: 0.1;
  z-index: 300;
}
.bs-notification-container > .bs-loading-icon > .font-icon {
  font-size: 52px;
  color: var(--white);
  opacity: 1;
}
[data-theme=dark] .bs-notification-container > .top-notification > div {
  box-shadow: 0 4px 4px rgba(255, 255, 255, 0.1);
}.bs-alarm-frame[data-v-801443a4] {
  width: 408px;
  height: 234px;
  padding: 24px;
  background-color: var(--color-body-bg);
  border: 2px solid var(--orange);
  border-radius: 2px;
  box-shadow: 0 3px 3px 3px rgba(0, 0, 0, 0.1);
}
.bs-alarm-frame .title-bar[data-v-801443a4] {
  padding-bottom: 16px;
}
.bs-alarm-frame .title-bar .title[data-v-801443a4] {
  font-size: 1.0769em;
}
.bs-alarm-frame .title-bar .title .font-icon[data-v-801443a4] {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  background-color: var(--orange);
  border-radius: 100%;
  color: white;
  line-height: 1;
}
.bs-alarm-frame .title-bar .title > span[data-v-801443a4] {
  color: var(--orange);
  font-weight: 500;
}
.bs-alarm-frame .buttons[data-v-801443a4] {
  padding-top: 16px;
}.bs-context-menu-container .context-menu-curtain {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 300;
}.menu-search[data-v-0072cd9c] {
  margin: 8px 10px 8px 12px;
}
.menu-search .menu-search-box[data-v-0072cd9c] {
  position: relative;
}
.menu-search .menu-search-box input[data-v-0072cd9c] {
  padding: 4px 36px 5px 8px;
  background: #2D2E36;
  border: 1px solid #A9A9AE;
  border-radius: 4px;
  width: 100%;
  color: #A9A9AE;
  outline: none;
}
.menu-search .menu-search-box .icon[data-v-0072cd9c] {
  position: absolute;
  font-size: 14px;
  top: 0;
  right: 4px;
  height: 100%;
}
.menu-search .menu-search-box .icon > button > span[data-v-0072cd9c] {
  display: block;
}
.menu-search button[data-v-0072cd9c] {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  color: #A9A9AE;
}