.form {
  --form-count-columns: 3;
  --form-gap: 10px;
  --form-row-mb: 20px;
}
@media (max-width: 1200px) {
  .form {
    --form-count-columns: 2;
  }
}
@media (max-width: 600px) {
  .form {
    --form-count-columns: 1;
  }
}
.form_is-loading {
  position: relative;
}
.form_is-loading:before {
  position: absolute;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 15;
}
.form_is-loading.form_is-dark-overlay:before {
  background-color: rgba(0, 0, 0, 0.8);
}
.form__title {
  font-weight: 300;
  font-size: 42px;
  line-height: 133%;
  letter-spacing: 0.05em;
  color: var(--color-black);
  text-transform: uppercase;
  margin-bottom: 23px;
}
.form__title span {
  font-weight: 500;
}
@media (max-width: 600px) {
  .form__title {
    font-size: 31px;
  }
}
.form__row {
  display: grid;
  grid-template-columns: repeat(var(--form-count-columns), 1fr);
  /* flex-wrap: wrap; */
  gap: var(--form-gap);
  margin-bottom: var(--form-row-mb);
}
.form__col {
  box-sizing: border-box;
}
.form__col_w-full {
  grid-column: span var(--form-count-columns);
}
.form__col_center {
  text-align: center;
}
.form__col_right {
  text-align: right;
}
.form__col_top-offset {
  padding-top: 24px;
}
.form__col_inline .form__field-wrap {
  display: flex;
  align-items: center;
}
.form__req {
  color: #b25212;
}
.form__message-item {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: 5px;
  margin-bottom: 10px;
}
.form__message-item_error {
  background-color: #b25212;
  margin-top: 2px;
}
.form__message-item_error, .form__message-item_error a {
  color: #fff;
}
.form__message-item_success, .form__message-item_success a {
  color: #312723;
}
.form__message .form__message-item {
  padding: 15px;
}
.form__field {
  width: 100%;
  box-sizing: border-box;
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  color: var(--color-black);
}
.form__field__box {
  background-color: var(--color-grey);
  border-radius: 8px;
}
.form__field__title {
  margin-bottom: 5px;
  font-weight: 300;
  font-size: 20px;
  color: #878787;
  transition: all 300ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
.form__field__box__inner_badger {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
}
.form__field__box__inner_badger .form__field__title {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
  box-sizing: border-box;
  padding: 24px 24px 24px 26px;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 100%;
  overflow: hidden;
}
.form__field__box__inner_badger .form__field {
  position: relative;
  z-index: 2;
}
.form__field__box__inner_badger .form__field:not(.form__select):focus + .form__field__title, .form__field__box__inner_badger .form__field.is-filled + .form__field__title {
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  top: -10px;
}
.form__field__wrap {
  position: relative;
}
.form__field__wrap .form__message-item {
  position: absolute;
  top: 100%;
  padding: 2px 5px;
  z-index: 10;
}
.form__title-inline .form__field__wrap {
  display: flex;
  align-items: start;
  justify-content: flex-start;
}
.form_title-inline .form__field-title {
  margin-bottom: 0;
  margin-right: 10px;
}
.form__input {
  width: 100%;
  background-color: transparent;
  padding: 26px 24px 8px 24px;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  color: var(--color-black);
}
.form__input:focus {
  outline: none;
  transition: all 0.2s;
}
.form__input:not(:focus)::placeholder {
  opacity: 0;
}
.form__textarea {
  resize: vertical;
}
.form .bottom-text {
  font-weight: 400;
  font-size: 12px;
  line-height: 167%;
  color: var(--color-black);
  margin-top: 26px;
}
.form__radio {
  flex: none;
  display: block;
  height: 28px;
  width: 28px;
  box-sizing: border-box;
  position: relative;
  border-radius: 50%;
}
.form__radio-wrap {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.form__radio-wrap .form__radio-text {
  margin-left: 10px;
  margin-bottom: 0;
  width: 100%;
}
.form__buttons {
  display: flex;
  align-items: center;
  justify-content: left;
}
.form__buttons_full .form__btn {
  width: 100%;
}
.form__buttons_right {
  justify-content: right;
}
.form__buttons_center {
  justify-content: center;
}
.form__buttons_space-between {
  justify-content: space-between;
}
.form__buttons .form__btn {
  margin-bottom: 10px;
}
.form__buttons .form__btn_full {
  width: 100%;
}
.form__buttons_inline {
  flex-wrap: wrap;
}
.form__buttons_inline .form__btn:not(:last-child) {
  margin-right: 10px;
}
.form__field-group-title {
  margin-bottom: 5px;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
}
.form__field-group .form__col {
  margin-bottom: 0;
}
.form__field-group_bordered {
  position: relative;
  padding-top: 15px;
  padding-bottom: 15px;
  margin-bottom: 0;
  border-top: 1px solid #e4e4e4;
}
.form__field_hidden {
  display: none;
}
.form__field-group_show-all .form__field_hidden {
  display: block;
}
.form__field-group_show-all-link {
  font-size: 13px;
  color: #3c5191;
  text-decoration: underline;
  line-height: 1.231;
  cursor: pointer;
}
.form__input {
  font-weight: 300;
  font-size: 20px;
  text-transform: uppercase;
  color: #878787;
}
.form__input, .form__select, .form__checkbox, .form__radio {
  border: 1px solid var(--gray-text);
}
.form__input:hover, .form__select:hover, .form__checkbox:hover, .form__radio:hover {
  border: 1px solid var(--biege);
}
.form__field__title {
  color: var(--color-black);
  font-weight: 300;
  font-size: 20px;
}
.form__field_error .form__input, .form__field_error .form__select, .form__field_error .form__checkbox, .form__field_error .form__radio {
  border: 1px solid red;
}
.form__field_error .form__field-title {
  color: red;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  position: relative;
  background-color: var(--color-black);
  border-radius: 8px;
  font-size: 20px;
  line-height: 120%;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.3s ease-in;
  user-select: none;
}
.btn, .btn:visited {
  color: var(--color-white);
}
.btn__icon {
  flex: none;
}
.btn__icon + .btn__text {
  margin-left: 10px;
}
.btn:not(.btn_is-not-padd) {
  padding: 16px 24px;
}
.btn_is-round {
  border-radius: 50%;
}
.btn:hover {
  color: var(--color-black);
  background-color: var(--color-grey);
}
.btn.is-loading > * {
  opacity: 0;
}
.btn.is-loading::before, .btn.is-loading::after {
  content: "";
}
.btn.is-loading:not([class~=loading-type-spin]):after {
  position: absolute;
  opacity: 1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-image: url(/local/templates/appsweb/img/loader_v2.gif);
  z-index: 15;
}
.btn.is-loading.loading-type-spin::after {
  --btn-loader-size: 20px;
  --btn-loader-color: red;
  --btn-loader-border-size: 4px;
  position: absolute;
  width: var(--btn-loader-size);
  height: var(--btn-loader-size);
  left: 50%;
  top: 50%;
  margin-left: calc(var(--btn-loader-size) / 2 * -1);
  margin-top: calc(var(--btn-loader-size) / 2 * -1);
  z-index: 12;
  transform-origin: 50%;
  box-sizing: border-box;
  border: var(--btn-loader-border-size) solid var(--btn-loader-color);
  border-radius: 50%;
  border-top-color: transparent;
  animation: preloader-spin 1s steps(12, end) infinite;
}
.btn_wide {
  min-width: 297px;
}
.btn.is-to-basket::before, .btn.is-to-basket::after {
  content: "";
}
.btn.is-to-basket:before {
  content: "";
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: var(--color-red);
  border-radius: 100%;
  top: 0;
  right: 0;
}
.btn_add-basket {
  border-radius: 100px;
  padding: 8px 14px;
  text-transform: none;
}
.btn_light {
  background: var(--color-grey);
}
.btn_light, .btn_light:visited {
  color: var(--color-black);
}
.btn_light:hover {
  color: var(--color-grey);
  background-color: var(--color-black);
}
.btn_transparent {
  background-color: transparent;
  color: var(--color-black);
}
.btn.btn_hover-bg-light:hover, .btn.btn_hover-bg-white:hover {
  color: var(--color-black);
}
.btn.btn_hover-bg-light:hover {
  background: var(--color-grey);
}
.btn.btn_hover-bg-white:hover {
  background: var(--color-white);
}
.btn:disabled, .btn:disabled:hover, .btn:disabled:active {
  opacity: 0.3;
  background-color: var(--color-grey);
  color: var(--color-black);
  cursor: not-allowed;
}

.switchbox, .checkbox, .radiobox {
  --sfc-margin: var(--root-sfc-margin, 10px);
  --sfc-mr: var(--root-sfc-mr, var(--sfc-margin));
  --sfc-mb: var(--root-sfc-mb, var(--sfc-margin));
  --sfc-size: var(--root-sfc-size, 20px);
  --sfc-font-size: var(--root-sfc-font-size, 14px);
  --sfc-lh: var(--root-sfc-lh, 1.3);
  --sfc-bg-color: var(--root-sfc-bg-color, #fff);
  --sfc-bg-color-active: var(--root-sfc-bg-color, var(--sfc-bg-color));
  --sfc-border-color: var(--root-sfc-border-color, #ededed);
  --sfc-border-color-active: var(--root-sfc-border-color, var(--sfc-border-color));
  --sfc-icon-color: var(--root-sfc-icon-color, #333);
  /* switch start */
  --sfc-switch-size: var(--root-sfc-switch-size, var(--sfc-size));
  --sfc-switch-icon-ratio: var(--root-sfc-switch-icon-ratio, 0.8);
  --sfc-switch-icon-ratio-active: var(--root-sfc-switch-icon-ratio-active, 0.86);
  --sfc-switch-bg-color: var(--root-sfc-switch-bg-color, #EDEDED);
  --sfc-switch-bg-color-active: var(--root-sfc-switch-bg-color-active, #333);
  --sfc-switch-border-color: var(--root-sfc-switch-border-color, #EDEDED);
  --sfc-switch-border-color-active: var(--root-sfc-switch-border-color-active, #333);
  --sfc-switch-icon-bg-color: var(--root-sfc-switch-icon-bg-color, #333);
  --sfc-switch-icon-bg-color-active: var(--root-sfc-switch-icon-bg-color-active, #fff);
  /* switch end */
  /* checkbox start */
  --sfc-check-size: var(--root-sfc-check-size, var(--sfc-size));
  --sfc-check-icon-ratio: var(--root-sfc-radio-icon-ratio, 0.5);
  --sfc-check-bg-color: var(--root-sfc-check-bg-color, var(--sfc-bg-color));
  --sfc-check-bg-color-active: var(--root-sfc-check-bg-color-active, var(--sfc-bg-color-active));
  --sfc-check-border-color: var(--root-sfc-check-border-color, var(--sfc-border-color));
  --sfc-check-border-color-active: var(--root-sfc-check-border-color-active, var(--sfc-border-color-active));
  --sfc-check-icon-bg-color: var(--root-sfc-check-icon-bg-color, var(--sfc-icon-color));
  /* checkbox end */
  /* radio start */
  --sfc-radio-size: var(--root-sfc-radio-size, var(--sfc-size));
  --sfc-radio-icon-ratio: var(--root-sfc-radio-icon-ratio, 0.5);
  --sfc-radio-bg-color: var(--root-sfc-radio-bg-color, var(--sfc-bg-color));
  --sfc-radio-bg-color-active: var(--root-sfc-radio-bg-color-active, var(--sfc-bg-color-active));
  --sfc-radio-border-color: var(--root-sfc-radio-border-color, var(--sfc-border-color));
  --sfc-radio-border-color-active: var(--root-sfc-radio-border-color-active, var(--sfc-border-color-active));
  --sfc-radio-icon-bg-color: var(--root-sfc-radio-bg-color, var(--sfc-icon-color));
  /* radio end */
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
  cursor: pointer;
}
.switchbox__group .switchbox, .switchbox__group .checkbox, .switchbox__group .radiobox, .checkbox__group .switchbox, .checkbox__group .checkbox, .checkbox__group .radiobox, .radiobox__group .switchbox, .radiobox__group .checkbox, .radiobox__group .radiobox {
  margin-bottom: var(--sfc-mb);
}
.switchbox__group_inline .switchbox, .switchbox__group_inline .checkbox, .switchbox__group_inline .radiobox, .checkbox__group_inline .switchbox, .checkbox__group_inline .checkbox, .checkbox__group_inline .radiobox, .radiobox__group_inline .switchbox, .radiobox__group_inline .checkbox, .radiobox__group_inline .radiobox {
  display: inline-flex;
  margin-right: var(--sfc-mr);
}
.switchbox__text, .checkbox__text, .radiobox__text {
  margin-left: var(--sfc-mr);
  font-size: var(--sfc-font-size);
  line-height: var(--sfc-lh);
  user-select: none;
}
.switchbox__input, .checkbox__input, .radiobox__input {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  opacity: 0;
  cursor: pointer;
}
.switchbox__control, .checkbox__control, .radiobox__control {
  position: relative;
  flex: none;
  overflow: hidden;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  transition: all 0.3s ease-in;
}
.switchbox__dropdown, .checkbox__dropdown, .radiobox__dropdown {
  width: 100%;
  margin-top: var(--sfc-margin);
}
.switchbox__input:not(:checked) ~ .switchbox__dropdown, .switchbox__input:not(:checked) ~ .checkbox__dropdown, .switchbox__input:not(:checked) ~ .radiobox__dropdown, .checkbox__input:not(:checked) ~ .switchbox__dropdown, .checkbox__input:not(:checked) ~ .checkbox__dropdown, .checkbox__input:not(:checked) ~ .radiobox__dropdown, .radiobox__input:not(:checked) ~ .switchbox__dropdown, .radiobox__input:not(:checked) ~ .checkbox__dropdown, .radiobox__input:not(:checked) ~ .radiobox__dropdown {
  display: none;
}

.switchbox__control, .switchbox__input {
  width: calc(var(--sfc-switch-size) * 2);
  height: var(--sfc-switch-size);
}
.switchbox__control {
  border-radius: 30px;
  background-color: var(--sfc-switch-bg-color);
  border: 1px solid var(--sfc-switch-border-color);
}
.switchbox__control::after {
  content: "";
  position: absolute;
  top: 50%;
  --sfc-switch-noactive-icon-size: calc(var(--sfc-switch-size) * var(--sfc-switch-icon-ratio));
  margin-top: calc(var(--sfc-switch-noactive-icon-size) / 2 * -1);
  margin-left: calc((var(--sfc-switch-size) - (var(--sfc-switch-size) - var(--sfc-switch-noactive-icon-size)) / 2) * -1);
  width: var(--sfc-switch-noactive-icon-size);
  height: var(--sfc-switch-noactive-icon-size);
  background-color: var(--sfc-switch-icon-bg-color);
  border-radius: 50%;
  transform: translateX(0);
  transition: all 0.3s cubic-bezier(0.2, 0.85, 0.32, 1.2);
}
.switchbox__input:not(:checked) + .switchbox__control::after {
  left: 50%;
}
.switchbox__input:checked + .switchbox__control {
  background-color: var(--sfc-switch-bg-color-active);
  border: 1px solid var(--sfc-switch-border-color-active);
}
.switchbox__input:checked + .switchbox__control::after {
  background-color: var(--sfc-switch-icon-bg-color-active);
  left: 50%;
  --sfc-switch-active-icon-size: calc(var(--sfc-switch-size) * var(--sfc-switch-icon-ratio-active));
  margin-left: calc((var(--sfc-switch-size) - var(--sfc-switch-active-icon-size)) / 2);
  margin-top: calc(var(--sfc-switch-active-icon-size) / 2 * -1);
  width: var(--sfc-switch-active-icon-size);
  height: var(--sfc-switch-active-icon-size);
}
.switchbox__text {
  width: calc(100% - var(--sfc-switch-size) * 2 - var(--sfc-mr));
}
.switchbox__dropdown {
  padding-left: calc(var(--sfc-switch-size) + var(--sfc-mr));
}

.checkbox__control, .checkbox__input {
  width: var(--sfc-check-size);
  height: var(--sfc-check-size);
}
.checkbox__control {
  border-radius: 4px;
  background-color: var(--sfc-check-bg-color);
  border: 1px solid var(--sfc-check-border-color);
}
.checkbox__control::after {
  transition: all 0.3s cubic-bezier(0.2, 0.85, 0.32, 1.2);
}
.checkbox__input:checked + .checkbox__control {
  background-color: var(--sfc-check-bg-color-active);
  border: 1px solid var(--sfc-check-border-color-active);
}
.checkbox__input:checked + .checkbox__control::after {
  content: "";
  background-color: var(--sfc-check-icon-bg-color);
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 4px;
  --sfc-check-icon-size: calc(var(--sfc-check-size) * var(--sfc-check-icon-ratio));
  margin-left: calc(var(--sfc-check-icon-size) / 2 * -1);
  margin-top: calc(var(--sfc-check-icon-size) / 2 * -1);
  width: var(--sfc-check-icon-size);
  height: var(--sfc-check-icon-size);
}
.checkbox__text {
  width: calc(100% - var(--sfc-check-size) - var(--sfc-mr));
}
.checkbox__dropdown {
  padding-left: calc(var(--sfc-check-size) + var(--sfc-mr));
}

.radiobox__control, .radiobox__input {
  width: var(--sfc-radio-size);
  height: var(--sfc-radio-size);
}
.radiobox__control {
  border-radius: 50%;
  background-color: var(--sfc-radio-bg-color);
  border: 1px solid var(--sfc-radio-border-color);
}
.radiobox__control::after {
  transition: all 0.3s cubic-bezier(0.2, 0.85, 0.32, 1.2);
}
.radiobox__input:checked + .radiobox__control {
  background-color: var(--sfc-radio-bg-color-active);
  border: 1px solid var(--sfc-radio-border-color-active);
}
.radiobox__input:checked + .radiobox__control::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  background-color: var(--sfc-radio-icon-bg-color);
  --sfc-radio-icon-size: calc(var(--sfc-radio-size) * var(--sfc-radio-icon-ratio));
  margin-left: calc(var(--sfc-radio-icon-size) / 2 * -1);
  margin-top: calc(var(--sfc-radio-icon-size) / 2 * -1);
  width: var(--sfc-radio-icon-size);
  height: var(--sfc-radio-icon-size);
}
.radiobox__text {
  width: calc(100% - var(--sfc-radio-size) - var(--sfc-mr));
}
.radiobox__dropdown {
  padding-left: calc(var(--sfc-radio-size) + var(--sfc-mr));
}

.disabled .checkbox__control, .disabled .checkbox__text,
.disabled .radiobox__control, .disabled .radiobox__text,
.disabled .switchbox__control, .disabled .switchbox__text {
  opacity: 0.3;
  cursor: not-allowed;
}

.styler-file {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-direction: column;
}
.body_is-ondragover .styler-file__zona {
  border: 3px dashed red;
}
.styler-file__zona {
  border: 1px dashed #CED1D6;
  box-sizing: border-box;
  border-radius: 8px;
  width: 100%;
  height: 192px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.styler-file_is-ondragover .styler-file__zona {
  background-color: yellow;
}
.styler-file__box {
  text-align: center;
}
.styler-file__native {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
  cursor: pointer;
}
.styler-file__title {
  display: flex;
  align-items: center;
}
.styler-file__title__icon + .styler-file__title__text {
  margin-left: 10px;
}
.styler-file__desc {
  font-size: 14px;
  line-height: 20px;
  color: #303233;
}
.styler-file__list-box {
  background: #F3F4F5;
  border-radius: 8px;
  padding: 21px 24px;
  display: none;
}
.styler-file__list-item {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 20px;
  color: #303233;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.styler-file__list-item-name {
  white-space: nowrap;
  max-width: 220px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
}
.styler-file__list-item-name-box {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.styler-file__list-item-type-box {
  margin-right: 10px;
}
.styler-file__list-item-delete:before {
  width: 10px;
  height: 10px;
  cursor: pointer;
}
.styler-file__list-title {
  font-weight: 500;
  margin-bottom: 10px;
}
.styler-file_is-choosen .styler-file__list-box {
  display: block;
}
.styler-file_pos-list-right .styler-file__list-box, .styler-file_pos-list-left .styler-file__list-box {
  flex: none;
  width: 432px;
}
.styler-file_pos-list-right {
  flex-direction: row;
}
.styler-file_pos-list-right .styler-file__list-box {
  margin-left: 8px;
}
.styler-file_pos-list-left {
  flex-direction: row-reverse;
}
.styler-file_pos-list-left .styler-file__list-box {
  margin-right: 8px;
}
.styler-file_pos-list-top {
  flex-direction: column-reverse;
}
.styler-file_pos-list-top .styler-file__list-box {
  margin-bottom: 8px;
}
.styler-file_pos-list-bottom {
  flex-direction: column;
}
.styler-file_pos-list-bottom .styler-file__list-box {
  margin-top: 8px;
}
@media (max-width: 991px) {
  .styler-file_pos-list-right {
    flex-direction: column;
  }
  .styler-file_pos-list-right .styler-file__list-box {
    margin-left: 0;
    margin-top: 8px;
  }
  .styler-file_pos-list-left {
    flex-direction: column-reverse;
  }
  .styler-file_pos-list-left .styler-file__list-box {
    margin-right: 0;
    margin-bottom: 8px;
  }
  .styler-file_pos-list-right .styler-file__list-box, .styler-file_pos-list-left .styler-file__list-box {
    flex: auto;
    width: 100%;
  }
}

button {
  font-family: var(--font-family);
}

@keyframes preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}