@import "@nasa-jpl/stellar/css/index.css";
:root {
  --st-react-input-outline: -webkit-focus-ring-color;
  --st-react-overlay-border: 1px solid rgba(0, 0, 0, 0.16);
  --st-react-overlay-filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.05))
    drop-shadow(0 1px 3px rgba(0, 0, 0, 0.1));
  --st-react-label-color: var(--st-gray-60);
  --st-react-label-typography-line-height: 24px;
  --st-react-label-required-spacing: 2px;
  --st-react-multiselect-background: var(--st-gray-10);
  --st-react-multiselect-border-radius: 4px;
  --st-react-multiselect-border-color: var(--st-gray-20);
  --st-react-multiselect-option-border-color: var(--st-gray-10);
  --st-react-multiselect-option-selected-border-color: var(--st-gray-20);
  --st-react-multiselect-option-selected-background-color: var(--st-white);
  --st-react-multiselect-option-selected-text-color: var(--st-gray-80);
  --st-react-multiselect-option-text-color: rgba(var(--st-gray-60-RGB), 0.65);
  --st-react-dropdown-font-family: var(--st-typography-font-family);
  --st-react-dropdown-font-weight: var(--st-typography-body-font-weight);
  --st-react-dropdown-font-size: var(--st-typography-body-font-size);
  --st-react-dropdown-letter-spacing: var(--st-typography-body-letter-spacing);
  --st-react-dropdown-height: calc(var(--st-grid-unit) * 3);
  --st-react-dropdown-line-height: var(--st-react-dropdown-height);
  --st-react-dropdown-value-color: var(--st-gray-80);
  --st-react-dropdown-value-container-padding: 0 var(--st-grid-unit);
  --st-react-dropdown-value-container-flex-gap: calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-label-color: var(--st-gray-60);
  --st-react-dropdown-inner-label-color: var(--st-gray-60);
  --st-react-dropdown-control-color: var(--st-white);
  --st-react-dropdown-control-border: 1px solid var(--st-gray-20);
  --st-react-dropdown-control-min-height: calc(var(--st-grid-unit) * 3);
  --st-react-dropdown-control-hover-background-color: var(--st-gray-10);
  --st-react-dropdown-control-hover-border: 1px solid var(--st-gray-20);
  --st-react-dropdown-control-focus-box-shadow: 0px 0px 0px 1px #4d90fe;
  --st-react-dropdown-menu-focus-box-shadow: 0px 1px 0px 0px #4d90fe,
    1px 0px 0px 0px #4d90fe, -1px 0px 0px 0px #4d90fe;
  --st-react-dropdown-placeholder-color: var(--st-gray-50);
  --st-react-dropdown-menu-background-color: var(--st-white);
  --st-react-dropdown-menu-border: 1px solid var(--st-gray-20);
  --st-react-dropdown-menu-border-radius: 0 0 calc(var(--st-grid-unit) / 2)
    calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-menu-list-padding-bottom: calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-menu-list-border-radius: calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-menu-list-box-shadow: 0 2px 3px 0 rgb(34 36 38 / 15%);
  --st-react-dropdown-menu-list-background-color: var(--st-white);
  --st-react-dropdown-menu-no-options-label-color: var(--st-gray-50);
  --st-react-dropdown-indicator-padding: 0 var(--st-grid-unit);
  --st-react-dropdown-indicator-svg-width: var(--st-grid-unit2x);
  --st-react-dropdown-indicator-svg-height: var(--st-grid-unit2x);
  --st-react-dropdown-indicator-svg-color: var(--st-gray-60);
  --st-react-dropdown-input-container-color: var(--st-gray-80);
  --st-react-dropdown-option-margin: 0px calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-option-padding: 0 calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-option-width: calc(100% - var(--st-grid-unit));
  --st-react-dropdown-option-border-radius: calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-option-focus-background-color: var(--st-gray-15);
  --st-react-dropdown-option-disabled-color: var(--st-gray-50);
  --st-react-dropdown-option-selected-background: inherit;
  --st-react-dropdown-option-selected-font-weight: 600;
  --st-react-dropdown-clear-indicator-color: var(--st-gray-60);
  --st-react-dropdown-clear-indicator-hover-color: var(--st-gray-100);
  --st-react-dropdown-multi-value-margin-right: calc(var(--st-grid-unit) / 2);
  --st-react-dropdown-multi-value-height: 18px;
  --st-react-dropdown-multi-value-background-color: var(--st-gray-20);
  --st-react-dropdown-multi-value-remove-width: 18px;
  --st-react-modal-animation: 150ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal
    none running contentShow;
  --st-react-modal-header-background-color: white;
  --st-react-modal-min-width: calc(var(--st-grid-unit) * 40);
  --st-react-modal-border-radius: 4px;
  --st-react-modal-border: 1px solid var(--st-gray-15);
  --st-react-modal-box-shadow: hsl(206deg 22% 7% / 35%) 0px 10px 38px -10px,
    hsl(206deg 22% 7% / 20%) 0px 10px 20px -15px;
  --st-react-modal-header-border-bottom: 1px solid var(--st-gray-15);
  --st-react-modal-header-padding: var(--st-grid-unit) var(--st-grid-unit)
    var(--st-grid-unit) var(--st-grid-unit2x);
  --st-react-modal-content-background-color: white;
  --st-react-modal-action-row-background-color: var(--st-gray-10);
  --st-react-modal-action-row-padding: var(--st-grid-unit);
  --st-react-modal-action-row-border-top: 1px solid var(--st-gray-15);
  --st-react-modal-action-row-secondary-button-background: white;
  --st-react-modal-action-row-secondary-button-border: 1px solid
    var(--st-gray-20);
  --st-react-modal-action-row-secondary-button-hover-background: var(
    --st-gray-10
  );
  --st-react-modal-overlay-background-color: hsl(0 0% 0% / 0.439);
  --st-react-modal-overlay-animation: 150ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1
    normal none running fadeIn;
  --st-react-progress-height: var(--st-grid-unit);
  --st-react-progress-background: var(--st-gray-20);
  --st-react-progress-border-radius: 99999px;
  --st-react-progress-indicator-background: var(--st-blue);
  --st-react-progress-indicator-transition: width 450ms
    cubic-bezier(0.65, 0, 0.35, 1) 0s;
  --st-react-popover-background: white;
  --st-react-popover-border-radius: 4px;
  --st-react-popover-border: var(--st-react-overlay-border);
  --st-react-popover-padding: calc(var(--st-grid-unit) * 1.5);
  --st-react-popover-filter: var(--st-react-overlay-filter);
  --st-react-checkbox-label-color: var(--st-gray-60);
  --st-react-checkbox-label-hover-color: var(--st-gray-70);
  --st-react-checkbox-unchecked-border-color: var(--st-gray-50);
  --st-react-checkbox-unchecked-hover-border-color: var(--st-gray-60);
  --st-react-checkbox-checked-background: rgba(240, 228, 255, 0.24);
  --st-react-checkbox-checked-color: var(--st-primary-70);
  --st-react-checkbox-checked-border-color: var(--st-primary-70);
  --st-react-checkbox-checked-hover-background: rgba(240, 228, 255, 0.48);
  --st-react-checkbox-checked-hover-border-color: var(--st-primary-80);
  --st-react-checkbox-checked-hover-color: var(--st-primary-80);
  --st-react-checkbox-label-color: var(--st-gray-60);
  --st-react-checkbox-label-hover-color: var(--st-gray-70);
  --st-react-checkbox-unchecked-border-color: var(--st-gray-50);
  --st-react-checkbox-unchecked-hover-border-color: var(--st-gray-60);
  --st-react-checkbox-checked-background: rgba(240, 228, 255, 0.24);
  --st-react-checkbox-checked-color: var(--st-primary-70);
  --st-react-checkbox-checked-border-color: var(--st-primary-70);
  --st-react-checkbox-checked-hover-background: rgba(240, 228, 255, 0.48);
  --st-react-checkbox-checked-hover-border-color: var(--st-primary-80);
  --st-react-checkbox-checked-hover-color: var(--st-primary-80);
  --st-react-switch-label-color: var(--st-gray-60);
  --st-react-switch-label-hover-color: var(--st-gray-70);
  --st-react-switch-unchecked-background: var(--st-gray-40);
  --st-react-switch-unchecked-hover-background: var(--st-gray-50);
  --st-react-switch-unchecked-hover-border-color: var(--st-gray-60);
  --st-react-switch-checked-background: var(--st-primary-70);
  --st-react-switch-checked-hover-background: var(--st-primary-80);
  --st-react-slider-label-color: var(--st-gray-60);
  --st-react-slider-height: 14px;
  --st-react-slider-range-background-color: var(--st-primary-50);
  --st-react-slider-thumb-background-color: var(--st-gray-15);
  --st-react-slider-thumb-hover-background-color: var(--st-gray-10);
  --st-react-slider-thumb-border-color: var(--st-primary-50);
  --st-react-slider-thumb-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);
  --st-react-slider-thumb-focus-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
  --st-react-slider-disabled-range-background-color: var(--st-gray-50);
  --st-react-slider-disabled-thumb-background-color: var(--st-gray-30);
  --st-react-slider-disabled-thumb-border-color: var(--st-gray-50);
  --st-react-slider-track-height: 4px;
  --st-react-slider-track-background-color: var(--st-gray-20);
  --st-react-slider-input-max-width: 64px;
  --st-react-slider-min-max-color: var(--st-gray-50);
  --st-react-tooltip-border-radius: calc(var(--st-grid-unit) / 2);
  --st-react-tooltip-padding: var(--st-grid-unit) var(--st-grid-unit3x);
  --st-react-tooltip-background-color: var(--st-white);
  --st-react-tooltip-box-shadow: hsl(206 22% 7% / 35%) 0px 10px 38px -10px,
    hsl(206 22% 7% / 20%) 0px 10px 20px -15px;
  --st-react-tooltip-arrow-background-color: var(--st-white);
  --st-react-tooltip-animation-duration: 400ms;
  --st-react-tooltip-animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  --st-react-tooltip-animation-top: slideUpAndFade;
  --st-react-tooltip-animation-right: slideRightAndFade;
  --st-react-tooltip-animation-bottom: slideDownAndFade;
  --st-react-tooltip-animation-left: slideLeftAndFade;
  --st-react-input-font-family: var(--st-input-font-family);
  --st-react-input-font-size: var(--st-input-font-size);
  --st-react-input-font-weight: var(--st-input-font-weight);
  --st-react-input-line-height: var(--st-input-line-height);
  --st-react-input-letter-spacing: var(--st-input-letter-spacing);
  --st-react-input-background-color: var(--st-input-background-color);
  --st-react-input-border: var(--st-input-border);
  --st-react-input-border-radius: var(--st-input-border-radius, 4px);
  --st-react-input-color: var(--st-input-color);
  --st-react-input-padding: var(--st-input-padding);
  --st-react-input-placeholder-color: var(--st-input-placeholder-color);
  --st-react-error-font-family: var(--st-typography-label-font-family);
  --st-react-error-font-weight: var(--st-typography-label-font-weight);
  --st-react-error-font-size: var(--st-typography-label-font-size);
  --st-react-error-line-height: var(--st-typography-label-line-height);
  --st-react-error-letter-spacing: var(--st-typography-label-letter-spacing);
  --st-react-error-color: var(--st-error-red);
  --st-react-error-spacing: 2px;
  --st-react-formfield-horizontal-grid-unit: 4px;
  --st-react-formfield-vertical-grid-unit: 2px;
  --st-react-navbar-brand-title-font-family: var(
    --st-typography-header-font-family
  );
  --st-react-navbar-brand-title-font-weight: var(
    --st-typography-header-font-weight
  );
  --st-react-navbar-brand-title-font-size: var(
    --st-typography-header-font-size
  );
  --st-react-navbar-brand-title-line-height: var(
    --st-typography-header-line-height
  );
  --st-react-navbar-brand-title-letter-spacing: var(
    --st-typography-header-letter-spacing
  );
  --st-react-navbar-brand-title-color: var(--st-gray-70);
  --st-react-navbar-brand-version-font-family: var(
    --st-typography-label-font-family
  );
  --st-react-navbar-brand-version-font-weight: var(
    --st-typography-label-font-weight
  );
  --st-react-navbar-brand-version-font-size: var(
    --st-typography-label-font-size
  );
  --st-react-navbar-brand-version-line-height: var(
    --st-typography-label-line-height
  );
  --st-react-navbar-brand-version-letter-spacing: var(
    --st-typography-label-letter-spacing
  );
  --st-react-navbar-brand-version-color: var(--st-gray-50);
  --st-react-navbar-link-font-family: var(--st-button-font-family);
  --st-react-navbar-link-font-weight: var(--st-button-font-weight);
  --st-react-navbar-link-font-size: var(--st-button-font-size);
  --st-react-navbar-link-line-height: var(--st-button-line-height);
  --st-react-navbar-link-letter-spacing: var(--st-button-letter-spacing);
  --st-react-navbar-link-color: var(--st-button-tertiary-color);
  --st-react-navbar-link-hover-background-color: var(--st-gray-15);
  --st-react-navbar-link-height: 100%;
  --st-react-navbar-mobile-link-height: 40px;
  --st-react-navbar-link-gap: var(--st-grid-unit);
  --st-react-navbar-link-padding: 0 var(--st-grid-unit3x);
  --st-react-navbar-height: 48px;
  --st-react-navbar-padding: 0px 16px;
  --st-react-navbar-mobile-spacer-width: 24px;
  --st-react-avatar-font-family: var(--st-typography-medium-font-family);
  --st-react-avatar-font-weight: var(--st-typography-medium-font-weight);
  --st-react-avatar-font-size: var(--st-typography-medium-font-size);
  --st-react-avatar-line-height: var(--st-typography-medium-line-height);
  --st-react-avatar-letter-spacing: var(--st-typography-medium-letter-spacing);
  --st-react-avatar-color: var(--st-gray-100);
  --st-react-avatar-background: var(--st-gray-20);
  --st-react-menu-background: var(--st-white);
  --st-react-menu-border-radius: calc(var(--st-grid-unit) / 2);
  --st-react-menu-border: var(--st-react-overlay-border);
  --st-react-menu-padding: calc(var(--st-grid-unit) / 2);
  --st-react-menu-filter: var(--st-react-overlay-filter);
  --st-react-menu-item-font-family: var(--st-typography-label-font-family);
  --st-react-menu-item-font-weight: var(--st-typography-label-font-weight);
  --st-react-menu-item-font-size: var(--st-typography-label-font-size);
  --st-react-menu-item-line-height: var(--st-typography-label-line-height);
  --st-react-menu-item-letter-spacing: var(
    --st-typography-label-letter-spacing
  );
  --st-react-menu-item-color: var(--st-typography-label-tertiary-color);
  --st-react-menu-item-open-color: var(--st-primary-40);
  --st-react-menu-item-open-background: var(--st-primary-10);
  --st-react-menu-item-highlighted-color: var(--st-gray-10);
  --st-react-menu-item-highlighted-background: var(--st-primary-50);
  --st-react-menu-item-disabled-color: var(--st-gray-30);
  --st-react-menu-label-font-family: var(--st-typography-label-font-family);
  --st-react-menu-label-font-weight: var(--st-typography-label-font-weight);
  --st-react-menu-label-font-size: var(--st-typography-label-font-size);
  --st-react-menu-label-line-height: 24px;
  --st-react-menu-label-letter-spacing: var(
    --st-typography-label-letter-spacing
  );
  --st-react-menu-label-color: var(--st-gray-50);
  --st-react-menu-separator-background: var(--st-gray-20);
  --st-react-menu-arrow-filter: drop-shadow(0px 1px 0px #d6d6d6);
  --st-react-menu-right-slot-color: var(--st-gray-50);
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes contentShow {
  0% {
    opacity: 0;
    transform: translate(-50%, -48%) scale(0.96);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes slideUpAndFade {
  0% {
    opacity: 0;
    transform: translateY(2px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slideRightAndFade {
  0% {
    opacity: 0;
    transform: translateX(-2px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes slideDownAndFade {
  0% {
    opacity: 0;
    transform: translateY(-2px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slideLeftAndFade {
  0% {
    opacity: 0;
    transform: translateX(2px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.st-react-multiselect {
  display: flex;
  align-items: center;
  position: relative;
  background: var(--st-react-multiselect-background);
  border-radius: var(--st-react-multiselect-border-radius);
}

.st-react-multiselect--option {
  border: 1px solid var(--st-react-multiselect-option-border-color);
  border-radius: var(--st-react-multiselect-border-radius);
  background: none;
  padding: 0px var(--st-grid-unit);
  flex: 1;
  cursor: pointer;
}
.st-react-multiselect--option .st-react-multiselect--optionText {
  color: var(--st-react-multiselect-option-text-color);
  text-align: center;
  padding: 0px var(--st-grid-unit2x);
  white-space: nowrap;
  display: flex;
  justify-content: center;
}
.st-react-multiselect--option.st-react-multiselect--option--selected {
  border: 1px solid var(--st-react-multiselect-option-selected-border-color);
  background-color: var(--st-react-multiselect-option-selected-background-color);
}
.st-react-multiselect--option.st-react-multiselect--option--selected .st-react-multiselect--optionText {
  color: var(--st-react-multiselect-option-selected-text-color);
}

.st-react-multiselect--background {
  pointer-events: none;
  border-radius: var(--st-react-multiselect-border-radius);
  border: 1px solid var(--st-react-multiselect-border-color);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.st-react-multiselect--medium .st-react-multiselect--option {
  height: var(--st-grid-unit3x);
}

.st-react-multiselect--large .st-react-multiselect--option {
  height: var(--st-grid-unit4x);
}

.st-react-dropdown {
  display: flex;
  gap: calc(var(--st-grid-unit) / 2);
  flex-direction: column;
  /* lighten the scrollbars */
}
.st-react-dropdown .st-react-dropdown--inner-label {
  color: var(--st-react-dropdown-inner-label-color);
}
.st-react-dropdown .st-react-dropdown--rs__control {
  background: var(--st-react-dropdown-control-color);
  border: var(--st-react-dropdown-control-border);
  cursor: pointer;
  min-height: var(--st-react-dropdown-control-min-height);
  transition: none;
}
.st-react-dropdown .st-react-dropdown--rs__control:hover {
  background: var(--st-react-dropdown-control-hover-background-color);
  border: var(--st-react-dropdown-control-hover-border);
}
.st-react-dropdown .st-react-dropdown--rs__control--menu-is-open {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.st-react-dropdown .st-react-dropdown--rs__option,
.st-react-dropdown .st-react-dropdown--rs__input-container,
.st-react-dropdown .st-react-dropdown--rs__input-container input,
.st-react-dropdown .st-react-dropdown--rs__single-value,
.st-react-dropdown .st-react-dropdown--rs__menu-notice--no-options,
.st-react-dropdown .st-react-dropdown--rs__placeholder {
  font-family: var(--st-react-dropdown-font-family);
  font-size: var(--st-react-dropdown-font-size);
  font-weight: var(--st-react-dropdown-font-weight);
  height: var(--st-react-dropdown-height);
  letter-spacing: var(--st-react-dropdown-letter-spacing) !important;
  line-height: var(--st-react-dropdown-line-height);
  color: var(--st-react-dropdown-value-color);
}
.st-react-dropdown .st-react-dropdown--rs__placeholder {
  margin: 0;
  color: var(--st-react-dropdown-placeholder-color);
}
.st-react-dropdown .st-react-dropdown--rs__menu {
  background-color: var(--st-react-dropdown-placeholder-background-color);
  border: var(--st-react-dropdown-menu-border);
  border-top: none;
  box-shadow: none;
  margin: 0;
  border-radius: var(--st-react-dropdown-menu-border-radius);
  z-index: 4;
}
.st-react-dropdown .st-react-dropdown--rs__menu-list {
  padding: var(--st-react-dropdown-menu-list-padding-bottom) 0;
  z-index: 3;
  border-radius: var(--st-react-dropdown-menu-list-border-radius);
  border-radius: inherit;
  box-shadow: var(--st-react-dropdown-menu-list-box-shadow);
  background: var(--st-react-dropdown-menu-list-background-color);
}
.st-react-dropdown .st-react-dropdown--rs__menu-notice--no-options {
  color: var(--st-react-dropdown-menu-no-options-label-color);
  cursor: default;
}
.st-react-dropdown .st-react-dropdown--rs__single-value {
  margin: 0 !important;
}
.st-react-dropdown .st-react-dropdown--rs__indicator-separator {
  display: none;
}
.st-react-dropdown .st-react-dropdown--rs__indicator {
  padding: var(--st-react-dropdown-indicator-padding) !important;
  color: inherit !important;
}
.st-react-dropdown .st-react-dropdown--rs__indicator:hover {
  color: inherit !important;
}
.st-react-dropdown .st-react-dropdown--rs__indicator svg {
  width: var(--st-react-dropdown-indicator-svg-width);
  height: var(--st-react-dropdown-indicator-svg-height);
  color: var(--st-react-dropdown-indicator-svg-color);
}
.st-react-dropdown .st-react-dropdown--rs__value-container {
  padding: var(--st-react-dropdown-value-container-padding) !important;
  gap: var(--st-react-dropdown-value-container-flex-gap);
}
.st-react-dropdown .st-react-dropdown--rs__input-container {
  display: flex;
  color: var(--st-react-dropdown-input-container-color);
  margin: 0;
  padding: 0;
}
.st-react-dropdown .st-react-dropdown--rs__control--is-focused {
  box-shadow: var(--st-react-dropdown-control-focus-box-shadow);
}
.st-react-dropdown .st-react-dropdown--rs__control--menu-is-open + .st-react-dropdown--rs__menu {
  box-shadow: var(--st-react-dropdown-menu-focus-box-shadow);
}
.st-react-dropdown .st-react-dropdown--rs__option {
  cursor: pointer;
  margin: var(--st-react-dropdown-option-margin);
  width: var(--st-react-dropdown-option-width);
  padding: var(--st-react-dropdown-option-padding);
  border-radius: var(--st-react-dropdown-option-border-radius);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.st-react-dropdown .st-react-dropdown--rs__option--is-focused,
.st-react-dropdown .st-react-dropdown--rs__option--is-focused.st-react-dropdown--rs__option--is-focused,
.st-react-dropdown .st-react-dropdown--rs__option:hover,
.st-react-dropdown .st-react-dropdown--rs__option:focus {
  background: var(--st-react-dropdown-option-focus-background-color);
}
.st-react-dropdown .st-react-dropdown--rs__option--is-disabled {
  color: var(--st-react-dropdown-option-disabled-color);
  cursor: not-allowed;
}
.st-react-dropdown .st-react-dropdown--rs__option--is-selected {
  background: var(--st-react-dropdown-option-selected-background-color);
  font-weight: var(--st-react-dropdown-option-selected-font-weight);
}
.st-react-dropdown .st-react-dropdown--rs__option--is-active,
.st-react-dropdown .st-react-dropdown--rs__option:active {
  background: inherit;
}
.st-react-dropdown .st-react-dropdown--clear-indicator {
  display: flex;
  color: var(--st-react-dropdown-clear-indicator-color);
}
.st-react-dropdown .st-react-dropdown--clear-indicator:hover {
  color: var(--st-react-dropdown-clear-indicator-hover-color);
}
.st-react-dropdown .st-react-dropdown--rs__multi-value {
  margin: 0;
  height: var(--st-react-dropdown-multi-value-height);
  background: var(--st-react-dropdown-multi-value-background-color);
}
.st-react-dropdown .st-react-dropdown--rs__multi-value__label {
  font-family: var(--st-react-dropdown-font-family);
  font-size: var(--st-react-dropdown-font-size);
  font-weight: var(--st-react-dropdown-font-weight);
  height: var(--st-react-dropdown-height);
  letter-spacing: var(--st-react-dropdown-letter-spacing) !important;
  color: var(--st-react-dropdown-value-color);
  line-height: 12px;
}
.st-react-dropdown .st-react-dropdown--rs__multi-value__remove {
  width: var(--st-react-dropdown-multi-value-remove-width);
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.st-react-modal.st-react-alert .st-react-modal--description--text {
  margin-bottom: 0px;
}

.st-react-modal {
  display: flex;
  flex-direction: column;
  min-width: var(--st-react-modal-min-width);
  border-radius: var(--st-react-modal-border-radius);
  border: var(--st-react-modal-border);
  box-shadow: var(--st-react-modal-box-shadow);
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
  z-index: 9999;
}
@media (prefers-reduced-motion: no-preference) {
  .st-react-modal {
    animation: var(--st-react-modal-animation);
  }
}
.st-react-modal .st-react-modal--header {
  display: flex;
  flex-direction: column;
  padding: var(--st-react-modal-header-padding);
  background: var(--st-react-modal-header-background-color);
  border-bottom: var(--st-react-modal-header-border-bottom);
}
.st-react-modal .st-react-modal--header--title-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.st-react-modal .st-react-modal--description--text {
  margin-bottom: var(--st-grid-unit2x);
}
.st-react-modal .st-react-modal--content {
  background: var(--st-react-modal-content-background-color);
  display: flex;
  padding: var(--st-grid-unit2x);
  flex-direction: column;
}

.st-react-modal--action-row {
  display: flex;
  background: var(--st-react-modal-action-row-background-color);
  justify-content: flex-end;
  padding: var(--st-react-modal-action-row-padding);
  gap: var(--st-grid-unit);
  border-top: var(--st-react-modal-action-row-border-top);
}

.st-react-modal--overlay {
  background-color: var(--st-react-modal-overlay-background-color);
  position: fixed;
  inset: 0;
  z-index: 9999;
}
@media (prefers-reduced-motion: no-preference) {
  .st-react-modal--overlay {
    animation: var(--st-react-modal-overlay-animation);
  }
}

.st-react-progress {
  position: relative;
  overflow: hidden;
  background: var(--st-react-progress-background);
  border-radius: var(--st-react-progress-border-radius);
  width: 100%;
  height: var(--st-react-progress-height);
}
.st-react-progress[data-state=indeterminate] .st-react-progress--indicator {
  background: var(--st-react-progress-background);
}
.st-react-progress .st-react-progress--indicator {
  background: var(--st-react-progress-indicator-background);
  height: 100%;
  transition: var(--st-react-progress-indicator-transition);
}
.st-react-progress .st-react-progress--indeterminate--line {
  top: 0;
  height: 100%;
  position: absolute;
  background: #4a8df8;
}
.st-react-progress .st-react-progress--indeterminate--line:first-child {
  animation: progressIndeterminateIncrease 2s infinite;
}
.st-react-progress .st-react-progress--indeterminate--line:last-child {
  animation: progressIndeterminateDecrease 2s infinite;
}
@keyframes progressIndeterminateIncrease {
  from {
    left: -5%;
    width: 5%;
  }
  to {
    left: 130%;
    width: 100%;
  }
}
@keyframes progressIndeterminateDecrease {
  from {
    left: -80%;
    width: 80%;
  }
  to {
    left: 110%;
    width: 10%;
  }
}

.st-react-checkbox .st-react-checkbox--label {
  flex: 1;
  text-align: left;
  user-select: none;
  color: var(--st-react-checkbox-label-color);
  cursor: pointer;
}
.st-react-checkbox:hover .st-react-checkbox--label {
  color: var(--st-react-checkbox-label-hover-color);
}
.st-react-checkbox:not(.st-react-checkbox--unlabeled) {
  display: flex;
  align-items: center;
  gap: var(--st-grid-unit);
}
.st-react-checkbox button {
  padding: 0;
  background: none;
  cursor: pointer;
  border-radius: 2px;
  border: 1px solid;
  width: 12px;
  height: 12px;
  align-items: center;
  justify-content: center;
  display: flex;
}
.st-react-checkbox button[data-state=unchecked] {
  border-color: var(--st-react-checkbox-unchecked-border-color);
}
.st-react-checkbox button[data-state=unchecked]:hover {
  border-color: var(--st-react-checkbox-unchecked-hover-border-color);
}
.st-react-checkbox button[data-state=checked] {
  background: var(--st-react-checkbox-checked-background);
  border-color: var(--st-react-checkbox-checked-border-color);
  color: var(--st-react-checkbox-checked-color);
}
.st-react-checkbox button[data-state=checked]:hover {
  background: var(--st-react-checkbox-checked-hover-background);
  border-color: var(--st-react-checkbox-checked-hover-border-color);
  color: var(--st-react-checkbox-checked-hover-color);
}
.st-react-checkbox button[data-state=checked] .st-react-checkbox--indicator-check {
  visibility: visible;
}
.st-react-checkbox .st-react-checkbox--indicator-check {
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.st-react-checkbox.st-react-checkbox--label-right {
  flex-direction: row-reverse;
}
.st-react-checkbox.st-react-checkbox--unlabeled {
  padding: 0;
}

.st-react-popover {
  background: var(--st-react-popover-background);
  border-radius: var(--st-react-popover-border-radius);
  border: var(--st-react-popover-border);
  padding: var(--st-react-popover-padding);
  filter: var(--st-react-popover-filter);
}

.st-react-input .st-react-input--container {
  font-family: var(--st-react-input-font-family);
  font-size: var(--st-react-input-font-size);
  font-weight: var(--st-react-input-font-weight);
  line-height: var(--st-react-input-line-height);
  letter-spacing: var(--st-react-input-letter-spacing);
  background-color: var(--st-react-input-background-color);
  border: var(--st-react-input-border);
  border-radius: var(--st-react-input-border-radius);
  color: var(--st-react-input-color);
  padding: var(--st-react-input-padding);
  display: flex;
  gap: var(--st-grid-unit);
}
.st-react-input .st-react-input--container:focus, .st-react-input .st-react-input--container.focus {
  outline-width: initial;
  outline-style: auto;
  outline-color: Highlight;
  outline-color: var(--st-react-input-outline);
}
.st-react-input .st-react-input--container.error {
  background-color: var(--st-input-error-background-color);
  border: 1px solid var(--st-red);
  color: var(--st-red);
}
.st-react-input .st-react-input--container.error::placeholder {
  color: var(--st-red);
}
.st-react-input .st-react-input--container.error:disabled {
  background-color: var(--st-input-disabled-background-color);
  border: 1px solid var(--st-red);
  color: var(--st-input-disabled-color);
  cursor: not-allowed;
}
.st-react-input .st-react-input--container.error:disabled::placeholder {
  color: var(--st-input-disabled-color);
}
.st-react-input .st-react-input--container.warning {
  background-color: var(--st-input-warning-background-color);
  border: 1px solid var(--st-orange);
  color: var(--st-orange);
}
.st-react-input .st-react-input--container.warning::placeholder {
  color: var(--st-orange);
}
.st-react-input .st-react-input--container.warning:disabled {
  background-color: var(--st-input-disabled-background-color);
  border: 1px solid var(--st-orange);
  color: var(--st-input-disabled-color);
  cursor: not-allowed;
}
.st-react-input .st-react-input--container.warning:disabled::placeholder {
  color: var(--st-input-disabled-color);
}
.st-react-input .st-react-input--container .st-react-input--adornment {
  display: flex;
  align-items: center;
  gap: var(--st-grid-unit);
}
.st-react-input .st-react-input--container .st-react-input--adornment * {
  display: flex;
}
.st-react-input .st-react-input--container:not(.error):not(.warning) .st-react-input--adornment {
  color: var(--st-gray-50);
}
.st-react-input .st-react-input--container input.st-react-input--input {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  background-color: rgba(0, 0, 0, 0);
  color: inherit;
  border: none;
  outline: none;
  width: 100%;
  padding: 0;
}
.st-react-input .st-react-input--container input.st-react-input--input::placeholder {
  color: var(--st-react-input-placeholder-color);
}
.st-react-input .st-react-input--container input.st-react-input--input:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.st-react-tooltip {
  border-radius: var(--st-react-tooltip-border-radius);
  padding: var(--st-react-tooltip-padding);
  background: var(--st-react-tooltip-background-color);
  box-shadow: var(--st-react-tooltip-box-shadow);
}
@media (prefers-reduced-motion: no-preference) {
  .st-react-tooltip {
    animation-duration: var(--st-react-tooltip-animation-duration);
    animation-timing-function: var(--st-react-tooltip-animation-timing-function);
    will-change: transform, opacity;
  }
  .st-react-tooltip[data-state=delayed-open][data-side=top] {
    animation-name: var(--st-react-tooltip-animation-top);
  }
  .st-react-tooltip[data-state=delayed-open][data-side=right] {
    animation-name: var(--st-react-tooltip-animation-right);
  }
  .st-react-tooltip[data-state=delayed-open][data-side=bottom] {
    animation-name: var(--st-react-tooltip-animation-bottom);
  }
  .st-react-tooltip[data-state=delayed-open][data-side=left] {
    animation-name: var(--st-react-tooltip-animation-left);
  }
}
.st-react-tooltip .st-react-tooltip--arrow {
  fill: var(--st-react-tooltip-arrow-background-color);
}

.st-react-label {
  line-height: var(--st-react-label-typography-line-height);
  color: var(--st-react-label-color);
}
.st-react-label .st-react-label--required-mark {
  color: var(--st-error-red);
  margin-right: var(--st-react-label-required-spacing);
}

.st-react-error {
  font-family: var(--st-react-error-font-family);
  font-weight: var(--st-react-error-font-weight);
  font-size: var(--st-react-error-font-size);
  line-height: var(--st-react-error-line-height);
  letter-spacing: var(--st-react-error-letter-spacing);
  color: var(--st-react-error-color);
  display: flex;
  gap: var(--st-react-error-spacing);
}

.st-react-warning {
  font-family: var(--st-react-error-font-family);
  font-weight: var(--st-react-error-font-weight);
  font-size: var(--st-react-error-font-size);
  line-height: var(--st-react-error-line-height);
  letter-spacing: var(--st-react-error-letter-spacing);
  color: var(--st-orange);
  display: flex;
  gap: var(--st-react-error-spacing);
}

.st-react-form-field {
  display: flex;
}
.st-react-form-field.st-react-form-field--horizontal {
  flex-flow: row;
  gap: var(--st-react-formfield-horizontal-grid-unit);
}
.st-react-form-field.st-react-form-field--vertical {
  flex-flow: column;
  gap: var(--st-react-formfield-vertical-grid-unit);
}

.st-react-navbar {
  display: flex;
  align-items: center;
  background: var(--st-gray-10);
  height: var(--st-react-navbar-height);
  padding: var(--st-react-navbar-padding);
}

.st-react-navbar-brand {
  display: flex;
  align-items: center;
  gap: calc(var(--st-grid-unit));
  margin-right: var(--st-grid-unit2x);
  color: inherit;
  text-decoration: none;
}
.st-react-navbar-brand .st-react-navbar-brand--logo {
  display: flex;
}
.st-react-navbar-brand .st-react-navbar-brand--title {
  font-family: var(--st-react-navbar-brand-title-font-family);
  font-size: var(--st-react-navbar-brand-title-font-size);
  font-weight: var(--st-react-navbar-brand-title-font-weight);
  line-height: var(--st-react-navbar-brand-title-line-height);
  letter-spacing: var(--st-react-navbar-brand-title-letter-spacing);
  color: var(--st-react-navbar-brand-title-color);
  white-space: nowrap;
  user-select: none;
  gap: var(--st-grid-unit2x);
  display: flex;
  align-items: baseline;
}
.st-react-navbar-brand .st-react-navbar-brand--version {
  font-family: var(--st-react-navbar-brand-version-font-family);
  font-size: var(--st-react-navbar-brand-version-font-size);
  font-weight: var(--st-react-navbar-brand-version-font-weight);
  line-height: var(--st-react-navbar-brand-version-line-height);
  letter-spacing: var(--st-react-navbar-brand-version-letter-spacing);
  color: var(--st-react-navbar-brand-version-color);
}

.st-react-navbar-content {
  display: flex;
  height: 100%;
  align-items: center;
}

.st-react-navbar-content--full {
  flex: 1;
}

.st-react-navbar-content--align-left {
  justify-content: flex-start;
}

.st-react-navbar-content--align-right {
  justify-content: flex-end;
}

.st-react-navbar-content--align-center {
  justify-content: center;
}

.st-react-navbar-link {
  height: var(--st-react-navbar-link-height);
  display: flex;
  align-items: center;
  font-family: var(--st-react-navbar-link-font-family);
  font-size: var(--st-react-navbar-link-font-size);
  font-weight: var(--st-react-navbar-link-font-weight);
  line-height: var(--st-react-navbar-link-line-height);
  letter-spacing: var(--st-react-navbar-link-letter-spacing);
  color: var(--st-react-navbar-link-color);
  text-decoration: none;
  padding: var(--st-react-navbar-link-padding);
  white-space: nowrap;
  gap: var(--st-react-navbar-link-gap);
}
.st-react-navbar-link:hover {
  background: var(--st-react-navbar-link-hover-background-color);
}
.st-react-navbar-link.st-react-navbar-link--active {
  background: var(--st-react-navbar-link-hover-background-color);
}

.st-react-navbar:not(.st-react-navbar--mobile) .st-react-navbar-link.st-react-navbar-link:hover {
  background: var(--st-react-navbar-link-hover-background-color);
}

.st-react-navbar-mobile-menu {
  display: flex;
  flex-direction: column;
  background-color: var(--st-gray-10);
}
.st-react-navbar-mobile-menu .st-react-navbar-link {
  height: var(--st-react-navbar-mobile-link-height);
}
.st-react-navbar-mobile-menu .st-react-navbar-link:active {
  background: var(--st-react-navbar-link-hover-background-color);
}

.st-react-navbar--mobile-spacer {
  width: var(--st-react-navbar-mobile-spacer-width);
}

.st-react-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  overflow: hidden;
  user-select: none;
  width: var(--st-grid-unit3x);
  height: var(--st-grid-unit3x);
  border-radius: 100%;
  background: var(--st-react-avatar-background);
}
.st-react-avatar.large {
  width: var(--st-grid-unit4x);
  height: var(--st-grid-unit4x);
}
.st-react-avatar .st-react-avatar--image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.st-react-avatar .st-react-avatar--fallback {
  font-family: var(--st-react-avatar-font-family);
  font-size: var(--st-react-avatar-font-size);
  font-weight: var(--st-react-avatar-font-weight);
  line-height: var(--st-react-avatar-line-height);
  letter-spacing: var(--st-react-avatar-letter-spacing);
}

.st-react-menu-content,
.st-react-menu-subcontent {
  min-width: 220px;
  background: var(--st-react-menu-background);
  border-radius: var(--st-react-menu-border-radius);
  border: var(--st-react-menu-border);
  padding: var(--st-react-menu-padding);
  filter: var(--st-react-menu-filter);
}

.st-react-menu-item,
.st-react-menu-checkbox-item,
.st-react-menu-radio-item,
.st-react-menu-sub-trigger {
  line-height: 1;
  border-radius: 4px;
  display: flex;
  align-items: center;
  height: 24px;
  padding: 0 4px;
  position: relative;
  padding-left: 24px;
  user-select: none;
  outline: none;
  font-family: var(--st-react-menu-item-font-family);
  font-size: var(--st-react-menu-item-font-size);
  font-weight: var(--st-react-menu-item-font-weight);
  line-height: var(--st-react-menu-item-line-height);
  letter-spacing: var(--st-react-menu-item-letter-spacing);
  color: var(--st-react-menu-item-color);
}

.st-react-menu-arrow {
  filter: var(--st-react-menu-arrow-filter);
}

.st-react-menu-sub-trigger[data-state=open] {
  background-color: var(--st-react-menu-item-open-background);
  color: var(--st-react-menu-item-open-color);
}

.st-react-menu-item[data-disabled],
.st-react-menu-checkbox-item[data-disabled],
.st-react-menu-radio-item[data-disabled],
.st-react-menu-sub-trigger[data-disabled] {
  color: var(--st-react-menu-item-disabled-color);
  pointer-events: none;
}

.st-react-menu-item[data-highlighted],
.st-react-menu-checkbox-item[data-highlighted],
.st-react-menu-radio-item[data-highlighted],
.st-react-menu-sub-trigger[data-highlighted] {
  background-color: var(--st-react-menu-item-highlighted-background);
  color: var(--st-react-menu-item-highlighted-color);
}

.st-react-menu-label {
  padding-left: 24px;
  line-height: 24px;
  font-family: var(--st-react-menu-label-font-family);
  font-size: var(--st-react-menu-label-font-size);
  font-weight: var(--st-react-menu-label-font-weight);
  line-height: var(--st-react-menu-label-line-height);
  letter-spacing: var(--st-react-menu-label-letter-spacing);
  color: var(--st-react-menu-label-color);
  user-select: none;
}

.st-react-menu-separator {
  height: 1px;
  background-color: var(--st-react-menu-separator-background);
  margin: 4px;
}

.st-react-menu-item-indicator {
  position: absolute;
  left: 0;
  width: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.st-react-menu-arrow {
  fill: white;
}

.st-react-menu-right-slot {
  margin-left: auto;
  display: flex;
  color: var(--st-react-menu-right-slot-color);
}

[data-highlighted] > .st-react-menu-right-slot {
  color: white;
}

[data-disabled] .st-react-menu-right-slot {
  color: var(--st-react-menu-item-disabled-color);
}

.st-react-switch .st-react-switch--label {
  flex: 1;
  text-align: left;
  user-select: none;
  cursor: pointer;
  color: var(--st-react-switch-label-color);
}
.st-react-switch:hover .st-react-switch--label {
  color: var(--st-react-switch-label-hover-color);
}
.st-react-switch:not(.st-react-switch--unlabeled) {
  display: flex;
  align-items: center;
  gap: var(--st-grid-unit);
}
.st-react-switch .st-react-switch--box {
  cursor: pointer;
  padding: 0;
  border: none;
  width: 32px;
  height: 16px;
  position: relative;
  border-radius: 9999px;
  background: var(--st-react-switch-unchecked-background);
}
.st-react-switch:hover .st-react-switch--box[data-state=unchecked] {
  background: var(--st-react-switch-unchecked-hover-background);
}
.st-react-switch:hover .st-react-switch--box[data-state=checked] {
  background: var(--st-react-switch-checked-hover-background);
}
.st-react-switch .st-react-switch--box[data-state=checked] {
  background: var(--st-react-switch-checked-background);
  box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.25);
}
.st-react-switch .st-react-switch--thumb {
  display: block;
  width: 12px;
  height: 12px;
  background-color: white;
  border-radius: 9999px;
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.25);
  transition: transform 100ms;
  transform: translateX(2px);
  will-change: transform;
}
.st-react-switch .st-react-switch--thumb[data-state=checked] {
  transform: translateX(18px);
}
.st-react-switch.st-react-switch--label-right {
  flex-direction: row-reverse;
}
.st-react-switch.st-react-switch--unlabeled {
  padding: 0;
}

.st-react-slider .st-react-slider--root {
  position: relative;
  display: flex;
  align-items: center;
  user-select: none;
  touch-action: none;
  flex: 1;
  height: var(--st-react-slider-height);
}
.st-react-slider .st-react-slider--root[data-disabled] .st-react-slider--range {
  background-color: var(--st-react-slider-disabled-range-background-color);
}
.st-react-slider .st-react-slider--root[data-disabled] .st-react-slider--thumb {
  background-color: var(--st-react-slider-disabled-thumb-background-color);
  border-color: var(--st-react-slider-disabled-thumb-border-color);
}
.st-react-slider .st-react-slider--label {
  flex: 1;
  text-align: left;
  user-select: none;
  color: var(--st-react-slider-label-color);
}
.st-react-slider:not(.st-react-slider--unlabeled) {
  display: flex;
  align-items: center;
  gap: var(--st-grid-unit);
}
.st-react-slider .st-react-slider--container {
  display: flex;
  align-items: center;
  flex: 2;
  gap: var(--st-grid-unit);
}
.st-react-slider .st-react-slider--track {
  background-color: var(--st-react-slider-track-background-color);
  position: relative;
  flex-grow: 1;
  border-radius: 9999px;
  height: var(--st-react-slider-track-height);
}
.st-react-slider .st-react-slider--range {
  position: absolute;
  background-color: var(--st-react-slider-range-background-color);
  border-radius: 9999px;
  height: 100%;
}
.st-react-slider .st-react-slider--thumb {
  display: block;
  width: var(--st-react-slider-height);
  height: var(--st-react-slider-height);
  background-color: var(--st-react-slider-thumb-background-color);
  border: 1px solid var(--st-react-slider-thumb-border-color);
  box-shadow: var(--st-react-slider-thumb-box-shadow);
  border-radius: 10px;
}
.st-react-slider .st-react-slider--thumb:hover {
  background-color: var(--st-react-slider-thumb-hover-background-color);
}
.st-react-slider .st-react-slider--thumb:focus {
  outline: none;
  box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
}
.st-react-slider.st-react-slider--label-right {
  flex-direction: row-reverse;
}
.st-react-slider.st-react-slider--unlabeled {
  padding: 0;
}
.st-react-slider .st-react-slider--input {
  max-width: var(--st-react-slider-input-max-width);
  flex: 1;
}
.st-react-slider .st-react-slider--min-max {
  pointer-events: none;
  position: absolute;
  top: 12px;
  display: flex;
  width: 100%;
  justify-content: space-between;
  color: var(--st-react-slider-min-max-color);
}

.date-picker--container {
  display: flex;
  width: min-content;
  position: relative;
}

.date-picker--calendar-container {
  background-color: #ffffff;
  z-index: 10000;
  background: var(--st-react-popover-background);
  border-radius: var(--st-react-popover-border-radius);
  border: var(--st-react-popover-border);
  filter: var(--st-react-popover-filter);
}

.date-picker--calendar-button.st-button {
  height: 16px;
  min-width: 16px;
}

.date-picker--calendar-button.st-button:not(.date-picker--calendar-button--active):hover,
.date-picker--calendar-button.st-button:not(.date-picker--calendar-button--active):focus-visible {
  color: var(--st-gray-60);
}

.date-picker--calendar-button--active.st-button {
  color: var(--st-primary);
}

.date-picker--picker {
  font-size: 12px;
  user-select: none;
  margin: 0 !important;
}

.date-picker-caption {
  display: flex;
  gap: 8px;
  margin: 12px 19px 0px;
}

.date-picker-caption--dropdowns {
  display: flex;
  gap: 4px;
  flex: 1;
  justify-content: center;
}

.date-picker-caption .st-react-dropdown--rs__control {
  --st-react-dropdown-font-size: 18px;
  --st-react-dropdown-font-weight: 700;
}

.date-picker-caption--buttons {
  display: flex;
}

.date-picker-caption .st-react-dropdown--rs__indicator {
  display: none;
}

.date-picker-caption .st-react-dropdown .st-react-dropdown--rs__value-container {
  padding: 0px !important;
}

.date-picker-caption .st-react-dropdown .st-react-dropdown--rs__control,
.date-picker-caption .st-react-dropdown .st-react-dropdown--rs__control:hover {
  border: none;
  padding: 0px 8px 0px 8px;
}

.date-picker-caption--month {
  min-width: 112px;
  text-align: center;
}

.date-picker-caption--year {
  min-width: 72px;
  text-align: center;
}

.date-picker--picker.rdp {
  --rdp-accent-color: var(--st-primary-50);
  --rdp-background-color: var(--st-primary-10);
  --rdp-cell-size: 36px;
}

.date-picker--picker .rdp-table {
  margin: 0px 12px 6px 12px;
}

.date-picker--picker .rdp-tbody {
  border-top: 6px solid transparent;
}

.date-picker--picker .rdp-day {
  border-radius: 5px;
  font-weight: 400;
  position: relative;
  text-align: center;
}

.date-picker--picker .rdp-day:not(.rdp-day_disabled) {
  cursor: pointer;
}

.date-picker--picker .rdp-head_cell {
  font-size: 12px;
  text-transform: none;
  font-weight: 400;
}

.date-picker--picker .rdp-head:after {
  border-bottom: 1px solid var(--st-gray-20);
  content: " ";
  width: 100%;
  position: absolute;
  z-index: 1;
  left: 1px;
}

.date-picker--picker .rdp-cell {
  padding: 2px;
}

.date-picker--picker .rdp-day_today:not(.rdp-day_outside):not(.rdp-day_selected) {
  font-weight: inherit;
  background: var(--st-gray-20);
}

.date-picker--header {
  border-bottom: 1px solid var(--st-gray-20);
}

.date-picker--footer {
  border-top: 1px solid var(--st-gray-20);
}

.date-picker--header-content,
.date-picker--footer-content {
  padding: 8px;
}

.date-picker-caption button > svg {
  pointer-events: none;
}

.st-react-text-field .st-react-text-field-helper-text {
  min-height: 1rem;
}
.st-react-text-field .st-react-error {
  padding: var(--st-input-padding);
  padding-top: inherit;
  padding-bottom: inherit;
}
.st-react-text-field .st-react-input-helper-text {
  font-family: var(--st-react-error-font-family);
  font-weight: var(--st-react-error-font-weight);
  font-size: var(--st-react-error-font-size);
  line-height: var(--st-react-error-line-height);
  letter-spacing: var(--st-react-error-letter-spacing);
  color: var(--st-gray-50);
  display: flex;
  gap: var(--st-react-error-spacing);
  padding: var(--st-input-padding);
  padding-top: inherit;
  padding-bottom: inherit;
}

.rdp {
  --rdp-cell-size: 40px; /* Size of the day cells. */
  --rdp-caption-font-size: 18px; /* Font size for the caption labels. */
  --rdp-accent-color: #0000ff; /* Accent color for the background of selected days. */
  --rdp-background-color: #e7edff; /* Background color for the hovered/focused elements. */
  --rdp-accent-color-dark: #3003e1; /* Accent color for the background of selected days (to use in dark-mode). */
  --rdp-background-color-dark: #180270; /* Background color for the hovered/focused elements (to use in dark-mode). */
  --rdp-outline: 2px solid var(--rdp-accent-color); /* Outline border for focused elements */
  --rdp-outline-selected: 3px solid var(--rdp-accent-color); /* Outline border for focused _and_ selected elements */
  --rdp-selected-color: #fff; /* Color of selected day text */
  margin: 1em;
}

/* Hide elements for devices that are not screen readers */
.rdp-vhidden {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  position: absolute !important;
  top: 0;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  border: 0 !important;
}

/* Buttons */
.rdp-button_reset {
  appearance: none;
  position: relative;
  margin: 0;
  padding: 0;
  cursor: default;
  color: inherit;
  background: none;
  font: inherit;
  -moz-appearance: none;
  -webkit-appearance: none;
}

.rdp-button_reset:focus-visible {
  /* Make sure to reset outline only when :focus-visible is supported */
  outline: none;
}

.rdp-button {
  border: 2px solid transparent;
}

.rdp-button[disabled]:not(.rdp-day_selected) {
  opacity: 0.25;
}

.rdp-button:not([disabled]) {
  cursor: pointer;
}

.rdp-button:focus-visible:not([disabled]) {
  color: inherit;
  background-color: var(--rdp-background-color);
  border: var(--rdp-outline);
}

.rdp-button:hover:not([disabled]):not(.rdp-day_selected) {
  background-color: var(--rdp-background-color);
}

.rdp-months {
  display: flex;
}

.rdp-month {
  margin: 0 1em;
}

.rdp-month:first-child {
  margin-left: 0;
}

.rdp-month:last-child {
  margin-right: 0;
}

.rdp-table {
  margin: 0;
  max-width: calc(var(--rdp-cell-size) * 7);
  border-collapse: collapse;
}

.rdp-with_weeknumber .rdp-table {
  max-width: calc(var(--rdp-cell-size) * 8);
  border-collapse: collapse;
}

.rdp-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  text-align: left;
}

.rdp-multiple_months .rdp-caption {
  position: relative;
  display: block;
  text-align: center;
}

.rdp-caption_dropdowns {
  position: relative;
  display: inline-flex;
}

.rdp-caption_label {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 0.25em;
  white-space: nowrap;
  color: currentColor;
  border: 0;
  border: 2px solid transparent;
  font-family: inherit;
  font-size: var(--rdp-caption-font-size);
  font-weight: bold;
}

.rdp-nav {
  white-space: nowrap;
}

.rdp-multiple_months .rdp-caption_start .rdp-nav {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.rdp-multiple_months .rdp-caption_end .rdp-nav {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.rdp-nav_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--rdp-cell-size);
  height: var(--rdp-cell-size);
  padding: 0.25em;
  border-radius: 100%;
}

/* ---------- */
/* Dropdowns  */
/* ---------- */
.rdp-dropdown_year,
.rdp-dropdown_month {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.rdp-dropdown {
  appearance: none;
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  cursor: inherit;
  opacity: 0;
  border: none;
  background-color: transparent;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

.rdp-dropdown[disabled] {
  opacity: unset;
  color: unset;
}

.rdp-dropdown:focus-visible:not([disabled]) + .rdp-caption_label {
  background-color: var(--rdp-background-color);
  border: var(--rdp-outline);
  border-radius: 6px;
}

.rdp-dropdown_icon {
  margin: 0 0 0 5px;
}

.rdp-head {
  border: 0;
}

.rdp-head_row,
.rdp-row {
  height: 100%;
}

.rdp-head_cell {
  vertical-align: middle;
  font-size: 0.75em;
  font-weight: 700;
  text-align: center;
  height: 100%;
  height: var(--rdp-cell-size);
  padding: 0;
  text-transform: uppercase;
}

.rdp-tbody {
  border: 0;
}

.rdp-tfoot {
  margin: 0.5em;
}

.rdp-cell {
  width: var(--rdp-cell-size);
  height: 100%;
  height: var(--rdp-cell-size);
  padding: 0;
  text-align: center;
}

.rdp-weeknumber {
  font-size: 0.75em;
}

.rdp-weeknumber,
.rdp-day {
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: var(--rdp-cell-size);
  max-width: var(--rdp-cell-size);
  height: var(--rdp-cell-size);
  margin: 0;
  border: 2px solid transparent;
  border-radius: 100%;
}

.rdp-day_today:not(.rdp-day_outside) {
  font-weight: bold;
}

.rdp-day_selected,
.rdp-day_selected:focus-visible,
.rdp-day_selected:hover {
  color: var(--rdp-selected-color);
  opacity: 1;
  background-color: var(--rdp-accent-color);
}

.rdp-day_outside {
  opacity: 0.5;
}

.rdp-day_selected:focus-visible {
  /* Since the background is the same use again the outline */
  outline: var(--rdp-outline);
  outline-offset: 2px;
  z-index: 1;
}

.rdp:not([dir=rtl]) .rdp-day_range_start:not(.rdp-day_range_end) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.rdp:not([dir=rtl]) .rdp-day_range_end:not(.rdp-day_range_start) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.rdp[dir=rtl] .rdp-day_range_start:not(.rdp-day_range_end) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.rdp[dir=rtl] .rdp-day_range_end:not(.rdp-day_range_start) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.rdp-day_range_end.rdp-day_range_start {
  border-radius: 100%;
}

.rdp-day_range_middle {
  border-radius: 0;
}