.Modal_backdrop_377 {
  position: fixed;
  display: flex;
  flex-direction: column;
  align-items: center;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: var(--zindexModalBackdrop);
  background-color: rgba(0, 0, 0, 0);
  transition: background-color 200ms; /* duration must match closeTimeoutMS prop */
}

.Modal_backdropAfterOpen_af5 {
  background-color: rgba(0, 0, 0, 0.8);
  transition-timing-function: ease-out;
}

.Modal_backdropBeforeClose_6d6 {
  background-color: rgba(0, 0, 0, 0);
  transition-timing-function: ease-in;
}

.Modal_body_6cc {
  position: relative;
  overflow-y: auto;
}

.Modal_body_6cc.Modal_globalPadding_244 {
    padding: var(--modalBodyPadding);
  }

/* If there is no modal footer, match a border radius so overflown content doesn't cause sharp corners */

.Modal_body_6cc:last-child {
    border-bottom-left-radius: var(--modalBorderRadius);
    border-bottom-right-radius: var(--modalBorderRadius);
  }

.Modal_bodyContainer_5de {
  opacity: 0;
  scale: 0.95;
  transition:
    scale 200ms,
    opacity 200ms; /* duration must match closeTimeoutMS prop */
}

.Modal_bodyContainerAfterOpen_ea1 {
  opacity: 1;
  scale: 1;
  transition-timing-function: ease-out;
}

.Modal_bodyContainerBeforeClose_845 {
  opacity: 0;
  scale: 0.95;
  transition-timing-function: ease-in;
}

.Modal_modal_1e0 {
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: var(--zindexModal);
  width: 560px;
  max-height: 80vh;
  margin-top: 10vh;
  background-color: var(--bgModalContent);
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: var(--modalBorderRadius);
  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  background-clip: padding-box;
  /* Remove focus outline from opened modal */
  outline: none;

  /* smaller screen height: give more vertical space */
}

@media (max-height: 600px) {

.Modal_modal_1e0 {
    margin-top: var(--spacing-32);
    max-height: calc(100vh - (var(--spacing-32) * 2));
}
  }

/* mobile: size12 around whole modal */

@media (max-width: 600px) {

.Modal_modal_1e0 {
    width: calc(100vw - (var(--spacing-12) * 2));
    margin-top: var(--spacing-12);
    max-height: calc(100vh - (var(--spacing-12) * 2));
}
  }


  .Icon_icon_416 * {
    fill: inherit;
  }

.Icon_BaseIcon_root_b54 {
  display: inline-block;
  fill: currentColor;
  flex: none;

  transition-property: fill;
  transition-timing-function: var(--easeInOutQuad);
  transition-duration: 100ms;
}

.Icon_BaseIcon_root_b54 > svg {
    display: block;
    height: inherit;
    width: inherit;
  }

.Icon_BaseIcon_block_262 {
  display: block;
}

.Icon_BaseIcon_noPointerEvents_939 {
  pointer-events: none;
}

@keyframes Loader_LoaderSvg_svgLoader_30e {
  0% {
    opacity: 1;
  }
  42% {
    opacity: 0.3;
  }
  100% {
    opacity: 0.3;
  }
}

/* A negative animation-delay causes the animation to begin immediately, but
   partway through its cycle, this prevents loader bars staying on their start
   frame (opacity 1) when the loader first appears:
   https://developer.mozilla.org/en-US/docs/Web/CSS/animation-delay */
.Loader_LoaderSvg_svg_15a path {
    animation: Loader_LoaderSvg_svgLoader_30e 1200ms infinite linear;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(1) {
    animation-delay: -1100ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(2) {
    animation-delay: -1000ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(3) {
    animation-delay: -900ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(4) {
    animation-delay: -800ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(5) {
    animation-delay: -700ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(6) {
    animation-delay: -600ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(7) {
    animation-delay: -500ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(8) {
    animation-delay: -400ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(9) {
    animation-delay: -300ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(10) {
    animation-delay: -200ms;
  }
.Loader_LoaderSvg_svg_15a path:nth-child(11) {
    animation-delay: -100ms;
  }

/*
 * Styles that are common to all buttons
 * https://www.figma.com/design/eflpAcOSTsb5Gbm0eizgJzSf/%F0%9F%A7%B1-Components?node-id=2234-71
 */
.Button_Button_base_cfa {
  --bgDefaultMutedHover: color-mix(in srgb, var(--bgDefaultMuted) 95%, #000000);
  --bgInformationalMutedHover: color-mix(
    in srgb,
    var(--bgInformationalMuted) 95%,
    #000000
  );
  --bgWarnMutedHover: color-mix(in srgb, var(--bgWarnMuted) 95%, #000000);
  --bgSuccessMutedHover: color-mix(in srgb, var(--bgSuccessMuted) 95%, #000000);
  --bgDangerMutedHover: color-mix(
    in srgb,
    var(--borderButtonDanger) 95%,
    #000000
  );

  --buttonIconColor: inherit;

  border-radius: 32px;

  /*
    Let us avoid styling borders to match background, if the background
    changes (hover, active)
  */
  background-clip: border-box;

  /* Override .Btn properties that we control here */
  border: 1px solid transparent;
  box-shadow: none;
}
.Button_Button_base_cfa:hover {
    color: var(--buttonHoverTextColor);
    border-color: var(--buttonHoverBorderColor, transparent);
    background-color: var(--buttonHoverBackgroundColor);
  }
:is(.Button_Button_base_cfa:active:not([disabled]),.Button_Button_base_cfa.Button_Button_isActive_a24),
    :is(.Button_Button_base_cfa:active:not([disabled]),.Button_Button_base_cfa.Button_Button_isActive_a24):hover,
    :is(.Button_Button_base_cfa:active:not([disabled]),.Button_Button_base_cfa.Button_Button_isActive_a24):focus {
      background-color: var(--buttonActiveBackgroundColor);
    }
.Button_Button_base_cfa .Button_Button_icon_1ec {
    color: var(--buttonIconColor);
  }

/* Priority styles */
.Button_Button_priorityPrimary_596 {
  font-weight: 600;
}

.Button_Button_priorityTertiary_74d {
  font-weight: 400;
}

.Button_Button_themeDestructive_1ed {
  font-weight: 500;
}

/**
  Compound
 */
.Button_Button_themeDefaultPriorityPrimary_426 {
  color: var(--colorTextNeutralWhite);
  background-color: var(--bgButtonPrimaryEnabled);

  --buttonIconColor: var(--colorTextNeutralWhite);
  --buttonHoverTextColor: var(--colorIconNeutralWhite);
  --buttonHoverBackgroundColor: var(--bgButtonPrimaryHover);
  --buttonActiveBackgroundColor: var(--bgButtonPrimaryPressed);

  /* default/primary buttons don't have a border so we need to add a separator for button groups */
  /* TODO: revisit once global BtnGroup CSS has been module-ified */
}
.BtnGroup .Button_Button_themeDefaultPriorityPrimary_426:not(:first-child) {
      border-left-color: var(--surfaceBackgroundDefault);
    }
.BtnGroup .Button_Button_themeDefaultPriorityPrimary_426:not(:last-child) {
      border-right-color: var(--surfaceBackgroundDefault);
    }

.Button_Button_themeDefaultPrioritySecondary_208 {
  color: var(--colorTextDefault);
  background-color: var(--surfaceBackgroundDefault);
  border-color: var(--borderDefault);

  --buttonHoverTextColor: var(--colorTextDefault);
  --buttonHoverBorderColor: var(--borderDefault);
  --buttonHoverBackgroundColor: var(--bgDefaultMuted);
  --buttonActiveBackgroundColor: var(--bgButtonDefaultPressed);

  /**
    This secondary/tertiary buttons have a different icon color.
  */
  --buttonIconColor: var(--colorIconDefault);
}

.Button_Button_themeDefaultPriorityTertiary_b61 {
  color: var(--colorTextDefault);
  background-color: var(--bgButtonBorderlessEnabled);
  --buttonHoverTextColor: var(--colorTextDefault);
  --buttonHoverBackgroundColor: var(--bgButtonBorderlessHover);
  --buttonActiveBackgroundColor: var(--bgButtonBorderlessPressed);

  /**
    This secondary/tertiary buttons have a different icon color.
  */
  --buttonIconColor: var(--colorIconDefault);

  /**
    NOTE: disabled+hover styles are difficult while we support the older themes
    Once https://github.com/closeio/close-ui/issues/16814 we can add a blanket
    :hover:not([disabled]) styles in one place.
  */
}

.Button_Button_themeDefaultPriorityTertiary_b61:disabled:hover {
    background-color: var(--bgButtonBorderlessEnabled);
  }

.Button_Button_themeDestructivePriorityPrimary_cde {
  color: var(--colorTextNeutralWhite);
  background-color: var(--bgDanger);
  border-color: var(--borderButtonDanger);
  --buttonHoverTextColor: var(--colorIconNeutralWhite);
  --buttonHoverBackgroundColor: var(--bgButtonDangerHover);
  --buttonActiveBackgroundColor: var(--bgButtonDangerPressed);
}

.Button_Button_themeDestructivePrioritySecondary_6cc {
  color: var(--colorTextDanger);
  background-color: var(--surfaceBackgroundDefault);
  border-color: var(--borderDefault);

  --buttonHoverBorderColor: var(--borderDefault);
  --buttonHoverBackgroundColor: var(--bgButtonDefaultHover);
  --buttonHoverTextColor: var(--colorTextDanger);
}

.Button_Button_themeDestructivePriorityTertiary_32a {
  color: var(--colorTextDanger);
  background-color: var(--bgButtonBorderlessEnabled);

  --buttonHoverBackgroundColor: var(--bgButtonBorderlessHover);
  --buttonHoverTextColor: var(--colorTextDanger);
}

.Button_Button_themeContrastPriorityPrimary_097 {
  color: var(--colorTextDanger);
  background-color: var(--colorTextNeutralWhite);
  --buttonHoverTextColor: var(--colorTextDanger);
}

.Button_Button_themeContrastPrioritySecondary_424 {
  color: var(--colorTextNeutralWhite);
  background-color: var(--bgDanger);
  --buttonHoverTextColor: var(--colorTextNeutralWhite);
  --buttonHoverBackgroundColor: var(--bgButtonDangerHover);
  --buttonActiveBackgroundColor: var(--bgButtonDangerHover);
}

.Button_Button_themeMutedPriorityTertiary_b9c {
  color: var(--colorTextMedium);
  background-color: var(--bgDefaultMuted);
  font-weight: 500;
  --buttonHoverTextColor: var(--colorTextMedium);
  --buttonHoverBackgroundColor: var(--bgDefaultMutedHover);
  --buttonActiveBackgroundColor: var(--bgDefaultMutedHover);
}

.Button_Button_themeInformationalPriorityTertiary_f49 {
  color: var(--colorTextInformational);
  background-color: var(--bgInformationalMuted);
  --buttonHoverTextColor: var(--colorTextInformational);
  --buttonHoverBackgroundColor: var(--bgInformationalMutedHover);
  --buttonActiveBackgroundColor: var(--bgInformationalMutedHover);
}

.Button_Button_themeWarnPriorityTertiary_ccf {
  color: var(--colorTextWarn);
  background-color: var(--bgWarnMuted);
  --buttonHoverTextColor: var(--colorTextWarn);
  --buttonHoverBackgroundColor: var(--bgWarnMutedHover);
  --buttonActiveBackgroundColor: var(--bgWarnMutedHover);
}

.Button_Button_themeSuccessPriorityTertiary_124 {
  color: var(--colorTextSuccess);
  background-color: var(--bgSuccessMuted);
  --buttonHoverTextColor: var(--colorTextSuccess);
  --buttonHoverBackgroundColor: var(--bgSuccessMutedHover);
  --buttonActiveBackgroundColor: var(--bgSuccessMutedHover);
}

/**
 * There's a lot of interesting CSS stuff going on in here to get the effect
 * of both the border having a gradient, and having a border radius.
 *
 * For the border gradient with radius, which is not directly supported, I was
 * inspired by https://dev.to/afif/border-with-gradient-and-radius-387f
 */
.Button_Button_themeGradientPrimary_68a {
  --gradient: linear-gradient(to right, #2e99de, #dd0f21);
  --buttonHoverBackgroundColor: var(--bgDefaultMuted);
  --buttonActiveBackgroundColor: var(--bgDefault);

  font-weight: 400;

  /* Allow the ::before pseudo-element to position itself absolutely. */
  position: relative;

  background-color: transparent;
}
.Button_Button_themeGradientPrimary_68a::before {
    content: '';

    /* Completely fill the area the actual component fills. */
    position: absolute;
    inset: 0;

    /* A bit of negative margin to push the border out to where it would be
       * if it were a real border.
       */
    margin: -1px;

    /* Match the border radius of button */
    border-radius: 32px;

    /* A bit of padding so the background can show. */
    padding: 1px;

    /* The background is exposed a bit on the edges to simulate a border. */
    background: var(--gradient);

    /* Mask away the inner part of the button so the background doesn't show.
       */
    -webkit-mask:
      linear-gradient(#000 0 0) content-box,
      linear-gradient(#000 0 0);
            mask:
      linear-gradient(#000 0 0) content-box,
      linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
  }

/* needs specificity to override UnstyledButton */
button.Button_LinkButton_linkButton_9c6 {
  /* for the outline */
  border-radius: 2px;
  text-underline-offset: 3px;

  white-space: nowrap;
}
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_inline_a18 {
    color: var(--colorLinkDefault);
  }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_inline_a18:hover:not([disabled]) {
      -webkit-text-decoration: underline;
      text-decoration: underline;
      color: var(--colorLinkHover);
    }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_secondary_0d0 {
    color: var(--colorTextLight);
  }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_secondary_0d0:hover:not([disabled]) {
      color: var(--colorLinkHover);
      -webkit-text-decoration: underline;
      text-decoration: underline;
    }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_contrast_d07 {
    color: var(--colorTextDefault);
    -webkit-text-decoration: underline;
    text-decoration: underline;
  }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_contrast_d07:hover:not([disabled]) {
      color: var(--colorLinkHover);
    }
button.Button_LinkButton_linkButton_9c6[disabled] {
    cursor: not-allowed;
  }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_small_eb4 {
    font-size: var(--fontSizeSmall);
  }
button.Button_LinkButton_linkButton_9c6.Button_LinkButton_smallest_2a0 {
    font-size: var(--fontSizeTiny);
  }
button.Button_LinkButton_linkButton_9c6:focus {
    outline-color: var(--borderFocused);
  }

@layer atom {
  .Button_UnstyledButton_button_308 {
    font: inherit;
    margin: 0;
    line-height: normal;
    vertical-align: inherit;
    border: none;
    padding: 0;
    width: auto;
    overflow: visible;
    background: transparent;
    text-align: inherit;
    color: inherit;

    /* Corrects font smoothing for webkit */
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;

    /* Corrects inability to style clickable `input` types in iOS */
    -webkit-appearance: none;
  }
}

.Loader_fullscreen_a5d {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 3; /* above lead page stuff and below search input */
}

.Loader_svgLoader_6af {
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-right: 2px;
  vertical-align: -3px;
}

.KeyboardShortcut_KeyboardShortcut_key_97e {
  background-color: var(--bgDefault);
  border-radius: var(--baseBorderRadius);
  color: var(--colorTextDefault);
  font-size: var(--fontSizeTiny);
  font-weight: var(--fontWeightBold);
  line-height: 12px;
  padding: var(--spacing-4);
  text-transform: uppercase;
}

.KeyboardShortcut_KeyboardShortcut_dark_d4f {
  background-color: var(--colorBgTooltipKey);
  color: var(--colorTextNeutralWhite);
}

.Tooltip_tooltip_a57 {
  width: max-content;
  word-wrap: break-word;
  opacity: 0.95;
  z-index: var(--zIndexTooltips);
  background: var(--colorBgTooltip);
  padding: 7px;
  border-radius: 3px;
}

.Tooltip_tooltip_a57[data-placement^='bottom'] .Tooltip_arrow_622 {
    top: -2px;
  }

.Tooltip_tooltip_a57[data-placement^='top'] .Tooltip_arrow_622 {
    bottom: -2px;
  }

.Tooltip_tooltip_a57[data-placement^='left'] .Tooltip_arrow_622 {
    right: -2px;
  }

.Tooltip_tooltip_a57[data-placement^='right'] .Tooltip_arrow_622 {
    left: -2px;
  }

.Tooltip_tooltip_a57[data-reference-hidden='true'] {
    visibility: hidden;
  }

.Tooltip_content_810 {
  font-size: 11px;
  line-height: 1.5;
  color: var(--colorTextNeutralWhite);
  text-align: center;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  text-wrap: balance;
}

.Tooltip_content_810 a {
    color: inherit;
  }

.Tooltip_truncatedContent_cfb {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.Tooltip_arrow_622 {
  fill: var(--colorBgTooltip);
}

.Tooltip_TruncateText_truncated_51b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* so dots have correct color */
  color: currentColor;
}

.subcomponents_footerComponents_footer_412 {
  padding: 14px 15px 15px;
  margin-bottom: 0;
  background-color: var(--bgModalFooter);
  border-radius: 0 0 var(--modalBorderRadius) var(--modalBorderRadius);
  border-top: 1px solid var(--borderDefault);

  display: flex;
  text-align: left;
  align-items: center;
}

@media screen and (max-width: 767px) {

.subcomponents_footerComponents_footer_412 {
    flex-direction: column;
    align-items: stretch;
    padding-bottom: 0;
}
  }

.subcomponents_footerComponents_subActions_d3a {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
}

@media screen and (max-width: 767px) {

.subcomponents_footerComponents_subActions_d3a {
    order: 2;
    border-top: 1px solid var(--borderDefault);
    justify-content: center;
    padding: var(--spacing-16) 0;
}
  }

.subcomponents_footerComponents_actions_e1c {
  display: flex;
  gap: var(--spacing-4);
  margin-left: auto;
}

@media screen and (max-width: 767px) {

.subcomponents_footerComponents_actions_e1c {
    order: 1;
    padding: 0 0 var(--spacing-16) 0;
}
  }

.subcomponents_footerComponents_actionsLoader_b26 {
  display: inline-block;
  margin-right: 10px;
}

.subcomponents_footerComponents_disabledButton_69f {
  /* We need this so that a tooltip works properly over a disabled button.
     Workaround for https://github.com/facebook/react/issues/4251 */
  pointer-events: none;
}

@layer atom {
  .IconSVG {
    line-height: 0;
    vertical-align: middle;
  }

  .IconSVG--inlineBlock {
    display: inline-block;
    vertical-align: text-bottom;
  }

  .IconSVG--tiny svg {
    width: 8px;
  }

  .IconSVG--mini svg {
    width: 12px;
  }

  .IconSVG--small svg {
    width: 14px;
  }

  .IconSVG--regular svg {
    width: 16px;
  }

  .IconSVG--large svg {
    width: 20px;
  }

  .IconSVG--fluid svg {
    width: 100%;
  }
}

.HintIcon_hintIcon_680 {
  margin: 0 var(--spacing-4);
  align-self: center;
  color: var(--colorIconDefault);
}.HintIcon_hintIcon_680.HintIcon_light_4e9 {
    color: var(--colorIconLight);
  }.HintIcon_hintIcon_680.HintIcon_error_789 {
    color: var(--colorTextDanger);
  }

/* Colors */
.Typography_defaultColor_913 {
  color: var(--colorTextDefault);
}
.Typography_mediumColor_366 {
  color: var(--colorTextMedium);
}
.Typography_lightColor_c84 {
  color: var(--colorTextLight);
}
.Typography_errorColor_5c9 {
  color: var(--colorTextDanger);
}
.Typography_linkColor_354 {
  color: var(--colorLinkDefault);
}
.Typography_invertedColor_12c {
  color: var(--colorTextNeutralInvert);
}

.Typography_aiGradientColor_8e9 {
  background-image: var(--colorLinearGradientAi);
  color: transparent;
  -webkit-background-clip: text;
          background-clip: text;
}

.Typography_neutralWhiteColor_8cc {
  color: var(--colorTextNeutralWhite);
}

/* Weights */
.Typography_defaultWeight_1e7 {
  font-weight: normal;
}
.Typography_mediumWeight_c61 {
  font-weight: var(--fontWeightMedium);
}
.Typography_boldWeight_34c {
  font-weight: var(--fontWeightBold);
}

.Typography_displayText_ae0 {
  margin: 0;
  font-weight: 700;
}

.Typography_displayText_ae0.Typography_medium_368,
  .Typography_displayText_ae0.Typography_large_00c {
    font-size: var(--headingSizeDisplay);
    line-height: 32px;
  }

@media screen and (min-width: 768px) {
    .Typography_displayText_ae0.Typography_large_00c {
      font-size: var(--headingSizeSuper);
      line-height: 40px;
    }
  }

.Typography_heading_f6b {
  margin: 0;
}

.Typography_heading_f6b.Typography_small_250 {
    font-size: var(--fontSizeBase);
    line-height: 18px;
    font-weight: var(--fontWeightBold);
  }

.Typography_heading_f6b.Typography_medium_368 {
    font-size: var(--headingSizeMedium);
    line-height: 20px;
    font-weight: 700;
  }

.Typography_heading_f6b.Typography_large_00c {
    font-size: var(--headingSizeLarge);
    line-height: 24px;
    font-weight: 700;
  }

.Typography_caption_570 {
  line-height: 16px;
}

.Typography_caption_570.Typography_small_250 {
    font-size: var(--fontSizeTiny); /* uiText smallest */
  }

.Typography_caption_570.Typography_medium_368 {
    font-size: var(--fontSizeSmall);
  }

.Typography_uiText_1ae {
  line-height: 16px;
}

.Typography_uiText_1ae.Typography_x-small_769 {
    font-size: 11px;
  }

.Typography_uiText_1ae.Typography_smallest_34b {
    font-size: 12px;
  }

.Typography_uiText_1ae.Typography_small_250 {
    font-size: 13px;
  }

.Typography_uiText_1ae.Typography_base_7c8 {
    font-size: 14px;
  }

/* when text is uppercase, it renders at smaller sizes */

.Typography_uiText_1ae.Typography_uppercase_d36 {
    text-transform: uppercase;
    letter-spacing: 0.25px;
    font-feature-settings:
      'pnum' on,
      'lnum' on,
      'cv09' on;
  }

.Typography_uiText_1ae.Typography_uppercase_d36.Typography_x-small_769 {
      font-size: 9px;
    }

.Typography_uiText_1ae.Typography_uppercase_d36.Typography_smallest_34b {
      font-size: 10px;
    }

.Typography_uiText_1ae.Typography_uppercase_d36.Typography_small_250 {
      font-size: 11px;
    }

.Typography_uiText_1ae.Typography_uppercase_d36.Typography_base_7c8 {
      font-size: 12px;
    }

.Typography_uiText_1ae.Typography_regularWeight_cb9 {
    font-weight: var(--fontWeightRegular);
  }

.Typography_uiText_1ae.Typography_mediumWeight_c61 {
    font-weight: var(--fontWeightMedium);
  }

.Typography_uiText_1ae.Typography_boldWeight_34c {
    font-weight: var(--fontWeightBold);
  }

.Typography_uiText_1ae.Typography_italic_012 {
    font-style: italic;
  }

.Typography_uiText_1ae.Typography_underline_59a {
    -webkit-text-decoration: underline;
    text-decoration: underline;
  }

.Typography_uiText_1ae.Typography_noWrap_96f {
    white-space: nowrap;
  }

.Typography_uiText_1ae.Typography_breakWord_dfa {
    word-break: break-word;
  }

.Typography_uiText_1ae.Typography_numeric_482 {
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
  }

.Typography_uiText_1ae.Typography_balanced_6ed {
    text-wrap: balance;
  }

.Typography_overflowEllipsis_861 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Typography_pointerCursor_0ad {
  cursor: pointer;
}

/*
BodyText
https://www.figma.com/design/VnqOXvCvPMLQbBCrZs4eLdYf/%F0%9F%94%A0-Typography?node-id=11-3&m=dev
*/
.Typography_bodyText_fbd {
  line-height: 1.5;
  margin: 0;
}
.Typography_bodyText_fbd.Typography_large_00c {
    font-size: var(--headingSizeLarge);
  }
.Typography_bodyText_fbd.Typography_base_7c8 {
    font-size: var(--fontSizeBase);
  }
.Typography_bodyText_fbd.Typography_small_250 {
    font-size: var(--fontSizeSmall);
  }
.Typography_bodyText_fbd.Typography_smallest_34b {
    font-size: var(--fontSizeTiny);
  }
.Typography_bodyText_fbd.Typography_regularWeight_cb9 {
    font-weight: var(--fontWeightRegular);
  }
.Typography_bodyText_fbd.Typography_boldWeight_34c {
    font-weight: var(--fontWeightBold);
  }

.subcomponents_ModalBanner_main_1dd {
  padding: var(--spacing-16);
  display: flex;
  align-items: flex-start;
}

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_info_04e {
    background: var(--bgInformationalMuted);
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_danger_47b {
    background: var(--bgDangerMuted);
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_bottomBorder_115 {
    border-bottom: 1px solid var(--borderDefault);
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_noVerticalPadding_321 {
    padding-bottom: 0;
    padding-top: 0;
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_withIllustration_aee {
    padding-bottom: 0;
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_ignoreGlobalPadding_3fe {
    margin: calc(var(--modalBodyPadding) * -1);
  }

.subcomponents_ModalBanner_main_1dd.subcomponents_ModalBanner_ignoreGlobalPadding_3fe:has(+ *) {
      margin-bottom: var(--modalBodyPadding);
    }

.subcomponents_ModalBanner_icon_a35 {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  background: var(--bgLight);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin-right: 12px;
}

.subcomponents_ModalBanner_content_609 {
  flex: 0 1 100%;
}

.subcomponents_ModalBanner_headerTooltip_cb6 {
  /* Nudge the tooltip into place. */
  display: inline-flex;
  position: relative;
  top: 3px;
}

.subcomponents_ModalBanner_body_fe0 {
  color: var(--colorTextMedium);

  /* If there is a prior sibling (eg a title), we want a little extra spacing
     before the body */
}

.subcomponents_ModalBanner_body_fe0:not(:first-child) {
    margin-top: 2px;
  }

.subcomponents_ModalBanner_withIllustration_aee .subcomponents_ModalBanner_body_fe0:not(:first-child) {
      padding-bottom: var(--spacing-16);
    }

.subcomponents_ModalBanner_illustration_cdf {
  align-self: flex-end;
  line-height: 0;
  padding-left: var(--spacing-16);
  width: var(--illustrationWidth, 105px);
}

.subcomponents_ModalForm_form_e8f {
  box-sizing: border-box;

  /* override global */
  margin: 0;

  /* fill height so child components behave as though this extra element wasn't there */
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.subcomponents_ModalHeader_header_e03 {
  border-bottom: 1px solid var(--borderDefault);
  background-color: var(--bgModalHeader);
  border-top-left-radius: var(--modalBorderRadius);
  border-top-right-radius: var(--modalBorderRadius);
}

.subcomponents_ModalHeader_header_e03 h3 {
    margin: 0;
    line-height: 20px;
    font-size: 16px;
    font-weight: 700;
  }

.subcomponents_ModalHeader_header_e03 .Modal__closeCrossBtn {
    margin-top: 0;
  }

.subcomponents_ModalHeader_headerInner_80c {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-12) var(--modalBodyPadding);
}

.subcomponents_ModalHeader_closeButton_d3d {
  color: var(--colorIconLight);
}

.subcomponents_ModalHeader_closeButton_d3d:disabled {
    pointer-events: none;
  }

.subcomponents_ModalHeader_closeButton_d3d:disabled:hover,
    .subcomponents_ModalHeader_closeButton_d3d:disabled:focus {
      opacity: 0.2; /* keep opacity the same as if un-hovered */
    }

.subcomponents_ModalHeader_tabsContainer_7cc {
  padding: 0 var(--modalBodyPadding);
  margin-bottom: -1px; /* merge bottom borders of tabs and header */
}

@layer atom {
  .Input_fieldContainer_879 {
    width: 100%;
    position: relative;

    /* Large size */
    --fontSize: var(--inputFontSizeLarge);
    --inputHeight: var(--inputHeightLarge);
    --verticalPadding: var(--inputVerticalPaddingLarge);
    --horizontalPadding: var(--inputHorizontalPaddingLarge);
    --prefixSuffixGap: 12px;

    /* Defaults */
    --iconWidth: 16px;
    --paddingLeft: var(--horizontalPadding);
    --paddingRight: var(--horizontalPadding);
  }

  .Input_fieldContainerSmall_9cc {
    --fontSize: var(--inputFontSizeSmall);
    --inputHeight: var(--inputHeightSmall);
    --verticalPadding: var(--inputVerticalPaddingSmall);
    --horizontalPadding: var(--inputHorizontalPaddingSmall);
    --prefixSuffixGap: 8px;
  }

    .Input_fieldContainerSmall_9cc .Input_textarea_812 {
      height: inherit;
    }

  .Input_fieldContainerTiny_4f1 {
    --fontSize: var(--inputFontSizeTiny);
    --inputHeight: var(--inputHeightTiny);
    --verticalPadding: var(--inputVerticalPaddingTiny);
    --horizontalPadding: var(--inputHorizontalPaddingTiny);
    --prefixSuffixGap: 6px;
  }

    .Input_fieldContainerTiny_4f1 .Input_textarea_812 {
      height: inherit;
    }

  .Input_fieldPrefix_905,
  .Input_fieldSuffix_a90 {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: normal;
    box-sizing: border-box;
    font-size: var(--fontSize);
    color: var(--colorTextLight);
  }

  .Input_fieldPrefix_905 {
    width: var(--iconWidth);
    left: var(--horizontalPadding);
    pointer-events: none;
  }

  .Input_fieldSuffix_a90 {
    /* we have some suffixes bigger than the default size, i.e. "seconds" */
    min-width: var(--iconWidth);
    right: var(--horizontalPadding);
  }

    .Input_fieldSuffix_a90.Input_nonInteractive_30e {
      pointer-events: none;
    }
    .Input_fieldContainerWithPrefix_f83 .Input_input_30e {
      --paddingLeft: calc(
        var(--horizontalPadding) + var(--iconWidth) + var(--prefixSuffixGap)
      );
    }
    .Input_fieldContainerWithSuffix_372 .Input_input_30e {
      --paddingRight: calc(
        var(--horizontalPadding) + var(--iconWidth) + var(--prefixSuffixGap)
      );
    }

  .Input_textarea_812,
  .Input_input_30e {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    display: block;
    text-align: inherit;
    font-size: var(--fontSize);
    height: var(--inputHeight);
    /* Deliberately don't assign padding to fixed height inputs */
    padding: 0 var(--paddingRight) 0 var(--paddingLeft);

    color: var(--colorTextDefault);
    background-color: var(--formBackground);
    border-radius: var(--baseInputBorderRadius);
    border: 1px solid var(--borderDefault);
    box-shadow: none;
  }

    .Input_textarea_812[aria-invalid='true'], .Input_input_30e[aria-invalid='true'] {
      border-color: var(--borderDanger);
    }

    .Input_textarea_812:focus, .Input_input_30e:focus {
      outline: 0;
      border-color: var(--borderFocused);
    }

    .Input_textarea_812[disabled], .Input_input_30e[disabled] {
      cursor: not-allowed;
      background-color: var(--formBackgroundDisabled);
    }

  .Input_textarea_812 {
    /* Assign vertical padding to textareas only */
    padding-top: var(--verticalPadding);
    padding-bottom: var(--verticalPadding);
  }

  .Input_input_30e[type='number']::-webkit-outer-spin-button,
  .Input_input_30e[type='number']::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .Input_input_30e[type='number'] {
    -moz-appearance: textfield; /* Firefox */
  }

  .Input_inlineInputWrapper_e11 {
    position: relative;
  }

    .Input_inlineInputWrapper_e11 > .Input_fieldPrefix_905 {
      z-index: 1;
    }

    .Input_inlineInputWrapper_e11 input.Input_inlineInput_f51 {
      border: none;
      height: 20px;
      padding: 0;
      border-radius: 0px;
    }

      .Input_inlineInputWrapper_e11 input.Input_inlineInput_f51.Input_withPrefix_818 {
        padding-left: calc(var(--iconWidth) + var(--prefixSuffixGap));
      }
    .Input_inlineInputLarge_f07 input.Input_inlineInput_f51 {
      font-size: var(--fontSizeBase);
      font-weight: var(--fontWeightBold);
      --prefixSuffixGap: 14px;
    }

    .Input_inlineInputLarge_f07 > .Input_fieldPrefix_905 {
      font-size: var(--fontSizeBase);
      font-weight: var(--fontWeightBold);
    }
    .Input_inlineInputSmall_58a input.Input_inlineInput_f51 {
      font-size: var(--fontSizeSmall);
      --prefixSuffixGap: 10px;
    }

    .Input_inlineInputSmall_58a > .Input_fieldPrefix_905 {
      font-size: var(--fontSizeSmall);
    }

  .Input_textareaWrapper_67c {
    position: relative;
  }

  .Input_characterCounter_05f {
    position: absolute;
    bottom: 8px;
    right: 8px;
    pointer-events: none;
  }
}

@layer atom {
  .Badge_outer_d44 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;

    border-radius: 50px;
    line-height: 12px;
    max-width: 100%;
    min-height: 20px;
  }

    .Badge_outer_d44 * {
      box-sizing: border-box;
    }

    .Badge_outer_d44.Badge_noShrink_e77 {
      flex-shrink: 0;
    }

  .Badge_root_153 {
    --bgColor: var(--bgDefault);
    --color: var(--colorTextDefault);
    --borderColor: var(--bgColor);
  }

  .Badge_badge_eae {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.25px;
    font-weight: var(--fontWeightBold);
    color: var(--colorTextDefault);

    /*
    We don't want any default text-shadows to be set on the Badge.
    Remove any shadow set by eg. Message component
  */
    text-shadow: none;
  }

    .Badge_badge_eae .Badge_inner_7ae {
      min-width: 20px;
    }

  .Badge_inner_7ae {
    border: 1px solid var(--borderColor);
    background-color: var(--bgColor);
    color: var(--color);
    border-radius: 50px;
  }

    .Badge_inner_7ae.Badge_hasPrefix_dbf {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border-left: none;
    }

  .Badge_icon_bab {
    margin-right: 4px;
    display: inline-block;
    height: 12px;
  }

    .Badge_icon_bab svg {
      width: 12px;
      height: 12px;
      vertical-align: bottom;
    }

  .Badge_padded_ad5 {
    padding: 3px 7px;
  }

  .Badge_small_93e {
    font-size: 10px;
    min-width: 16px;
    line-height: 10px;
    min-height: 16px;
  }

    .Badge_small_93e .Badge_inner_7ae {
      min-height: 16px;
      min-width: 16px;
    }

    .Badge_small_93e .Badge_padded_ad5 {
      padding: 2px 4px;
    }

    .Badge_small_93e .Badge_icon_bab {
      margin-right: 5px;
      height: 10px;
    }
      .Badge_small_93e .Badge_icon_bab svg {
        width: 10px;
        height: 10px;
      }

  .Badge_isCircle_3b7 {
    text-align: center;
  }

    .Badge_isCircle_3b7 .Badge_padded_ad5 {
      padding: 3px 1px;
    }
      .Badge_isCircle_3b7.Badge_small_93e .Badge_padded_ad5 {
        padding: 2px;
      }

    .Badge_isCircle_3b7 .Badge_icon_bab {
      margin: 0;
    }

  .Badge_default_89d {
    --bgColor: var(--borderDefault);

    /* only default & inverted style supports an outline atm */
  }
    .Badge_default_89d.Badge_outlined_e1a {
      --bgColor: var(--bgLight);
      --borderColor: var(--borderDefault);
    }

  .Badge_inner_7ae,
  .Badge_prefix_ae7 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1 1 50%;
    max-width: max-content;
  }

  .Badge_prefix_ae7 {
    color: var(--colorTextDefault);
    background-color: var(--surfaceBackgroundDefault);
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    border: 1px solid var(--borderDefault);
    border-right: 0;
  }

  .Badge_default_89d {
    --bgColor: var(--bgDefault);
  }

  .Badge_info_fad,
  .Badge_danger_de0 {
    --color: var(--colorTextNeutralWhite);
  }

  .Badge_info_fad {
    --bgColor: var(--bgInformational);
  }

    .Badge_info_fad.Badge_outlined_e1a {
      --borderColor: var(--surfaceBackgroundDefault);
    }

  .Badge_warning_bff {
    --bgColor: var(--bgWarn);
    --color: var(--colorTextNeutralBlack);
  }

  .Badge_warningLight_61e {
    --bgColor: var(--bgWarn);
    --color: var(--colorTextNeutralInvert);
  }

  .Badge_danger_de0 {
    --bgColor: var(--bgDanger);
  }

  .Badge_success_853 {
    --bgColor: var(--bgSuccess);
    --color: var(--colorTextNeutralBlack);
  }

  .Badge_successLight_12a {
    --bgColor: var(--bgSuccess);
    --color: var(--colorTextNeutralInvert);
  }

  .Badge_defaultMuted_385 {
    --bgColor: var(--bgDefaultMuted);
  }

  .Badge_infoMuted_ef6 {
    --bgColor: var(--bgInformationalMuted);
    --color: var(--colorTextInformational);
  }

  .Badge_warningMuted_665 {
    --bgColor: var(--bgWarnMuted);
    --color: var(--colorTextWarn);
  }

  .Badge_dangerMuted_99f {
    --bgColor: var(--bgDangerMuted);
    --color: var(--colorTextDanger);
  }

  .Badge_successMuted_a5c {
    --bgColor: var(--bgSuccessMuted);
    --color: var(--colorTextSuccess);
  }

  .Badge_active_dd0 {
    --bgColor: var(--bgActive);
    --color: var(--colorTextNeutralWhite);
  }

  .Badge_activeMuted_b22 {
    --bgColor: var(--bgActiveMuted);
    --color: var(--colorLinkDefault);
  }

  .Badge_inverted_896 {
    --bgColor: var(--bgLight);
  }

    .Badge_inverted_896.Badge_outlined_e1a {
      --borderColor: var(--borderDefault);
    }

  .Badge_task_33b {
    --bgColor: var(--colorBgBadgeTask);
    --color: var(--colorTextNeutralWhite);
  }

  .Badge_meeting_e69 {
    --bgColor: var(--colorBgBadgeMeeting);
    --color: var(--colorTextNeutralWhite);
  }

  .Badge_active-opportunity_6f7 {
    --bgColor: var(--colorBgOpportunityActive);
    --color: var(--colorTextOpportunityActive);
  }

  .Badge_won-opportunity_41f {
    --bgColor: var(--colorBgOpportunityWon);
    --color: var(--colorTextOpportunityWon);
  }

  .Badge_lost-opportunity_9f5 {
    --bgColor: var(--bgDefault);
  }
}

@layer atom {
  .SearchInput_search_55f {
    position: relative;
  }

    .SearchInput_search_55f .SearchInput_searchInput_73a.SearchInput_searchInput_73a {
      background-color: var(--bgSearchEnabled);
      border: 1px solid transparent;
      box-shadow: none;
    }

      .SearchInput_search_55f .SearchInput_searchInput_73a.SearchInput_searchInput_73a.SearchInput_themeBright_143 {
        background-color: var(--bgSearchActive);
        border-color: var(--borderDefault);
      }

      .SearchInput_search_55f .SearchInput_searchInput_73a.SearchInput_searchInput_73a:hover {
        background-color: var(--bgSearchHover);
      }

      .SearchInput_search_55f .SearchInput_searchInput_73a.SearchInput_searchInput_73a:focus {
        background-color: var(--bgSearchActive);
        border-color: var(--borderFocused);
      }

      .SearchInput_search_55f .SearchInput_searchInput_73a.SearchInput_searchInput_73a[aria-invalid='true'] {
        border-color: var(--borderDanger);
      }

  .SearchInput_searchIcon_7ba {
    color: var(--colorIconDefault);
    cursor: pointer;

    /* allow clicks to pass through & focus the input */
    pointer-events: none;
  }

  .SearchInput_clearIcon_a90 {
    cursor: pointer;
    color: var(--colorIconDefault);
    opacity: 0.8;
  }

    .SearchInput_clearIcon_a90:hover {
      opacity: 1;
    }

  .SearchInput_searchInput_73a:placeholder-shown + *:has(.SearchInput_clearIcon_a90) > .SearchInput_clearIcon_a90 {
    display: none;
  }
}

:root {
  /* Global vars so subcomponents can be used independently of wrapper */
  --switchToggleWidth: 30px;
  --switchToggleHeight: 16px;
  --switchToggleDotSize: 12px;
  --switchToggleDotOffset: 1px;
}

.Switch_wrapper_837 {
  display: inline-flex;
  padding: 6px 0;
  line-height: var(--switchToggleHeight);
}

.Switch_wrapper_837.Switch_noPadding_3da {
    padding: 0;
  }

.Switch_label_658 {
  display: inline-flex;
  margin: 0;
  gap: 8px;
  line-height: var(--switchToggleHeight);
}

.Switch_label_658.Switch_disabled_b61 {
    opacity: var(--disabledOpacity);
    cursor: not-allowed;
  }

.Switch_labelText_64b {
  display: flex;
  align-items: center;
}

.Switch_inputWrapper_4f3 {
  display: block;
  position: relative;
  height: var(--switchToggleHeight);
  min-width: var(--switchToggleWidth);
  width: var(--switchToggleWidth);
  border-radius: var(--switchToggleHeight);
  background-color: var(--bgFormControlToggleEnabledUnchecked);
  border: 1px solid transparent;
  box-sizing: border-box;
}

.Switch_inputWrapper_4f3:focus-within {
    border-color: var(--formBorderFocused);
    box-shadow: 0 0 0 2px
    color-mix(in srgb, transparent 50%, var(--formBorderFocused));
  }

.Switch_inputWrapper_4f3::before,
  .Switch_inputWrapper_4f3::after {
    content: '';
    position: absolute;
    display: block;
    transition: 200ms var(--standardCurve);
  }

.Switch_inputWrapper_4f3::before {
    height: var(--switchToggleHeight);
    width: var(--switchToggleHeight);
    top: -1px;
    left: -1px;
    border-radius: var(--switchToggleHeight);
  }

.Switch_inputWrapper_4f3::after {
    height: var(--switchToggleDotSize);
    width: var(--switchToggleDotSize);
    top: var(--switchToggleDotOffset);
    left: var(--switchToggleDotOffset);
    border-radius: var(--switchToggleDotSize);
    background: var(--fillFormControlEnabled);
  }

.Switch_inputWrapper_4f3.Switch_checked_a34::before {
      width: var(--switchToggleWidth);
      background: var(--bgFormControlEnabledChecked);
    }

.Switch_inputWrapper_4f3.Switch_checked_a34::after {
      left: calc(var(--switchToggleWidth) - var(--switchToggleDotSize) - 3px);
    }

.Switch_input_5bb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  margin: 0;
  padding: 0;
}

@keyframes Skeletons_skeleton_d15 {
  0% {
    background-color: var(--fromBg);
  }
  100% {
    background-color: var(--toBg);
  }
}

.Skeletons_skeleton_d15 {
  --fromBg: var(--colorFillTransparent02);
  --toBg: var(--colorFillTransparent05);
  /* keep in sync with useStaggeredAnimation */
  --animationLength: 0.5s;

  border-radius: 3px;

  background-color: var(--fromBg);
  animation: Skeletons_skeleton_d15 var(--animationLength) infinite alternate;
  animation-delay: inherit;
}

.Skeletons_skeleton_d15.Skeletons_dark_b4c {
  --fromBg: var(--colorFillTransparent05);
  --toBg: var(--colorFillTransparent10);
}

/**
 * Box/Text
 */

.Skeletons_box_52e {
  display: block;
  max-width: 100%;
  height: 1.2em;
  font-size: 1rem;
}

.Skeletons_box_52e:not(:last-child):not(.Skeletons_inline_fd4) {
    margin-bottom: 0.25em;
  }

.Skeletons_fullWidth_b53 {
  width: 100%;
}

/**
 * Icon
 */

.Skeletons_icon_d49 {
  display: block;
}

.Skeletons_rounded_604 {
  border-radius: 50%;
}

/**
 * Common
 */

.Skeletons_inline_fd4 {
  display: inline-block;
  vertical-align: middle;
}

.Popover_popover_723 {
  --popoverBorderRadius: 7px;
  background-clip: padding-box;
  border-radius: var(--popoverBorderRadius);
  border: 1px solid var(--borderDefault);
  box-shadow: var(--shadowLevel3);
  display: flex;
  flex-direction: column;
  color: var(--colorTextDefault);
  line-height: 20px;
  background-color: var(--bgPopover);
  max-height: 70vh;
  position: relative;
  z-index: 10000;
}

.Popover_popover_723.Popover_overflowHidden_cb6 {
    overflow: hidden;
  }

/* the element to which the popover is attached has left the viewport */

.Popover_popover_723[data-reference-hidden='true'],
  
  .Popover_popover_723[data-eager-hidden='true'] {
    visibility: hidden;
    /* ensure hidden popovers do not impact layout */
    position: fixed !important;
  }

.Popover_scrollContainer_e27 {
  position: relative;
  z-index: 2;
  overflow-y: auto;
}

.Popover_contentWithPadding_0fa {
  padding: 8px 14px;
}

.Popover_popoverHeader_542,
.Popover_popoverFooter_a37 {
  /* let popover content dictate how wide header/footer should be */
  width: min-content;
  min-width: 100%;
  position: relative;
  box-sizing: border-box;
  z-index: 2;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
}

.Popover_headerWithPadding_933,
.Popover_footerWithPadding_e2a {
  padding: 8px 14px;
}

.Popover_popoverHeader_542 {
  border-bottom: 1px solid var(--borderDefault);
  border-top-left-radius: calc(var(--popoverBorderRadius) - 1px);
  border-top-right-radius: calc(var(--popoverBorderRadius) - 1px);
}

.Popover_popoverHeader_542.Popover_whiteBackground_087 {
    background-color: var(--bgPopover);
  }

.Popover_popoverHeader_542.Popover_grayBackground_c23 {
    /* TODO [darkmode] this ends up darker than the BG in dark mode *
    /* TODO this is used only once, in the phone settings popover */
    background-color: var(--surfaceBackgroundMedium);
  }

.Popover_popoverFooter_a37 {
  border-top: 1px solid var(--borderDefault);
  border-bottom-left-radius: calc(var(--popoverBorderRadius) - 1px);
  border-bottom-right-radius: calc(var(--popoverBorderRadius) - 1px);
}

.Popover_popoverFooter_a37.Popover_noBorder_871 {
    border-top: none;
  }

.Popover_backdrop_ab4 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0);
  z-index: 102; /* in front of left nav, behind filter sidebar */
}

.DropdownMenu_menuContainer_c3d {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: var(--menuMaxHeight);

  /* ensures does not go taller than its container */
  min-height: 0;

  /* don't show focus ring on iOS */
}

.DropdownMenu_menuContainer_c3d:focus {
    outline: none;
  }

.DropdownMenu_menu_34b {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 2;
  flex: 1;
  min-height: 0;
}

.DropdownMenu_list_50d {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 4px 0;
  background-color: var(--bgPopover);
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: var(--popoverBorderRadius);
}

.DropdownMenu_rootSearch_3cd + .DropdownMenu_list_50d {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }

.DropdownMenu_list_50d:focus {
    outline: none;
  }

.DropdownMenu_item_699 {
  position: relative;
  display: flex;
  padding: 6px 16px;
  line-height: 16px;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  gap: var(--spacing-8);
}

@media screen and (max-width: 767px) {

.DropdownMenu_item_699 {
    padding: 8px 16px;
}
  }

.DropdownMenu_item_699 svg {
    fill: var(--colorIconDefault);
  }

.DropdownMenu_item_699.DropdownMenu_withIcon_0ac {
    display: grid;
    column-gap: var(--spacing-8);
    grid-template-columns: var(--spacing-16) 1fr;
  }

.DropdownMenu_item_699.DropdownMenu_withIcon_0ac.DropdownMenu_withFullSizeIcon_40d {
      align-items: center;
      column-gap: var(--spacing-16);
      grid-template-columns: var(--spacing-24) 1fr;
    }

.DropdownMenu_item_699.DropdownMenu_isDisabled_9c2 {
    cursor: not-allowed;
    color: var(--colorTextLight);
  }

.DropdownMenu_item_699.DropdownMenu_isDisabled_9c2 svg {
      fill: currentColor;
    }

.DropdownMenu_item_699 a {
    display: block;
    color: inherit;
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.DropdownMenu_submenuArrow_df8 {
  position: absolute;
  right: var(--spacing-16);
  color: var(--colorIconLight);
  top: calc(50% - var(--spacing-8));

  /* 16x tall & centered */
}

.DropdownMenu_isHighlighted_53f .DropdownMenu_submenuArrow_df8 {
    color: var(--colorIconDefault);
  }

.DropdownMenu_itemInner_b5f {
  width: 100%;
}

.DropdownMenu_itemTitle_231 {
  margin-bottom: 4px;
}

.DropdownMenu_itemTitle_231.DropdownMenu_smallMargin_4a0 {
    margin-bottom: 2px;
  }

.DropdownMenu_subtext_06d {
  margin-left: auto;
  margin-right: var(--spacing-8);
  white-space: nowrap;
}

.DropdownMenu_typeDefault_1a7.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2), .DropdownMenu_typeLink_76d.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2) {
    background: var(--bgMenuItemHover);
  }

.DropdownMenu_linkAnchor_bf9:hover,
.DropdownMenu_linkAnchor_bf9:focus,
.DropdownMenu_linkAnchor_bf9:active {
  -webkit-text-decoration: none;
  text-decoration: none;
  outline: none;
}

.DropdownMenu_typeLink_76d {
  color: var(--colorTextDefault);
}

.DropdownMenu_typeLink_76d.DropdownMenu_isHighlighted_53f {
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.DropdownMenu_typeDanger_e5d {
  color: var(--colorTextDanger);
}

.DropdownMenu_typeDanger_e5d svg {
    fill: currentColor;
  }

.DropdownMenu_typeDanger_e5d.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2) {
    color: var(--colorTextNeutralWhite);
    background: var(--bgDanger);
  }

/* While setting these on the item itself and allowing the color to cascade to
   the icon is convenient it stops the icon from being composable, so some
   explicit duplication here decouples the icon from the list item */
.DropdownMenu_icon_bf9.DropdownMenu_typeDefault_1a7,
  .DropdownMenu_icon_bf9.DropdownMenu_typeLink_76d {
    color: var(--colorIconDefault);
  }
.DropdownMenu_icon_bf9.DropdownMenu_typeDefault_1a7.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2), .DropdownMenu_icon_bf9.DropdownMenu_typeLink_76d.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2) {
      color: var(--colorTextDefault);
    }
.DropdownMenu_icon_bf9.DropdownMenu_typeDanger_e5d {
    color: var(--fillDanger);
  }
.DropdownMenu_icon_bf9.DropdownMenu_typeDanger_e5d.DropdownMenu_isHighlighted_53f:not(.DropdownMenu_isDisabled_9c2) {
      color: var(--colorIconNeutralWhite);
    }

.DropdownMenu_divider_a9c {
  display: block;
  margin: 4px 0;
  border-bottom: 1px solid var(--borderDefault);

  /* don't show two dividers next to each other */
}

.DropdownMenu_divider_a9c:first-child,
  .DropdownMenu_divider_a9c:last-child,
  .DropdownMenu_divider_a9c + .DropdownMenu_divider_a9c {
    display: none;
  }

.DropdownMenu_card_370 {
  padding: 4px 8px;
  /* prevents extraneous padding in Safari Desktop */
  list-style-type: none;
}

.DropdownMenu_submenuBar_185 {
  border-bottom: 1px solid var(--borderDefault);
}

.DropdownMenu_submenuHeading_d8a {
  display: grid;
  grid-template-columns: 16px auto 16px;
  justify-items: center;
  padding: var(--spacing-8) var(--spacing-16);
}

.DropdownMenu_submenuSearch_2ad {
  padding: 0 var(--spacing-8) var(--spacing-8);
}

/* NOTE: It's the same padding as in Select's GroupHeading. Make sure to sync */
.DropdownMenu_subtitle_425 {
  display: flex;
  align-items: center;
  padding: 8px 32px 8px 16px;
  line-height: 16px;
}

.DropdownMenu_rootSearch_3cd {
  border-top-left-radius: var(--popoverBorderRadius);
  border-top-right-radius: var(--popoverBorderRadius);
  border-bottom: 1px solid var(--borderDefault);
  padding: var(--spacing-8);
}

.DropdownMenu_backIcon_5e5 {
  cursor: pointer;
  color: var(--colorIconLight);
}

.DropdownMenu_backIcon_5e5:hover {
    color: var(--colorIconDefault);
  }

.DropdownMenu_emptyState_557 {
  padding: var(--spacing-8);
}

.Table_table_d42 {
  background: transparent;
  border-collapse: separate;
  border-radius: var(--tableBorderRadius);
  border-spacing: 0;
  border: 1px solid var(--borderDefault);
  box-shadow: var(--tableShadow);
  box-sizing: border-box;
  position: relative;
  transition: opacity 200ms var(--standardCurve);
  width: 100%;
}

.Table_table_d42 thead {
    position: relative;
  }

.Table_table_d42 thead tr {
      /* Fixes FF border issue */
      background-color: transparent;
    }

.Table_table_d42.Table_stickyHeader_6bc {
    border-top-width: 0;
  }

.Table_table_d42.Table_stickyHeader_6bc thead th {
        border-top: 1px solid var(--borderDefault);
        position: sticky;
        top: 0;
        z-index: 1;
      }

.Table_table_d42.Table_fullWidth_62f {
    --tableBorderRadius: 0;
    border-left-width: 0;
    border-right-width: 0;
  }

.Table_table_d42 * {
    box-sizing: border-box;
  }

.Table_loading_719 {
  opacity: 0.5;
}

.Table_th_10a {
  background: var(--bgTableHeaderDefault);
  border-bottom: 1px solid var(--borderDefault);
  font-weight: var(--fontWeightBold);
  /* Includes border height */
  height: 41px;
  padding: var(--spacing-8) var(--spacing-12);
  text-align: left;
  white-space: nowrap;

  /* Fixes Tooltip positioning */
}

.Table_th_10a > span {
    align-items: center;
    display: inline-flex;
    height: 100%;
    vertical-align: middle; /* Fixes FF cell height issue */
  }

.Table_th_10a:first-child {
    border-top-left-radius: var(--tableBorderRadius);
  }

.Table_th_10a.Table_canSelectAll_2b0:nth-child(2) {
    padding-left: 0;
  }

.Table_th_10a.Table_fullWidth_62f:first-child {
    padding-left: var(--spacing-16);
  }

@media screen and (min-width: 768px) {

.Table_th_10a.Table_fullWidth_62f:first-child {
        padding-left: var(--spacing-24);
    }
      }

.Table_th_10a.Table_fullWidth_62f:last-child {
    padding-right: var(--spacing-12);
  }

@media screen and (min-width: 768px) {

.Table_th_10a.Table_fullWidth_62f:last-child {
        padding-right: var(--spacing-24);
    }
      }

.Table_th_10a:last-child {
    border-top-right-radius: var(--tableBorderRadius);
  }

.Table_th_10a[role='button'] {
    cursor: not-allowed; /* enabled below when not .loading */
  }

.Table_table_d42:not(.Table_loading_719) .Table_th_10a[role='button'] {
    cursor: pointer;
  }

.Table_table_d42:not(.Table_loading_719) .Table_th_10a[role='button']:hover {
      background-color: var(--bgTableHeaderHover);
    }

.Table_table_d42:not(.Table_loading_719) .Table_th_10a[role='button']:hover .Table_nextSortOptionIcon_f27 {
        display: block;
      }

.Table_table_d42:not(.Table_loading_719) .Table_th_10a[role='button']:hover .Table_currentSortOptionIcon_61d {
        display: none;
      }

.Table_headerContent_98b {
  align-items: center;
  display: inline-flex;
  gap: var(--spacing-8);
}

.Table_sortIcon_6ff {
  margin: -0.5px 0;
  height: var(--spacing-16);
  width: var(--spacing-16);
}

.Table_nextSortOptionIcon_f27 {
  color: var(--colorIconLight);
  display: none;
}

.Table_icon_e24 {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
}

.Table_td_0c9 {
  height: 40px;
  padding: var(--spacing-8) var(--spacing-12);
}

.Table_td_0c9.Table_fullWidth_62f:first-child {
    padding-left: var(--spacing-16);
  }

@media screen and (min-width: 768px) {

.Table_td_0c9.Table_fullWidth_62f:first-child {
        padding-left: var(--spacing-24);
    }
      }

.Table_td_0c9.Table_fullWidth_62f:last-child {
    padding-right: var(--spacing-12);
  }

@media screen and (min-width: 768px) {

.Table_td_0c9.Table_fullWidth_62f:last-child {
        padding-right: var(--spacing-24);
    }
      }

.Table_td_0c9.Table_canSelect_21b:nth-child(2) {
    padding-left: 0;
  }

.Table_legacyMinHeight_06f {
  height: unset;
  min-height: 40px;
}

.Table_tr_ef8 {
  background: var(--bgTableCellDefault);
}

.Table_tr_ef8:not(:last-child) .Table_td_0c9 {
      border-bottom: 1px solid var(--borderDefault);
    }

.Table_tr_ef8:last-child .Table_td_0c9:first-child {
      border-bottom-left-radius: var(--tableBorderRadius);
    }

.Table_tr_ef8:last-child .Table_td_0c9:last-child {
      border-bottom-right-radius: var(--tableBorderRadius);
    }

.Table_tr_ef8.Table_clickable_089 {
    cursor: pointer;
  }

.Table_tr_ef8.Table_selected_d78 {
    background: var(--bgTableCellHighlighted);
  }

.Table_tr_ef8.Table_selected_d78:not(:last-child) .Table_td_0c9 {
        border-bottom-color: var(--borderActiveMuted);
      }

.Table_tr_ef8.Table_selected_d78.Table_hover_434:hover {
      background: var(--bgTableCellHighlighted);
    }

.Table_align-right_462 {
  text-align: right;
}

.Table_align-center_52a {
  text-align: center;
}

.Table_tr_ef8.Table_hover_434:hover {
  background: var(--bgTableCellHover);
}

.Table_cover_937 {
  padding-top: var(--spacing-24);
  padding-bottom: var(--spacing-24);
  text-align: center;
}

.Table_moreIcon_6ee {
  width: var(--spacing-16);
  padding: var(--spacing-4);
  box-sizing: content-box;
  background: none;
  border: none;
  outline: none;
  color: var(--colorIconLight);
  display: inline-flex;
}

.Table_moreIcon_6ee:hover {
    color: var(--colorTextDefault);
  }

.Table_moreIcon_6ee svg {
    width: 100%;
  }

.Table_hideHeader_c08 tr:first-child td:first-child {
      border-top-left-radius: var(--tableBorderRadius);
    }

.Table_hideHeader_c08 tr:first-child td:last-child {
      border-top-right-radius: var(--tableBorderRadius);
    }

.Table_selectionHeader_0f0 {
  align-items: center;
  display: flex;
  gap: var(--spacing-12);
}

.Table_selectionButton_fb0 {
  align-items: center;
  display: flex;
  height: 26px;
  justify-content: center;
  margin: -4px -6px;
  width: 26px;
}

.Table_selectionSeparator_84f {
  border-left: 1px solid var(--borderDefault);
  height: 16px;
}

.Table_selectionAction_7fd {
  margin: -4px 0;
}

.Table_actionMenu_daf {
  margin: -3px 0;
}

.Table_selectAll_679 {
  /* increase checkbox clickable area without affecting the layout */
  padding: var(--spacing-12) var(--spacing-12);
  margin: calc(-1 * var(--spacing-12)) calc(-1 * var(--spacing-12));
}

.Table_selectAll_679.Table_fullWidth_62f {
    padding-left: var(--spacing-16);
    margin-left: calc(-1 * var(--spacing-16));
  }

@media screen and (min-width: 768px) {

.Table_selectAll_679.Table_fullWidth_62f {
        padding-left: var(--spacing-24);
        margin-left: calc(-1 * var(--spacing-24));
    }
      }

.Table_selectCell_2fa {
  height: 100%;
  /* Width of checkbox */
  /* We have to apply this because of the container-type: size */
  width: 14px;
}

.Table_selectInner_f36 {
  align-items: center;
  display: flex;
  /* Checkboxes are misaligned by 1px */
  height: calc(100% - 1px);
  /* Single line cells we want to align in the center of the cell */
}

.Table_selectInner_f36.Table_top_af2 {
    /* Multi-line cells we want to align with the first line of text */
    /* 18px is our line height and checkboxes are misaligned by 1px */
    height: 17px;
  }

/* Stacked tables */
.Table_table_d42:has(+ .Table_table_d42) {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.Table_table_d42:has(+ .Table_table_d42) tr:last-child td:first-child {
          border-bottom-left-radius: 0;
        }
.Table_table_d42:has(+ .Table_table_d42) tr:last-child td:last-child {
          border-bottom-right-radius: 0;
        }

.Table_table_d42 + .Table_table_d42 {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top: 0;
}

.Table_table_d42 + .Table_table_d42 thead th {
      border-top: 0;
    }

.Table_table_d42 + .Table_table_d42 thead th:first-child {
        border-top-left-radius: 0;
      }

.Table_table_d42 + .Table_table_d42 thead th:last-child {
        border-top-right-radius: 0;
      }

.Table_SelectionHeaderCollapsed_root_0a9 {
  align-items: center;
  background-color: var(--surfaceBackgroundMedium);
  border-top: solid 1px var(--borderDefault);
  bottom: 0;
  display: grid;
  gap: var(--spacing-8);
  grid-template-columns: auto 1fr auto;
  left: 0;
  padding: var(--spacing-12) var(--spacing-16);
  position: fixed;
  right: 0;
  z-index: 1;
}

/* If you change something here, also check CheckboxCard.module.css
 * that overrides some styles here.
 */

.Checkbox {
  --focusedBorderColor: rgba(82, 168, 236, 0.8);

  cursor: pointer;
  position: relative;
  display: flex;
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 16px;
  -webkit-user-select: none;
          user-select: none;
}

.Checkbox--isLoading {
  opacity: var(--disabledOpacity);
}

.Checkbox__label {
  cursor: pointer;
  color: var(--colorTextDefault);
  display: flex;
  align-items: flex-start;
  font-weight: normal;
  max-width: 100%;
  position: relative;

  /**
   * The checkbox "box"
   * Colors are defined state by state below
   */
}

.Checkbox__label::before {
    content: '';
    position: relative;
    top: 1px;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    width: 14px;
    height: 14px;
    transition:
      border 80ms ease-in-out,
      background 80ms ease-in-out;
    margin-right: 12px;
    flex: 0 0 14px;
    box-sizing: border-box;
  }

/**
   * The checkbox checkmark
   * Colors are defined state by state below
   */

.Checkbox__label::after {
    content: '';
    display: none;
    position: absolute;
    width: 3px;
    height: 6px;
    top: 3px;
    left: 5px;
    border-style: solid;
    border-width: 0 2px 2px 0;
    transform: rotate3d(0, 0, 1, 45deg);
  }

.Checkbox__label:empty {
    /* the label should only take the size of the checkbox when it's empty */
    width: 14px;
  }

.Checkbox__label:hover {
    color: var(--colorTextDefault);
  }

.Checkbox__label.is-disabled {
    color: var(--colorTextMedium);
  }

.Checkbox__label.is-bold {
    font-weight: var(--fontWeightBold);
  }

.Checkbox__label--isMobile {
  pointer-events: none; /* mobile: otherwise the label doesn't check the box */
}

.Checkbox__label--halfChecked::after {
  display: block;
  transform: none;
  top: calc(50% - 6px);
  left: 4px;
  width: 6px;
  border-width: 0 0 2px 0;
}

.Checkbox__label--left::before {
    margin-right: 0;
    margin-left: 12px;
    order: 1;
  }

.Checkbox__label--left::after {
    right: 4px;
    left: unset;
  }

.Checkbox__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.Checkbox__input:disabled ~ .Checkbox__label {
    color: var(--colorTextMedium);
    cursor: not-allowed;
  }

/**
 * Default (enabled unchecked)
 */
/* box */
.Checkbox__label::before {
    background-color: var(--bgFormControlEnabledUnchecked);
    border-color: var(--borderFormControlEnabledUnchecked);
  }

/**
 * Disabled unchecked
 */

/* box */

.Checkbox__input:disabled ~ .Checkbox__label::before,
  .Checkbox__input:disabled ~ .Checkbox__label--halfChecked::before {
    background: var(--bgFormControlDisabled);
    border-color: var(--bgFormControlDisabled);
  }

/* box */

.Checkbox__input:disabled ~ .Checkbox__label::after,
  .Checkbox__input:disabled ~ .Checkbox__label--halfChecked::after {
    border-color: var(--fillFormControlDisabled);
  }

/**
 * Enabled checked/halfchecked
 */

/* box */
.Checkbox__input:checked ~ .Checkbox__label::before,
.Checkbox__label--halfChecked::before {
  border-color: var(--bgFormControlEnabledChecked);
  background: var(--bgFormControlEnabledChecked);
}

/* mark */
.Checkbox__input:checked ~ .Checkbox__label::after,
.Checkbox__label--halfChecked::after {
  display: flex;
  border-color: var(--fillFormControlEnabled);
}

/**
 * Disabled checked/halfchecked
 */

/* box */
.Checkbox__input:disabled:checked ~ .Checkbox__label::before,
  .Checkbox__input:disabled:checked ~ .Checkbox__label--halfChecked::before {
    background: var(--bgFormControlDisabled);
    border-color: var(--bgFormControlDisabled);
  }
.Checkbox__input:disabled:checked ~ .Checkbox__label::after,
  .Checkbox__input:disabled:checked ~ .Checkbox__label--halfChecked::after {
    border-color: var(--fillFormControlDisabled);
  }

/* focus */
.Checkbox__input:focus ~ .Checkbox__label::before {
  border-color: var(--focusedBorderColor);
  box-shadow: 0 0 0 3px
    color-mix(in srgb, transparent 50%, var(--colorBrandBlue));
}

.CloseLogo_theme_0e6 {
  color: var(--colorLogoText);
}

.CloseLogo_white_a9b {
  color: var(--colorWhite);
}

.CloseLogo_black_2b5 {
  color: var(--colorBlack);
}

.LineSeparator_lineSeparator_739 {
  margin: 0;
  border-top: 1px solid var(--borderDefault);
  border-bottom: 0 none;
}

.LineSeparator_hasSpacing_043 {
  margin: 24px 0;
}

/* NOTE: any changes to the header height on narrow screens needs an
   equivalent change to the opportunity pipeline mobile menu, since it has
   a hardcoded offset */

.AppHeader_header_464 {
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  padding-left: var(--spacing-24);
  padding-right: var(--spacing-24);
  border-bottom: 1px solid var(--borderDefault);
  background-color: var(--surfaceBackgroundDefault);
}

@media screen and (max-width: 767px) {

.AppHeader_header_464 {
    padding-left: var(--spacing-16);
    padding-right: var(--spacing-12); /* To line up with avatar */
}
  }

.AppHeader_inner_ed8 {
  position: relative;
  display: flex;
  align-items: center;
  padding-top: var(--spacing-24);
  padding-bottom: var(--spacing-24);
  flex-wrap: wrap;
  row-gap: var(--spacing-12);
}

.AppHeader_isCompact_502:not(.AppHeader_hasAbsoluteTabs_b0f) .AppHeader_inner_ed8 {
    padding-bottom: var(--spacing-16);
  }

.AppHeader_hasAbsoluteTabs_b0f:not(.AppHeader_isCompact_502) .AppHeader_inner_ed8 {
    padding-bottom: 40px;
  }

/* leave even more room for tabs if there is a titleSub passed as well */

.AppHeader_hasAbsoluteTabs_b0f.AppHeader_isCompact_502 .AppHeader_inner_ed8 {
    padding-bottom: 50px;
  }

.AppHeader_hasFlowTabs_184 .AppHeader_inner_ed8 {
    padding-bottom: 0 !important;
  }

.AppHeader_isCompact_502:not(.AppHeader_hasBreadcrumbs_105) .AppHeader_inner_ed8 {
    padding-top: var(--spacing-16);
  }

.AppHeader_hasAbsoluteTabs_b0f:not(.AppHeader_hasBreadcrumbs_105) .AppHeader_inner_ed8 {
    padding-top: var(--spacing-12);
  }

.AppHeader_hasBreadcrumbs_105 .AppHeader_inner_ed8 {
    padding-bottom: 18px;
    padding-top: 18px;
  }

.AppHeader_marginBottom_845 {
  margin-bottom: var(--spacing-24);
}

@media screen and (max-width: 767px) {

.AppHeader_marginBottom_845 {
    margin-bottom: var(--spacing-16);
}
  }

/* account for padding on general app screen and settings pages to spread full-width */
.AppHeader_spreadForApp_66b,
.AppHeader_spreadForSettings_61b {
  margin-top: calc(-1 * var(--spacing-24));
  margin-left: calc(-1 * var(--spacing-24));
  margin-right: calc(-1 * var(--spacing-24));
}
@media screen and (max-width: 767px) {
.AppHeader_spreadForApp_66b,
.AppHeader_spreadForSettings_61b {
    margin-top: calc(-1 * var(--spacing-16));
    margin-right: calc(-1 * var(--spacing-16));
    margin-left: calc(-1 * var(--spacing-16));
    padding-right: var(--spacing-12); /* To line up with avatar */
}

    .AppHeader_spreadForApp_66b .AppHeader_hasBreadcrumbs_105, .AppHeader_spreadForSettings_61b .AppHeader_hasBreadcrumbs_105 {
      margin-top: calc(-1 * var(--spacing-20));
    }
  }

/* only used in the pipelines view */
/* TODO: smaller sizing for all headings on narrow screens? */
.AppHeader_fullScreen_0dd {
  padding-left: var(--spacing-16);
  padding-right: var(--spacing-16);
  flex-shrink: 0;
}
.AppHeader_fullScreen_0dd .AppHeader_inner_ed8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
@media screen and (min-width: 1120px) {
.AppHeader_fullScreen_0dd {
    padding-left: 24px;
    padding-right: 24px;
}

    .AppHeader_fullScreen_0dd .AppHeader_inner_ed8 {
      padding-top: 24px;
      padding-bottom: 24px;
    }
  }
@media screen and (max-width: 767px) {
.AppHeader_fullScreen_0dd {
    padding-right: 12px; /* To line up with avatar */
}
  }

.AppHeader_title_e4d {
  flex: 1;
  margin: 0;
  min-width: 120px;
  white-space: nowrap;

  /* HACK: If TitleButton is wrapped in a select, we need to target a div that
     wraps the button in order to keep it from filling the width. Otherwise the
     popover is not positioned relative to the correct element. */
}

.AppHeader_title_e4d[aria-expanded] {
    display: flex;
    max-width: 100%;
  }

.AppHeader_hasBreadcrumbs_105 .AppHeader_title_e4d {
    margin-top: 12px;
  }

.AppHeader_actions_9b9 {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
}

.AppHeader_breadcrumbsWrap_6e8 {
  position: absolute;
  z-index: 1;
  top: 13px;
  left: 0;
}

.AppHeader_tabsWrap_7ac {
  position: absolute;
  z-index: 1;
  bottom: -1px;
  left: 0;
  right: 0;
}

.AppHeader_titleSub_776 {
  display: block;
  color: var(--colorTextLight);
  font-size: 14px;
  line-height: 20px;
  margin-top: 4px;
  /* reset wrapping for title subtitle */
  white-space: normal;
}

.AppHeader_secondaryHeader_09d {
  /* Emulate a border so height isn't affected
     and border collapses when content height is 0 */
  box-shadow: 0px -1px 0px 0px var(--borderDefault);

  /* Adjust for main header padding */
  margin-left: calc(-1 * var(--spacing-24));
  margin-right: calc(-1 * var(--spacing-24));
}

@media screen and (max-width: 767px) {

.AppHeader_secondaryHeader_09d {
    margin-left: calc(-1 * var(--spacing-16));
    margin-right: calc(-1 * var(--spacing-12));
}
  }

@media screen and (min-height: 480px) {

.AppHeader_sticky_2dd {
    position: sticky;
    top: 0;
    z-index: var(
      --stickyHeaderZIndex
    ); /* on top of ActivityCharts__chartBoxInfo */
}
  }

.AppHeader_titleButton_2d1.AppHeader_titleButton_2d1 {
  display: flex;
  align-items: center;
  padding: 0 var(--spacing-12);
  border-radius: 16px;
  max-width: 100%;

  /* eat into left padding so text is aligned with edge of page */
  margin-left: calc(-1 * var(--spacing-12));
}

.AppHeader_titleButtonContents_c2c {
  max-width: 100%;
}

.AppHeader_titleButtonContents_c2c.AppHeader_withCaret_b8b {
    /* Leave space for the caret */
    max-width: calc(100% - 20px);
  }

.AppHeader_titleButtonContents_c2c {

  /* Firefox has a UI bug where it show ellipsis even when it has */
  /* enough space to display the whole name. */
  /* i.e. "Test" displays as "Te..." */
  /* Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1881220 */
  @-moz-document url-prefix() {
    max-width: calc(100% - 19px);
  }
}

.AppHeader_headingText_4be {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.AppHeader_caret_fac {
  width: 14px;
  height: 14px;
  margin-left: 6px;
}

.AppHeader_primaryActions_b39 {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
}

.AppHeader_primaryActionsWithPadding_3e6 {
  padding-right: var(--spacing-8);
}

.AppHeader_secondaryActions_aa2 {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
  padding-left: var(--spacing-8);
}

.BtnGroup > .Btn.MoreButton {
  /* When it's in a ButtonGroup, we want to add border radius on right. Even though MoreButton
     is the last element of a group in the UI, in the DOM, the dropdown is inserted after it */
  border-top-right-radius: var(--baseBorderRadius);
  border-bottom-right-radius: var(--baseBorderRadius);
}

.VerticalDivider_divider_900 {
  border-left: 1px solid var(--borderDefault);
  margin: 3px 0;
  align-self: stretch;
}@media screen and (max-width: 767px) {.VerticalDivider_divider_900 {
    display: none !important;
}
  }

.EmptyState_main_ca3 {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--surfaceBackgroundDefault);
  box-sizing: border-box;
}

.EmptyState_hasPadding_93a {
  padding: calc(3vw + 3vh);
}

.EmptyState_hasBorder_92d {
  border: 1px solid var(--borderDefault);
  border-radius: var(--baseBorderRadius);
  box-shadow: var(--panelShadow);
}

.EmptyState_fillHeight_943 {
  height: 100%;
}

.EmptyState_centerGradient_c57::before, .EmptyState_bottomGradient_c43::before {
    content: ' ';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    clip-path: polygon(0% 45px, 100% 0, 100% 100%, 0% 100%);
  }

.EmptyState_centerGradient_c57::before {
  height: 65%;
  background: linear-gradient(
    180deg,
    var(--colorGradientEmptyStateStart) -8%,
    var(--colorGradientEmptyStateEnd) 20%
  );
}

.EmptyState_bottomGradient_c43::before {
  height: 18%;
  background: linear-gradient(
    180deg,
    var(--colorGradientEmptyStateStart) -30%,
    var(--colorGradientEmptyStateEnd) 100%
  );
}

.EmptyState_graphic_1a9.EmptyState_graphic_1a9 {
  position: relative;
  margin-bottom: var(--spacing-24);
}

.EmptyState_graphic_1a9.EmptyState_graphic_1a9 svg {
    height: 150px;
    width: auto;
    vertical-align: bottom;
  }

.EmptyState_graphic_1a9.EmptyState_graphic_1a9.EmptyState_svgAutoHeight_7ad svg {
      height: auto;
    }

.EmptyState_icon_1ff {
  position: relative;
  margin-bottom: var(--spacing-24);
  background-color: var(--bgDefault);
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.EmptyState_icon_1ff svg {
    width: 48px;
    height: 48px;
    vertical-align: bottom;
  }

.EmptyState_danger_0a2 {
  background-color: var(--failureBackgroundColor);
  color: var(--failurePrimaryColor);
}

.EmptyState_textContainer_ea4 {
  position: relative;
  text-align: center;
  max-width: 520px;
}

.EmptyState_heading_baa {
  font-size: 24px;
  margin: 0;
  line-height: 2;
}

.EmptyState_heading_baa.EmptyState_small_2ef {
    font-size: 18px;
  }

.EmptyState_text_351 {
  font-size: 14px;
  margin-bottom: 24px;
  text-wrap: balance;
}

.EmptyState_text_351.EmptyState_faded_5ef {
    color: var(--colorTextLight);
  }

.EmptyState_link_d9a {
  -webkit-text-decoration: underline;
  text-decoration: underline;
  white-space: nowrap;
  color: inherit;
}

label.RadioGroup_LabelWithBorder_label_385 {
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 7px;
  border: 1px solid var(--borderDefault);
}label.RadioGroup_LabelWithBorder_label_385:hover {
    border-color: var(--borderHover);
  }label.RadioGroup_LabelWithBorder_label_385.isSelected {
    background: var(--bgActiveMuted);
    border-color: var(--borderFocused);
  }

.RadioGroup_RadioButton_input_758 {
  display: none;
}

.RadioGroup_RadioButton_button_975 {
  position: relative;
  color: var(--colorTextDefault);
}

.RadioGroup_RadioButton_button_975 .Btn__icon {
    color: var(--colorIconLight);
  }

.RadioGroup_RadioButton_button_975.isSelected {
    color: var(--colorTextDefault);
  }

.RadioGroup_RadioButton_button_975.isSelected .Btn__icon {
      color: var(--colorIconDefault);
    }

label.RadioGroup_RadioItem_label_9ee {
  display: flex;
  align-items: center;
  margin-bottom: 0;
}

label.RadioGroup_RadioItem_label_9ee.RadioGroup_RadioItem_positionLeft_9b9 {
    justify-content: flex-start;
  }

label.RadioGroup_RadioItem_label_9ee.RadioGroup_RadioItem_positionCenter_977 {
    width: 100%;
    justify-content: center;
  }

input[type='radio'].RadioGroup_RadioItem_radio_1c5 {
  display: block;
  width: 14px;
  height: 14px;
  margin: 0 14px 0 0;
  flex: 0 0 auto;
}

input.RadioGroup_RadioItem_radio_1c5.RadioGroup_RadioItem_alignTop_c51[type='radio'] {
    align-self: baseline;
    margin-top: var(--spacing-4);
  }

.RadioGroup_RadioItem_labelContainer_b41 {
  flex: 0 1 auto;
}

.TileSelect_wrapper_085 {
  --options-gap: 15px; /* keep in sync w/ OPTIONS_GAP in ./index.js */
  --options-pointer-width: 10px; /* keep in sync w/ OPTIONS_POINTER_WIDTH in ./index.js */

  /* Pointer sits to the left of the options when stacked */
}

.TileSelect_wrapper_085.TileSelect_stacked_394.TileSelect_withPointer_fa1 {
    position: relative;
    padding-left: 20px;
  }

.TileSelect_options_7c4 {
  display: flex;
  column-gap: var(--options-gap);
}

.TileSelect_stacked_394 .TileSelect_options_7c4 {
    flex-direction: column;
    row-gap: var(--options-gap);
  }

.TileSelect_optionsLine_3c4 {
  position: relative;
  margin: 20px 0;
  border-bottom: 1px solid var(--borderDefault);
}

.TileSelect_stacked_394 .TileSelect_optionsLine_3c4 {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    height: 100%;
    border-bottom: none;
    border-right: 1px solid var(--borderDefault);
  }

.TileSelect_optionsPointer_f21 {
  position: absolute;
}

.TileSelect_optionsPointer_f21::before,
  .TileSelect_optionsPointer_f21::after {
    position: absolute;
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    bottom: -1px;
  }

.TileSelect_optionsPointer_f21::before {
    z-index: 1;
    border-bottom: var(--options-pointer-width) solid var(--borderDefault);
    border-right: var(--options-pointer-width) solid transparent;
    border-left: var(--options-pointer-width) solid transparent;
  }

.TileSelect_optionsPointer_f21::after {
    z-index: 2;
    left: 2px;
    border-bottom: calc(var(--options-pointer-width) - 2px) solid
      var(--surfaceBackgroundDefault);
    border-right: calc(var(--options-pointer-width) - 2px) solid transparent;
    border-left: calc(var(--options-pointer-width) - 2px) solid transparent;
  }

.TileSelect_stacked_394 .TileSelect_optionsPointer_f21::before,
    .TileSelect_stacked_394 .TileSelect_optionsPointer_f21::after {
      left: 0;
      bottom: initial;
    }

.TileSelect_stacked_394 .TileSelect_optionsPointer_f21::before {
      border: initial;
      border-bottom: var(--options-pointer-width) solid transparent;
      border-top: var(--options-pointer-width) solid transparent;
      border-left: var(--options-pointer-width) solid var(--borderDefault);
    }

.TileSelect_stacked_394 .TileSelect_optionsPointer_f21::after {
      top: 2px;
      border: initial;
      border-bottom: calc(var(--options-pointer-width) - 2px) solid transparent;
      border-top: calc(var(--options-pointer-width) - 2px) solid transparent;
      border-left: calc(var(--options-pointer-width) - 2px) solid
        var(--surfaceBackgroundDefault);
    }

.TileSelect_input_a56 {
  display: none;
}

.TileSelect_horizontalRadioOptionLabel_463 {
  padding: 12px 16px;
  flex: 1;
  margin: 0;
}

.TileSelect_centered_3f4 .TileSelect_horizontalRadioOptionLabel_463 {
    text-align: center;
  }

.TileSelect_optionHeading_378 {
  margin-bottom: 8px;
  display: flex;
  gap: 4px;
  align-items: center;
}

.TileSelect_centered_3f4 .TileSelect_optionHeading_378 {
    justify-content: center;
  }

.Slideable_main_37b {
  transition: height 200ms var(--standardCurve);
}.Slideable_main_37b:not(.Slideable_isExpanded_25c) {
    overflow: hidden;
  }

.AsyncSelect_AsyncSelect_container_2f5 {
  width: 100%;
}

.AsyncSelect_AsyncSelect_inputContainer_ce6 {
  position: relative;
}

.AsyncSelect_AsyncSelect_icons_d83 {
  /* Position to the right side of the input, and give a form color background
   * so text that overflows behind the controls will not mix with them.
   */
  position: absolute;
  right: 1px;
  top: 1px;
  bottom: 1px;
  background-color: var(--formBackground);
  border-radius: var(--baseInputBorderRadius);

  display: flex;
  flex-direction: row;
  align-items: center;
}

/* The <Loader /> component has a 2px right margin on it, this is causing
 * layout shift when the loader is replaced with the search / dropdown icon.
 *
 * This corrects for that.
 */
.AsyncSelect_AsyncSelect_loader_3f0 {
  padding: 0 6px;
}

.AsyncSelect_AsyncSelect_popover_f39 {
  --popoverBorderRadius: 7px;

  background-color: var(--bgPopover);
  border-radius: var(--popoverBorderRadius);
  border: 1px solid var(--borderDefault);
  box-shadow: var(--shadowLevel3);

  z-index: var(--zindexOverlays);

  display: none;
  flex-direction: column;
}

.AsyncSelect_AsyncSelect_popover_f39.AsyncSelect_AsyncSelect_open_473 {
    display: flex;
  }

.AsyncSelect_AsyncSelect_menu_cdd {
  flex: 1;
  overflow: auto;
}

.AsyncSelect_AsyncSelect_menu_cdd ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }

.AsyncSelect_AsyncSelect_menu_cdd li {
    padding: 0;
    margin: 0;
    cursor: pointer;
  }

.AsyncSelect_AsyncSelect_footer_94e {
  border-top: 1px solid var(--borderDefault);
}

.AsyncSelect_AsyncSelect_selectItem_bd1 {
  display: flex;
  gap: var(--spacing-4);
  align-items: center;
  /* nonstandard vertical padding. 4px makes items too tall, 2px is too tight :) */
  padding: 6px var(--spacing-8);
}

.AsyncSelect_AsyncSelect_highlighted_b6c {
  background-color: var(--bgMenuItemHover);
}

.AsyncSelect_AsyncSelect_disabled_a24 {
  cursor: not-allowed;
  opacity: var(--disabledOpacity);
}

.AsyncSelect_AsyncSelect_groupSeparator_8a1 {
  display: flex;
  flex-direction: row;
  padding: var(--spacing-8);
  /* item padding + checkbox width + gap */
  padding-left: calc(var(--spacing-12));
}

.AsyncSelect_AsyncSelect_groupSeparator_8a1.AsyncSelect_AsyncSelect_hasDivider_d7c {
    border-top: 1px solid var(--borderDefault);
    margin-top: var(--spacing-8);
  }

.AsyncSelect_AsyncSelect_groupSeparator_8a1.AsyncSelect_AsyncSelect_noTitle_617 {
    margin-top: 0;
  }

.AsyncSelect_AsyncSelect_checkIcon_ebe {
  width: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.AsyncSelect_AsyncSelect_footerItem_c4b {
  cursor: pointer;
}


  .Field_Field_643.Field_withMargin_938 {
    margin-bottom: 20px;
  }

.Field_content_ebe {
  display: flex;
  align-items: center;
}

.Field_content_ebe.Field_errorBottom_23a {
    flex-direction: column;
    align-items: inherit;
  }

div.Field_label_771,
label.Field_label_771 {
  /* TODO: remove hardcoded value and set on consumer container
     https://github.com/closeio/closeio/issues/18925
     this could then be set to 100% all the time */
  width: 340px;
  margin: 0;
  font-size: 14px;
}

div.Field_label_771.Field_disabled_2b1, label.Field_label_771.Field_disabled_2b1 {
    cursor: default;
  }

div.Field_label_771.Field_fullWidth_2b3, label.Field_label_771.Field_fullWidth_2b3 {
    width: 100%;
  }

.Field_labelText_575 {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 8px;
  line-height: 16px;
  font-weight: var(--fontWeightBold);
}

.Field_disabled_2b1 > .Field_labelText_575 {
    opacity: 0.5;
  }

.Field_description_66c {
  margin-top: 8px;
  color: var(--colorTextMedium);
  line-height: 16px;
  overflow-wrap: break-word;
  word-break: break-word;
}

.Field_error_3b7 {
  color: var(--colorTextDanger);
  padding-left: 20px;
}

.Field_error_3b7.Field_rightWithLabel_e26 {
    margin-top: 24px;
  }

.Field_error_3b7.Field_bottom_07b {
    margin-top: 5px;
    width: 100%;
    padding: 0;
  }

.Field_errorIcon_71e {
  margin-right: 5px;
}

.Field_required_0c2 {
  color: var(--colorTextDanger);
}

.ExternalLink_externalLink_2bd {
  display: inline-flex;
  align-items: center;
}

.ExternalLink_externalLinkIcon_1e9 {
  margin-left: 8px;
}

.Message_root_3a2 {
  border: 1px solid var(--borderDefault);
  box-sizing: border-box;
  color: var(--colorTextDefault);
  container: message / inline-size;
  display: flex;
  font-size: var(--fontSizeBase);
  position: relative;
  width: 100%;
}

.Message_inner_ada {
  display: flex;
  flex: 1;
  gap: var(--spacing-8);
}

.Message_inner_ada .Message_spacer_b58 {
    display: none;
  }

.Message_inner_ada.Message_center_7ce {
    align-items: center;
  }

.Message_inner_ada.Message_top_34a {
    align-items: flex-start;
  }

@container message (max-width: 500px) {

.Message_inner_ada.Message_withRightControls_326 {
      align-items: flex-start;
      flex-direction: column;
  }
    }

@container message (max-width: 500px) {

.Message_inner_ada.Message_withRightControlsAndIcon_40f {
      align-items: flex-start;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: var(--spacing-8);
  }

      .Message_inner_ada.Message_withRightControlsAndIcon_40f .Message_spacer_b58 {
        display: block;
      }
        /*
        * Makes up for line height difference in icon and text
        * we can't center since this can only be centered with first
        * line of text
        */
        .Message_inner_ada.Message_withRightControlsAndIcon_40f.Message_iconIsNode_80f svg {
          padding-top: 2px;
        }

      /**
      * When we are showing the icon in a circle, we need to adjust the
      * icon's position to be centered with first line of the text
      */
      .Message_inner_ada.Message_withRightControlsAndIcon_40f .Message_icon_e72 {
        margin-top: -2px;
      }
    }

.Message_children_864 {
  flex: 1;
}

/** Message Variants */
.Message_message_975 {
  border-radius: var(--baseInputBorderRadius);
}
.Message_message_975.Message_basePadding_a3f {
    padding: 11px var(--spacing-16);
  }
.Message_message_975.Message_narrowPadding_610 {
    padding: var(--spacing-8) var(--spacing-12);
  }
.Message_message_975.Message_dismissible_847.Message_basePadding_a3f {
    /** base padding plus close button width **/
    padding-right: calc(var(--spacing-16) + 30px);
  }
.Message_message_975.Message_dismissible_847.Message_narrowPadding_610 {
    /** narrow padding plus close button width **/
    padding-right: calc(var(--spacing-12) + 40px);
  }
.Message_message_975.Message_dismissible_847.Message_narrowPadding_610 .Message_close_b66 {
      right: var(--spacing-8);
    }

.Message_bar_d65 {
  border-left: none;
  border-right: none;
}

.Message_bar_d65 .Message_withRightControls_326 {
    gap: var(--spacing-12);
  }

.Message_bar_d65.Message_basePadding_a3f {
    padding: var(--spacing-12) var(--spacing-24);
  }

.Message_bar_d65.Message_basePadding_a3f .Message_close_b66 {
      top: calc(50% - 14px);
    }

@container message (max-width: 500px) {

.Message_bar_d65.Message_basePadding_a3f .Message_close_b66 {
        top: 7px;
    }
      }

.Message_bar_d65.Message_narrowPadding_610 .Message_close_b66 {
      right: var(--spacing-8);
      top: calc(50% - 15px);
    }

@container message (max-width: 500px) {

.Message_bar_d65.Message_narrowPadding_610 .Message_close_b66 {
        top: 3px;
    }
      }

.Message_bar_d65.Message_basePadding_a3f {
    padding: var(--spacing-12) var(--spacing-24);
  }

.Message_bar_d65.Message_narrowPadding_610 {
    padding: var(--spacing-8) var(--spacing-12);
  }

.Message_bar_d65.Message_dismissible_847.Message_basePadding_a3f {
    /** base padding plus close button width **/
    padding-right: calc(var(--spacing-24) + 30px);
  }

.Message_bar_d65.Message_dismissible_847.Message_narrowPadding_610 {
    /** narrow padding plus close button width **/
    padding-right: calc(var(--spacing-12) + 40px);
  }

.Message_bar_d65.Message_dismissible_847.Message_narrowPadding_610 .Message_close_b66 {
      right: 0;
    }

.Message_banner_862 {
  border-left: none;
  border-right: none;
  border-top: none;

  /* banner variant does not support `narrow` padding */
}

.Message_banner_862 .Message_close_b66 {
    right: var(--spacing-16);
    top: 22px;
  }

.Message_banner_862.Message_basePadding_a3f {
    padding: var(--spacing-24);
  }
/** end Message Variants */

/** Message Types */
.Message_warning_075 {
  background-color: var(--bgWarnMuted);
  border-color: var(--borderWarnMuted);
}

.Message_danger_704 {
  background-color: var(--bgDangerMuted);
  border-color: var(--borderDangerMuted);
}

.Message_info_442 {
  background-color: var(--bgInformationalMuted);
  border-color: var(--borderInformationalMuted);
}

.Message_success_20e {
  background-color: var(--bgSuccessMuted);
  border-color: var(--borderSuccessMuted);
}

.Message_task_ccf {
  background-color: var(--colorBgMessageTask);
  border-color: var(--colorBorderMessageTask);
}

/** end Message Types */

.Message_borderless_228 {
  border-color: transparent;
  border-width: 0;
}

.Message_invisible_79e {
  display: none;
}

.Message_close_b66 {
  color: var(--colorIconDefault);
  position: absolute;
  right: var(--spacing-12);
  top: 10px;
}

.Message_dismissible_847 {
  padding-right: var(--spacing-48);
}

.Message_icon_e72 {
  align-items: center;
  background-color: var(--bgLight);
  border-radius: 50%;
  color: var(--colorIconDefault);
  display: inline-flex;
  height: 24px;
  justify-content: center;
  width: 24px;
}

.Message_rightControls_156 {
  align-items: center;
  display: flex;
  gap: var(--spacing-16);
}

.HighlightText_mark_042 {
  color: var(--colorTextNeutralBlack);
}

.HighlightText_yellow_32d {
  background-color: var(--bgHighlightMatch);
}

.HighlightText_yellow_32d.HighlightText_active_bea {
    background-color: var(--bgHighlightMatchSelected);
  }

.UserAvatar_avatarContainer_297 {
  flex: 0 0 auto;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  z-index: 0;
  border-radius: 50%;
  overflow: hidden;
  font-weight: var(--fontWeightBold);
  background: var(--surfaceBackgroundDefault);
}

.UserAvatar_avatarContainer_297.UserAvatar_xxx-small_95c {
    width: 12px;
    height: 12px;
    font-size: 5px;
    line-height: 9px;
  }

.UserAvatar_avatarContainer_297.UserAvatar_mini_080 {
    width: 16px;
    height: 16px;
    font-size: 7.25px;
    line-height: 9px;
  }

.UserAvatar_avatarContainer_297.UserAvatar_x-small_14a {
    width: 20px;
    height: 20px;
    font-size: 9px;
    line-height: 9px;
  }

.UserAvatar_avatarContainer_297.UserAvatar_small_919 {
    width: 24px;
    height: 24px;
    font-size: 10px;
    line-height: 9px;
  }

.UserAvatar_avatarContainer_297.UserAvatar_medium_8a1 {
    width: 32px;
    height: 32px;
    font-size: 12px;
    line-height: 14px;
  }

.UserAvatar_avatarContainer_297.UserAvatar_large_5de {
    width: 40px;
    height: 40px;
    font-size: 16px;
    line-height: 19px;
  }

.UserAvatar_avatar_b4b {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  border-radius: 50%;
  overflow: hidden;
}

.UserAvatar_avatar_b4b:after {
    border-radius: 50%;
  }

.UserAvatar_border_0e9 {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-radius: 50%;
  border: 1px solid var(--colorFillTransparent10);
  position: absolute;
  z-index: var(--userAvatarZIndex);
}

.UserAvatar_image_06e {
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  border-radius: 50%;
}

.UserAvatar_initials_682 {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: var(--fontWeightBold);
  letter-spacing: 0.05em;
  position: absolute;
  top: 0;
  left: 0;
}

.UserAvatar_initials_682.UserAvatar_red_b2b {
    color: var(--colorFillAvatarRed);
    background-color: var(--colorBgAvatarRed);
  }

.UserAvatar_initials_682.UserAvatar_green_9d4 {
    color: var(--colorFillAvatarGreen);
    background-color: var(--colorBgAvatarGreen);
  }

.UserAvatar_initials_682.UserAvatar_gold_5ff {
    color: var(--colorFillAvatarGold);
    background-color: var(--colorBgAvatarGold);
  }

.UserAvatar_initials_682.UserAvatar_blue_c0b {
    color: var(--colorFillAvatarBlue);
    background-color: var(--colorBgAvatarBlue);
  }

.UserAvatar_initials_682.UserAvatar_cyan_06c {
    color: var(--colorFillAvatarCyan);
    background-color: var(--colorBgAvatarCyan);
  }

.UserAvatar_initials_682.UserAvatar_purple_e6c {
    color: var(--colorFillAvatarPurple);
    background-color: var(--colorBgAvatarPurple);
  }

.UserAvatar_initials_682.UserAvatar_orange_8a6 {
    color: var(--colorFillAvatarOrange);
    background-color: var(--colorBgAvatarOrange);
  }

.UserAvatar_initials_682.UserAvatar_teal_a3f {
    color: var(--colorFillAvatarTeal);
    background-color: var(--colorBgAvatarTeal);
  }

.UserAvatar_initials_682.UserAvatar_magenta_5d8 {
    color: var(--colorFillAvatarMagenta);
    background-color: var(--colorBgAvatarMagenta);
  }

.UserAvatar_initials_682.UserAvatar_gray_dc5 {
    color: var(--colorFillAvatarGray);
    background-color: var(--colorBgAvatarGray);
  }

.UserAvatar_userAvatarAndNameWrapper_9e3 {
  display: flex;
  align-items: center;
  max-width: 100%;
}

.UserAvatar_userNameWrapper_cb3 {
  flex: 0 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.UserStatusAvatar_wrap_29e {
  --avatarSize: 40px;

  /* TODO [darkmode] "special" grey here. Also see calling/UserStatusAvatar */
  --coachingListenColor: var(--colorGray20);

  position: relative;
  width: var(--avatarSize);
  height: var(--avatarSize);
}

.UserStatusAvatar_wrap_29e::before {
    content: '';
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 0;
    left: 0;
    width: var(--avatarSize);
    height: var(--avatarSize);
    border-radius: 50%;
    border: 2px solid var(--fillSuccess);
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.255, 1.28);
    transform: scale(0.5);
  }

.UserStatusAvatar_wrap_29e.UserStatusAvatar_hasStatusRing_6cd::before {
    transform: scale(1);
  }

.UserStatusAvatar_wrap_29e.UserStatusAvatar_coaching-listen_922::before {
      border-color: var(--coachingListenColor);
    }

.UserStatusAvatar_wrap_29e.UserStatusAvatar_coaching-whisper_b2f::before {
      border-color: var(--fillActive);
    }

.UserStatusAvatar_imgWrap_ed5 {
  position: absolute;
  top: 4px;
  left: 4px;
  width: calc(var(--avatarSize) - 8px);
  height: calc(var(--avatarSize) - 8px);
  border-radius: 50%;
  background-color: var(--surfaceBackgroundDefault);
}

.UserStatusAvatar_isUnavailable_cb4 .UserStatusAvatar_imgWrap_ed5 .UserStatusAvatar_img_802 {
    opacity: 0.5;
  }

.UserStatusAvatar_img_802 {
  transition: opacity 0.4s ease;
  width: calc(var(--avatarSize) - 8px);
  height: calc(var(--avatarSize) - 8px);
  border-radius: 50%;
}

.UserStatusAvatar_svgFallback_8b6 {
  color: var(--coachingListenColor);
}

.UserStatusAvatar_statusIcon_f23 {
  position: absolute;
  right: -4px;
  bottom: -4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--colorIconNeutralWhite);
  border: 2px solid var(--surfaceBackgroundDefault);
  width: 20px;
  height: 20px;
  border-radius: 10px;
  box-sizing: border-box;
}

.UserStatusAvatar_statusIcon_f23.UserStatusAvatar_regular-call_2af,
  .UserStatusAvatar_statusIcon_f23.UserStatusAvatar_power-call_c71,
  .UserStatusAvatar_statusIcon_f23.UserStatusAvatar_coaching-barge_59a {
    background-color: var(--fillSuccess);
  }

.UserStatusAvatar_statusIcon_f23.UserStatusAvatar_predictive-call_185 {
    background-color: var(--fillWarn);
  }

.UserStatusAvatar_statusIcon_f23.UserStatusAvatar_coaching-listen_922 {
    background-color: var(--coachingListenColor);
  }

.UserStatusAvatar_statusIcon_f23.UserStatusAvatar_coaching-whisper_b2f {
    background-color: var(--fillActive);
  }

.InfoPopover_content_723 {
  padding: 22px;
  box-sizing: border-box;
  color: var(--colorTextDefault);
}

.InfoPopover_content_723.InfoPopover_default_69a {
    max-width: 320px;
    width: 320px;
  }

.InfoPopover_content_723.InfoPopover_large_fee {
    max-width: 380px;
    width: 380px;
  }

.InfoPopover_header_904 {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 20px;
  font-weight: var(--fontWeightBold);
}

.InfoPopover_p_ac5 {
  font-size: 14px;
  line-height: 20px;
  color: var(--colorTextMedium);
}

.InfoPopover_action_da2 {
  display: flex;
  align-items: center;
  margin-top: 16px;
}

.InfoPopover_helpLink_e9d {
  flex-grow: 1;
  text-align: right;
}

.InfoPopover_xButton_fc5 {
  position: absolute;
  top: 16px;
  right: 16px;
}

.subComponents_SelectLabel_root_d35 {
  position: relative;
  padding: 4px 16px 4px 40px; /* 24px total height */
  font-size: var(--fontSizeBase);
}

.subComponents_SelectLabel_icon_49f {
  position: absolute;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  left: 0;
  width: 40px;
  padding-top: 2px;
}

/* This wrapper moves the item "top" – as used when computing the position
   needed to scroll the item into view. This prevents keyboard navigation from
   scrolling items to a point underneath a sticky search input.

   TODO: once compute-scroll-into-view (used by downshift) supports the
   `scroll-margin-top` css prop, use that instead.
   https://github.com/scroll-into-view/compute-scroll-into-view/issues/831 */
.subComponents_SelectRow_root_753 {
  position: relative;
  pointer-events: none;
  padding-top: var(--select-menu-fixed-header-height, 0);
  margin-top: calc(-1 * var(--select-menu-fixed-header-height, 0));
}
.subComponents_SelectRow_root_753 .subComponents_SelectRow_inner_f1b {
    pointer-events: auto;
    position: relative;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
  }
.subComponents_SelectRow_root_753 .subComponents_SelectRow_inner_f1b.subComponents_SelectRow_highlighted_116 {
      background-color: var(--bgMenuItemHover);
    }
.subComponents_SelectRow_root_753 .subComponents_SelectRow_inner_f1b.subComponents_SelectRow_disabled_f80 {
      cursor: not-allowed;
      opacity: var(--disabledOpacity);
      -webkit-user-select: none;
              user-select: none;
    }

.BottomSheet_backdrop_497 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--zindexModalBackdrop);
  background-color: transparent;
  transition: background-color 300ms ease-in-out;
}

.BottomSheet_backdrop_497.BottomSheet_afterOpen_f89 {
    background-color: var(--colorBgBackdrop);
  }

.BottomSheet_backdrop_497.BottomSheet_beforeClose_671 {
    background-color: transparent;
  }

.BottomSheet_sheet_b1a {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  z-index: var(--zIndexModal);
  background-color: var(--colorBgBottomsheet);
  border-radius: 7px 7px 0 0;
  transform: translate3d(0, 100%, 0);
  transition: transform 400ms cubic-bezier(0.28, 0.03, 0.25, 1);
  /* always leave some room for the backdrop */
  max-height: calc(100vh - 120px);
}

.BottomSheet_sheet_b1a:focus {
    outline: none;
  }

.BottomSheet_sheet_b1a.BottomSheet_afterOpen_f89 {
    transform: translate3d(0, 0, 0);
  }

.BottomSheet_sheet_b1a.BottomSheet_beforeClose_671 {
    transform: translate3d(0, 100%, 0);
  }

.BottomSheet_fixedHeight_193 {
  height: calc(100vh - 120px);
}

.BottomSheet_header_51c {
  padding: var(--spacing-16);
  border-bottom: 1px solid var(--borderDefault);
}

.BottomSheet_headerUpper_197 {
  display: flex;
  gap: var(--spacing-8);
  align-items: center;
}

.BottomSheet_title_6f7 {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-right: auto;
}

.BottomSheet_scrollContainer_66d {
  min-height: 0;
  overflow-y: auto;
}

.BottomSheet_scrollContainerInner_ac9 {
  padding: var(--spacing-8) 0 var(--spacing-32);
}

.BottomSheet_scrollContainerInner_ac9.BottomSheet_withFooter_dd7 {
    padding-bottom: 0;
  }

.subComponents_SelectInlineButton_wrapper_121 {
  position: relative;
}

.subComponents_SelectInlineButton_button_52a {
  cursor: pointer;

  box-sizing: border-box;
  width: 100%;
  padding: 3px 24px 3px 8px;
  border: 1px solid transparent;
  border-radius: var(--baseBorderRadius);

  color: var(--colorTextDefault);

  display: flex;
  align-items: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  white-space: nowrap;

  /* button reset */
  appearance: none;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.subComponents_SelectInlineButton_button_52a.subComponents_SelectInlineButton_tiny_10f {
    font-size: var(--inputFontSizeTiny);
    line-height: 20px;
  }

.subComponents_SelectInlineButton_button_52a.subComponents_SelectInlineButton_small_08e {
    font-size: 14px;
    line-height: 23px;
  }

.subComponents_SelectInlineButton_button_52a.subComponents_SelectInlineButton_placeholder_9b3 {
    color: var(--colorTextLight);
  }

.subComponents_SelectInlineButton_button_52a.subComponents_SelectInlineButton_isOpen_359,
  .subComponents_SelectInlineButton_button_52a:hover {
    border: 1px solid var(--borderDefault);
    background-color: var(--surfaceBackgroundDefault);
  }

.subComponents_SelectInlineButton_button_52a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 6px;
    right: 6px;
    width: calc(100% - 12px);
    border-top: 1px solid var(--borderDefault);
  }

.subComponents_SelectInlineButton_button_52a.subComponents_SelectInlineButton_isDisabled_a01 {
    cursor: not-allowed;
    color: var(--colorTextLight);
    background-color: var(--formBackgroundDisabled);
  }

.subComponents_SelectInlineButton_icon_e7b {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  pointer-events: none;
  color: var(--colorIconDefault);
}

@layer atom {
  .subComponents_SelectInput_inputWrap_9e1 {
    --iconGap: 32px;
    position: relative;
  }

  .subComponents_SelectInput_flex_d6a {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
  }

  .subComponents_SelectInput_selectInput_5fa[type='search'] {
    background-color: var(--formBackground);
    /* TODO [darkmode] needs an alias, or --borderFocus needs updating */
    --colorButtonFocusRingDefault: var(--colorBlue20);

    padding-right: var(--iconGap);
    padding-left: 10px; /* Match the content of the select */
    -webkit-appearance: none; /* Fix border-radius issue on Mobile Safari */
    cursor: pointer;

    /* special styles for Select inputs that are embedded in elements that render */
    /* their own border and padding, e.g. the compose form (Send As & Templates) */
  }
    .subComponents_SelectInput_selectInput_5fa.subComponents_SelectInput_noBorder_8d9[type='search'] {
      width: auto;
      border: 1px solid transparent;
      box-shadow: none;
      width: 100%;
      transition: none;
      background-color: transparent;

      /* override */
    }
      .subComponents_SelectInput_selectInput_5fa.subComponents_SelectInput_noBorder_8d9[type='search']:focus {
        outline: none !important;

        /* match buttons */
        /* TODO: move be the default focus styles for all selects */
        border-color: var(--formBorderFocused);
      }

    .subComponents_SelectInput_selectInput_5fa.subComponents_SelectInput_hasError_66a[type='search'] {
      border-color: var(--formBorderDanger);
    }

    .subComponents_SelectInput_selectInput_5fa[type='search']:disabled {
      background-color: var(--formBackgroundDisabled);
    }

    /* hide placeholder text when disabled */
    .subComponents_SelectInput_selectInput_5fa[type='search']:disabled,
    .subComponents_SelectInput_selectInput_5fa[type='search']:disabled::placeholder {
      color: transparent;
    }

    /* By default, readonly inputs get a grey BG (global stylesheet) */
    /* which we don't want. But we do want disabled readonly inputs to get that BG. */
    .subComponents_SelectInput_selectInput_5fa[type='search'][readonly]:not(:disabled) {
      background-color: var(--formBackground);
    }

    .subComponents_SelectInput_tiny_589 .subComponents_SelectInput_selectInput_5fa[type='search'] {
      height: var(--inputHeightTiny);
      padding-left: var(--inputHorizontalPaddingTiny);
      font-size: var(--inputFontSizeTiny);
    }

    .subComponents_SelectInput_small_70c .subComponents_SelectInput_selectInput_5fa[type='search'] {
      height: 32px;
      font-size: 14px;
    }

    .subComponents_SelectInput_medium_bc1 .subComponents_SelectInput_selectInput_5fa[type='search'] {
      height: 52px;
    }

    .subComponents_SelectInput_large_a54 .subComponents_SelectInput_selectInput_5fa[type='search'] {
      height: 64px;
      font-size: 16px;
    }

    .subComponents_SelectInput_selectInput_5fa[type='search']:focus {
      outline: none;
      box-shadow: none;
      /* color: transparent; // no cursor when focused and not open */
    }

  /**
 * The element using the .inputTrigger class must completely cover the element using the .selectInput class (z-axis-wise).
 * Otherwise, users can directly click the .selectInput element which causes issues with the Popover not opening.
 * Issue reference: https://github.com/closeio/close-ui/issues/11293
*/
  .subComponents_SelectInput_inputTrigger_79d {
    border: 1px solid transparent;
    background: var(--formBackground);

    /**
   * `background-clip: content-box` makes the background color not apply to borders. This
   * is important for letting the .selectInput element's border show while only letting
   * users click the .inputTrigger element.
  */
    background-clip: content-box;
    position: absolute;
    z-index: 1;

    /* Cover the .selectInput element completely so no users can directly click on it */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    border-radius: var(--baseInputBorderRadius);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 1px var(--iconGap) 0 10px;
    color: var(--colorTextDefault);
  }

    .subComponents_SelectInput_inputTrigger_79d:disabled,
    .subComponents_SelectInput_inputTrigger_79d[aria-disabled='true'] {
      background: transparent;
      color: var(--colorTextLight);
      cursor: not-allowed;
    }

    .subComponents_SelectInput_tiny_589 .subComponents_SelectInput_inputTrigger_79d {
      padding-top: 0;
      padding-left: var(--inputHorizontalPaddingTiny);
      font-size: var(--inputFontSizeTiny);
    }

    .subComponents_SelectInput_small_70c .subComponents_SelectInput_inputTrigger_79d {
      font-size: 14px;
    }

    .subComponents_SelectInput_large_a54 .subComponents_SelectInput_inputTrigger_79d {
      font-size: 16px;
    }

    .subComponents_SelectInput_inputTrigger_79d.subComponents_SelectInput_isOpen_6fa {
      display: none;
    }

    /* account for extra icon here so ellipses don't overlap */
    .subComponents_SelectInput_inputTrigger_79d.subComponents_SelectInput_withClearButton_a43 {
      padding-right: calc(var(--iconGap) + 16px);
    }

  .subComponents_SelectInput_triggerText_ef1 {
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

    .subComponents_SelectInput_triggerText_ef1[data-placeholder='true'] {
      color: var(--colorTextLight);
    }

  .subComponents_SelectInput_inputIcon_e5d {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translateY(-50%);
    right: var(--spacing-12);
    pointer-events: none;
    color: var(--colorIconDefault);
  }

    .subComponents_SelectInput_inputIcon_e5d.subComponents_SelectInput_faded_d7a {
      color: var(--colorIconLight);
    }

  .subComponents_SelectInput_closeIcon_ebc {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translateY(-50%);
    right: 32px;
    cursor: pointer;
  }

    .subComponents_SelectInput_closeIcon_ebc:hover {
      color: var(--colorIconLight);
    }
}

.subComponents_SelectMenu_menu_453 {
  overflow-y: auto;

  /* push in front of popover arrow */
  position: relative;

  /* Inherit border radius from popover component */
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;

  z-index: 2;

  /* this will be used by both the fixed header itself (if it exists),
     and by individual items, so that they can be positioned in a way
     that prevents `scrollIntoView` from placing them under the fixed header. */
  --select-menu-fixed-header-height: 0;

  /* Prevent the menu from outgrowing the viewport. */
}

@media screen and (min-width: 768px) {

.subComponents_SelectMenu_menu_453 {
    max-width: calc(100vw - var(--spacing-24));
}
  }

.subComponents_SelectMenu_menu_453:focus {
    outline: none;
  }

.subComponents_SelectMenu_menu_453.subComponents_SelectMenu_hasFixedInlineSearch_33d {
    --select-menu-fixed-header-height: 48px;
  }

.subComponents_SelectMenu_menuItems_3b6 {
  /* use margin instead of padding, so that it collapses with margins of child elements */
  margin: 4px 0;
}

/* NOTE: item heights are also hardcoded in SelectMenu for the purposes of virtualization. */
.subComponents_Divider_divider_1a8 {
  border-top: 1px solid var(--borderDefault);
  margin: 4px 0;

  /* don't show two next to each other, */
  /* don't show if it follows the hidden search input, */
  /* don't show if all items above divider have been filtered out */
  /* dont' show a divider if it's the last item rendered */
}
.subComponents_Divider_divider_1a8 + .subComponents_Divider_divider_1a8,
  .subComponents_Divider_divider_1a8:first-child,
  .subComponents_Divider_divider_1a8:last-child {
    display: none;
  }

.subComponents_GroupHeading_groupItemWrap_061 {
  overflow: hidden;
}

/* NOTE: item heights are also hardcoded in SelectMenu for the purposes of virtualization. */
/* Also it's the same padding as in DropdownMenu's Subtitle. Make sure to sync */
.subComponents_GroupHeading_groupItem_b10 {
  margin: 0;
  position: relative;
  padding: 8px 32px 8px 16px;
  line-height: 16px;
}

.subComponents_GroupHeading_multiGroupItem_a02 {
  padding-left: 16px;
}

.subComponents_GroupHeading_groupToggle_99f {
  position: absolute;
  display: flex;
  top: 0;
  right: var(--spacing-4);
  bottom: 0;
  padding: 0 var(--spacing-8);
  cursor: pointer;
}

.subComponents_GroupHeading_count_17d {
  margin-left: 8px;
  display: flex;
  align-self: center;
}

.subComponents_GroupHeading_groupLabel_b66 {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.subComponents_GroupHeading_groupLabel_b66.subComponents_GroupHeading_withCount_7ca {
    min-width: 184px; /* give some extra space on right side for "x selected" label */
  }

.subComponents_GroupHeading_minimal_288 .subComponents_GroupHeading_groupLabel_b66,
  .subComponents_GroupHeading_minimal_288 .subComponents_GroupHeading_groupToggle_99f {
    cursor: default;
  }

.subComponents_InlineSearch_cloakedSearchWrap_a4f {
  position: absolute;
  height: 0;
  overflow: hidden;
}

.subComponents_InlineSearch_inlineSearchWrap_e10 {
  position: sticky;
  top: 0;
  box-sizing: border-box;
  height: var(--select-menu-fixed-header-height, 0);
  overflow: hidden;
  padding: var(--spacing-8) 0;
  background-color: var(--bgPopover);
  border-bottom: 1px solid var(--borderDefault);
  border-radius: inherit;
  z-index: 1;
}

/* Can't use SearchInput here as this maintains the same styles while focussed */
.subComponents_InlineSearch_inlineSearchInput_92f[type='search'],
  .subComponents_InlineSearch_inlineSearchInput_92f[type='search']:focus {
    border: none;
    background-color: var(--bgSearchEnabled);
    min-width: 200px;
  }

.subComponents_SelectItem_checkbox_38d {
  /* adjust left padding because there is no checkmark icon to offset from */
  /* adjust top & bottom to maintain consistent height (`Checkbox` has a custom non-20px line-height) */
  padding: 6px 24px 6px 16px;
}

.subComponents_SelectItem_checkIcon_fb2 {
  color: var(--colorIconLight);
  /* TODO [darkmode] maybe-temporary opacity treatment until we settle on an alias */
  opacity: 0;
}

.subComponents_SelectItem_checkIcon_fb2.subComponents_SelectItem_iconHovered_99b {
    opacity: 0.3;
  }

.subComponents_SelectItem_checkIcon_fb2.subComponents_SelectItem_iconActive_c88 {
    color: var(--bgFormControlEnabledChecked);
    opacity: 1;
  }

.subComponents_SelectPopover_flexWrapper_078 {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
}

.subComponents_ConfirmationFooter_footer_155 {
  /* shared with Popover.Footer */
  width: min-content;
  min-width: 100%;
  position: relative;
  box-sizing: border-box;
  z-index: 2;
  border-top: 1px solid var(--borderDefault);
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;

  padding: 12px 16px;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.AvatarGroup_group_78c {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
}

.AvatarGroup_avatarWrapper_b56 {
  display: block;
  position: relative;
  box-sizing: border-box;
  width: 12px;
  border-radius: 8px;
}

.AvatarGroup_avatarWrapper_b56.AvatarGroup_mini_351 {
    height: 20px;
  }

.AvatarGroup_avatarWrapper_b56.AvatarGroup_x-small_28a {
    height: 24px;
  }

.AvatarGroup_avatarWrapper_b56.AvatarGroup_small_5fe {
    height: 28px;
  }

/* Add full width to last child so children don't overflow container */

.AvatarGroup_avatarWrapper_b56.AvatarGroup_fixSizing_7a5.AvatarGroup_mini_351:last-child {
        width: 20px;
      }

.AvatarGroup_avatarWrapper_b56.AvatarGroup_fixSizing_7a5.AvatarGroup_x-small_28a:last-child {
        width: 24px;
      }

.AvatarGroup_avatarWrapper_b56.AvatarGroup_fixSizing_7a5.AvatarGroup_small_5fe:last-child {
        width: 28px;
      }

.AvatarGroup_imgWrap_22d {
  position: absolute;
  width: 16px;
  border: 2px solid var(--surfaceBackgroundLight);
  background-color: var(--surfaceBackgroundLight);
  opacity: 1;
  z-index: 1;
  border-radius: 50%;
}

.AvatarGroup_rest_6d6 {
  display: block;
}

.AvatarGroup_rest_6d6.AvatarGroup_mini_351 {
    margin-left: var(--spacing-8);
  }

.AvatarGroup_rest_6d6.AvatarGroup_x-small_28a,
  .AvatarGroup_rest_6d6.AvatarGroup_small_5fe {
    box-sizing: border-box;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--white);
    border-radius: 50%;
    background-color: var(--gray-90);
    color: var(--white);
  }

.AvatarGroup_rest_6d6.AvatarGroup_x-small_28a {
    width: 24px;
    height: 24px;
    font-size: 8px;
  }

.AvatarGroup_rest_6d6.AvatarGroup_small_5fe {
    width: 28px;
    height: 28px;
    font-size: 10px;
  }

.UserSelect_button_98d {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.UserSelect_button_98d.UserSelect_isDisabled_595 {
    pointer-events: none;
  }

/* equivalent of Btn__text in regular Button atoms */
.UserSelect_buttonLabel_326 {
  overflow: hidden;
  text-overflow: ellipsis;
}

.UserSelect_userSelectLabel_0b4 {
  display: flex;
  align-items: center;
  gap: 8px;
}

.UserSelect_groupMemberCount_cec {
  display: inline-block;
  font-size: 12px;
  color: var(--colorTextLight);
  margin-left: 8px;
  align-self: end;
}

.LeadAvatar_avatarContainer_b16 {
  position: relative;
  display: flex;
  flex-shrink: 0;
  box-sizing: border-box;
  -webkit-user-select: none;
          user-select: none;
}

.LeadAvatar_avatarContainer_b16 * {
    box-sizing: border-box;
  }

.LeadAvatar_avatarContainer_b16.LeadAvatar_mini_7d3 {
    width: 16px;
    height: 16px;
    font-size: 8px;
    line-height: 8px;
  }

.LeadAvatar_avatarContainer_b16.LeadAvatar_small_1db {
    width: 20px;
    height: 20px;
    font-size: 10px;
    line-height: 10px;
  }

.LeadAvatar_avatarContainer_b16.LeadAvatar_medium_6fc {
    width: 32px;
    height: 32px;
    font-size: 12px;
    line-height: 12px;
  }

.LeadAvatar_avatarContainer_b16.LeadAvatar_large_0ed {
    width: 48px;
    height: 48px;
    font-size: 18px;
    line-height: 24px;
  }

.LeadAvatar_image_d36 {
  width: 100%;
  height: 100%;
  visibility: hidden;
}

.LeadAvatar_imageLoaded_2dd {
  border-radius: var(--baseBorderRadius);
  visibility: visible;
}

.LeadAvatar_fallback_42b {
  display: flex;

  /* removes the element from the flow, preventing the letter to be underlined when used inside a link */
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-weight: var(--fontWeightBold);
  letter-spacing: 0;
  text-align: center;
  text-transform: uppercase;
  color: var(--colorFillAvatarGray);
}

.LeadAvatar_fallbackCircle_33e {
  border-radius: 100%;
  border: 1px solid var(--colorFillTransparent10);
  background: var(--surfaceBackgroundDefault);
  background-color: var(--colorBgAvatarGray);
}

.LeadAvatar_fallbackIcon_f3a {
  width: 70%;
  height: 70%;
}

.ContentLoader_contentLoader_879 {
  min-height: 50px;
}

.ContentLoader_content_658 {
  transition: all 200ms var(--standardCurve);
}

.ContentLoader_active_1f6 {
  position: relative;
}

.ContentLoader_active_1f6 .ContentLoader_content_658 {
    opacity: 0;
    pointer-events: none;
    height: 0;
  }

.ContentLoader_spinnerWrapper_6b9 {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  z-index: 1;
  align-items: center;
  justify-content: center;
  color: var(--colorIconLight);
}

.ContentLoader_spinner_94c {
  margin-right: 5px;
}

.FileDropzone_dropzone_865 {
  display: block;
  width: 100%;
}

.AttachmentTiles_tiles_a94 {
  --attachmentTileWidth: 334px;

  width: 100%;
  display: grid;
  gap: 8px;
}

@media screen and (min-width: 768px) {

.AttachmentTiles_tiles_a94 {
    grid-template-columns: repeat(auto-fill, var(--attachmentTileWidth));
}
  }

.AttachmentTiles_errorBox_660 {
  position: relative;
  margin: 8px 0 0 0;
  padding: 14px 38px 14px 16px;
  background-color: #fbe6e8;
  border: 1px solid var(--borderDefault);
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
  border-radius: 7px;
  font-size: 13px;
}

.AttachmentTiles_errorBox_660 button {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 1;
    opacity: 0.25;
    transition: opacity 0.2s ease-in;
  }

/* TODO: Possibly create a button variant for such cases (icon button within colorful background) */

.AttachmentTiles_errorBox_660 button:hover,
  .AttachmentTiles_errorBox_660 button:active,
  .AttachmentTiles_errorBox_660 button:focus-visible,
  .AttachmentTiles_errorBox_660 button:active:hover {
    opacity: 1;
    background-color: transparent;
  }

.AttachmentIcon_icon_14b {
  display: grid;
  place-content: center;
  width: var(--size, 16px);
  height: var(--size, 16px);
  min-width: var(--size, 16px);
  min-height: var(--size, 16px);
}.AttachmentIcon_icon_14b svg {
    width: 100%;
    height: 100%;
  }

.AttachmentTiles_AttachmentTile_tile_b15 {
  --iconSize: 16px;
  --fileSizeWidth: 70px;
  --attachmentTileHeight: 32px;
  --attachmentTileSpacing: 8px;

  position: relative;
  overflow: hidden;
  display: flex;
  max-width: 100%;
  width: 100%;
  column-gap: var(--attachmentTileSpacing);
  align-items: center;
  height: var(--attachmentTileHeight);
  padding-left: var(--attachmentTileSpacing);
  box-sizing: border-box;
  border: 1px solid var(--borderDefault);
  background: var(--bgCardBase);
  border-radius: 3px;
  box-shadow: var(--shadowLevel1);
  color: var(--colorTextDefault);
}

.AttachmentTiles_AttachmentTile_tile_b15:hover,
  .AttachmentTiles_AttachmentTile_tile_b15:visited,
  .AttachmentTiles_AttachmentTile_tile_b15:focus {
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.AttachmentTiles_AttachmentTile_tile_b15:focus {
    /* TODO: possibly a lil nice blue border */
  }

div.AttachmentTiles_AttachmentTile_tile_b15 {
  cursor: default;
}

.AttachmentTiles_AttachmentTile_errorIcon_47b {
  flex: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--iconSize);
  height: var(--iconSize);
  border-radius: 3px;
  color: var(--failurePrimaryColor);
}

.AttachmentTiles_AttachmentTile_actions_b2b {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 0 auto;
  width: 30px;
  height: 30px;
}

.AttachmentTiles_AttachmentTile_loading_905 .AttachmentTiles_AttachmentTile_actions_b2b {
    color: var(--colorTextLight);
  }

.AttachmentTiles_AttachmentTile_actions_b2b svg {
    width: var(--iconSize);
    height: var(--iconSize);
  }

.AttachmentTiles_AttachmentTile_actions_b2b span {
    /* flex fixes vertical line-height bug */
    display: flex;
  }

.AttachmentTiles_AttachmentTile_actions_b2b button {
    width: 24px;
    height: 24px;
    padding: 0;
  }

.FileDropzone_DropArea_droparea_f69 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 60px;
  border: 2px dashed #999;
  color: #777;
  font-size: 16px;
}.FileDropzone_DropArea_droparea_f69.FileDropzone_DropArea_draggingOver_34e {
    border-color: var(--colorLinkDefault);
    color: var(--colorLinkDefault);
  }.FileDropzone_DropArea_droparea_f69[hidden] {
    display: none;
  }

.AttachmentsPicker_attachmentsContainer_b8f {
  max-height: 140px;
  overflow: hidden auto;
  background: var(--surfaceBackgroundMedium);
}

.AttachmentCards_wrapper_7ea {
  box-sizing: border-box;
}

.AttachmentCards_wrapper_7ea *,
  .AttachmentCards_wrapper_7ea *:before,
  .AttachmentCards_wrapper_7ea *:after {
    box-sizing: inherit;
  }

.AttachmentCards_cards_220 {
  /* keep in sync with ./index.js */
  --attachmentCardWidth: 164px;

  display: grid;
  grid-template-columns: repeat(auto-fit, var(--attachmentCardWidth));
  gap: var(--spacing-8);
}

.AttachmentCards_cards_220.AttachmentCards_justify-start_679 {
    justify-content: flex-start;
  }

.AttachmentCards_cards_220.AttachmentCards_justify-end_5ec {
    justify-content: flex-end;
  }

.AttachmentCards_mediaPlayerColumn_56b {
  /* make the audio player always span a whole row */
  grid-column: 1 / -1;
  max-width: 1024px;
}

.AttachmentThumbnail_thumbnail_34d {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: 0.3s opacity linear;
  z-index: 0;
}.AttachmentThumbnail_thumbnail_34d.AttachmentThumbnail_loaded_06f {
    opacity: 1;
  }

.AttachmentCards_AttachmentCard_card_314 {
  --iconSize: 24px;

  /* flex forces the card to collapse in height */
  display: flex;
  position: relative;
  width: var(--attachmentCardWidth);
  border: 1px solid var(--borderLight);
  border-radius: 7px;
  background: var(--colorBgCardAttachmentDefault);
  overflow: hidden;
  cursor: pointer;
}

.AttachmentCards_AttachmentCard_card_314:hover,
  .AttachmentCards_AttachmentCard_card_314:visited,
  .AttachmentCards_AttachmentCard_card_314:focus {
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.AttachmentCards_AttachmentCard_card_314:hover {
    background: var(--colorBgCardAttachmentHover);
    border-color: var(--borderDefault);
  }

.AttachmentCards_AttachmentCard_card_314:focus {
    border-color: var(--borderFocused);
    outline: none;
  }

.AttachmentCards_AttachmentCard_default_4d1:hover,
  .AttachmentCards_AttachmentCard_default_4d1:focus {
    background: var(--colorBgCardAttachmentHover);
  }

.AttachmentCards_AttachmentCard_thumbnail_12b {
  position: absolute;
  inset: 0;
  object-fit: cover;
  opacity: 0;
  transition: 0.3s opacity linear;
  z-index: 0;
}

.AttachmentCards_AttachmentCard_thumbnail_12b.AttachmentCards_AttachmentCard_loaded_cfb {
    opacity: 1;
  }

.AttachmentCards_AttachmentCard_player_f79 {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-content: center;
  background-color: color-mix(in srgb, var(--colorBlack) 20%, transparent);
  opacity: 0;
  transition: 0.1s opacity linear;
  pointer-events: none;
}

.AttachmentCards_AttachmentCard_card_314:is(:hover, :focus) .AttachmentCards_AttachmentCard_player_f79 {
    opacity: 1;
  }

.AttachmentCards_AttachmentCard_playerIcon_75c {
  color: var(--colorWhite);
}

.AttachmentCards_AttachmentCard_playerIcon_75c svg {
    width: 40px;
    height: 40px;
  }

@keyframes AttachmentCards_AttachmentCard_skeleton_38d {
  0% {
    background-color: color-mix(
      in srgb,
      var(--colorTextDefault) 40%,
      transparent
    );
  }
  100% {
    background-color: color-mix(
      in srgb,
      var(--colorTextDefault) 70%,
      transparent
    );
  }
}

.AttachmentCards_AttachmentCard_content_365 {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: var(--spacing-16);
  justify-content: space-between;
  min-width: 0;
  padding: var(--spacing-8);
  position: relative;
  width: 100%;
  z-index: 1;
}

.AttachmentCards_AttachmentCard_content_365.AttachmentCards_AttachmentCard_shortContent_a29 {
    align-items: center;
    flex-direction: row;
    gap: var(--spacing-8);
  }

.AttachmentCards_AttachmentCard_content_365.AttachmentCards_AttachmentCard_hasThumbnail_875 {
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.25) 50%,
      rgba(0, 0, 0, 0.8) 100%
    );

    transition:
      0.1s opacity linear,
      0.1s background linear;
  }

.AttachmentCards_AttachmentCard_card_314:is(:hover, :focus) .AttachmentCards_AttachmentCard_content_365.AttachmentCards_AttachmentCard_hasThumbnail_875 {
      /* Needs to remain a gradient for transition to work without flickering */
      /* Hexcode is from Figma. No matching token available for this color */
      background: linear-gradient(
        180deg,
        rgba(38, 46, 57, 0.7) 50%,
        rgba(38, 46, 57, 0.7) 100%
      );
    }

.AttachmentCards_AttachmentCard_content_365.AttachmentCards_AttachmentCard_hasThumbnail_875:not(.AttachmentCards_AttachmentCard_loaded_cfb) {
      animation: AttachmentCards_AttachmentCard_skeleton_38d 0.5s infinite alternate;
    }

.AttachmentCards_AttachmentCard_icon_86f {
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--iconSize);
  height: var(--iconSize);
  border-radius: 50%;
  color: #fff;
}

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_imageIcon_eca {
    background: var(--closeBrightBlue);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_videoIcon_0d3 {
    background: var(--successPrimaryColor);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_audioIcon_198 {
    background: var(--warningPrimaryColor);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_pdfIcon_225 {
    background: var(--failurePrimaryColor);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_wordIcon_9ad {
    background: var(--colorBrandBlue);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_excelIcon_155 {
    background: var(--successPrimaryColor);
  }

.AttachmentCards_AttachmentCard_icon_86f.AttachmentCards_AttachmentCard_defaultIcon_aa2 {
    background: var(--colorTextDefault);
  }

.AttachmentCards_AttachmentCard_svg_c62 {
  display: block;
  width: 10px;
  height: 10px;
}

.AttachmentCards_AttachmentCard_svg_c62 svg {
    display: block;
  }

.AttachmentCards_AttachmentCard_text_077 {
  /* flex fixes vertical line-height bug */
  display: flex;
  line-height: 16px;
  min-width: 0;
}

.AttachmentCards_AttachmentCard_text_077 span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

.AttachmentCards_AttachmentCard_attachmentName_f45 {
  color: var(--colorTextDefault);
  font-size: var(--fontSizeTiny);
}

.AttachmentCards_AttachmentCard_attachmentName_f45.AttachmentCards_AttachmentCard_short_167 {
    font-size: var(--fontSizeSmall);
  }

.AttachmentCards_AttachmentCard_attachmentName_f45.AttachmentCards_AttachmentCard_withThumbnail_d02 {
    color: var(--colorTextNeutralWhite);
  }

.AttachmentCards_AttachmentCard_size_c95 {
  color: var(--colorTextLight);
  letter-spacing: 0.25px;
  font-size: 11px;
  font-weight: var(--fontWeightRegular);
  text-transform: uppercase;
}

.AttachmentCards_AttachmentCard_size_c95.AttachmentCards_AttachmentCard_short_167 {
    font-size: var(--fontSizeTiny);
  }

.AttachmentCards_AttachmentCard_size_c95.AttachmentCards_AttachmentCard_withThumbnail_d02 {
    color: var(--colorTextNeutralWhite);
  }

.AppFilterBar_container_ea5 {
  flex: 0 0 auto;
  position: relative;
  height: var(--appFilterBarHeight);
  max-height: var(--appFilterBarHeight);
  overflow-y: hidden;
  transition: max-height 0.2s;
}

.AppFilterBar_containerClosed_181 {
  max-height: 0;
}

.AppFilterBar_main_1e6 {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 0 var(--spacing-12);
  box-sizing: border-box;
  height: var(--appFilterBarHeight);

  overflow-x: scroll;
  scrollbar-width: none;
  --ms-overflow-style: none;
}

.AppFilterBar_main_1e6::-webkit-scrollbar {
    display: none;
  }

/* Matches medium.down conditional rendering (so with no Column wrapper) */

@media screen and (max-width: 1119px) {

.AppFilterBar_main_1e6 {
    gap: var(--spacing-4);
}
  }

/* Matches large.up conditional rendering (so with Column wrapper) */

@media screen and (min-width: 1120px) {

.AppFilterBar_main_1e6 {
    justify-content: space-between;
    gap: var(--spacing-12);

    /* By default, flex items won't shrink
     beyond their minimum content size, possibly overflowing the parent.
     We can change that by explicitly setting no minimum width. */
}
    .AppFilterBar_main_1e6 > * {
      min-width: 0;
    }
  }

.AppFilterBar_column_ed1 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: var(--spacing-4);

  /* By default, flex items won't shrink
     beyond their minimum content size, possibly overflowing the parent.
     We can change that by explicitly setting no minimum width. */
}

@media screen and (min-width: 1120px) {

.AppFilterBar_column_ed1 {
    min-width: 0;
}

    .AppFilterBar_column_ed1 > * {
      min-width: 0;
    }
  }

.AppFilterBar_divider_b65 {
  background: var(--colorFillTransparent10);
  height: 20px;
  margin: 0 var(--spacing-8);
  width: 1px;
}

.Token_wrapper_cc5 {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  max-width: 100%;
}

.Token_root_007 {
  /* TODO: consider moving to a global scope and share with other components */
  --tokenHeightMedium: 24px;

  width: 100%;
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
  padding: 0px var(--spacing-8);
  background-color: var(--bgTokenDefault);
  height: var(--tokenHeightMedium);
  border-radius: var(--tokenHeightMedium);
  white-space: nowrap;
  border: 1px solid transparent;
  color: var(--tokenTextColor);
  box-sizing: border-box;
  font-size: var(--fontSizeSmall);
  color: var(--colorTextDefault);
}

.Token_root_007.Token_withRemoveButton_325 {
    padding-right: 28px;
  }

.Token_root_007:focus,
  .Token_root_007:focus-visible:not(.Token_disabled_8ab) {
    outline: none;
    box-shadow: 0px 0px 0px 2px var(--borderFocused);
  }

.Token_root_007.Token_danger_c9d {
    background-color: var(--bgTokenDanger);
    color: var(--colorTextDanger);
  }

.Token_root_007.Token_danger_c9d:hover {
      background-color: var(--bgTokenDangerHover);
    }

.Token_root_007.Token_danger_c9d:active {
      background-color: var(--bgTokenDangerPressed);
    }

.Token_root_007.Token_danger_c9d:focus,
    .Token_root_007.Token_danger_c9d:focus-visible:not(.Token_disabled_8ab) {
      outline: none;
      box-shadow: 0px 0px 0px 2px var(--borderDangerMuted);
    }

.Token_root_007.Token_secondary_cdb {
    background-color: var(--bgDefaultMuted);
  }

.Token_root_007.Token_secondary_cdb:focus,
    .Token_root_007.Token_secondary_cdb:focus-visible:not(.Token_disabled_8ab) {
      outline: none;
      box-shadow: 0px 0px 0px 2px var(--borderDefault);
    }

.Token_root_007.Token_disabled_8ab {
    opacity: 0.7;
    cursor: not-allowed;
  }

.Token_interactive_1e5 {
  cursor: pointer;
}

.Token_interactive_1e5:hover:not(.Token_disabled_8ab) {
    background-color: var(--bgTokenHover);
  }

.Token_interactive_1e5:active:not(.Token_disabled_8ab) {
    background-color: var(--bgTokenPressed);
  }

.Token_interactive_1e5 .Token_secondary_cdb:hover:not(.Token_disabled_8ab) {
      background-color: var(--bgDefaultMutedHover);
    }

.Token_interactive_1e5 .Token_secondary_cdb:active:not(.Token_disabled_8ab) {
      background-color: var(--bgDefaultMutedPressed);
    }

.Token_removeButtonWrapper_cc4 {
  position: absolute;
  right: var(--spacing-4);
  top: 0.5px;
}

.Token_draggableTokenWrapper_e62 {
  display: flex;
  align-items: center;
  z-index: 2;
  max-width: 100%;
  /* keep in sync with --tokenHeightMedium */
  border-radius: 24px;
}

.Token_draggableTokenWrapper_e62.Token_draggable_144 {

    touch-action: none;
  }

.Token_draggableTokenWrapper_e62.Token_draggable_144 .Token_root_007 {
      cursor: grab;
    }

.Token_draggableTokenWrapper_e62.Token_draggable_144.Token_dragging_8ca {
      box-shadow: var(--shadowLevel2);
    }

.Token_draggableTokenWrapper_e62.Token_draggable_144.Token_dragging_8ca .Token_root_007 {
        cursor: grabbing;
      }

.MultiSortBySelect_buttonContainer_765 {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0 4px;
}

.MultiSortBySelect_button_5ce {
  flex: 1 0 auto;
  margin: 4px;
}

.MultiSortBySelect_popoverActions_c82 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: var(--surfaceBackgroundDefault);
}

.MultiSortBySelect_anotherSortFieldButton_657:disabled,
  .MultiSortBySelect_anotherSortFieldButton_657:disabled:hover {
    border: none;
  }

.MultiSortBySelect_SortFieldsList_sortField_c79 {
  display: flex;
  align-items: center;
  padding: 6px 7px 6px 10px;
}

@media screen and (min-width: 768px) {
      .MultiSortBySelect_SortFieldsList_sortField_c79:hover .MultiSortBySelect_SortFieldsList_dragHandle_63a {
        display: flex;
      }

        :is(.MultiSortBySelect_SortFieldsList_sortField_c79:hover .MultiSortBySelect_SortFieldsList_dragHandle_63a) + .MultiSortBySelect_SortFieldsList_sortFieldNumber_e9f {
          display: none;
        }
  }

.MultiSortBySelect_SortFieldsList_sortFieldNumber_e9f {
  width: 16px;
  margin: 0 8px;
  line-height: 16px;
  text-align: center;
}

.MultiSortBySelect_SortFieldsList_sortFieldLabelWrapper_b4e {
  position: relative;
  width: 198px;
}

@media screen and (max-width: 767px) {

.MultiSortBySelect_SortFieldsList_sortFieldLabelWrapper_b4e {
    width: 140px;
}
  }

.MultiSortBySelect_SortFieldsList_directionButtons_f04 {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);

  /* needs to be within .directButtons to properly override ButtonGroup specificity */
}

.MultiSortBySelect_SortFieldsList_directionButtons_f04 .MultiSortBySelect_SortFieldsList_directionButton_cbb {
    width: 72px;
    height: 28px;
    border: 2px solid var(--borderDefault);
    border-radius: 3px;
    font-size: 11px;
    font-weight: var(--fontWeightBold);
  }

.MultiSortBySelect_SortFieldsList_directionButtons_f04 .MultiSortBySelect_SortFieldsList_directionButton_cbb.MultiSortBySelect_SortFieldsList_active_54d {
      border-color: var(--borderActive);
    }

.MultiSortBySelect_SortFieldsList_dragHandle_63a {
  display: none;
  align-items: center;
  margin: 0 8px;
  cursor: grab;
}

.MultiSortBySelect_SortFieldsList_dragHandle_63a svg {
    width: 16px;
  }

.Loader_FullScreenLoader_container_e0f {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* TODO [darkmode] overlay alias? */
  background: rgba(0, 0, 0, 0.6);
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--colorTextNeutralWhite);
  font-size: 22px;
  flex-direction: column;
}

.Loader_FullScreenLoader_loadingIcon_c36 {
  display: block;
  margin-bottom: 20px;
}

.Loader_FullScreenLoader_loadingIcon_c36 svg {
    width: 40px;
    height: 40px;
  }

.Tabs_tabs_a5a {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  margin: 0;
  border-bottom: 1px solid var(--borderDefault);
}

.Tabs_tabs_a5a:not(.Tabs_fitted_177) {
    justify-content: flex-start;
    grid-template-columns: min-content;
    gap: var(--spacing-20);
  }

.Tabs_tab_b33 {
  display: block;
}

.Tabs_tabButton_ec0 {
  position: relative;
  display: flex;
  align-items: center;
  appearance: none;
  background: none;
  border: none;
  white-space: nowrap;
  padding: 0 0 10px;
  color: var(--colorTextLight);
}

.Tabs_fitted_177 .Tabs_tabButton_ec0 {
    width: 100%;
    justify-content: center;
  }

.Tabs_tabButton_ec0::after {
    content: '';
    position: absolute;
    display: block;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    border-radius: 1px;
    background-color: transparent;
  }

.Tabs_tabButton_ec0.Tabs_active_8ca,
  .Tabs_tabButton_ec0:hover {
    outline: none;
    color: var(--colorTextDefault);
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.Tabs_tabButton_ec0.Tabs_active_8ca .Tabs_badge_74e,
    .Tabs_tabButton_ec0:hover .Tabs_badge_74e,
    .Tabs_tabButton_ec0.Tabs_active_8ca .Tabs_icon_24c,
    .Tabs_tabButton_ec0:hover .Tabs_icon_24c {
      color: var(--colorTextDefault);
    }

/* reset focus styles when tab is a link */

.Tabs_tabButton_ec0:focus {
    color: inherit;
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.Tabs_tabButton_ec0.Tabs_active_8ca::after {
    background-color: var(--colorTextDefault);
  }

.Tabs_tabButton_ec0:not(.Tabs_active_8ca):hover::after {
    background-color: var(--borderHover);
  }

.Tabs_badgeWrap_2c2 {
  margin-left: 6px;
  vertical-align: bottom;
  min-width: 1em;
  line-height: 1;
}

/* This is essentially the `outlined` variant of Badge, but we're using
   BaseBadge instead so we can apply different active/inactive styles */
.Tabs_badge_74e {
  border-color: var(--bgDefaultMuted);
  color: var(--colorTextLight);
  background-color: var(--bgDefaultMuted);
}

.Card_card_dd2 {
  background: var(--bgCardBase);
  border: 1px solid var(--borderDefault);
  border-radius: 7px;
  box-shadow: var(--shadowLevel1);
  transition: box-shadow linear 0.3s;
}.Card_card_dd2:hover:not(.Card_fixed_8a3) {
    box-shadow: var(--shadowLevel2);
    background: var(--bgCardHover);
  }.Card_card_dd2.Card_shadowLevel3_d1c {
    box-shadow: var(--shadowLevel3);
  }.Card_card_dd2.Card_shadowLevel4_1d3 {
    box-shadow: var(--shadowLevel4);
  }.Card_card_dd2:focus-within:not(.Card_fixed_8a3) {
    border-color: transparent;
  }.Card_card_dd2.Card_border-solid_b28 {
    border-style: solid;
  }.Card_card_dd2.Card_border-dashed_e1b {
    border-style: dashed;
  }.Card_card_dd2.Card_defaultBorderColor_201:focus-within {
    border-color: var(--borderDefault);
  }

.Breadcrumbs_breadcrumbs_847 {
  margin: 0;
  display: flex;
}

.Breadcrumbs_crumb_547 {
  display: flex;
}

.Breadcrumbs_crumb_547:not(:last-child)::after {
    content: '/';
    display: flex;
    margin: 0 10px;
    color: var(--borderDefault);
  }

.Breadcrumbs_link_974 {
  display: flex;
  align-items: center;
  padding: 0;
  position: relative;
  appearance: none;
  background: none;
  border: none;
  font-size: 13px;
  color: var(--colorTextLight);
}

.Breadcrumbs_link_974:hover {
    color: var(--colorTextDefault);
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.Breadcrumbs_link_974:focus {
    color: inherit;
    -webkit-text-decoration: none;
    text-decoration: none;
  }

.Breadcrumbs_icon_8fa {
  margin-right: 6px;
}

.Breadcrumbs_icon_8fa svg {
    width: 14px;
  }

.DockedAIAssistant_root_f9b {
  position: fixed;
  bottom: var(--spacing-24);
  right: var(--spacing-24);
  z-index: var(--zindexDockedElement);
}

.DockedAIAssistant_tooltipContent_94d {
  display: flex;
  flex-direction: column;
  background: var(--colorBgTooltip);
}

.DockedAIAssistant_button_615 {
  box-shadow: 0px 8px 16px -8px rgba(0, 0, 0, 0.25);
}

.DotSeparator_dotSeparator_ce0 {
  -webkit-user-select: none;
          user-select: none;
  display: inline-block;
  color: var(--colorIconLight);
}

.Form_hiddenSubmit_19a {
  /*
    We can't use "display: none" as implicit form submit would NOT work in Safari if there is a readonly element.
    See https://stackoverflow.com/questions/47559991/html-form-onsubmit-fails-to-fire-on-certain-browsers-with-hidden-submit-button-a
  */
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: -3000px;
}

.Form_fetcherForm_2c9 {
  /* base form have 20px of bottom margin */
  margin: 0;
}

.Toast_main_a90 {
  background-color: var(--surfaceBackgroundDefault);
  border: 1px solid var(--borderLight);
  border-radius: var(--baseInputBorderRadius);
  box-shadow: var(--shadowLevel2);
  max-width: 400px;
}

@media screen and (max-width: 767px) {

.Toast_main_a90 {
    max-width: calc(100vw - 64px);
}
  }

.Toast_default_e22 {
  background-color: var(--surfaceBackgroundDefault);
  border-color: var(--borderLight);
}

.Toast_success_24e {
  background-color: var(--bgSuccessMuted);
  border-color: var(--borderSuccessMuted);
}

.Toast_warning_3b3 {
  background-color: var(--bgWarnMuted);
  border-color: var(--borderWarnMuted);
}

.Toast_danger_432 {
  background-color: var(--bgDangerMuted);
  border-color: var(--borderDangerMuted);
}

.Toast_informational_4cf {
  background-color: var(--bgInformationalMuted);
  border-color: var(--borderInformationalMuted);
}

.Toast_icon_858 {
  height: 16px;
  position: relative;
  top: 5px; /* Center the icon vertically in the first line of text */
  width: 16px;
}

.Toast_default_e22 .Toast_icon_858 {
    color: var(--colorIconDefault);
  }

.Toast_success_24e .Toast_icon_858 {
    color: var(--fillSuccess);
  }

.Toast_warning_3b3 .Toast_icon_858 {
    color: var(--fillWarn);
  }

.Toast_danger_432 .Toast_icon_858 {
    color: var(--fillDanger);
  }

.Toast_informational_4cf .Toast_icon_858 {
    color: var(--fillInformational);
  }

.Toast_text_ee6 {
  font-size: var(--fontSizeBase);
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: 3px 0; /* Center the first line of text vertically with the close icon when single or multi-line */
}

.Toast_close_51a {
  background-color: var(--bgButtonBorderlessEnabled);
  border-radius: 100%;
  box-sizing: border-box;
  color: var(--colorIconDefault);
  cursor: pointer;
  display: flex;
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  justify-content: center;
  align-items: center;
  border: 0;
  outline: 0;
  padding: var(--spacing-4);
}

.Toast_close_51a:hover {
    background-color: var(--bgButtonBorderlessHover);
  }

.Toast_close_51a:active {
    background-color: var(--bgButtonBorderlessPressed);
  }

.KeystrokePicker_KeystrokePickerEmptyState_emptyState_090 {
  margin-top: 32px;
  overflow: hidden;
  cursor: default;
}

.KeystrokePicker_KeystrokePickerEmptyState_noAvailableItemsGraphic_4a5 svg {
    width: 37px;
  }

.KeystrokePicker_KeystrokePickerEmptyState_noMatchingItemsGraphic_000 svg {
    width: 64px;
  }

.KeystrokePicker_KeystrokePickerInlineWrapper_keystrokePicker_867 {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.KeystrokePicker_KeystrokePickerInlineWrapper_keystrokePickerNoAvailableItems_045 {
  cursor: default;
}

.Default_default_b7b {
  display: flex;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Default_defaultText_f11 {
  flex: 0 1 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 8px;
}

.Default_defaultTokenText_454 {
  flex: 0 1 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.Default_defaultTokenRemove_503 {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--colorIconDefault);
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  opacity: 0.5;
}

.Default_defaultTokenRemove_503 span {
    width: 14px;
    height: 14px;
  }

.Default_defaultTokenRemove_503 span svg {
      display: block;
    }

.KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0 {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  flex: 0 0 auto;
  box-sizing: border-box;
  max-height: 112px; /* Enough for three rows of tokens */
  margin: 0;
  padding: 6px 8px;
  gap: 4px;
  overflow-y: auto;
  border: 1px solid var(--borderDefault);
  border-radius: var(--baseInputBorderRadius);
  background-color: var(--formBackground);
  transition: background-color ease-in-out 150ms;
}

.KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0:focus-within {
    border: solid 1px var(--formBorderFocused);
  }

.KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0.KeystrokePicker_KeystrokePickerInput_withResetButton_c50 {
    padding-right: 36px;
  }

.KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0.KeystrokePicker_KeystrokePickerInput_error_9de:not(.KeystrokePicker_KeystrokePickerInput_disabled_823) {
    border-color: var(--borderDanger);
  }

.KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0 *,
  .KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0 *::before,
  .KeystrokePicker_KeystrokePickerInput_selectedTokens_5d0 *::after {
    box-sizing: border-box;
  }

.KeystrokePicker_KeystrokePickerInput_searchInputContainer_96f {
  flex: 1 1 auto;
  margin-left: 2px;
}

.KeystrokePicker_KeystrokePickerInput_searchInput_cd1 {
  width: 100%;
  padding: 0;
  border: none !important;
  border-radius: 0;
  background: transparent;
  font-size: 13px;
  line-height: 24px;
}

.KeystrokePicker_KeystrokePickerInput_searchInput_cd1:focus {
    outline: none;
  }

.KeystrokePicker_KeystrokePickerInput_searchInput_cd1:disabled {
    visibility: hidden;
  }

.KeystrokePicker_KeystrokePickerInput_resetButton_b48 {
  position: absolute;
  top: 5px;
  right: 5px;
}

.KeystrokePicker_KeystrokePickerMenu_menu_826 {
  display: flex;
  flex-direction: column;
  /* Make sure that maxHeight supplied by JS is internal height only */
  box-sizing: content-box;

  /* But make sure that all children are sized by border-box */
}

.KeystrokePicker_KeystrokePickerMenu_menu_826 *, .KeystrokePicker_KeystrokePickerMenu_menu_826 *::before, .KeystrokePicker_KeystrokePickerMenu_menu_826 *::after {
    box-sizing: border-box;
  }

.KeystrokePicker_KeystrokePickerMenu_menu_826.KeystrokePicker_KeystrokePickerMenu_withBorder_8e8:not(.KeystrokePicker_KeystrokePickerMenu_empty_30b) {
      border-top: solid 1px var(--borderLight);
      border-bottom: solid 1px var(--borderLight);
    }

.KeystrokePicker_KeystrokePickerMenu_menuItem_c38 {
  cursor: pointer;
  border-bottom: solid 1px var(--borderLight);
}

.KeystrokePicker_KeystrokePickerMenu_menuItem_c38.KeystrokePicker_KeystrokePickerMenu_isLastItem_997 {
    border-bottom: 0;
  }

.KeystrokePicker_KeystrokePickerMenu_menuItemSelected_7f5,
.KeystrokePicker_KeystrokePickerMenu_menuItemHighlighted_92d {
  background: var(--bgMenuItemHover);
}

.KeystrokePicker_KeystrokePickerMenu_menuItemDisabled_a43 {
  cursor: not-allowed;

  /* apply to children so as not to opacify border */
}

.KeystrokePicker_KeystrokePickerMenu_menuItemDisabled_a43 > * {
    opacity: 0.5;
  }

.KeystrokePicker_KeystrokePickerMenu_vanillaScrollContainer_a08 {
  flex: 1 1 auto;
  overflow-y: auto;
}

.User_user_5f7 {
  display: flex;
  place-items: center;
  height: 55px;
  font-size: 14px;
  line-height: 20px;
  color: var(--colorTextDefault);
}

.User_user_5f7.User_inactive_2f4 {
    color: var(--colorTextLight);
  }

.User_userAvatar_43d {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  /* Set express dims to avoid jank on image load */
  width: 48px;
  height: 100%;
}

.User_inactive_2f4 .User_userAvatar_43d {
    opacity: 50%;
  }

.User_userNameAndEmail_8dc {
  flex: 0 1 100%;
  overflow: hidden;
}

.User_userName_042 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.User_userEmail_39a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  color: var(--colorTextLight);
}

.User_userEnterPrompt_124 {
  flex: 0 0 auto;
  position: relative;
  top: 2px;
  margin: 0 16px 0 12px;
  visibility: hidden;
}

.User_userHighlighted_6df .User_userEnterPrompt_124 {
    visibility: visible;
  }

.User_userTokenAvatarAndName_e93 {
  display: flex;
  gap: 4px;
}

.User_userTokenAvatar_e07 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  /* Set express dims to avoid jank on image load */
  width: 16px;
  height: 16px;
}

.User_userTokenName_ab8 {
  flex: 0 1 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  line-height: 16px;
}

.Group_group_4c4 {
  display: flex;
  place-items: center;
  height: 55px;
  font-size: 14px;
  line-height: 20px;
  color: var(--colorTextDefault);
}

.Group_group_4c4.Group_inactive_218 {
    color: var(--colorTextLight);
  }

.Group_groupAvatar_497 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  /* Set express dims to avoid jank on image load */
  width: 48px;
  height: 100%;
}

.Group_inactive_218 .Group_groupAvatar_497 {
    opacity: 50%;
  }

.Group_groupTextContent_40e {
  display: flex;
  flex: 0 1 100%;
  justify-content: space-between;
}

.Group_groupNameAndCount_8db {
  flex: 0 1 auto;
}

.Group_groupName_b40 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Group_groupMemberCount_54e {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--colorTextLight);
}

.Group_groupEnterPrompt_80a {
  flex: 0 0 auto;
  position: relative;
  top: 2px;
  margin: 0 16px 0 12px;
  visibility: hidden;
}

.Group_groupHighlighted_835 .Group_groupEnterPrompt_80a {
    visibility: visible;
  }

.Group_groupTokenAvatarAndName_f80 {
  display: flex;
  gap: 4px;
}

.Group_groupTokenAvatar_a67 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  /* Set express dims to avoid jank on image load */
  width: 16px;
  height: 16px;
}

.Group_groupTokenName_072 {
  flex: 0 1 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  line-height: 16px;
}

.Group_groupTokenRemove_a51 {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--colorIconDefault);
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  opacity: 0.5;
}

.Group_groupTokenRemove_a51 span {
    width: 14px;
    height: 14px;
  }

.Group_groupTokenRemove_a51 span svg {
      display: block;
    }

.PillTab_pillTab_a35 {
  --pillTabLabelColor: var(--colorLinkDefault);
  --pillTabLabelHoverColor: var(--colorLinkDefault);
  --pillTabLabelActiveColor: var(--colorWhite);
  --pillTabLabelDisabledColor: var(--colorLinkDefault);

  --pillTabIconColor: var(--colorLinkDefault);
  --pillTabIconHoverColor: var(--colorLinkDefault);
  --pillTabIconActiveColor: var(--colorWhite);
  --pillTabIconDisabledColor: var(--colorLinkDefault);

  --pillTabBackgroundHoverColor: var(--bgActiveMuted);
  --pillTabBackgroundActiveColor: var(--bgActive);

  display: flex;
  font-size: var(--fontSizeSmall);
  line-height: var(--line);
  gap: var(--spacing-4);
  align-items: center;
  padding: var(--spacing-4) var(--spacing-8);
  border: none;
  border-radius: 12px;
  background-color: transparent;
  white-space: nowrap;
}.PillTab_pillTab_a35.PillTab_tertiary_2fe {
    --pillTabLabelColor: var(--colorTextMedium);
    --pillTabLabelHoverColor: var(--colorTextDefault);
    --pillTabLabelActiveColor: var(--colorTextDefault);
    --pillTabLabelDisabledColor: var(--colorTextLight);

    --pillTabIconColor: var(--colorIconLight);
    --pillTabIconHoverColor: var(--colorIconDefault);
    --pillTabIconActiveColor: var(--colorIconDefault);
    --pillTabIconDisabledColor: var(--colorIconDefault);

    --pillTabBackgroundHoverColor: var(--bgButtonDefaultHover);
    --pillTabBackgroundActiveColor: var(--bgDefault);
  }.PillTab_pillTab_a35 .PillTab_label_d4e {
    color: var(--pillTabLabelColor);
  }.PillTab_pillTab_a35 svg {
    color: var(--pillTabIconColor);
  }.PillTab_pillTab_a35.PillTab_selected_df6 {
    background-color: var(--pillTabBackgroundActiveColor);
  }.PillTab_pillTab_a35.PillTab_selected_df6 .PillTab_label_d4e {
      color: var(--pillTabLabelActiveColor);
    }.PillTab_pillTab_a35.PillTab_selected_df6 svg {
      color: var(--pillTabIconActiveColor);
    }:is(.PillTab_pillTab_a35:not([aria-disabled='true']):hover:not(.PillTab_primary_070.PillTab_selected_df6),.PillTab_pillTab_a35:not([aria-disabled='true']):focus:not(.PillTab_selected_df6)) .PillTab_label_d4e {
        color: var(--pillTabLabelHoverColor);
      }:is(.PillTab_pillTab_a35:not([aria-disabled='true']):hover:not(.PillTab_primary_070.PillTab_selected_df6),.PillTab_pillTab_a35:not([aria-disabled='true']):focus:not(.PillTab_selected_df6)) svg {
        color: var(--pillTabIconHoverColor);
      }.PillTab_pillTab_a35:not([aria-disabled='true']):hover:not(.PillTab_primary_070.PillTab_selected_df6) {
      background-color: var(--pillTabBackgroundHoverColor);
    }.PillTab_pillTab_a35[aria-disabled='true'] {
    opacity: 0.5;
  }.PillTab_pillTab_a35[aria-disabled='true'] .PillTab_label_d4e {
      color: var(--pillTabLabelDisabledColor);
    }.PillTab_pillTab_a35[aria-disabled='true'] svg {
      color: var(--pillTabIconDisabledColor);
    }

.FilterHeader_wrapper_eda {
  align-items: center;
  display: flex;
  gap: var(--spacing-16);
  margin-bottom: var(--spacing-24);
}

.FilterHeader_wrapper_eda.FilterHeader_noMargin_ada {
    margin-bottom: 0;
  }

.FilterHeader_search_cb2 {
  flex: 1;
}

@media screen and (min-width: 768px) {

.FilterHeader_search_cb2 {
    flex: 0;
    min-width: 278px;
}
  }

.FilterHeader_extras_dd0 {
  margin-left: auto;
}

.TaskReminder_SnoozeButton_root_f2a {
  min-width: 200px;
}

.TaskReminder_SnoozeButton_header_456 {
  padding: 0 16px;
}

.TaskReminder_SnoozeButton_list_32c {
  list-style: none;
  margin: 0;
  padding: 0;
}

@container message (max-width: 500px) {

.TaskReminder_SnoozeButton_hideOnSmall_3a8 {
    display: none;
}
  }

.TaskReminder_SnoozeButton_showOnSmall_2dc {
  display: none;
}

@container message (max-width: 500px) {

.TaskReminder_SnoozeButton_showOnSmall_2dc {
    display: flex;
}
  }

.TaskReminder_TaskReminder_root_55e {
  container: taskReminder / inline-size;
}

.TaskReminder_TaskReminder_root_55e + .TaskReminder_TaskReminder_root_55e > div {
    border-top: none;
  }

.TaskReminder_TaskReminder_inner_c68 {
  display: grid;
  gap: var(--spacing-24);
  grid-template-columns: auto 1fr;
}

@container message (max-width: 500px) {

.TaskReminder_TaskReminder_inner_c68 {
    align-items: flex-start;
    gap: var(--spacing-16);
    grid-template-columns: 1fr;
}
  }

.TaskReminder_TaskReminder_left_297 {
  align-items: center;
  border-right: 1px solid var(--colorBorderMessageTask);
  display: flex;
  padding-right: var(--spacing-24);
}

@container message (max-width: 500px) {

.TaskReminder_TaskReminder_left_297 {
    border-right: none;
    padding-right: 0;
}
  }

.TaskReminder_TaskReminder_icon_7ea {
  color: var(--colorIconDefault);
  flex-shrink: 0;
  height: 16px;
  width: 16px;
}

.TaskReminder_TaskReminder_actions_ca0 {
  display: flex;
  gap: var(--spacing-16);
}

@container message (max-width: 500px) {

.TaskReminder_TaskReminder_actions_ca0 {
    flex-direction: row-reverse;
    gap: var(--spacing-8);
}
  }

.TaskReminder_TaskReminder_desc_154 {
  color: var(--colorTextLight);
}

.TaskReminder_TaskReminder_desc_154:hover {
    color: var(--colorTextLight);
  }

.InlinePromo {
  --padding: 24px;
  --maxWidth: 780px;
  --illustrationWidth: 200px;

  background: var(--bgDefault);
  position: relative;
}

.InlinePromo.has-border {
    border-bottom: 1px solid var(--borderDefault);
  }

.InlinePromo.has-info-background {
    background: var(--bgInformationalMuted);
  }

.InlinePromo__content {
  display: flex;
  max-width: var(--maxWidth);
  align-items: flex-start;
}

.InlinePromo.centered .InlinePromo__content {
    margin: 0 auto;
  }

.InlinePromo__close {
  position: absolute;
  margin: calc(var(--padding) / 2) calc(var(--padding) / 2) 0 0;
  padding: calc(var(--padding) / 2);
  cursor: pointer;
  top: 0;
  right: var(--padding);
  color: var(--colorIconLight);
}

.InlinePromo__body {
  padding: var(--padding);
}

.InlinePromo__heading {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.InlinePromo__badge {
  margin-left: 12px;
}

.InlinePromo__cta {
  margin-top: 16px;
  display: grid;
  grid-template-columns: max-content max-content;
  grid-gap: var(--padding);
  align-items: center;
}

.InlinePromo__ctaSubtitle {
  margin-top: 8px;
}

.InlinePromo__illustration {
  align-self: flex-end;
  margin-right: calc(var(--padding) * 2);
  line-height: 0;
}

.InlinePromo__illustration svg {
    width: var(--illustrationWidth);
  }

/* Mobile */
@media screen and (max-width: 767px) {
  .InlinePromo__illustration {
    display: none;
  }

  .InlinePromo__title {
    font-size: 18px;
  }

  .InlinePromo__content {
    padding: var(--spacing-24) var(--spacing-16);
    display: flex;
    flex-direction: row-reverse;
  }

  .InlinePromo__body {
    padding: 0 var(--spacing-8) 0 0;
  }

  .InlinePromo__close {
    margin: 0;
    padding: 0;
    position: static;
  }
}

.Button_OAuthButton_parent_87d {
  display: inline-flex;
  padding: 0 !important;
}

.Button_OAuthButton_text_73a {
  font-size: 14px;
  line-height: var(--spacing-16);
  color: var(--colorTextDefault);
  border-radius: 0 var(--spacing-16) var(--spacing-16) 0;
  margin: 0;
  padding: 6px var(--spacing-16) 6px var(--spacing-4);
}

.Button_OAuthButton_text_73a.Button_OAuthButton_bold_d78 {
    font-weight: var(--fontWeightBold);
  }

.Button_OAuthButton_button_a6b {
  display: grid;
  grid-template-columns: 36px min-content;
  align-items: center;
}

.Button_OAuthButton_button_a6b.Button_OAuthButton_fullWidth_0ef {
    grid-template-columns: 36px 1fr;
    width: 100%;
  }

.Button_OAuthButton_button_a6b .Button_OAuthButton_icon_210 {
    position: unset;
  }

.Button_OAuthButton_button_a6b.Button_OAuthButton_dark_0be .Button_OAuthButton_text_73a {
      color: var(--colorTextNeutralWhite);
      padding: 6px var(--spacing-16) 6px var(--spacing-8);
    }

.Button_OAuthButton_button_a6b.Button_OAuthButton_dark_0be.Button_OAuthButton_google_a33 .Button_OAuthButton_text_73a {
        background: #4285f4;
      }

.Button_OAuthButton_button_a6b.Button_OAuthButton_dark_0be.Button_OAuthButton_microsoft_573 .Button_OAuthButton_text_73a {
        background: #2f2f2f;
      }

.Button_OAuthButton_centered_b43.Button_OAuthButton_button_a6b {
    display: flex;
    justify-content: center;
  }

.Button_OAuthButton_large_bb3 {
  border-radius: 100px !important;
}

.Button_OAuthButton_large_bb3 .Button_OAuthButton_button_a6b {
    height: 44px;
  }

.Button_OAuthButton_large_bb3 .Button_OAuthButton_button_a6b .Button_OAuthButton_text_73a {
      border-radius: 0 100px 100px 0;
      font-weight: var(--fontWeightBold);
      font-size: 16px;
      line-height: 130%;
    }

.Button_OAuthButton_large_bb3 .Button_OAuthButton_button_a6b .Button_OAuthButton_icon_210 svg {
      width: 24px;
      height: 24px;
    }

.OptionSwitch_description_a02 {
  display: block;
  margin-left: 40px;
}

.OptionSwitch_disabled_87f {
  opacity: 0.5;
}


/*# sourceMappingURL=https://srcmaps.close.com/srcmaps/entry~eadb8c7f.885e92def7f6167922cb.js.map*/