@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap");
@import '../fonts/Marselis Pro/stylesheet.css';
.body-overlay {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  pointer-events: none;
  background-color: rgba(109, 109, 109, 0.5);
  opacity: 1;
  transition: opacity 0.5s ease;
}
.body-overlay-hidden {
  width: 0;
  height: 0;
  opacity: 0;
}
.body-overlay-fadeout {
  opacity: 0;
}

.modal {
  font-family: "Work Sans", sans-serif, serif;
  position: fixed;
  left: 0;
  top: 0;
  transform: translateX(100%);
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: 1000;
  transition: transform 0.5s ease;
}
.modal.visible {
  transform: translateX(0);
}

.modal_container {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 930px;
  min-height: 100vh;
  background-color: #f3f3f3;
  padding: 32px;
  position: fixed;
  z-index: 1001;
  right: 0;
  animation: slideIn 0.5s ease-out forwards;
}
@media (max-width: 600px) {
  .modal_container {
    min-height: 125vh;
    overflow-y: auto;
    padding: 20px;
  }
}

@keyframes slideIn {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0%);
  }
}
@keyframes fadeOutBlur {
  from {
    opacity: 1;
    backdrop-filter: blur(2px);
  }
  to {
    opacity: 0;
    backdrop-filter: blur(5px);
  }
}
.modal.fadeOut {
  animation: fadeOutBlur 0.5s ease-out forwards;
}

.modal_header {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 40px;
  gap: 16px;
}
@media (max-width: 600px) {
  .modal_header {
    align-items: start;
    margin-bottom: 16px;
  }
}

.modal_title__block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.modal_title__block-hidden {
  visibility: hidden;
}

.modal_title {
  font-size: 24px;
  font-weight: 700;
  line-height: 28.8px;
  letter-spacing: 0.02em;
}

.modal_subtitle {
  font-family: "Work Sans", sans-serif, serif;
  opacity: 70%;
  font-size: 14px;
  font-weight: 400;
  line-height: 17.07px;
  color: #0F0F0F;
}
.modal_subtitle__option {
  display: none;
}
.modal_subtitle__option-active {
  display: block;
}

.modal_btn__block {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 40px;
}
@media (max-width: 600px) {
  .modal_btn__block {
    gap: 16px;
  }
}

.modal_cancel {
  color: #0F0F0F;
  font-size: 18px;
  font-weight: 600;
  line-height: 21.6px;
  cursor: pointer;
}

.modal_save {
  background-color: var(--category-color);
  color: #FFF;
  border-radius: 3px;
  padding: 16px 48px 16px 48px;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  cursor: pointer;
}

#modalSize .modal_title {
  font-weight: 400;
}

.modal_size__selectors {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 50px;
}
@media (max-width: 600px) {
  .modal_size__selectors {
    margin-bottom: 16px;
  }
}
body.nanoperf .modal_size__selectors, body.linears .modal_size__selectors {
  flex-wrap: wrap;
  gap: 24px 40px;
}
@media (max-width: 600px) {
  body.nanoperf .modal_size__selectors, body.linears .modal_size__selectors {
    gap: 16px;
  }
}
@media (min-width: 601px) {
  .modal_size__sku {
    position: absolute;
    left: 16px;
    bottom: 16px;
  }
}
.modal_size__sku-inner {
  padding: 16px;
  background: #ffffff;
  display: inline-flex;
  width: auto;
  border-radius: 12px;
  font-weight: 400;
}
.modal_size__sku-inner .sku__label {
  color: rgba(15, 15, 15, 0.7);
  margin-right: 8px;
  font-size: 14px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal_size__sku-inner .sku__value {
  line-height: 16px;
  height: 16px;
  font-size: 16px;
  text-align: center;
  color: #0F0F0F;
}

.size_selector,
.reveal_selector {
  background-color: #ffffff;
  padding: 16px 24px 24px;
  -webkit-border-radius: 26px;
  -moz-border-radius: 26px;
  border-radius: 26px;
}
.title_and_switch {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  gap: 20px;
}

.size_title,
.reveal_title {
  margin-bottom: 24px;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
  font-family: "MarselisPro", sans-serif, serif;
}

body.linears .size_option,
body.linears .reveal_option,
body.linears .reveal-type_option {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 16px;
  cursor: pointer;
  user-select: none;
}

body.linears .size_option input[type=radio],
body.linears .reveal_option input[type=radio],
body.linears .reveal-type_option input[type=radio] {
  appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.5em;
  height: 1.5em;
  border: 0.0625em solid #A5ABAC;
  display: grid;
  place-content: center;
  -webkit-border-radius: 1.25em;
  -moz-border-radius: 1.25em;
  border-radius: 1.25em;
  flex-shrink: 0;
  transition: border-width 0.3s ease;
}

body.linears .size_option input[type=radio]:checked,
body.linears .reveal_option input[type=radio]:checked,
body.linears .reveal-type_option input[type=radio]:checked {
  border-width: 0.375em;
  border-color: var(--category-color);
}

body.linears .size_option span,
body.linears .reveal_option span,
body.linears .reveal-type_option span {
  position: relative;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  -webkit-font-smoothing: antialiased;
}

.style_selector,
.spacing_selector {
  background-color: #ffffff;
  padding: 16px 24px 24px;
  -webkit-border-radius: 26px;
  -moz-border-radius: 26px;
  border-radius: 26px;
}

.spacing-measure__toggle {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}

.spacing-measure__inches,
.spacing-measure__slats {
  font-size: 14px;
  line-height: 16.8px;
  font-weight: normal;
  transition: all 0.3s ease;
  opacity: 0.7;
}
.spacing-measure__inches.spacing-measure__selected,
.spacing-measure__slats.spacing-measure__selected {
  font-weight: 600;
  opacity: 1;
}

.toggle_container {
  position: relative;
  min-width: 46px;
  height: 26px;
  border: 1px solid #a5abac;
  border-radius: 26px;
  background-color: #ffffff;
  cursor: pointer;
}

.toggle_units {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--category-color);
  border: none;
  cursor: pointer;
  transition: left 0.3s ease;
}

.toggle_units.active {
  left: 21px;
}

.spacing_title {
  margin-bottom: 4px;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  font-family: "MarselisPro", sans-serif, serif;
}
.hybrids .spacing_title {
  margin-left: auto;
  margin-right: auto;
}

.cf-range-slider {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  position: relative;
  user-select: none;
}
.cf-range-slider.hidden {
  display: none;
}
.cf-range-slider::before {
  content: "";
  width: 100%;
  height: 12px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #E6E6E6;
}
.cf-range-slider--bottom:before {
  top: 12px;
}
.cf-range-slider__item {
  width: 10%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
}
.cf-range-slider__item.hidden {
  display: none;
}
.cf-range-slider--2 .cf-range-slider__item {
  width: calc(100% / 2);
}
.cf-range-slider--3 .cf-range-slider__item {
  width: calc(100% / 3);
}
.cf-range-slider--4 .cf-range-slider__item {
  width: calc(100% / 4);
}
.cf-range-slider--5 .cf-range-slider__item {
  width: calc(100% / 5);
}
.cf-range-slider--6 .cf-range-slider__item {
  width: calc(100% / 6);
}
.cf-range-slider--7 .cf-range-slider__item {
  width: calc(100% / 7);
}
.cf-range-slider--8 .cf-range-slider__item {
  width: calc(100% / 8);
}
.cf-range-slider--9 .cf-range-slider__item {
  width: calc(100% / 9);
}
.cf-range-slider--10 .cf-range-slider__item {
  width: calc(100% / 10);
}
.cf-range-slider[data-range-count="2"] .cf-range-slider__item {
  width: calc(100% / 2);
}
.cf-range-slider[data-range-count="3"] .cf-range-slider__item {
  width: calc(100% / 3);
}
.cf-range-slider[data-range-count="4"] .cf-range-slider__item {
  width: calc(100% / 4);
}
.cf-range-slider[data-range-count="5"] .cf-range-slider__item {
  width: calc(100% / 5);
}
.cf-range-slider[data-range-count="6"] .cf-range-slider__item {
  width: calc(100% / 6);
}
.cf-range-slider[data-range-count="7"] .cf-range-slider__item {
  width: calc(100% / 7);
}
.cf-range-slider[data-range-count="8"] .cf-range-slider__item {
  width: calc(100% / 8);
}
.cf-range-slider[data-range-count="9"] .cf-range-slider__item {
  width: calc(100% / 9);
}
.cf-range-slider[data-range-count="10"] .cf-range-slider__item {
  width: calc(100% / 10);
}
.cf-range-slider__caption {
  font-size: clamp(7px, 0.8vw, 12px);
  white-space: nowrap;
  opacity: 0.7;
}
.cf-range-slider__caption.panel-type_option__label {
  font-size: clamp(8px, 0.9vw, 14px);
}
.cf-range-slider__caption--top {
  order: -1;
}
.cf-range-slider input[type=radio] {
  appearance: none;
  background-color: transparent;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.5em;
  height: 1.5em;
  border: 0;
  display: grid;
  place-content: center;
  -webkit-border-radius: 1.25em;
  -moz-border-radius: 1.25em;
  border-radius: 1.25em;
  flex-shrink: 0;
  cursor: inherit;
  position: relative;
  outline: none;
}
.cf-range-slider input[type=radio]:not(:checked):before {
  content: "";
  width: 1px;
  height: 12px;
  border: 1px solid #6F6F6F;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.cf-range-slider input[type=radio]:checked {
  background-color: #fff;
  border: 0.5em solid var(--category-color);
}
.cf-range-slider input[type=radio]:checked + span, .cf-range-slider input[type=radio]:checked + span + span {
  opacity: 1;
}
.cf-range-slider input[type=radio]:disabled + span, .cf-range-slider input[type=radio]:disabled + span + span {
  opacity: 0.3;
}

.modal_size__interactive-spacing {
  width: 100%;
  margin-top: auto;
}

.material_selector {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 8px;
  width: 100%;
  border-radius: 10px;
  margin-bottom: 40px;
}
@media (max-width: 1000px) {
  .material_selector {
    grid-template-columns: repeat(1, 1fr);
  }
}
@media (max-width: 600px) {
  .material_selector {
    gap: 16px;
    width: 100%;
    margin-bottom: 20px;
  }
}

.material_left__column {
  width: 50%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (max-width: 600px) {
  .material_left__column {
    width: 100%;
    gap: 16px;
  }
}

.material_right__column {
  width: 50%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (max-width: 600px) {
  .material_right__column {
    width: 100%;
    gap: 16px;
  }
}

.material_options__group {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
  padding: 16px 24px;
  border-radius: 18px;
  font-size: 16px;
  background-color: #FFF;
}
@media (max-width: 600px) {
  .material_options__group {
    flex-direction: column;
    align-items: flex-start;
  }
}

.material_options__group_title {
  font-size: 20px;
  line-height: 24.88px;
  font-weight: 700;
  flex-basis: 100%;
  margin-bottom: 8px;
}
@media (max-width: 600px) {
  .material_options__group_title {
    flex-basis: unset;
  }
}

.material_option {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: start;
  padding: 0;
  border-radius: 18px;
  cursor: pointer;
  font-size: 16px;
  user-select: none;
  width: calc((100% - 32px) / 3);
  flex: 0 0 calc((100% - 32px) / 3);
}

.material_option img {
  border-radius: 8px;
  width: 40px;
  height: 40px;
}

.material_option__certificate {
  max-width: 26px;
  max-height: 26px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.material_option span {
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  font-family: "Work Sans", sans-serif, serif;
  -webkit-font-smoothing: antialiased;
  flex-basis: fit-content;
}

.material_option input[type=radio] {
  appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.5em;
  height: 1.5em;
  border: 0.0625em solid #A5ABAC;
  display: grid;
  place-content: center;
  -webkit-border-radius: 1.25em;
  -moz-border-radius: 1.25em;
  border-radius: 1.25em;
  flex-shrink: 0;
  transition: border-width 0.3s ease;
}

.material_option input[type=radio]:checked {
  border-width: 0.375em;
  border-color: var(--category-color);
}

.material_preview {
  margin-top: auto;
  background: #FFF;
  display: none;
  justify-content: center;
  align-content: center;
  border-radius: 18px;
  padding: 0;
}
.material_preview img {
  margin: 24px;
}
.material_preview.visible {
  display: flex;
}

.color_selector {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 8px;
  width: 100%;
}
.color_selector__groups {
  border-radius: 18px;
  background-color: #FFF;
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 8px;
  width: 100%;
}

.component_colors {
  margin-top: 32px;
}
.component_colors__title {
  margin-bottom: 8px;
}

.color_selector__group {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
  padding: 16px 24px;
  border-radius: 18px;
  font-size: 16px;
  background-color: #FFF;
}
@media (max-width: 600px) {
  .color_selector__group {
    flex-direction: column;
    align-items: flex-start;
  }
}

.color_selector__group_title {
  font-size: 20px;
  line-height: 24.88px;
  font-weight: 700;
  flex-basis: 100%;
  margin-bottom: 8px;
}
@media (max-width: 600px) {
  .color_selector__group_title {
    flex-basis: unset;
  }
}

.color_option {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  border-radius: 10px;
  cursor: pointer;
  font-size: 16px;
  user-select: none;
  width: calc(33% - 9px);
}
@media (max-width: 600px) {
  .color_option {
    width: 100%;
  }
}
.color_option--hidden {
  display: none;
}

.color_option input[type=radio] {
  appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.5em;
  height: 1.5em;
  border: 0.0625em solid #A5ABAC;
  display: grid;
  place-content: center;
  -webkit-border-radius: 1.25em;
  -moz-border-radius: 1.25em;
  border-radius: 1.25em;
  flex-shrink: 0;
  transition: border-width 0.3s ease;
}

.color_option input[type=radio]:checked {
  border-width: 0.375em;
  border-color: var(--category-color);
}

.color_option input[type=radio]:disabled,
.color_option input[type=radio]:disabled + img,
.color_option input[type=radio]:disabled + img + div {
  opacity: 0.3;
  cursor: auto;
}

.color_option__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.color_option__title {
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  font-family: "Work Sans", sans-serif, serif;
  -webkit-font-smoothing: antialiased;
}

.color_option__subtitle {
  opacity: 60%;
  font-size: 12px;
  font-weight: 400;
  line-height: 14.4px;
  font-family: "Work Sans", sans-serif, serif;
  -webkit-font-smoothing: antialiased;
}

.color_option__custom_note {
  padding: 16px;
  background: rgb(239, 219, 220);
  background: #FFF4EF;
  display: flex;
  gap: 16px;
  margin-top: 8px;
  border-radius: 26px;
  align-items: center;
}
.color_option__custom_note--hidden {
  display: none;
}
.color_option__custom_note p {
  color: #FE5000;
  font-size: 16px;
  font-weight: 400;
  line-height: 18.77px;
}
.color_option__custom_note svg {
  width: 24px;
  height: 24px;
  flex: 1 0 24px;
}
.color_option__custom_note svg path {
  fill: #FE5000;
}

.color_option img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 8px;
}

.choose_color__block {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: #ffffff;
  border-radius: 10px;
  padding: 16px 16px 16px 24px;
  margin-top: 40px;
  width: 100%;
}

.choose_color__title {
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
}

.choose_color__btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 16px 24px 16px 24px;
  background-color: var(--category-color);
  border-radius: 3px;
  color: #FFF;
  cursor: pointer;
}
@media (max-width: 600px) {
  .choose_color__btn {
    padding: 16px;
  }
}

.chosen_color__block {
  display: flex;
  flex-direction: row;
  gap: 40px;
}

.chosen_color {
  cursor: pointer;
  color: #0F0F0F;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.chosen_color p {
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  text-align: left;
}

.chosen_color__radio {
  background-color: transparent;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  border: 6px solid #ed1c24;
}

.change_color__btn {
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 16px 24px 16px 24px;
  border: 1px solid #333b47;
  border-radius: 3px;
}

.modal_additions__selectors {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}
@media (max-width: 600px) {
  .modal_additions__selectors {
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
}

.modal_additions__column {
  width: calc(50% - 20px);
  background-color: #ffffff;
  padding: 16px 24px 24px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 26px;
}
@media (max-width: 600px) {
  .modal_additions__column {
    width: 100%;
  }
}

.additions_title {
  margin-bottom: 24px;
  font-size: 20px;
  font-weight: 700;
  font-family: "MarselisPro", sans-serif, serif;
}

.range-slider-wrap {
  position: relative;
  width: 100%;
  height: 50px;
}
.range-slider-wrap label {
  text-transform: none;
  color: #0F0F0F;
  font-weight: 400;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.range-slider__input {
  position: absolute;
  left: 0;
  top: calc(50% + 9px);
  z-index: 3;
  transform: translateY(-50%) translateX(-10%);
  -webkit-appearance: none;
  appearance: none;
  width: 120%;
  height: 4px;
  opacity: 0;
  margin: 0;
}
@media (max-width: 575px) {
  .range-slider__input {
    width: 100%;
    transform: translateY(-50%) translateX(0);
  }
}
.range-slider__input::-moz-range-thumb {
  width: 14vmin;
  height: 14vmin;
  cursor: pointer;
  border-radius: 50%;
  opacity: 0;
}
.range-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 100px;
  height: 100px;
  cursor: pointer;
  border-radius: 50%;
  opacity: 0;
}
.range-slider__thumb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: calc(50% + 9px);
  transform: translateY(-50%);
  background-color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: var(--category-color);
  z-index: 2;
  border: 8px solid var(--category-color);
}
.range-slider__line {
  height: 6px;
  width: 100%;
  background-color: #E6E6E6;
  top: calc(50% + 9px);
  transform: translateY(-50%);
  left: 0;
  position: absolute;
  z-index: 1;
  border-radius: 4px;
}
.range-slider__line-fill {
  position: absolute;
  height: 5px;
  width: 0;
  background-color: var(--category-color);
  border-radius: 5px 0 0 5px;
}

.radio__wrapper,
.checkbox__wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 16px;
  cursor: pointer;
  user-select: none;
}
.radio__wrapper-hidden,
.checkbox__wrapper-hidden {
  display: none;
}

.radio__wrapper:last-of-type,
.checkbox__wrapper:last-of-type {
  margin-bottom: 0;
}

.radio__wrapper input[type=radio],
.checkbox__wrapper input[type=checkbox] {
  appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 1.5em;
  height: 1.5em;
  border: 0.0625em solid #A5ABAC;
  display: grid;
  place-content: center;
  flex-shrink: 0;
  -webkit-border-radius: 0.1875em;
  -moz-border-radius: 0.1875em;
  border-radius: 0.1875em;
  cursor: pointer;
  transition: border-width 0.3s ease;
}

.radio__wrapper input[type=radio] {
  -webkit-border-radius: 1.25em;
  -moz-border-radius: 1.25em;
  border-radius: 1.25em;
}

.checkbox__wrapper input[type=checkbox]:checked {
  border-color: var(--category-color);
  border-width: 0.0625em;
  background-color: var(--category-color);
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_1353_2357' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='16' height='16'%3E%3Crect width='16' height='16' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_1353_2357)'%3E%3Cpath d='M6.36641 12.0001L2.56641 8.20007L3.51641 7.25007L6.36641 10.1001L12.4831 3.9834L13.4331 4.9334L6.36641 12.0001Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
}

.radio__wrapper input[type=radio]:checked {
  border-color: var(--category-color);
  border-width: 0.375em;
}

.radio__wrapper span,
.checkbox__wrapper span {
  position: relative;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
}

input[type=radio]:disabled + img + span + .tooltip.tooltip_for-disabled,
input[type=radio]:disabled + img + img + span + .tooltip.tooltip_for-disabled,
input[type=radio]:disabled + span + .tooltip.tooltip_for-disabled {
  display: flex;
}

.material_option .file-download-link {
  opacity: 0;
}

.material_option .file-download-link:hover svg g path,
.material_option .file-download-link.loading svg g path {
  fill: #FE5000;
}

.material_option .file-download-link.loading .download-icon {
  animation: pulseIcon 1.2s ease-in-out infinite;
  transform-origin: center;
}

@keyframes pulseIcon {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
.material_option input[type=radio]:checked + img + img + span + .tooltip.tooltip_for-disabled + .file-download-link {
  opacity: 1;
}

.material_option .download-icon {
  flex: 1 0 24px;
}

.material_option .tooltip,
.size_option .tooltip,
.spacing_option .tooltip,
.radio__wrapper .tooltip,
.checkbox__wrapper .tooltip {
  display: flex;
  position: relative;
}

.tooltip.tooltip_for-disabled {
  display: none;
}

.material_option .tooltip:before,
.size_option .tooltip:before,
.spacing_option .tooltip:before,
.radio__wrapper .tooltip:before,
.checkbox__wrapper .tooltip:before {
  content: attr(data-tooltip);
  width: max-content;
  max-width: 160px;
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 0);
  padding: 6px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.28em;
  background-color: #EFDBDC;
  opacity: 0;
  visibility: hidden;
  transition: 0.2s ease;
  font-family: "Work Sans", sans-serif, serif;
  font-weight: 400;
  color: #C92E31;
}

.material_option .tooltip:hover:before,
.size_option .tooltip:hover:before,
.spacing_option .tooltip:hover:before,
.radio__wrapper .tooltip:hover:before,
.checkbox__wrapper .tooltip:hover:before {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -8px);
}

.material_option .tooltip:after,
.size_option .tooltip:after,
.spacing_option .tooltip:after,
.radio__wrapper .tooltip:after,
.checkbox__wrapper .tooltip:after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='8' viewBox='0 0 18 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.3255 0H0.674514C2.74325 0 4.66607 1.06572 5.7625 2.82001L8.152 6.6432C8.54367 7.26987 9.45633 7.26987 9.848 6.6432L12.2375 2.82001C13.3339 1.06572 15.2567 0 17.3255 0Z' fill='%23EFDBDC'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  width: 18px;
  height: 8px;
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translate(-50%, 8px);
  opacity: 0;
  visibility: hidden;
  transition: 0.2s ease;
}

.material_option .tooltip:hover:after,
.size_option .tooltip:hover:after,
.spacing_option .tooltip:hover:after,
.radio__wrapper .tooltip:hover:after,
.checkbox__wrapper .tooltip:hover:after {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.custom_color__btns {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}

.custom_color__back {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 16px 24px 16px 24px;
  border: 1px solid #0F0F0F;
  border-radius: 3px;
  cursor: pointer;
  transition: color 0.3s ease;
}

.custom_color__back:hover {
  color: var(--category-color);
  border-color: var(--category-color);
  transition: color 0.3s ease;
}

svg g path {
  transition: fill 0.3s ease;
}

.custom_color__back:hover svg g path {
  fill: var(--category-color);
  transition: fill 0.3s ease;
}

.custom_color__back p {
  font-size: 18px;
  font-weight: 600;
  line-height: 21.6px;
  text-align: left;
}

.custom_color__apply {
  background-color: var(--category-color);
  color: #FFF;
  border-radius: 3px;
  padding: 16px 48px 16px 48px;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  cursor: pointer;
}

.custom_color__block {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 16px 24px 24px 24px;
  margin-top: 40px;
  background-color: #ffffff;
  border-radius: 10px;
}

.custom_color__title {
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: left;
}

.color_picker__block {
  display: flex;
  flex-direction: row;
  gap: 40px;
}
@media (max-width: 600px) {
  .color_picker__block {
    flex-direction: column;
  }
}

.color_picker {
  position: relative;
  max-width: 264px;
  max-height: 264px;
  min-width: 150px;
  min-height: 150px;
  width: 40vw;
  height: 15vw;
  border-radius: 3px;
  background: rgb(223, 223, 223);
  background: linear-gradient(45deg, rgb(223, 223, 223) 0%, rgb(0, 91, 255) 100%);
}
@media (max-width: 600px) {
  .color_picker {
    width: 100%;
    height: 70vw;
  }
}

.picker_point {
  position: absolute;
  right: 10%;
  top: 10%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: transparent;
  border: 3px solid #fff;
}

.picker_point__border {
  position: absolute;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  transform: translateX(-20%) translateY(-20%);
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.2);
}

.picker_details__block {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.color_picker__items {
  display: flex;
  flex-direction: row;
  gap: 20px;
}

.picker_details {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.picker_color {
  position: relative;
  background-color: #1094de;
  border-radius: 3px;
  min-width: 40px;
  min-height: 40px;
  max-width: 40px;
  max-height: 40px;
}

.color_picker__gradient {
  position: relative;
  width: 75%;
  height: 12px;
  background: linear-gradient(90deg, #ff0800 0%, #fffe1b 17.71%, #26ff1b 35.42%, #24fcff 50.52%, #1e1bff 66.15%, #ff33eb 82.29%, #ff0e0e 100%);
  border-radius: 20px;
  border: 0.4px solid rgba(0, 0, 0, 0.2);
  z-index: 20;
}
@media (max-width: 1280px) {
  .color_picker__gradient {
    width: 100%;
  }
}

.color_picker__opacity {
  position: relative;
  width: 75%;
  height: 12px;
  background: url("/wp-content/themes/customfast/assets/images/color/customColor/opacity.png"), linear-gradient(0deg, #ffffff, #ffffff), linear-gradient(270deg, #1094de 0%, rgba(16, 148, 222, 0) 100%);
  border-radius: 20px;
  border: 0.4px solid rgba(0, 0, 0, 0.2);
  background-repeat: no-repeat, repeat, repeat;
  background-position: center, center, center;
}
@media (max-width: 1280px) {
  .color_picker__opacity {
    width: 100%;
  }
}

.picker_point__gradient {
  position: absolute;
  left: 60%;
  top: -3px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: transparent;
  border: 3px solid white;
  z-index: 30;
}

.picker_point__border__gradient {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: transparent;
  border: 3px solid rgba(0, 0, 0, 0.0117647059);
}

.picker_point__opacity {
  position: absolute;
  left: 90%;
  top: -3px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: transparent;
  border: 3px solid white;
  z-index: 30;
}

.picker_point__border__opacity {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  transform: translateX(-20%) translateY(-15%);
  background-color: transparent;
  border: 10px solid rgba(0, 0, 0, 0.0117647059);
}

.picker_selects {
  display: flex;
  flex-direction: row;
  width: 100%;
  gap: 16px;
}
@media (max-width: 1000px) {
  .picker_selects {
    flex-direction: column;
  }
}

.color_picker__select {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;
  padding: 16px;
  border: 1px solid #a5abac;
  border-radius: 3px;
  gap: 16px;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 12.8124L5 7.81242L6.16667 6.64575L10 10.4791L13.8333 6.64575L15 7.81242L10 12.8124Z" fill="%23333B47"/></svg>');
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 20px 20px;
  padding-right: 35px;
  border: 1px solid #ccc;
  cursor: pointer;
}
@media (max-width: 1000px) {
  .color_picker__select {
    width: max-content;
  }
}

.color_picker__select option {
  font-family: Lato;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.48px;
  text-align: left;
}

.color_picker__select:focus {
  outline: none;
}

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

.color_picker__inputs {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 4px 16px;
  border: 1px solid #a5abac;
  border-radius: 3px;
  gap: 16px;
  cursor: pointer;
}
@media (max-width: 1000px) {
  .color_picker__inputs {
    width: max-content;
  }
}

.color_picker__inputs input {
  border: none;
  max-width: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.48px;
  text-align: center;
}

.color_picker__inputs input:focus {
  outline: none;
}

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

.color_picker__inputs hr {
  height: 100%;
}
@media (max-width: 1000px) {
  .color_picker__inputs hr {
    height: 40px;
  }
}

.color_input__hex {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;
  padding: 16px;
  border: 1px solid #a5abac;
  border-radius: 3px;
  gap: 16px;
  cursor: pointer;
  width: 50%;
}
@media (max-width: 1000px) {
  .color_input__hex {
    width: max-content;
  }
}

.color_input__hex input {
  border: none;
  max-width: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.48px;
  text-align: center;
  min-width: 100%;
}

.color_input__hex input:focus {
  outline: none;
}

.color_input__opacity {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;
  padding: 16px;
  border: 1px solid #a5abac;
  border-radius: 3px;
  gap: 16px;
  cursor: pointer;
}
@media (max-width: 1000px) {
  .color_input__opacity {
    width: max-content;
  }
}

.color_input__opacity input {
  border: none;
  max-width: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.48px;
  text-align: center;
}

.color_input__opacity input:focus {
  outline: none;
}

.picker_warning__block {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 24px;
  background-color: #efdbdc;
  border-radius: 10px;
  padding: 16px;
  gap: 16px;
}

.picker_warning__block p {
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  text-align: left;
  color: var(--category-color);
}

.installation_selector {
  width: 100%;
  display: flex;
  justify-content: space-between;
  background-color: #ffffff;
  padding: 16px 24px;
  -webkit-border-radius: 26px;
  -moz-border-radius: 26px;
  border-radius: 26px;
}
.installation_selector .radio__wrapper {
  margin: 0;
}
.installation_selector .radio__wrapper img {
  max-width: 26px;
}

.access_selector {
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #ffffff;
  padding: 16px;
  -webkit-border-radius: 26px;
  -moz-border-radius: 26px;
  border-radius: 26px;
  margin-bottom: 16px;
}

.toggle-buttons {
  display: flex;
  justify-content: center;
  gap: 40px;
}

.toggle-button {
  cursor: pointer;
  position: relative;
}
.toggle-button__labels {
  display: flex;
  align-items: center;
  gap: 4px;
}
.toggle-button_multiple .toggle-button__labels {
  flex-direction: column;
}
.toggle-button__label {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.17em;
  color: #0F0F0F;
}
input:not(:checked) + .toggle-button__labels .toggle-button__label_left {
  text-shadow: 0 0 0.0314em #0F0F0F;
}
input:checked + .toggle-button__labels .toggle-button__label_right {
  text-shadow: 0 0 0.0314em #0F0F0F;
}
.toggle-button__label_top {
  font-family: "MarselisPro", sans-serif, serif;
  font-size: 20px;
  line-height: 1.25em;
  font-weight: 700;
}
input:checked + .toggle-button__labels .toggle-button__label_top {
  text-shadow: 0 0 0.0314em #0F0F0F;
}
.toggle-button__slider {
  width: 46px;
  height: 26px;
  border: 1px solid #a5abac;
  -webkit-border-radius: 26px;
  -moz-border-radius: 26px;
  border-radius: 26px;
  position: relative;
}
.toggle-button__slider:before {
  content: "";
  width: 20px;
  height: 20px;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  position: absolute;
  left: 2px;
  bottom: 2px;
  background: var(--category-color);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.toggle-button_multiple .toggle-button__slider:before {
  background: transparent;
  border: 1px solid #a5abac;
}
.toggle-button_multiple input:checked + .toggle-button__labels .toggle-button__slider:before {
  background: var(--category-color);
  border: 1px solid var(--category-color);
}
input:checked + .toggle-button__labels .toggle-button__slider:before {
  transform: translateX(20px);
}
.toggle-button input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.scope-input-wrap {
  margin-top: 14px;
}

.text_input {
  width: 100%;
  font-size: 16px;
  padding: 16px;
  border: #a5abac 1px solid;
  border-radius: 12px;
  font-family: "Work Sans", sans-serif, serif;
  font-weight: 400;
}

.size_option.hidden, body.linears .size_option.hidden,
.reveal-type_option.hidden,
body.linears .reveal-type_option.hidden {
  display: none;
}

#modalCheckout .modal_container {
  display: flex;
  flex-direction: column;
}
#modalCheckout .modal_content {
  flex-grow: 1;
  display: flex;
  align-items: stretch;
}
#modalCheckout .modal_content > * {
  width: 100%;
}
#modalCheckout .loader-container {
  background: rgba(109, 109, 109, 0.5);
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#modalCheckout .thank-you-container {
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media (max-width: 600px) {
  #modalCheckout .thank-you-container {
    justify-content: flex-start;
  }
}
#modalCheckout .modal-checkout-errors {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 15px;
  border-radius: 16px;
  background: rgba(201, 46, 49, 0.2);
  margin-top: 10px;
}
#modalCheckout .modal-checkout-errors ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
#modalCheckout .modal-checkout-errors * {
  margin: 0;
  padding: 0;
}
#modalCheckout .select2-container {
  width: 100% !important;
}
#modalCheckout .select2-container--default .select2-selection--single {
  padding: 16px;
  height: 53px !important;
  width: 100%;
}
#modalCheckout .select2-container--default .select2-selection--single .select2-selection__arrow {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
}
#modalCheckout .select2-container--open.select2-container--default .select2-results__option {
  padding: 8px 16px;
}
#modalCheckout .select2-selection__rendered {
  line-height: 1 !important;
}

.select2-container--open .select2-search__field {
  border-radius: 8px;
  font-family: "Work Sans", sans-serif, serif;
  font-size: 14px;
  padding: 8px !important;
}

.order_block {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 0% auto;
}
@media (max-width: 600px) {
  .order_block {
    width: 100%;
  }
}

.order_title {
  font-size: 24px;
  font-weight: 700;
  line-height: 28.8px;
  letter-spacing: 0.02em;
  text-align: center;
}

.order_progress__block {
  display: flex;
  flex-direction: row;
  gap: 4px;
  margin-bottom: 40px;
}
@media (max-width: 600px) {
  .order_progress__block {
    flex-direction: column;
  }
}

.order_progress__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 33.3%;
}
@media (max-width: 600px) {
  .order_progress__item {
    display: none;
    gap: 16px;
    width: 200px;
  }
}

.order_progress__item.active {
  display: flex;
}

.order_progress__text {
  opacity: 70%;
  font-size: 14px;
  font-weight: 400;
  line-height: 17.92px;
  text-align: center;
  color: #0F0F0F;
}
@media (max-width: 600px) {
  .order_progress__text {
    font-size: 24px;
  }
}

.progress_text__active {
  opacity: 100%;
  color: var(--category-color);
  filter: brightness(50%);
}

.order_progress__underline {
  opacity: 20%;
  width: 100%;
  height: 4px;
  border-radius: 2px;
  background-color: var(--category-color);
}

.progress_underline__active {
  opacity: 100%;
}

.form_container {
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #fff;
  border-radius: 26px;
  padding: 16px;
}
@media (max-width: 600px) {
  .form_container {
    justify-content: center;
    padding: 20px;
    border-radius: 10px;
    width: 100%;
  }
}

.form_ul {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 600px) {
  .form_ul {
    width: 100%;
  }
}

.form_ul li {
  display: flex;
  flex-direction: column;
  align-items: start;
  width: 100%;
  row-gap: 8px;
}

.form_ul label {
  color: #000;
}

.form_ul .form-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form_ul .form-row-first,
.form_ul .form-row-last {
  width: calc(50% - 8px);
}

.form_ul .form-row-wide {
  width: 100%;
}

.input-text {
  font-family: "Work Sans", sans-serif, serif;
  width: 100%;
  font-size: 16px;
  padding: 16px;
  border: #a5abac 1px solid;
  border-radius: 12px;
  appearance: none;
}

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

.form-row select {
  width: 100%;
  font-size: 16px;
  padding: 16px;
  color: #333b47;
  border: #a5abac 1px solid;
  border-radius: 12px;
  margin-right: 32px;
  appearance: none;
  background: url("data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cmask%20id%3D%22mask0_207_3250%22%20style%3D%22mask-type%3Aalpha%22%20maskUnits%3D%22userSpaceOnUse%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2220%22%20height%3D%2220%22%3E%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22%23D9D9D9%22/%3E%3C/mask%3E%3Cg%20mask%3D%22url(%23mask0_207_3250)%22%3E%3Cpath%20d%3D%22M10%2012.8125L5%207.81254L6.16667%206.64587L10%2010.4792L13.8333%206.64587L15%207.81254L10%2012.8125Z%22%20fill%3D%22%23333B47%22/%3E%3C/g%3E%3C/svg%3E") no-repeat right 16px center;
  background-color: white;
  background-size: 20px;
}

.form-row select option:checked {
  color: #333b47;
}

.form-row select option {
  color: #333b47;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.48px;
}

.form-row textarea {
  width: 100%;
  min-height: 9.5em;
  font-family: "MarselisPro", sans-serif, serif;
  font-size: 16px;
  padding: 1em;
  border: #a5abac 1px solid;
  border-radius: 12px;
  resize: vertical;
}

.form-row.woocommerce-invalid input, select, textarea {
  border-color: #C92E31;
}

.form-row abbr {
  color: #ff6347;
  text-decoration: none;
}

.button_container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 40px;
}

.next_btn,
.back_btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 16px 24px 16px 24px;
  border: 1px #0F0F0F solid;
  border-radius: 12px;
  cursor: pointer;
  line-height: 1;
  color: #0F0F0F;
}

.next_btn {
  margin-left: auto;
}

.next_btn p,
.back_btn p {
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  text-align: left;
  font-family: "Work Sans", sans-serif, serif;
}

.place_order__btn {
  background-color: var(--category-color);
  border: var(--category-color);
  color: #FFF;
}

.place_order__btn svg {
  display: none;
}

.warning_block {
  position: fixed;
  bottom: 10%;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 24px;
  background-color: #efdbdc;
  border-radius: 10px;
  padding: 16px;
  gap: 16px;
  max-width: 518px;
}
@media (max-width: 600px) {
  .warning_block {
    position: relative;
  }
}

.warning_block svg {
  width: 24px;
  flex: 1 0 24px;
}

.warning_block p {
  font-size: 16px;
  font-weight: 400;
  line-height: 19.2px;
  text-align: left;
  color: #ff6347;
}

.form_step {
  display: none;
}

.form_step_active {
  display: block;
}

.form_box {
  background-color: #fff;
  border-radius: 26px;
  padding: 16px;
}
@media (max-width: 600px) {
  .form_box {
    padding: 20px;
    border-radius: 10px;
  }
}
.form_box + .form_box {
  margin-top: 32px;
}
@media (max-width: 600px) {
  .form_box + .form_box {
    margin-top: 24px;
  }
}

.thanks_logo * {
  fill: var(--category-color);
}
@media (max-width: 600px) {
  .thanks_logo {
    width: 100%;
  }
}

.thanks_title__block {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 16px;
  text-align: center;
}

.thanks_title {
  font-size: 36px;
  font-weight: 700;
  line-height: 43.2px;
  letter-spacing: 0.02em;
  text-align: center;
  color: #0F0F0F;
}
@media (max-width: 600px) {
  .thanks_title {
    font-size: 32px;
  }
}

.thanks_subtitle {
  font-family: "Work Sans", sans-serif, serif;
  opacity: 0.7;
  font-size: 14px;
  font-weight: 400;
  line-height: 17.07px;
  text-align: center;
  color: #0F0F0F;
}

.thanks_btn__block {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  justify-content: center;
}
@media (max-width: 600px) {
  .thanks_btn__block {
    flex-direction: column;
  }
}

.thanks_order__btn {
  min-width: 180px;
  align-items: center;
  justify-content: center;
  padding: 16px 24px 16px 24px;
  border: 1px #0F0F0F solid;
  border-radius: 12px;
  cursor: pointer;
}

.thanks_order__btn p {
  text-align: center;
  color: #0F0F0F;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  font-family: "Work Sans", sans-serif, serif;
}

.thanks_gallery__btn, .thanks_close__btn {
  min-width: 180px;
  align-items: center;
  justify-content: center;
  padding: 16px 24px 16px 24px;
  background-color: var(--category-color);
  border: 1px var(--category-color) solid;
  border-radius: 12px;
  cursor: pointer;
}

.thanks_gallery__btn p, .thanks_close__btn p {
  text-align: center;
  color: #FFF;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  font-family: "Work Sans", sans-serif, serif;
}

.modal-downloads .modal_content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.modal-downloads__parameters {
  background: #FFF;
  border-radius: 12px;
  padding: 18px 100px 18px 24px;
  display: flex;
  justify-content: space-between;
}
@media (max-width: 600px) {
  .modal-downloads__parameters {
    width: 100%;
    padding: 18px 24px;
  }
}
.modal-downloads__parameter {
  color: #0F0F0F;
  display: flex;
  align-items: flex-end;
  line-height: 1;
  gap: 8px;
}
@media (max-width: 600px) {
  .modal-downloads__parameter {
    flex-direction: column;
    align-items: flex-start;
  }
}
.modal-downloads__parameter:not(:first-of-type) {
  padding-left: 20px;
  border-left: 1px solid #D9E0EA;
  margin-left: 20px;
}
@media (max-width: 600px) {
  .modal-downloads__parameter:not(:first-of-type) {
    padding-left: 18px;
    margin-left: 0;
  }
}
.modal-downloads__parameter-label {
  color: rgba(15, 15, 15, 0.7);
  font-size: 14px;
}
.modal-downloads__parameter-value {
  font-size: 16px;
}
.modal-downloads__assets {
  background: #FFF;
  border-radius: 12px;
  padding: 16px 24px 24px;
}
.modal-downloads__asset {
  margin-bottom: 32px;
}
.modal-downloads__asset:last-child {
  margin-bottom: 0;
}
.modal-downloads__asset-title {
  font-family: "MarselisPro", sans-serif, serif;
  font-size: 20px;
  line-height: 1.1em;
  font-weight: 700;
  margin-bottom: 24px;
}
.modal-downloads__buttons {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 24px;
}
.modal-downloads__button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #FFF;
  border-radius: 12px;
  appearance: none;
  -webkit-appearance: none;
  border: none;
  cursor: pointer;
  border: 1px solid #D4DADB;
  padding: 16px 24px;
  font-size: 18px;
  transition: all 0.15s ease-out;
}
.modal-downloads__button_large {
  width: calc((100% - 24px) / 2);
  padding: 12px 16px;
  font-size: 18px;
}
@media (max-width: 600px) {
  .modal-downloads__button_large {
    width: 100%;
  }
}
.modal-downloads__button_small {
  width: calc((100% - 72px) / 4);
  font-size: 16px;
  padding: 18px 16px;
}
@media (max-width: 600px) {
  .modal-downloads__button_small {
    width: calc((100% - 24px) / 2);
  }
}
.modal-downloads__button_small .modal-downloads__button-download svg {
  width: 18px;
  height: 18px;
}
.modal-downloads__button:hover {
  filter: brightness(90%);
}
.modal-downloads__button-file-type {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #FE5000;
  font-family: "MarselisPro", sans-serif, serif;
  font-weight: 700;
}
.modal-downloads__button-file-type svg {
  max-width: 32px;
  max-height: 32px;
}
.modal-downloads__button-file-type svg path, .modal-downloads__button-file-type svg g {
  fill: #FE5000;
}
.modal-downloads__button-download {
  display: flex;
  align-items: center;
  color: #0F0F0F;
  font-family: "Work Sans", sans-serif, serif;
  font-weight: 500;
  gap: 8px;
}
.modal-downloads__button-download svg {
  max-width: 24px;
  max-height: 24px;
}
.modal-downloads__button-all {
  width: auto;
  max-width: unset;
  border: 1px solid;
  color: #0F0F0F;
  border: 1px solid #0F0F0F;
  background: transparent;
  gap: 14px;
  font-family: "Work Sans", sans-serif, serif;
  position: relative;
}
.modal-downloads__button-all:not(:disabled):hover {
  border-color: rgba(15, 15, 15, 0.7);
  color: rgba(15, 15, 15, 0.7);
}
.modal-downloads__button-all--preparing {
  border-color: rgba(15, 15, 15, 0.1);
}
.modal-downloads__button-all--preparing:disabled:hover {
  border-color: rgba(15, 15, 15, 0.1);
  color: #0F0F0F;
}
.modal-downloads__button-all--preparing .download-icon {
  display: none;
}
.modal-downloads__button-wrapper-all {
  flex-basis: 100%;
  display: flex;
  justify-content: center;
}
.modal-downloads__errors-wrapper {
  display: none;
}
.modal-downloads__errors-wrapper p {
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  font-size: 20px;
}
.modal-downloads .loader-container {
  right: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}
.modal-downloads .loader-container.loading {
  background: rgba(109, 109, 109, 0.5);
}

.thanks_guest__block {
  width: 100%;
  max-width: 520px;
  background-color: #FFF;
  border-radius: 26px;
  padding: 32px;
}
@media (max-width: 600px) {
  .thanks_guest__block {
    justify-content: center;
    width: 90%;
    padding: 20px;
    border-radius: 10px;
  }
}
.thanks_guest__title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2em;
  letter-spacing: 0.02em;
  text-align: center;
  color: #0F0F0F;
  margin-bottom: 8px;
}
@media (max-width: 600px) {
  .thanks_guest__title {
    font-size: 32px;
  }
}
.thanks_guest__subtitle {
  font-family: "Work Sans", sans-serif, serif;
  opacity: 0.7;
  font-size: 14px;
  font-weight: 400;
  line-height: 17.07px;
  text-align: center;
  color: #0F0F0F;
}
.thanks_guest__form {
  width: 100%;
  margin-top: 32px;
}
.thanks_guest__form .form-row {
  display: flex;
  flex-direction: column;
  align-items: start;
  width: 100%;
  row-gap: 8px;
  margin-bottom: 16px;
}
.thanks_guest__form .form-row_submit {
  margin-top: 32px;
  margin-bottom: 0;
}
.thanks_guest__form .form-row label {
  color: rgba(15, 15, 15, 0.7);
  font-family: "Work Sans", sans-serif, serif;
}
.thanks_guest__form .form-row .text_input {
  width: 100%;
  font-size: 16px;
  padding: 16px;
  border: #a5abac 1px solid;
  border-radius: 12px;
  font-family: "Work Sans", sans-serif, serif;
}
.thanks_guest__form .form_btn {
  width: 100%;
  cursor: pointer;
  font-family: "Work Sans", sans-serif, serif;
  background-color: #FE5000;
  border-style: none;
  padding: 16px 24px;
  border-radius: 12px;
  color: #FFF;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.2em;
}
.thanks_guest__form .form_btn a {
  text-decoration: none;
  color: #FFF;
}

.style_selector .style_radio-container {
  display: flex;
  gap: 24px 16px;
  flex-wrap: wrap;
}
.style_selector .style_radio-container .radio__wrapper {
  margin-bottom: 0;
  flex: 0 0 calc((100% - 32px) / 3);
  gap: 16px;
}
.style_selector .style_radio-container .radio__wrapper.disabled {
  pointer-events: none;
}
.style_selector .style_radio-container .radio__wrapper.disabled input[type=radio]:disabled {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3481_5613)'%3E%3Cpath d='M13.6574 2.34305C10.5331 -0.780843 5.46764 -0.781191 2.34305 2.34305C-0.781191 5.46729 -0.780843 10.5328 2.34305 13.6574C5.46729 16.7809 10.5328 16.7813 13.6574 13.6574C16.7813 10.5328 16.7809 5.46764 13.6574 2.34305ZM9.04337 11.4786C9.04337 12.0549 8.57623 12.5221 7.99987 12.5221C7.42351 12.5221 6.95637 12.0549 6.95637 11.4786V7.30455C6.95637 6.72819 7.42351 6.26105 7.99987 6.26105C8.57623 6.26105 9.04337 6.72819 9.04337 7.30455V11.4786ZM7.98143 5.52086C7.38038 5.52086 6.97967 5.09511 6.9922 4.56953C6.97967 4.01857 7.38038 3.60569 7.99361 3.60569C8.60719 3.60569 8.99537 4.01891 9.00824 4.56953C9.00789 5.09511 8.60753 5.52086 7.98143 5.52086Z' fill='%23A5ABAC'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3481_5613'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
}
.style_selector .style_radio-container .radio__wrapper.disabled input[type=radio]:disabled + span {
  cursor: inherit;
}
#modalSize .style_selector .style_radio-container .radio__wrapper.disabled input[type=radio]:disabled {
  opacity: 1;
  pointer-events: auto;
}
.style_selector .style_radio-container .radio__wrapper input[type=radio]:checked {
  border-width: 0.575em;
  box-shadow: 0 0 0 0.25em #FE5000;
}

.modal_tooltip__text *:not(:last-child) {
  margin-bottom: 1em;
}

/*# sourceMappingURL=configurator-popups.css.map */