survey-core/survey-core.css

survey.js is a JavaScript Survey Library. It is a modern way to add a survey to your website. It uses JSON for survey metadata and results.

/*!
 * surveyjs - Survey JavaScript library v2.0.3
 * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
 * License: MIT (http://www.opensource.org/licenses/mit-license.php)
 */
/*!*********************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/default-theme/default.scss ***!
  \*********************************************************************************************************************************************************************************/
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format("woff2");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format("woff2");
  unicode-range: U+0370-03FF;
}
/* hebrew */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format("woff2");
  unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format("woff2");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format("woff2");
  unicode-range: U+0370-03FF;
}
/* hebrew */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format("woff2");
  unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSKmu1aB.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSumu1aB.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSOmu1aB.woff2) format("woff2");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSymu1aB.woff2) format("woff2");
  unicode-range: U+0370-03FF;
}
/* hebrew */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS2mu1aB.woff2) format("woff2");
  unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
/* vietnamese */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSCmu1aB.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTSGmu1aB.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  src: url(https://fonts.gstatic.com/s/opensans/v34/memvYaGs126MiZpBA-UvWbX2vVnXBbObj2OVTS-muw.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

:root {
  --sjs-transition-duration: 150ms;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes changeHeight {
  from {
    height: var(--animation-height-from);
  }
  to {
    height: var(--animation-height-to);
  }
}
@keyframes moveInWithOverflow {
  from {
    overflow: hidden;
    height: var(--animation-height-from);
    min-height: var(--animation-height-from);
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-top-width: 0;
    border-bottom-width: 0;
  }
  99% {
    overflow: hidden;
    margin-top: var(--animation-margin-top);
    margin-bottom: var(--animation-margin-bottom);
    padding-top: var(--animation-padding-top);
    padding-bottom: var(--animation-padding-bottom);
    border-top-width: var(--animation-border-top-width);
    border-bottom-width: var(--animation-border-bottom-width);
    height: var(--animation-height-to);
    min-height: var(--animation-height-to);
  }
  to {
    overflow: visible;
    margin-top: var(--animation-margin-top);
    margin-bottom: var(--animation-margin-bottom);
    padding-top: var(--animation-padding-top);
    padding-bottom: var(--animation-padding-bottom);
    border-top-width: var(--animation-border-top-width);
    border-bottom-width: var(--animation-border-bottom-width);
    height: var(--animation-height-to);
    min-height: var(--animation-height-to);
  }
}
@keyframes moveIn {
  from {
    height: 0;
  }
  to {
    height: var(--animation-height);
  }
}
@keyframes paddingFadeIn {
  from {
    padding-top: 0;
    padding-bottom: 0;
  }
  to {
    padding-bottom: var(--animation-padding-bottom);
    padding-top: var(--animation-padding-top);
  }
}
.sv-action-bar {
  display: flex;
  box-sizing: content-box;
  position: relative;
  align-items: center;
  margin-left: auto;
  overflow: hidden;
  white-space: nowrap;
}

.sv-action-bar-separator {
  display: inline-block;
  width: 1px;
  height: 24px;
  vertical-align: middle;
  margin-right: 16px;
  background-color: var(--sjs-border-default, var(--border, #d6d6d6));
}

.sv-action-bar--default-size-mode .sv-action-bar-separator {
  margin: 0 var(--sjs-base-unit, var(--base-unit, 8px));
}

.sv-action-bar--small-size-mode .sv-action-bar-separator {
  margin: 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-action-bar-item {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  padding: var(--sjs-base-unit, var(--base-unit, 8px));
  box-sizing: border-box;
  border: none;
  border-radius: calc(0.5 * (var(--sjs-corner-radius, 4px)));
  background-color: transparent;
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
  cursor: pointer;
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  overflow-x: hidden;
  white-space: nowrap;
}

button.sv-action-bar-item {
  overflow: hidden;
}

.sv-action-bar--default-size-mode .sv-action-bar-item {
  height: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  font-size: var(--sjs-font-size, 16px);
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  margin: 0 var(--sjs-base-unit, var(--base-unit, 8px));
}

.sv-action-bar--small-size-mode .sv-action-bar-item {
  height: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  font-size: calc(0.75 * (var(--sjs-font-size, 16px)));
  line-height: var(--sjs-font-size, 16px);
  margin: 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-action:first-of-type .sv-action-bar-item {
  margin-inline-start: 0;
}

.sv-action:last-of-type .sv-action-bar-item {
  margin-inline-end: 0;
}

.sv-action-bar--default-size-mode .sv-action-bar-item__title--with-icon {
  margin-inline-start: var(--sjs-base-unit, var(--base-unit, 8px));
}

.sv-action-bar--small-size-mode .sv-action-bar-item__title--with-icon {
  margin-inline-start: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-action-bar-item__icon svg {
  display: block;
}
.sv-action-bar-item__icon use {
  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
}

.sv-action-bar-item:hover, .sv-action-bar-item:focus {
  outline: none;
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
}
.sv-action-bar-item:active, .sv-action-bar-item.svc-toolbar__item--pressed {
  opacity: 0.5;
}
.sv-action-bar-item.svc-toolbar__item--active {
  outline: none;
}
.sv-action-bar-item:disabled {
  opacity: 0.25;
  cursor: default;
}

.sv-action-bar-item__title {
  color: inherit;
  vertical-align: middle;
  white-space: nowrap;
}

.sv-action-bar-item--secondary .sv-action-bar-item__icon use {
  fill: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
}

.sv-action-bar-item--active .sv-action-bar-item__icon use {
  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
}

.sv-action-bar-item-dropdown {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: flex;
  height: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  padding: var(--sjs-base-unit, var(--base-unit, 8px));
  box-sizing: border-box;
  border: none;
  border-radius: calc(0.5 * (var(--sjs-corner-radius, 4px)));
  background-color: transparent;
  cursor: pointer;
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  font-size: var(--sjs-font-size, 16px);
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
}

.sv-expand-action:before {
  content: "";
  display: inline-block;
  background-image: url("data:image/svg+xml,%3C%3Fxml version=%271.0%27 encoding=%27utf-8%27%3F%3E%3C%21-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0%29 --%3E%3Csvg version=%271.1%27 id=%27Layer_1%27 xmlns=%27http://www.w3.org/2000/svg%27 xmlns:xlink=%27http://www.w3.org/1999/xlink%27 x=%270px%27 y=%270px%27 viewBox=%270 0 10 10%27 style=%27enable-background:new 0 0 10 10;%27 xml:space=%27preserve%27%3E%3Cstyle type=%27text/css%27%3E .st0%7Bfill:%23404040;%7D%0A%3C/style%3E%3Cpolygon class=%27st0%27 points=%272,2 0,4 5,9 10,4 8,2 5,5 %27/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center center;
  height: 10px;
  width: 12px;
  margin: auto 8px;
}

.sv-expand-action--expanded:before {
  transform: rotate(180deg);
}

.sv-dots {
  width: 48px;
}

.sv-dots__item {
  width: 100%;
}
.sv-dots__item .sv-action-bar-item__icon {
  margin: auto;
}

.sv-action--hidden {
  width: 0px;
  height: 0px;
  overflow: hidden;
  visibility: hidden;
}
.sv-action--hidden .sv-action__content {
  min-width: fit-content;
}

.sv-action__content {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.sv-action__content > * {
  flex: 0 0 auto;
}

.sv-action--space {
  margin-left: auto;
}

.sv-action-bar-item--pressed:not(.sv-action-bar-item--active) {
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
  opacity: 50%;
}

.sv-dragged-element-shortcut {
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  min-width: calc(12.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  border-radius: calc(4.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
  padding: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  cursor: grabbing;
  position: absolute;
  z-index: 10000;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  font-size: var(--sjs-font-size, 16px);
  padding-left: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
}

.sv-matrixdynamic__drag-icon {
  padding-top: calc(1.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-matrixdynamic__drag-icon:after {
  content: " ";
  display: block;
  height: calc(0.75 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  width: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  border: 1px solid #e7e7e7;
  box-sizing: border-box;
  border-radius: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  cursor: move;
  margin-top: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-matrixdynamic-dragged-row {
  cursor: grabbing;
  position: absolute;
  z-index: 10000;
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
}
.sv-matrixdynamic-dragged-row .sd-table__row {
  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  align-items: center;
  line-height: 0;
}
.sv-matrixdynamic-dragged-row .sd-table__cell.sd-table__cell--drag > div {
  background-color: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
  min-height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sd-table__cell--header.sd-table__cell--drag,
.sd-table__cell.sd-table__cell--drag {
  padding-right: 0;
  padding-left: 0;
}

.sd-question--mobile .sd-table__cell--header.sd-table__cell--drag,
.sd-question--mobile .sd-table__cell.sd-table__cell--drag {
  display: none;
}

.sv-matrix-row--drag-drop-ghost-mod td {
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
}

.sv-matrix-row--drag-drop-ghost-mod td > * {
  visibility: hidden;
}

.sv-drag-drop-choices-shortcut {
  cursor: grabbing;
  position: absolute;
  z-index: 10000;
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  min-width: 100px;
  max-width: 400px;
}
.sv-drag-drop-choices-shortcut .sv-ranking-item {
  height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-drag-drop-choices-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-viewer,
.sv-drag-drop-choices-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-editor {
  overflow: hidden;
  white-space: nowrap;
}

.sv-drag-drop-choices-shortcut__content.sv-drag-drop-choices-shortcut__content {
  min-width: 100px;
  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
  border-radius: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
  padding-right: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
  margin-left: 0;
}

.sv-drag-drop-image-picker-shortcut {
  cursor: grabbing;
  position: absolute;
  z-index: 10000;
  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
  padding: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
  border-radius: calc(0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
}

sv-popup {
  display: block;
  position: absolute;
}

.sv-popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  outline: none;
  z-index: 2000;
  height: 100vh;
}

.sv-dropdown-popup {
  height: 0;
}

.sv-popup.sv-popup-inner {
  height: 0;
}

.sv-popup-inner > .sv-popup__container {
  margin-top: calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-list__item--with-icon .sv-popup-inner > .sv-popup__container {
  margin-top: calc(-0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-popup--menu-popup > .sv-popup__container {
  background: var(--lbr-popup-menu-background-color-global, var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3)));
  border-radius: var(--lbr-popup-menu-corner-radius, var(--sjs-corner-radius, 4px));
  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
}
.sv-popup--menu-popup > .sv-popup__container > .sv-popup__body-content {
  background-color: var(--lbr-popup-menu-background-color, var(--sjs-general-backcolor, var(--background, #fff)));
  border-radius: var(--lbr-popup-menu-corner-radius, var(--sjs-corner-radius, 4px));
  height: 100%;
}

.sv-popup__container {
  position: absolute;
  padding: 0;
}

.sv-popup__content {
  min-width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  position: relative;
}

.sv-popup__body-content {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  max-width: 100vw;
}

.sv-popup--modal-popup {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--lbr-dialog-screen-color, var(--background-semitransparent, rgba(144, 144, 144, 0.5)));
  padding: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(15 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(8 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  box-sizing: border-box;
}

.sv-popup--modal-popup > .sv-popup__container {
  position: static;
  display: flex;
  background-color: var(--lbr-dialog-background-color, var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9)));
  border-radius: var(--lbr-dialog-corner-radius, calc(2 * (var(--sjs-corner-radius, 4px))));
  box-shadow: var(--lbr-dialog-shadow-2-offset-x, 0px) var(--lbr-dialog-shadow-2-offset-y, 2px) var(--lbr-dialog-shadow-2-blur, 6px) var(--lbr-dialog-shadow-2-spread, 0px) var(--lbr-dialog-shadow-2-color, rgba(0, 0, 0, 0.1)), var(--lbr-dialog-shadow-1-offset-x, 0px) var(--lbr-dialog-shadow-1-offset-y, 8px) var(--lbr-dialog-shadow-1-blur, 16px) var(--lbr-dialog-shadow-1-spread, 0px) var(--lbr-dialog-shadow-1-color, rgba(0, 0, 0, 0.1));
}
.sv-popup--modal-popup > .sv-popup__container > .sv-popup__body-content {
  padding: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: auto;
  min-width: 452px;
  gap: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-popup--modal-popup .sv-popup__body-footer .sv-modal-footer-action-bar {
  overflow: visible;
}
.sv-popup--modal-popup .sv-popup__scrolling-content {
  padding: 2px;
  margin: -2px;
}

.sd-root-modern--mobile .sv-popup--modal-popup .sv-popup__body-content {
  min-width: auto;
}

.sv-popup--confirm .sv-popup__body-content .sv-string-viewer {
  color: var(--sjs-font-editorfont-color, var(--sjs-general-forecolor, rgba(0, 0, 0, 0.91)));
  align-self: self-start;
  /* UI/Default */
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  font-size: var(--sjs-font-size, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  /* 150% */
}

.sv-popup__scrolling-content {
  height: 100%;
  overflow: auto;
  display: flex;
  flex-direction: column;
}
.sv-popup__scrolling-content::-webkit-scrollbar,
.sv-popup__scrolling-content *::-webkit-scrollbar {
  height: 6px;
  width: 6px;
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
}
.sv-popup__scrolling-content::-webkit-scrollbar-thumb,
.sv-popup__scrolling-content *::-webkit-scrollbar-thumb {
  background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
}

.sv-popup--show-pointer.sv-popup--top .sv-popup__pointer {
  transform: translate(calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))))) rotate(180deg);
}

.sv-popup--show-pointer.sv-popup--bottom .sv-popup__pointer {
  transform: translate(calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px)))), calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px)))));
}

.sv-popup--show-pointer.sv-popup--right .sv-popup__container {
  transform: translate(var(--sjs-base-unit, var(--base-unit, 8px)));
}
.sv-popup--show-pointer.sv-popup--right .sv-popup__container .sv-popup__pointer {
  transform: translate(-12px, -4px) rotate(-90deg);
}

.sv-popup--show-pointer.sv-popup--left .sv-popup__container {
  transform: translate(calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px)))));
}
.sv-popup--show-pointer.sv-popup--left .sv-popup__container .sv-popup__pointer {
  transform: translate(-4px, -4px) rotate(90deg);
}

.sv-popup__pointer {
  display: block;
  position: absolute;
}
.sv-popup__pointer:after {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-left: var(--sjs-base-unit, var(--base-unit, 8px)) solid transparent;
  border-right: var(--sjs-base-unit, var(--base-unit, 8px)) solid transparent;
  border-bottom: var(--sjs-base-unit, var(--base-unit, 8px)) solid var(--sjs-general-backcolor, var(--background, #fff));
  align-self: center;
}

.sv-popup__body-header {
  font-family: Open Sans;
  font-size: calc(1.5 * (var(--sjs-font-size, 16px)));
  line-height: calc(2 * (var(--sjs-font-size, 16px)));
  font-style: normal;
  font-weight: 700;
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
}

.sv-popup__body-footer {
  display: flex;
}

.sv-popup__body-footer .sv-action-bar {
  gap: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  overflow: visible;
}

.sv-popup--menu-phone,
.sv-popup--menu-tablet {
  z-index: 2001;
  padding: 0;
  width: 100%;
  height: var(--sv-popup-overlay-height, 100vh);
}
.sv-popup--menu-phone .sv-popup__body-footer-item,
.sv-popup--menu-tablet .sv-popup__body-footer-item {
  width: 100%;
}
.sv-popup--menu-phone .sv-popup__body-footer .sv-action-bar,
.sv-popup--menu-tablet .sv-popup__body-footer .sv-action-bar {
  width: 100%;
  justify-content: flex-start;
}
.sv-popup--menu-phone .sv-popup__body-footer .sv-action-bar .sv-action,
.sv-popup--menu-tablet .sv-popup__body-footer .sv-action-bar .sv-action {
  flex: 0 0 auto;
}
.sv-popup--menu-phone .sv-popup__body-footer,
.sv-popup--menu-tablet .sv-popup__body-footer {
  padding: var(--lbr-popup-menu-footer-padding-top, calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))))) var(--lbr-popup-menu-footer-padding-right, 0px) var(--lbr-popup-menu-footer-padding-bottom, calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))))) var(--lbr-popup-menu-footer-padding-left, 0px);
  border-top: var(--lbr-popup-menu-footer-border-width-top, 1px) solid var(--lbr-popup-menu-footer-border-color, var(--sjs-border-light, var(--border-light, #eaeaea)));
  background: var(--lbr-popup-menu-footer-background-color, var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9)));
}
.sv-popup--menu-phone .sv-list__filter,
.sv-popup--menu-tablet .sv-list__filter {
  display: flex;
  align-items: center;
  margin-bottom: 0;
  padding: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-popup--menu-phone .sv-list,
.sv-popup--menu-tablet .sv-list {
  flex-grow: 1;
}
.sv-popup--menu-phone .sv-list__filter-icon,
.sv-popup--menu-tablet .sv-list__filter-icon {
  position: static;
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-popup--menu-phone .sv-list__empty-container,
.sv-popup--menu-tablet .sv-list__empty-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
}
.sv-popup--menu-phone .sv-list__filter-clear-button,
.sv-popup--menu-tablet .sv-list__filter-clear-button {
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  appearance: none;
  border: none;
  border-radius: 100%;
  background-color: transparent;
}
.sv-popup--menu-phone .sv-list__filter-clear-button svg,
.sv-popup--menu-tablet .sv-list__filter-clear-button svg {
  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-popup--menu-phone .sv-list__filter-clear-button svg use,
.sv-popup--menu-tablet .sv-list__filter-clear-button svg use {
  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
}
.sv-popup--menu-phone .sv-list__filter-clear-button:hover,
.sv-popup--menu-tablet .sv-list__filter-clear-button:hover {
  border-radius: var(--lbr-popup-menu-search-clear-button-corner-radius, 1024px);
  background: var(--lbr-popup-menu-search-clear-button-background-color-hovered, var(--sjs-special-red-light, rgba(229, 10, 62, 0.1)));
}
.sv-popup--menu-phone .sv-list__filter-clear-button:hover use,
.sv-popup--menu-tablet .sv-list__filter-clear-button:hover use {
  fill: var(--lbr-popup-menu-search-clear-button-icon-color-hovered, var(--sjs-special-red, #E50A3E));
}
.sv-popup--menu-phone .sv-list__input,
.sv-popup--menu-tablet .sv-list__input {
  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
  font-size: max(16px, var(--sjs-font-size, 16px));
  line-height: max(24px, 1.5 * (var(--sjs-font-size, 16px)));
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px));
}
.sv-popup--menu-phone .sv-list__item:hover .sv-list__item-body,
.sv-popup--menu-phone .sv-list__item:focus .sv-list__item-body,
.sv-popup--menu-phone .sv-list__item--focused .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item:hover .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item:focus .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item--focused .sv-list__item-body {
  background: var(--sjs-general-backcolor, var(--background, #fff));
}
.sv-popup--menu-phone .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-phone .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-phone .sv-list__item--focused.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
  background: var(--sjs-primary-backcolor, var(--primary, #19b394));
  color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
  font-weight: 600;
}
.sv-popup--menu-phone.sv-multi-select-list .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-phone.sv-multi-select-list .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-phone.sv-multi-select-list .sv-list__item--focused.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet.sv-multi-select-list .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet.sv-multi-select-list .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
.sv-popup--menu-tablet.sv-multi-select-list .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
  background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
  font-weight: 400;
}

.sv-popup--menu-phone > .sv-popup__container {
  width: 100%;
  height: calc(var(--sv-popup-overlay-height, 100vh));
  max-width: 100vw;
  max-height: calc(var(--sv-popup-overlay-height, 100vh));
  border: unset;
  box-shadow: unset;
  box-sizing: content-box;
  background: var(--lbr-popup-menu-background-color-global, var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3)));
}
.sv-popup--menu-phone > .sv-popup__container > .sv-popup__body-content {
  background-color: var(--lbr-popup-menu-background-color, var(--sjs-general-backcolor, var(--background, #fff)));
  max-height: var(--sv-popup-overlay-height, 100vh);
  max-width: 100vw;
  height: calc(var(--sv-popup-overlay-height, 100vh));
}

.sv-popup--menu-tablet {
  background: var(--lbr-dialog-screen-color, var(--background-semitransparent, rgba(144, 144, 144, 0.5)));
}
.sv-popup--menu-tablet > .sv-popup__container {
  border: unset;
  box-sizing: content-box;
  background: var(--lbr-popup-menu-background-color-global, var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3)));
  --sv-popup-overlay-max-height: calc(var(--sv-popup-overlay-height, 100vh) - var(--sjs-base-unit, var(--base-unit, 8px)) * 8);
  --sv-popup-overlay-max-width: calc(100% - var(--sjs-base-unit, var(--base-unit, 8px)) * 8);
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
  max-height: var(--sv-popup-overlay-max-height);
  min-height: min(var(--sv-popup-overlay-max-height), 30 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: auto;
  width: auto;
  min-width: min(40 * (var(--sjs-base-unit, var(--base-unit, 8px))), var(--sv-popup-overlay-max-width));
  max-width: var(--sv-popup-overlay-max-width);
  border-radius: var(--lbr-popup-menu-corner-radius, var(--sjs-corner-radius, 4px));
  overflow: hidden;
  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
}
.sv-popup--menu-tablet > .sv-popup__container > .sv-popup__body-content {
  background-color: var(--lbr-popup-menu-background-color, var(--sjs-general-backcolor, var(--background, #fff)));
  max-width: 100vw;
  max-height: calc(var(--sv-popup-overlay-height, 100vh) - var(--sjs-base-unit, var(--base-unit, 8px)) * 8);
  min-height: min(var(--sv-popup-overlay-max-height), 30 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: auto;
}
.sv-popup--menu-tablet .sv-popup__content,
.sv-popup--menu-tablet .sv-popup__scrolling-content,
.sv-popup--menu-tablet .sv-list__container {
  flex-grow: 1;
}

.sv-popup--visible {
  opacity: 1;
}

.sv-popup--hidden {
  opacity: 0;
}

.sv-popup--enter {
  animation-name: fadeIn;
  animation-fill-mode: forwards;
  animation-duration: 0.15s;
}

.sv-popup--modal-popup.sv-popup--enter {
  animation-timing-function: cubic-bezier(0, 0, 0.58, 1);
  animation-duration: 0.25s;
}

.sv-popup--leave {
  animation-direction: reverse;
  animation-name: fadeIn;
  animation-fill-mode: forwards;
  animation-duration: 0.15s;
}

.sv-popup--modal-popup.sv-popup--leave {
  animation-timing-function: cubic-bezier(0.42, 0, 1, 1);
  animation-duration: 0.25s;
}

.sv-popup--hidden {
  opacity: 0;
}

@keyframes modalMoveUp {
  from {
    transform: translateY(64px);
  }
  to {
    transform: translateY(0);
  }
}
.sv-popup--modal-popup.sv-popup--leave .sv-popup__container, .sv-popup--modal-popup.sv-popup--enter .sv-popup__container {
  animation-name: modalMoveUp;
  animation-timing-function: cubic-bezier(0, 0, 0.58, 1);
  animation-fill-mode: forwards;
  animation-duration: 0.25s;
}
.sv-popup--modal-popup.sv-popup--leave .sv-popup__container {
  animation-direction: reverse;
  animation-timing-function: cubic-bezier(0.42, 0, 1, 1);
}

.sv-button-group {
  display: flex;
  align-items: center;
  flex-direction: row;
  font-size: var(--sjs-font-size, 16px);
  overflow: auto;
  border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
}

.sv-button-group:focus-within {
  box-shadow: 0 0 0 1px var(--sjs-primary-backcolor, var(--primary, #19b394));
  border-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
}

.sv-button-group__item {
  display: flex;
  box-sizing: border-box;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  appearance: none;
  width: 100%;
  padding: 11px calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  outline: none;
  font-size: var(--sjs-font-size, 16px);
  font-weight: 400;
  background: var(--sjs-general-backcolor, var(--background, #fff));
  cursor: pointer;
  overflow: hidden;
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
  position: relative;
}
.sv-button-group__item:not(:last-of-type) {
  border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
}

.sv-button-group__item--hover:hover {
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
}

.sv-button-group__item-icon {
  display: block;
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}
.sv-button-group__item-icon use {
  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
}

.sv-button-group__item--selected {
  font-weight: 600;
  color: var(--sjs-primary-backcolor, var(--primary, #19b394));
}
.sv-button-group__item--selected .sv-button-group__item-icon use {
  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
}
.sv-button-group__item--selected:hover {
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
}

.sv-button-group__item-decorator {
  display: flex;
  align-items: center;
  max-width: 100%;
}

.sv-button-group__item-caption {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sv-button-group__item-icon + .sv-button-group__item-caption {
  margin-left: var(--sjs-base-unit, var(--base-unit, 8px));
}

.sv-button-group__item--disabled {
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
  cursor: default;
}
.sv-button-group__item--disabled .sv-button-group__item-decorator {
  opacity: 0.25;
  font-weight: normal;
}
.sv-button-group__item--disabled .sv-button-group__item-icon use {
  fill: var(--sjs-general-forecolor, var(--foreground, #161616));
}
.sv-button-group__item--disabled:hover {
  background-color: var(--sjs-general-backcolor, var(--background, #fff));
}

.sv-button-group:focus-within {
  box-shadow: 0 0 0 1px var(--sjs-primary-backcolor, var(--primary, #19b394));
  border-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
}

.sv-visuallyhidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.sv-hidden {
  display: none !important;
}

.sv-title-actions {
  display: flex;
  align-items: center;
  width: 100%;
}

.sv-title-actions__title {
  flex-wrap: wrap;
  max-width: 90%;
  min-width: 50%;
  white-space: initial;
}

.sv-action-title-bar {
  min-width: 56px;
}

.sv-title-actions .sv-title-actions__title {
  flex-wrap: wrap;
  flex: 0 1 auto;
  max-width: unset;
  min-width: unset;
}
.sv-title-actions .sv-action-title-bar {
  flex: 1 1 auto;
  justify-content: flex-end;
  min-width: unset;
}

.sv_window {
  position: fixed;
  bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  right: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  border-radius: var(--sjs-base-unit, var(--base-unit, 8px));
  border: 1px solid var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
  background-clip: padding-box;
  z-index: 100;
  max-height: 50vh;
  overflow: auto;
  box-sizing: border-box;
  background: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
  width: calc(100% - 4 * (var(--sjs-base-unit, var(--base-unit, 8px)))) !important;
}
@-moz-document url-prefix() {
  .sv_window,
  .sv_window * {
    scrollbar-width: thin;
    scrollbar-color: var(--sjs-border-default, var(--border, #d6d6d6)) transparent;
  }
}
.sv_window::-webkit-scrollbar,
.sv_window *::-webkit-scrollbar {
  width: 12px;
  height: 12px;
  background-color: transparent;
}
.sv_window::-webkit-scrollbar-thumb,
.sv_window *::-webkit-scrollbar-thumb {
  border: 4px solid rgba(0, 0, 0, 0);
  background-clip: padding-box;
  border-radius: 32px;
  background-color: var(--sjs-border-default, var(--border, #d6d6d6));
}
.sv_window::-webkit-scrollbar-track,
.sv_window *::-webkit-scrollbar-track {
  background: transparent;
}
.sv_window::-webkit-scrollbar-thumb:hover,
.sv_window *::-webkit-scrollbar-thumb:hover {
  border: 2px solid rgba(0, 0, 0, 0);
  background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
}

.sv_window_root-content {
  height: 100%;
}

.sv_window--full-screen {
  top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  left: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  right: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  max-height: 100%;
  width: initial !important;
  max-width: initial !important;
}

.sv_window_header {
  display: flex;
  justify-content: flex-end;
}

.sv_window_content {
  overflow: hidden;
}

.sv_window--collapsed {
  height: initial;
}
.sv_window--collapsed .sv_window_header {
  height: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  padding: var(--sjs-base-unit, var(--base-unit, 8px)) var(--sjs-base-unit, var(--base-unit, 8px)) var(--sjs-base-unit, var(--base-unit, 8px)) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  border-radius: var(--sjs-base-unit, var(--base-unit, 8px));
  display: flex;
  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
  box-sizing: content-box;
}
.sv_window--collapsed .sv_window_content {
  display: none;
}
.sv_window--collapsed .sv_window_buttons_container {
  margin-top: 0;
  margin-right: 0;
}

.sv_window_header_title_collapsed {
  color: var(--sjs-general-dim-forecolor, rgba(0, 0, 0, 0.91));
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  font-style: normal;
  font-weight: 600;
  font-size: var(--sjs-font-size, 16px);
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  flex: 1;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.sv_window_header_description {
  color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
  font-feature-settings: "salt" on;
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  font-style: normal;
  font-size: var(--sjs-font-size, 16px);
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.sv_window_buttons_container {
  position: fixed;
  margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
  margin-right: var(--sjs-base-unit, var(--base-unit, 8px));
  display: flex;
  gap: var(--sjs-base-unit, var(--base-unit, 8px));
  z-index: 10000;
}

.sv_window_button {
  display: flex;
  padding: var(--sjs-base-unit, var(--base-unit, 8px));
  justify-content: center;
  align-items: center;
  border-radius: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  cursor: pointer;
}
.sv_window_button:hover, .sv_window_button:active {
  background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
}
.sv_window_button:hover svg use,
.sv_window_button:hover svg path, .sv_window_button:active svg use,
.sv_window_button:active svg path {
  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
}
.sv_window_button:active {
  opacity: 0.5;
}
.sv_window_button svg use,
.sv_window_button svg path {
  fill: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
}

sv-brand-info,
.sv-brand-info {
  z-index: 1;
  position: relative;
  margin-top: 1px;
}

.sv-brand-info {
  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
  text-align: right;
  color: #161616;
  padding: 24px 40px;
}
.sv-brand-info a {
  color: #161616;
  text-decoration-line: underline;
}

.sd-body--static .sv-brand-info {
  padding-top: 0;
  margin-top: 16px;
}

.sd-body--responsive .sv-brand-info {
  padding-top: 16px;
  margin-top: -8px;
}

.sd-root-modern--mobile .sv-brand-info {
  padding: 48px 24px 8px 24px;
  margin-top: 0;
  text-align: center;
}

.sv-brand-info__text {
  font-weight: 600;
  font-size: var(--sjs-font-size, 16px);
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  color: #161616;
}

.sv-brand-info__logo {
  display: inline-block;
}
.sv-brand-info__logo img {
  width: 118px;
}

.sv-brand-info__terms {
  font-weight: 400;
  font-size: calc(0.75 * (var(--sjs-font-size, 16px)));
  line-height: var(--sjs-font-size, 16px);
  padding-top: 4px;
}
.sv-brand-info__terms a {
  color: #909090;
}

.sd-body--responsive .sv-brand-info {
  padding-right: 0;
  padding-left: 0;
}

.sv-ranking {
  outline: none;
  user-select: none;
  -webkit-user-select: none;
}

.sv-ranking-item {
  cursor: pointer;
  position: relative;
  opacity: 1;
}

.sv-ranking-item:focus .sv-ranking-item__icon--hover {
  visibility: hidden;
}

.sv-ranking-item:hover:not(:focus) .sv-ranking-item__icon--hover {
  visibility: visible;
}

.sv-question--disabled .sv-ranking-item:hover .sv-ranking-item__icon--hover {
  visibility: hidden;
}

.sv-ranking-item:focus {
  outline: none;
}

.sv-ranking-item:focus .sv-ranking-item__icon--focus {
  visibility: visible;
  top: calc(0.6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-ranking-item:focus .sv-ranking-item__index {
  background: var(--sjs-general-backcolor, var(--background, #fff));
  outline: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid var(--sjs-primary-backcolor, var(--primary, #19b394));
}

.sv-ranking-item__content.sv-ranking-item__content {
  display: flex;
  align-items: center;
  line-height: 1em;
  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0px;
  border-radius: calc(12.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-ranking-item__icon-container {
  position: relative;
  left: 0;
  bottom: 0;
  flex-shrink: 0;
  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  align-self: flex-start;
  padding-left: var(--sjs-base-unit, var(--base-unit, 8px));
  padding-right: var(--sjs-base-unit, var(--base-unit, 8px));
  margin-left: calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  box-sizing: content-box;
}

.sv-ranking-item--disabled.sv-ranking-item--disabled,
.sv-ranking-item--readonly.sv-ranking-item--readonly,
.sv-ranking-item--preview.sv-ranking-item--preview {
  cursor: initial;
  user-select: initial;
  -webkit-user-select: initial;
}
.sv-ranking-item--disabled.sv-ranking-item--disabled .sv-ranking-item__icon-container.sv-ranking-item__icon-container .sv-ranking-item__icon.sv-ranking-item__icon,
.sv-ranking-item--readonly.sv-ranking-item--readonly .sv-ranking-item__icon-container.sv-ranking-item__icon-container .sv-ranking-item__icon.sv-ranking-item__icon,
.sv-ranking-item--preview.sv-ranking-item--preview .sv-ranking-item__icon-container.sv-ranking-item__icon-container .sv-ranking-item__icon.sv-ranking-item__icon {
  visibility: hidden;
}

.sv-ranking-item__icon.sv-ranking-item__icon {
  visibility: hidden;
  fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
  position: absolute;
  top: var(--sjs-base-unit, var(--base-unit, 8px));
  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
}

.sv-ranking-item__index.sv-ranking-item__index {
  --sjs-internal-font-editorfont-size: var(--sjs-mobile-font-editorfont-size, var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px)));
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
  font-size: var(--sjs-internal-font-editorfont-size);
  border-radius: 100%;
  border: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid transparent;
  width: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  height: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
  box-sizing: border-box;
  font-weight: 600;
  margin-left: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  transition: outline var(--sjs-transition-duration, 150ms), background var(--sjs-transition-duration, 150ms);
  outline: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid transparent;
  align-self: self-start;
}
.sv-ranking-item__index.sv-ranking-item__index svg {
  fill: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
  width: var(--sjs-internal-font-editorfont-size);
  height: var(--sjs-internal-font-editorfont-size);
}

.sv-ranking-item__text {
  --sjs-internal-font-editorfont-size: var(--sjs-mobile-font-editorfont-size, var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px)));
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
  font-size: var(--sjs-internal-font-editorfont-size);
  line-height: calc(1.5 * (var(--sjs-internal-font-editorfont-size)));
  margin: 0 calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
  overflow-wrap: break-word;
  word-break: normal;
  align-self: self-start;
  padding-top: var(--sjs-base-unit, var(--base-unit