@import 'variables', 'mixin';

/**
 * Table of Contents:

 * 1.0 - variables
	* 1.1 - wpcf7
	* 1.2 - input
	* 1.3 - output
	* 1.4 - ajax-loader
 * 2.0 - acf-map
 * 3.0 - contact
 */


/* 1.0 - variables */
$wpcf7-form-margin: 0 0 30px 0;

$wpcf7-input-border: 1px;
$wpcf7-textarea-height: 140px;

$wpcf7-loader-bg: rgba(#FFF, .75);

.page-kontakt {
	  padding: 0;
	  
      .ps1 {
			padding: 70px 150px 70px 150px;
      }

      .ps2 {
	  		padding: 0 0 60px 0;
			
			a {
                  background-size: 100% 1px !important;

                  &:hover {
                        background-size: 0% 1px !important;
                  }
            }

            @include media-max(1200px) {
                  .col-sm-12.col-md-6 {
                        &:last-of-type {
                              margin-top: 30px;
                        }
                  }
            }

            .ps2__single_box {
                  border: 1px solid rgba(#000, 25%);
                  padding: 50px 80px;
                  height: 100%;

                  @include media-max(1200px) {
                        padding: 20px;
                  }
				  
				  span {
				  	margin-right: 30px;
				  }

                  .sub-title {
                        font-size: 13px;
                        letter-spacing: 5px;
                        color: #000;
                        text-transform: uppercase;
                        position: relative;
                        z-index: 1;
                  }

                  .title {
                        color: #000;
                        font-size: 35px;
                        line-height: 35px;
                        margin-bottom: 50px;
                        position: relative;
                        z-index: 1;
                        font-family: 'gilroy-regular', sans-serif;
                  }

                  p {
                        margin: 0 0 15px;
                  }

                  a {
                        color: #000;
                        @extend %link-color;
                  }

                  .svg-icon {
                        width: 15px;
                        margin-right: 15px;
                  }
            }
      }
}

/* 1.1 - wpcf7 */
.wpcf7 {
      position: relative;

      .screen-reader-response {
            position: absolute;
            overflow: hidden;
            clip: rect(1px, 1px, 1px, 1px);
            height: 1px;
            width: 1px;
            margin: 0;
            padding: 0;
            border: 0;
      }

      &-form-control-wrap {
            display: block;
            margin: $wpcf7-form-margin;
      }

      &-list-item-label {
            padding-left: .5em;
            margin-right: 1rem;
      }


      /* 1.2 - input */
      &-not-valid {
            border-color: $red;

            &-tip {
                  color: $red;
            }
      }

      .form-control,
      .input-text,
      .woocommerce-Reviews #review_form input[type="text"],
      .woocommerce-Reviews #review_form input[type="email"],
      .woocommerce-Reviews #review_form textarea {
            width: 100%;
            height: 50px;
            padding: 10px;
            display: block;
            border: 1px;
            border-bottom: 1px solid #B1B1B1;
            background-color: transparent;
            background-image: none;
            text-shadow: none;
            color: #B1B1B1;
            font-size: 14px;
            line-height: 20px;
            margin: 0;
            line-height: normal;
            box-sizing: border-box;
      }

      textarea {
            height: $wpcf7-textarea-height;
      }

      .button {
            border-color: #000;
            background: transparent;
            color: #000;
            position: relative;
            transition: $transition;

            &:hover {
                  color: #fff !important;
                  background: #000;
            }
      }

      .wpcf7-acceptance {
            .wpcf7-list-item {
                  label {
                        display: flex;

                        input {
                              width: 45px;
                              margin-right: 10px;
                        }

                        .wpcf7-list-item-label {
                              font-size: 12px;
                              line-height: 20px;
                              vertical-align: middle;
                              display: inline-block;
                        }
                  }
            }
      }




      // /* 1.3 - output */
      &-response-output {
            font-size: $input-font-size;
            padding: $input-padding-y $input-padding-x;
            margin: $wpcf7-form-margin;
            background: $input-bg;
            line-height: $input-line-height;
            border-width: $wpcf7-input-border;
            border-style: solid;
            border-radius: $input-border-radius;

            &:empty {
                  display: none;
                  margin: 0;
            }

            form.failed &,
            form.aborted & {
                  border-color: $red;
            }

            form.invalid &,
            form.unaccepted & {
                  border-color: $yellow;
            }

            form.spam & {
                  border-color: $orange;
            }

            form.sent & {
                  border-color: $green;
            }
      }


      /* 1.4 - ajax-loader */
      .ajax-loader {
            background: $wpcf7-loader-bg;
            height: 100%;
            width: 100%;
            margin: 0;
            color: rgba($primary-color, 1);
            z-index: 2;
            opacity: 0;
            visibility: hidden;
            @include absolute(0, 0, 0, 0);
            @include css3(transition, $transition);

            &:before {
                  @include absolute(0, 0, 0, 0);
                  content: '';
                  margin: auto;
                  height: 40px;
                  width: 40px;
                  display: block;
                  background-position: center;
                  background-repeat: no-repeat;
                  @include css3(animation, loading 2s infinite linear);
            }
      }

      .submitting .ajax-loader {
            opacity: 1;
            visibility: visible;
      }
}


/* 2.0 - acf-map */
.acf-map {
      width: 100%;
      height: 580px;
      background: #E5E3DF;

      @include media-max(1200px) {
            margin-top: 30px;
      }

      >.marker {
            display: none;
      }

      .gm-style-mtc li {
            label {
                  font-weight: 400;
                  font-size: 14px;
                  margin: 0 0 0 7px;
            }

            img {
                  position: relative;
                  top: -3px;
            }
      }

      img {
            max-width: inherit !important;
      }
}


/* 3.0 - contact */