@mixin white-block-bg {
  padding: 0 15px;
  margin: 0 -15px 1rem;
}

.your-details {
  background-color: $gray-bg;
  padding-top: 30px;
  padding-left: 30px;
  padding-right: 30px;

  &__help,
  &__add {
    &-wrap {
      @include white-block-bg;
      display: none;

      .title {
        &-help {
          font-size: 1.125rem;
          padding-left: 0;
          margin-bottom: 1.25rem;
        }
      }

      .form-row__error {
        padding-left: 0;
      }
    }

    &-inner {
      padding-left: 30px;

      &-wrap {
        display: none;
      }

      .form-row__label {
        padding-left: 0;
      }

      .rbn {
        &:first-child {
          padding-right: 10%;
        }
      }
    }

    & > .form-row__label {
      padding-left: 0;
      margin-bottom: 1.25rem;
    }

    &-radio {
      @include primary-text;
      margin-bottom: 1rem;
      font-weight: 500;

      .rbn {
        @include primary-text;
      }

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  .wickes-installed,
  .kitchen-bathroom,
  .other-enquiries,
  .store-enquiry {
    display: none;
  }

  &__personal {
    &-title {
      font-size: 1.125rem;
      font-weight: 500;
    }
  }

  &__add {
    @include white-block-bg;

    .form-row__label {
      margin-bottom: 10px;
    }

    &-radio {
      margin-bottom: 0;

      .rbn {
        &:first-child {
          padding-right: 10%;
        }
      }
    }

    &-title {
      font-size: 1.125rem;
      font-weight: 500;
    }
  }

  .error-msg {
    margin-top: 5px;
    padding-left: 30px;
    display: none;
  }
}

.details-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
}

.row-time {
  margin-top: 40px;

  &.form-row_convenient-time {
    display: none;
  }
}

.row-project {
  margin-top: 30px;
}

.row-time,
.row-project {
  .form-row__label {
    margin-bottom: 20px;
  }
}

.row-time,
.row-project {
  .form-row__field {
    @include make-col(6);
    margin-bottom: 10px;
  }

  .form-row__field--smaller {
    @include make-col(4);
  }
}

@include media-breakpoint-up(lg) {
  .your-details {
    &__wrap {
      @include make-col(12);
      padding: 0;

      .your-details {
        padding-left: 120px;
        padding-right: 120px;

        .btn-submit {
          width: 160px;
        }
      }
    }
  }
}

@include media-breakpoint-down(lg) {
  .your-details {
    padding-left: 60px;
    padding-right: 60px;

    .details-wrap {
      gap: 60px;
    }
  }
}

@include media-breakpoint-only(md) {
  .your-details {
    .form-row__field:nth-child(2n-1) {
      padding-left: 0;
    }
  }
}

@include media-breakpoint-down(md) {
  .your-details {
    padding-left: 30px;
    padding-right: 30px;

    .details-wrap {
      gap: 30px;

      .form-row__col-btn {
        flex: 0 0 100%;
        max-width: 100%;
      }
    }
  }
}

@include media-breakpoint-down(sm) {
  .page_contact-us {
    .page-header {
      margin-bottom: 10px;
      order: 1;

      &__title {
        margin-bottom: 0;
      }

      &__message {
        display: none;
      }
    }

    .left-aside {
      margin-bottom: 60px;
      order: 2;
    }

    .content {
      order: 3;
    }

    .your-details {
      padding-left: 15px;
      padding-right: 15px;

      .warning-required {
        margin-top: 0;
      }

      .details-wrap {
        gap: 0px;
      }

      .form-row {
        padding: 0;

        & + .your-details__help-wrap {
          padding: 0 15px;
        }
      }
    }

    .wickes-installed {
      .guarantee-claim {
        .your-details__help-inner {
          &:nth-child(2) {
            .your-details__help-radio {
              label {
                &:first-child {
                  padding-bottom: 15px;
                }
              }
            }
          }
        }
      }
    }

    .kitchen-bathroom {
      .guarantee-claim-kitchen {
        .your-details__help-inner {
          &:nth-child(3) {
            .your-details__help-radio {
              label {
                &:first-child {
                  padding-bottom: 15px;
                }
              }
            }
          }
        }
      }
    }

    .row-time {
      .form-row__field {
        &:last-child {
          margin-top: 30px;
        }
      }
    }
  }

  .your-details {
    padding-bottom: 0px;

    .details-wrap {
      grid-template-columns: 1fr;
      gap: 0px;

      .form-row {
        padding: 0px;
      }

      .row-project {
        margin-top: 15px;
      }
    }
  }

  .row-time,
  .row-project {
    .form-row__field {
      padding-right: 0;
    }
  }

  .form-row__action {
    margin-top: 20px;
  }
}

@media (max-width: 360px) { 
  .row-project {
    .form-row__field {
      flex: 0 0 100%;
      max-width: none;
    }
  }
}