/*
- Name: "modal.scss"
- Description: "Add custom styles to modal component"
*/
/*
    - Name: "button.scss"
    - Description: "Add custom styles to button component"
*/
.btn, .webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary {
  font-weight: var(--buttonFontWeightText);
  justify-content: center;
  display: flex;
  align-items: center;
  text-decoration: none;
  box-sizing: content-box;
  font-family: var(--largeDefaultFontFamily);
  border: none;
  box-sizing: border-box;
}

.btn.btn-primary, .webform-dialog.webform-dialog-narrow, .webform-dialog.webform-dialog-narrow.btn-icon, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-primary.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary, .btn.btn-icon.btn-primary {
  background-color: var(--buttonColorPrimaryBackground);
  color: var(--buttonColorPrimaryText);
}

.btn.btn-primary:hover, .webform-dialog.webform-dialog-narrow:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-primary.button.cancel:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel.webform-dialog.webform-dialog-narrow:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:hover, .btn.btn-primary:focus, .webform-dialog.webform-dialog-narrow:focus, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-primary.button.cancel:focus, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel.webform-dialog.webform-dialog-narrow:focus, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:focus {
  background-color: var(--buttonColorPrimaryBackgroundHover);
  color: var(--buttonColorPrimaryTextHover);
}

.btn.btn-primary:active, .webform-dialog.webform-dialog-narrow:active, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-primary.button.cancel:active, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel.webform-dialog.webform-dialog-narrow:active, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:active {
  background-color: var(--buttonColorSecondaryBackgroundHover);
  color: var(--buttonColorSecondaryTextHover);
  box-shadow: 0px 0px 0px 2px var(--buttonColorPrimaryText), 0px 0px 0px 4px var(--buttonBorderSecondaryColorHover);
}

.disabled.btn.btn-primary, .disabled.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.btn-primary.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.button.cancel.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.button--primary {
  background-color: var(--buttonColorPrimaryBackgroundDisabled);
  color: var(--buttonColorPrimaryTextDisabled);
}

.btn.btn-secondary, .btn-secondary.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-secondary.button--primary, .btn.btn-icon.btn-secondary {
  background-color: var(--buttonColorSecondaryBackground);
  color: var(--buttonColorSecondaryText);
  outline: var(--buttonBorderWidthBorder) solid var(--buttonBorderSecondaryColor);
}

.btn.btn-secondary:hover, .btn-secondary.webform-dialog.webform-dialog-narrow:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-secondary.button--primary:hover, .btn.btn-secondary:focus, .btn-secondary.webform-dialog.webform-dialog-narrow:focus, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:focus, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-secondary.button--primary:focus {
  background-color: var(--buttonColorSecondaryBackgroundHover);
  color: var(--buttonColorSecondaryTextHover);
}

.btn.btn-secondary:active, .btn-secondary.webform-dialog.webform-dialog-narrow:active, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:active, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-secondary.button--primary:active {
  background-color: var(--buttonColorSecondaryBackgroundHover);
  color: var(--buttonColorSecondaryTextHover);
  box-shadow: 0px 0px 0px 2px var(--buttonColorPrimaryText), 0px 0px 0px 4px var(--buttonBorderSecondaryColorHover);
}

.disabled.btn.btn-secondary, .disabled.btn-secondary.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.btn-secondary.button--primary {
  background-color: var(--buttonColorSecondaryBackground);
  color: var(--selectColorButtonStroke);
  outline: var(--buttonBorderWidthBorder) solid var(--selectColorButtonStroke);
}

.btn.btn-lg, .btn-lg.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-lg.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-lg.button--primary {
  padding-top: var(--buttonLgPaddingY);
  padding-right: var(--buttonLgPaddingX);
  padding-bottom: var(--buttonLgPaddingY);
  padding-left: var(--buttonLgPaddingX);
  gap: 12px;
  font-size: var(--buttonFontSizeLg);
  min-height: 60px;
}

.change-to-md.btn.btn-lg, .change-to-md.btn-lg.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .change-to-md.btn-lg.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .change-to-md.btn-lg.button--primary {
  padding-top: var(--buttonMdPaddingY);
  padding-right: var(--buttonMdPaddingX);
  padding-bottom: var(--buttonMdPaddingY);
  padding-left: var(--buttonMdPaddingX);
  font-size: var(--buttonFontSizeMd);
  gap: 10px;
  min-height: auto;
}

@media all and (min-width: 50.0625rem) {
  .change-to-md.btn.btn-lg, .change-to-md.btn-lg.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .change-to-md.btn-lg.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .change-to-md.btn-lg.button--primary {
    padding-top: var(--buttonLgPaddingY);
    padding-right: var(--buttonLgPaddingX);
    padding-bottom: var(--buttonLgPaddingY);
    padding-left: var(--buttonLgPaddingX);
    gap: 12px;
    font-size: var(--buttonFontSizeLg);
  }
}
.btn.btn-md, .webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary {
  padding-top: var(--buttonMdPaddingY);
  padding-right: var(--buttonMdPaddingX);
  padding-bottom: var(--buttonMdPaddingY);
  padding-left: var(--buttonMdPaddingX);
  gap: 10px;
  font-size: var(--buttonFontSizeMd);
  min-height: 48px;
}

.btn.btn-sm, .btn-sm.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-sm.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-sm.button--primary {
  padding-top: var(--buttonSmPaddingY);
  padding-right: var(--buttonSmPaddingX);
  padding-bottom: var(--buttonSmPaddingY);
  padding-left: var(--buttonSmPaddingX);
  font-size: var(--buttonFontSizeSm);
  gap: 8px;
  font-size: var(--buttonFontSizeSm);
}

.btn.btn-icon i::before, .btn-icon.webform-dialog.webform-dialog-narrow i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-icon.button.cancel i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-icon.button--primary i::before, .btn.btn-text-icon i::before, .btn-text-icon.webform-dialog.webform-dialog-narrow i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button.cancel i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button--primary i::before {
  font-size: 2.125rem;
  margin-left: 0;
}

.btn.btn-text-icon i, .btn-text-icon.webform-dialog.webform-dialog-narrow i, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button.cancel i, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button--primary i {
  order: 2;
  font-size: 1rem !important;
  margin-left: 1rem;
}

.btn.btn-text-icon i::before, .btn-text-icon.webform-dialog.webform-dialog-narrow i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button.cancel i::before, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-text-icon.button--primary i::before {
  font-size: 1rem !important;
}

.btn.btn-icon, .btn-icon.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-icon.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .btn-icon.button--primary {
  /*min-width: 16px;
  max-width: 16px;*/
  /*padding:0;*/
  /*height: 16px;*/
  width: -moz-fit-content;
  width: fit-content;
  border: none;
  background-color: none;
  padding: 0.125rem;
}

.btn.disabled, .disabled.webform-dialog.webform-dialog-narrow, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.button.cancel, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .disabled.button--primary {
  pointer-events: none;
}

.btn:hover, .webform-dialog.webform-dialog-narrow:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:hover, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:hover {
  cursor: pointer;
}

@media all and (min-width: 36rem) {
  .btn:not(.btn-icon), .webform-dialog.webform-dialog-narrow:not(.btn-icon), .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:not(.btn-icon), .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:not(.btn-icon) {
    min-width: 192px;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
    width: -moz-fit-content;
    width: fit-content;
  }
  .btn:not(.btn-icon) > span, .webform-dialog.webform-dialog-narrow:not(.btn-icon) > span, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel:not(.btn-icon) > span, .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button--primary:not(.btn-icon) > span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.micon.iconXs {
  width: var(--sizeXs);
  height: var(--sizeXs);
}

.micon.iconSm {
  width: var(--sizeSm);
  height: var(--sizeSm);
}

.micon.iconMd {
  width: var(--sizeMd);
  height: var(--sizeMd);
}

.micon.iconLg {
  width: var(--sizeLg);
  height: var(--sizeLg);
}

.micon.iconXl {
  width: var(--sizeXl);
  height: var(--sizeXl);
}

.micon.icon2xl {
  width: var(--size2xl);
  height: var(--size2xl);
}

.ui-widget.ui-widget-content {
  max-width: 100%;
  width: 660px !important;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar {
  background-color: var(--colorTextWhite);
  border: none;
  font-family: var(--fontFamilyBody);
  font-size: var(--mobileH2BoldFontSize) !important;
  line-height: var(--mobileH2BoldLineHeight) !important;
  color: var(--colorBlack) !important;
}

.ui-widget.ui-widget-content .ui-dialog-buttonpane {
  border: none;
}

.ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset {
  width: 100%;
  float: none;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}

.ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button {
  display: inline-flex !important;
  margin-left: var(--spacingSm);
  order: 1;
  border-radius: 0;
}

.ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button:last-of-type {
  margin-right: 0;
}

.ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset .button.cancel {
  order: 0;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close {
  border: none !important;
  left: 94%;
  background: none !important;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close svg {
  position: absolute;
  top: 0;
  left: -10px;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close .ui-icon {
  background-image: none !important;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar {
  background-color: var(--colorTextWhite);
  border: none;
  font-family: var(--fontFamilyBody);
  font-size: var(--mobileH2BoldFontSize) !important;
  line-height: var(--mobileH2BoldLineHeight) !important;
  color: var(--colorBlack) !important;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close {
  border: none !important;
  left: 94%;
  background: none !important;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close svg {
  position: absolute;
  top: 0;
  left: -10px;
}

.ui-widget.ui-widget-content .ui-dialog-titlebar-close .ui-icon {
  background-image: none !important;
}

.ui-widget.ui-widget-content .ui-dialog .ui-dialog-title {
  color: var(--colorBlack) !important;
}

.ui-dialog {
  z-index: 999;
}

.ui-dialog .ui-dialog-title {
  color: var(--colorBlack) !important;
}

.ui-dialog .ui-widget-content.ui-dialog-buttonpane {
  border: 0 !important;
  background-color: white !important;
}

.ui-dialog .ui-dialog-title {
  color: var(--colorBlack) !important;
}

.ui-dialog:not(.ui-dialog-off-canvas) {
  border-radius: 0 !important;
}

.ui-widget-overlay.ui-front {
  background: var(--colorBlack);
  opacity: var(--opacityMedium);
}

.webform-confirmation {
  margin: 0 0 var(--spacingMd) 0;
  padding: var(--spacingSm);
  background-color: var(--validationSummaryColorSuccessBackground);
}

.webform-confirmation svg.micon {
  margin: 0;
  padding: 0;
  position: relative;
  top: 5px;
  fill: var(--colorFeedbackSuccess);
}

.webform-confirmation a {
  color: var(--colorFeedbackSuccess);
  font-weight: var(--validationSummaryFontWeightTitle);
}

.webform-confirmation__message, .webform-confirmation__back {
  margin: 0 !important;
}

.webform-confirmation__message {
  font-size: var(--validationSummaryFontSizeTitle);
  font-weight: var(--validationSummaryFontWeightTitle);
  color: var(--colorFeedbackSuccess);
}

.ui-icon-closethick {
  display: none !important;
}