/*
Subscribe paragraph

Styleguide 2.10
*/

// Colour variables used in this paragraph
$d-p-subscribe-color: $color-odysseus !default;
$d-p-subscribe-header-color: $color-odysseus !default;
$d-p-subscribe-background: $color-agamemnon !default;
$d-p-subscribe-line-color: $color-nestor !default;
$d-p-subscribe-line-color-inverted: $line-background !default;

// Padding, margins & sizing.
$d-p-subscribe-form-margin: 2.2rem auto 1.25rem auto !default;
$d-p-subscribe-form-max-width: 56rem !default;
$d-p-subscribe-mobile-form-max-width: 31.25rem !default;
$d-p-subscribe-mobile-form-margin-y: 3% !default;
$d-p-subscribe-padding-y: 8% !default;
$d-p-subscribe-line-margin-top: 1.45rem !default;

// Other settings.
$d-p-subscribe-background-opacity: 0.4 !default;

.theme-default {
  .paragraph--type--d-p-subscribe-file {
    background: $d-p-subscribe-background;
    color: $d-p-subscribe-color;

    a {
      color: $d-p-subscribe-color;
    }

    .field--name-field-d-main-title {
      color: $d-p-subscribe-header-color;
    }
  }
}

// Override default values.
.padding-top-default {
  .paragraph--type--d-p-subscribe-file {
    padding-top: $d-p-subscribe-padding-y;
  }
}

.padding-bottom-default {
  .paragraph--type--d-p-subscribe-file {
    padding-bottom: $d-p-subscribe-padding-y;
  }
}

// Subscribe form
.d-p-subscribe-file-form {
  margin: $d-p-subscribe-form-margin;
  text-align: center;

  .form-control {
    border: none;
  }

  .btn {
    @include media-breakpoint-up(md) {
      vertical-align: top;
      margin-top: 0;
      padding-top: $input-padding-y;
      padding-bottom: $input-padding-y;
    }
  }

  a {
    @include font-body-standard;
  }

  @include make-inline-form;
  fieldset.form-item-name {
    max-width: 0.25 * $d-p-subscribe-form-max-width;
    margin-right: 0.025 * $d-p-subscribe-form-max-width;
  }
  fieldset.form-item-mail {
    max-width: 0.4 * $d-p-subscribe-form-max-width;
    margin-right: 0.025 * $d-p-subscribe-form-max-width;
  }
  .checkbox {
    margin-top: 1rem;
    margin-left: auto;
    margin-right: auto;
  }
  @include media-breakpoint-up(lg) {
    .checkbox {
      width: 0.75 * $d-p-subscribe-form-max-width;
    }
  }
  @include media-breakpoint-down(lg) {
    fieldset.form-item-mail {
      max-width: 0.35 * $d-p-subscribe-form-max-width;
    }
    .checkbox {
      width: 90%;
    }
  }
  @include media-breakpoint-down(md) {
    max-width: $d-p-subscribe-mobile-form-max-width;
    margin: $d-p-subscribe-mobile-form-margin-y auto;
    fieldset.form-item-name, fieldset.form-item-mail {
      max-width: 100%;
      margin-right: 0;
    }
  }
}

// Entire paragraph
.paragraph--type--d-p-subscribe-file {
  position: relative;
  z-index: 0;

  .d-media-background-wrapper {
    img, iframe {
      opacity: $d-p-subscribe-background-opacity;
    }
  }

  .content-wrapper {
    position: relative;
    z-index: 2;
  }

  .field--name-field-d-media-icon {
    text-align: center;
  }
  .field--name-field-d-main-title {
    @include font-main-header;
    text-align: center;

    // Horizontal line
    &::after {
      @include decoration-header-line-main-center($d-p-subscribe-line-color, $d-p-subscribe-line-color-inverted);
    }
  }
  p {
    text-align: center;
  }
}
