/*!*****************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/survey--topic/style.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************/
.survey-topic {
  --background-color: var(--wp--preset--color--neutral);
  --title-color: var(--wp--preset--color--accent-secondary-6);
  --divider-color: var(--wp--preset--color--accent-secondary-1);
  --tooltip-border-color: var(--wp--preset--color--main-primary-soft);
  --tooltip-background-color: var(--wp--preset--color--neutral);
  --tooltip-text-color: var(--wp--preset--color--main-primary-medium);
  --tooltip-shadow-color: var(--wp--preset--color--accent-primary-6-semi-transparent);
  --answer-separator-color--radio: var(--wp--preset--color--neutral);
  --answer-background-color--radio-1: var(--wp--preset--color--accent-tertiary-1);
  --answer-background-color--radio-2: var(--wp--preset--color--accent-tertiary-2);
  --answer-background-color--radio-3: var(--wp--preset--color--accent-tertiary-3);
  --answer-label-background-color: var(--wp--preset--color--main-primary-medium);
  --answer-label-text-color: var(--wp--preset--color--neutral);
  --answer-label-border-color: var(--wp--preset--color--neutral);
  --answer-button-main-color: var(--wp--preset--color--main-primary-medium);
  --answer-button-background-color: var(--wp--preset--color--neutral);
  --answer-button-background-color--interacting: var(--wp--preset--color--accent-primary-3);
  --error-color: var(--wp--preset--color--supplemental-tertiary-2);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: space-between;
  padding: 0;
  border: none;
  counter-increment: survey-question-count;
}
@media (max-width: 767px) {
  .survey-topic {
    --background-color: var(--wp--preset--color--main-primary-pale);
  }
}
@media (max-width: 767px) {
  .survey-topic {
    background-color: var(--background-color);
    flex-direction: column;
  }
  .survey-topic ~ .survey-topic {
    margin-top: 12px;
  }
}
.survey-topic header {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  flex-grow: 1;
  flex-shrink: 1;
  width: 70%;
  padding: 18px 48px 18px 10px;
  border-bottom: 2px solid var(--divider-color);
  min-height: 65px;
}
@media (max-width: 767px) {
  .survey-topic header {
    padding: 12px 32px 12px 12px;
    min-height: unset;
    width: 100%;
    border-bottom-width: 1px;
  }
}
.survey-topic__title-container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 0;
  width: 100%;
}
.survey-topic__title-container .survey-topic__title {
  display: inline;
  margin: 0;
}
.survey-topic__title-container:before {
  content: counter(survey-question-count) ". ";
  padding-right: 0.55em;
  padding-top: 0.1em;
}
.survey-topic__title-container, .survey-topic__title {
  font-size: 18px;
  font-weight: 500;
  color: var(--title-color);
  line-height: 1.4;
}
.survey-topic .tooltip {
  position: relative;
  z-index: 99;
  left: 21px;
  vertical-align: text-bottom;
}
.survey-topic .tooltip img {
  cursor: help;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.survey-topic .tooltip span {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  bottom: 0;
  left: 100%;
  background-color: var(--tooltip-background-color);
  border: 1px solid var(--tooltip-border-color);
  box-shadow: 2px 2px 4px var(--tooltip-shadow-color);
  transform: translate(12px, -12px);
  width: 245px;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.4;
  color: var(--tooltip-text-color);
  opacity: 0;
  transition: 0.25s all ease-in-out;
}
@media (max-width: 767px) {
  .survey-topic .tooltip span {
    visibility: visible;
    display: block;
    width: 100%;
    position: static;
    transform: translateX(-20px);
    max-height: 1px;
    padding: 0;
  }
}
.survey-topic .tooltip:focus span, .survey-topic .tooltip:hover span {
  visibility: visible;
  display: block;
  opacity: 1;
  max-height: 300px;
  padding: 16px;
}
@media (max-width: 767px) {
  .survey-topic .tooltip:focus span, .survey-topic .tooltip:hover span {
    margin-top: 12px;
  }
}
.survey-topic__response {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 36.275%;
  max-width: 357px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
}
@media (max-width: 767px) {
  .survey-topic__response {
    padding: 10px 12px;
    width: 100%;
    max-width: unset;
  }
}
@media (max-width: 390px) {
  .survey-topic__response {
    flex-direction: column;
  }
}
.survey-topic__response .answer {
  width: 33.3%;
  flex-grow: 1;
  flex-shrink: 0;
  align-items: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--answer-background-color--radio-1);
  position: relative;
  padding-bottom: 2px;
}
.survey-topic__response .answer:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--separator-color);
}
@media (max-width: 767px) {
  .survey-topic__response .answer:after {
    display: none;
  }
}
@media (min-width: 768px) {
  .survey-topic__response .answer ~ .answer {
    border-left: 3px solid var(--answer-separator-color--radio);
  }
}
.survey-topic__response .answer:nth-child(2) {
  background-color: var(--answer-background-color--radio-2);
}
.survey-topic__response .answer:nth-child(3) {
  background-color: var(--answer-background-color--radio-3);
}
@media (max-width: 767px) {
  .survey-topic__response .answer, .survey-topic__response .answer:nth-child(2), .survey-topic__response .answer:nth-child(3) {
    background-color: transparent;
    padding: 5px;
  }
}
@media (max-width: 390px) {
  .survey-topic__response .answer {
    width: 100%;
  }
}
.survey-topic__response .answer:first-child__label span {
  left: 0;
  width: calc(100% + 1px);
}
.survey-topic__response .answer__label {
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1px;
  height: 1px;
  background-color: var(--answer-label-background-color);
  color: var(--answer-label-text-color);
  text-transform: uppercase;
  pointer-events: none;
  font-size: 14px;
  font-weight: 900;
  border-bottom: 3px solid var(--answer-label-border-color);
}
@media (min-width: 768px) {
  .survey-topic__response .answer__label {
    font-size: 18px;
    position: absolute;
    bottom: 100%;
    left: -1px;
    height: 50px;
    width: calc(100% + 2px);
  }
}
@media (max-width: 1024px) {
  .survey-topic__response .answer__label {
    font-size: 16px;
  }
}
.survey-topic__response .answer button {
  -webkit-appearance: none !important;
  margin: 0;
  padding: 0;
  width: 24px;
  height: 24px;
  border: 2px solid var(--answer-button-main-color);
  color: var(--answer-button-main-color);
  border-radius: 50%;
  background-color: var(--answer-button-background-color);
  position: relative;
  cursor: pointer;
}
.survey-topic__response .answer button span {
  display: none;
}
@media (max-width: 767px) {
  .survey-topic__response .answer button {
    width: 100%;
    height: auto;
    padding: 10px;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 3px;
  }
  .survey-topic__response .answer button span {
    display: block;
  }
}
.survey-topic__response .answer button:focus, .survey-topic__response .answer button:hover {
  background-color: var(--answer-button-background-color--interacting);
}
.survey-topic__response .answer button[disabled]:not([aria-selected]) {
  opacity: 0.35;
  cursor: default;
}
.survey-topic__response .answer button[disabled]:not([aria-selected]):hover, .survey-topic__response .answer button[disabled]:not([aria-selected]):focus {
  background-color: var(--answer-button-background-color--interacting);
}
.survey-topic__response .answer button[aria-invalid] {
  border-color: var(--error-color);
  color: var(--error-color);
}
.survey-topic__response .answer button[aria-checked=true], .survey-topic__response .answer button[aria-selected=true] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAFQ2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS41LjAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgeG1sbnM6ZXhpZj0iaHR0cDovL25zLmFkb2JlLmNvbS9leGlmLzEuMC8iCiAgICB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iCiAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyIKICAgIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIKICAgIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIgogICAgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIKICAgZXhpZjpDb2xvclNwYWNlPSIxIgogICBleGlmOlBpeGVsWERpbWVuc2lvbj0iMzIiCiAgIGV4aWY6UGl4ZWxZRGltZW5zaW9uPSIzMiIKICAgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIKICAgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIgogICB0aWZmOkltYWdlTGVuZ3RoPSIzMiIKICAgdGlmZjpJbWFnZVdpZHRoPSIzMiIKICAgdGlmZjpSZXNvbHV0aW9uVW5pdD0iMiIKICAgdGlmZjpYUmVzb2x1dGlvbj0iNzIvMSIKICAgdGlmZjpZUmVzb2x1dGlvbj0iNzIvMSIKICAgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyNS0wNi0zMFQwMjoxNDoyNi0wNDowMCIKICAgeG1wOk1vZGlmeURhdGU9IjIwMjUtMDYtMzBUMDI6MTQ6MjYtMDQ6MDAiPgogICA8eG1wTU06SGlzdG9yeT4KICAgIDxyZGY6U2VxPgogICAgIDxyZGY6bGkKICAgICAgeG1wTU06YWN0aW9uPSJwcm9kdWNlZCIKICAgICAgeG1wTU06c29mdHdhcmVBZ2VudD0iQWZmaW5pdHkgRGVzaWduZXIgMS4xMC44IgogICAgICB4bXBNTTp3aGVuPSIyMDI0LTAxLTExVDE2OjAyOjEzLTA1OjAwIi8+CiAgICAgPHJkZjpsaQogICAgICBzdEV2dDphY3Rpb249InByb2R1Y2VkIgogICAgICBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZmZpbml0eSBEZXNpZ25lciAyIDIuNi4zIgogICAgICBzdEV2dDp3aGVuPSIyMDI1LTA2LTMwVDAyOjE0OjI2LTA0OjAwIi8+CiAgICA8L3JkZjpTZXE+CiAgIDwveG1wTU06SGlzdG9yeT4KICA8L3JkZjpEZXNjcmlwdGlvbj4KIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+Cjw/eHBhY2tldCBlbmQ9InIiPz5OkstBAAABgGlDQ1BzUkdCIElFQzYxOTY2LTIuMQAAKJF1kd8rg1EYxz/bMDFRXLiQlnA1mqllN8qWUJJmynCzvfZD7cfb+25puVVuV5S48euCv4Bb5VopIiXX3BI36PW8ttqSndPzPJ/zPed5Ouc5YA2llLRe54Z0JqcFJ/zOhfCi0/5CA91iLfgiiq6Ozc5OU3N83GEx482AWav2uX9H80pMV8DSKDyqqFpOeFJ4ei2nmrwt3KEkIyvCp8IuTS4ofGvq0RI/m5wo8ZfJWigYAGubsDNRxdEqVpJaWlheTm86lVfK9zFf4ohl5uck9oh1oRNkAj9OphgngJchfOK9DOBhUFbUyHf/5s+QlVxFvEoBjVUSJMnhEjUv1WMS46LHZKYomP3/21c9PuwpVXf4of7JMN76wL4F30XD+Dw0jO8jsD3CRaaSnz2AkXfRixWtdx9aN+DssqJFd+B8Ezof1IgW+ZVsYtZ4HF5PoCUM7dfQtFTqWXmf43sIrctXXcHuHvTL+dblH3TdZ+xsscDZAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB20lEQVRYhc3XsWsUQRQG8N9tDFp5gkkTsRAbIXaSFNd4YBUL01hbHvgHiE1sEhvNf7DlgV2aWAh2Z7OFYpcUgWAKMYVEuD1EFFNYzBxezouux91uPphimWG+b96b2fe9moKoN1qzaOIebmIhDjiMYwcv0cmz9GeRfWsFiOexhge4VFBvF21s5Fl6NJaAeOJHeIyLBYmH0cMzbJ4WkZEC6o3WHLZwe0ziYXRwP8/SL/8UUG+0buAVrk2IvI8DrORZuneqgHjyt1MgHxSxNBiJZIB8Vgj7tMjFvbci10kBwoWbVM7/hmbkQkxBfGr7xr/t/4serudZetSPwFqJ5CLXE6jFfHxW/CczKXQxnwg5KZtc5Gwmwr+9KqwmQmGpCouJ3xWtCiycCQGVIhGMRFU4PBMCdioUsJsIHq4qbCeCW+lWQN5FJ4lerV2BgHaepcf9Z/hUKJFloYcNmIEfH99/u3D1VoI7JQlYz7P0NScd0SbelEDewfP+x7ApvYx3pucLP2B5pCmFOLEiuNdJ4wB3h3uDP2pB9O3LJpuOjmDH94YnZkatjpfyBb5jCefHJO5hHQ/zLP06akGR5nROMJDlNqcjhJwT/OMqFgUfcSVOfxKK2i62hfb8uMi+vwCzOoqQFbZdfQAAAABJRU5ErkJggg==);
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: center center;
}
.survey-topic__response .answer button[aria-checked=true]:focus, .survey-topic__response .answer button[aria-checked=true]:hover, .survey-topic__response .answer button[aria-selected=true]:focus, .survey-topic__response .answer button[aria-selected=true]:hover {
  background-color: var(--answer-button-background-color);
}
@media (max-width: 767px) {
  .survey-topic__response .answer button[aria-checked=true], .survey-topic__response .answer button[aria-checked=true]:focus, .survey-topic__response .answer button[aria-checked=true]:hover, .survey-topic__response .answer button[aria-selected=true], .survey-topic__response .answer button[aria-selected=true]:focus, .survey-topic__response .answer button[aria-selected=true]:hover {
    background-image: none;
    background-color: var(--answer-button-main-color);
    border-color: var(--answer-button-main-color);
    color: var(--answer-button-background-color);
  }
}
@media (min-width: 768px) {
  .survey-topic:first-of-type .survey-topic__response .answer__label {
    opacity: 1;
  }
}
.is-style-default .survey-topic {
  --background-color: var(--wp--preset--color--main-primary-pale);
  --title-color: var(--wp--preset--color--main-primary);
  --answer-field-border-color: var(--wp--preset--color--main-primary-medium);
  --answer-field-background-color: var(--wp--preset--color--neutral);
  --answer-field-background-color--disabled: var(--wp--preset--color--neutral);
  --answer-field-text-color: var(--wp--preset--color--main-primary-medium);
  --answer-field-text-color--placeholder: var(--wp--preset--color--accent-secondary-5);
  margin-bottom: 18px;
}
.is-style-default .survey-topic header {
  margin-right: 18px;
  padding: 15px 40px 13px 15px;
  width: 59.4%;
  max-width: 694px;
  background-color: var(--background-color);
  border: none;
  flex-grow: 0;
  min-height: 81px;
}
@media (max-width: 1024px) {
  .is-style-default .survey-topic header {
    width: 50%;
  }
}
@media (max-width: 767px) {
  .is-style-default .survey-topic__title-container:before {
    content: unset;
  }
}
.is-style-default .survey-topic__title-container, .is-style-default .survey-topic__title {
  color: var(--title-color);
  line-height: 1.35;
}
@media (max-width: 767px) {
  .is-style-default .survey-topic__title-container, .is-style-default .survey-topic__title {
    font-size: 16px;
  }
}
.is-style-default .survey-topic__response {
  width: 40.6%;
  max-width: 450px;
  flex-grow: 1;
  flex-shrink: 1;
  align-items: stretch;
  justify-content: stretch;
}
@media (max-width: 1024px) {
  .is-style-default .survey-topic__response {
    width: 50%;
  }
}
@media (max-width: 767px) {
  .is-style-default .survey-topic__response {
    padding: 0 15px 15px 15px;
    background-color: var(--background-color);
  }
}
.is-style-default .survey-topic__response__input {
  border: 1px solid var(--answer-field-border-color);
  padding: 15px 15px 0 15px;
  border-radius: 0;
  display: flex;
  width: 100%;
  height: 100%;
  font-size: 18px;
  resize: none;
}
.is-style-default .survey-topic__response__input[disabled] {
  border-color: transparent;
  background-color: var(--answer-field-background-color--disabled);
}
.is-style-default .survey-topic__response__input, .is-style-default .survey-topic__response__input[disabled] {
  color: var(--answer-field-text-color);
  -webkit-text-fill-color: var(--answer-field-text-color);
}
@media (max-width: 767px) {
  .is-style-default .survey-topic__response__input {
    font-size: 16px;
  }
}
.is-style-default .survey-topic__response__input::-moz-placeholder {
  color: var(--answer-field-text-color--placeholder);
  opacity: 1;
}
.is-style-default .survey-topic__response__input, .is-style-default .survey-topic__response__input::placeholder {
  color: var(--answer-field-text-color--placeholder);
  opacity: 1;
}
.is-style-default .survey-topic__response__input[aria-invalid] {
  border-color: var(--error-color);
}
.is-style-default .survey-topic__response__input[aria-invalid]::-moz-placeholder {
  color: var(--error-color);
}
.is-style-default .survey-topic__response__input[aria-invalid]::placeholder {
  color: var(--error-color);
}
@media (max-width: 767px) {
  .is-style-default .survey-topic header, .is-style-default .survey-topic__response {
    margin: 0;
    width: 100%;
    max-width: unset;
    min-height: unset;
  }
}
.is-style-default .survey-topic .tooltip {
  left: 23px;
}
@media (max-width: 767px) {
  .is-style-default .survey-topic .tooltip {
    left: 15px;
  }
}
@media (max-width: 767px) {
  .is-style-default .survey-topic .tooltip span {
    width: calc(100% + 25px);
    transform: translateX(-15px);
  }
}

/*# sourceMappingURL=style-index.css.map*/