/* Stay Updated Page Specific Styles */
.hero {
  min-height: 40vw;
  background-color: unset;

  @media (max-width: 991px) {
    padding: 32px 0;
  }
}

/* Desktop (≥1200px) */
@media (min-width: 1200px) {
  .hero {
    min-height: 40vw;
  }
}

/* Tablet (768px – 1199px) */
@media (max-width: 1023px) and (min-width: 768px) {
  .hero__container {
    grid-template-columns: unset;
  }
}

/* Mobile L (425px – 767px) */
@media (max-width: 767px) and (min-width: 426px) {
  .hero {
    min-height: 147vw;
  }
}

/* Mobile M (376px – 425px) */
@media (max-width: 425px) and (min-width: 376px) {
  .hero {
    min-height: 630px;
  }
}

/* Mobile S (≤375px) */
@media (max-width: 375px) {
  .hero {
    min-height: 555px;
  }
}

/* Mobile S (≤375px) */
@media (max-width: 320px) {
  .hero {
    min-height: 475px;
  }
}

/* Ipad Air */
@media (min-width: 820px) and (max-width: 834px) and (orientation: portrait) {
  .hero {
    min-height: 350px;
  }
  .hero__title {
    font-size: 45px;
  }
}

/* Page Layout */
.stay-updated-page {
  background-color: var(--color-white);
}

.stay-updated-form-wrapper .form-submit {
  width: 132px;
  margin: 0 auto;
  background: url(/themes/custom/dawnzera_full/images/icons/chevron-right.svg) no-repeat right center var(--color-primary);
  background-size: 24px;
  padding-right: 40px;
  /* background-position: right 9px center; */
  background-position: right 15px center;
  line-height: normal;

  @media (max-width: 767px) {
    background-position: left 60% center;
    padding-right: 40px;
  }

  @media (max-width: 440px) {
    background-position: left 61% center;
    padding-right: 40px;
  }
}

/* AM/PM font size */
:root {
  --ampm-color: #302a2a;
}

.stay-updated-ampm {
  font-size: 1rem;
  color: var(--ampm-color);
}

/* Coral color for stay updated agree */
a.stay-updated-agree {
  color: #c94808 !important;
  text-decoration: underline;
  text-decoration-color: #c94808 !important;
}

.consent-para-content {
  label {
    p {
      line-height: normal;
    }
  }
}

.page__bg--bricks {
  background: url(../../images/backgrounds/form-lab-background.png) lightgray center / contain repeat;
  opacity: 0.5;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: -1;
}

.desktop-only {
  display: block;
}

.mobile-only {
  display: none;
}

@media (max-width: 769px) {
  .desktop-only {
    display: none;
  }

  .mobile-only {
    display: block;
  }
}

.hero__title {
  color: var(--color-charcol);
  text-shadow: none;
  font-size: 52px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: var(--space-md);

  @media (max-width: 991px) {
    font-size: 36px;
    margin-bottom: 16px;
  }
}

.hero__subtitle {
  color: var(--color-charcol);
  text-shadow: none;
  font-size: 26px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: 100%;
  max-width: 51.25rem;

  @media (max-width: 991px) {
    font-size: 22px;
    max-width: none;
  }
}

.container {
  @media (max-width: 767px) {
    margin: 40px auto;
  }
}

/*****
REGISTER PAGE VARIANTS
*****/

.coral-cta-card {
  color: white;
  background-color: var(--color-coral);
  text-align: center;
  border-radius: 12px;
  padding: 16px 24px;
  outline: 2px solid var(--color-coral);
  outline-offset: 4px;

  label {
    color: white;
    font-size: 28px;
  }
}


/* .form-required::after {
  content: '*';
  color: red;
} */

.form-required:not(.option)::after,
.custom-error-layout .form-required::after {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 0.1em;
  content: "";
  vertical-align: super;
  /* Use a background image to prevent screen readers from announcing the text. */
  background-image: url(../../images/icons/required.svg);
  background-repeat: no-repeat;
  background-size: 7px 7px;
}

.form-type-radios {
  .form-required:not(.option)::after {
    content: '(Select 1)';
    font-size: 20px;
    padding-left: 0.65rem;
    vertical-align: baseline;
    width: auto;
    height: auto;
    background-position: left top 0.126rem;
  }
}


.custom-error-layout, .form-type-radio {
  display: flex;
  flex-wrap: wrap; /* allow children to break onto new line */
  align-items: center;
  gap: 16px;
}

.custom-error-layout .form-item--error-message {
  flex: 0 0 100%;
  min-width: auto;
  margin-top: -8px;
  line-height: normal;
}

.form-type-radio .description {
  flex: 0 0 100%;
  min-width: auto;
  padding-left: 20px;
}

.form-item--error-message {
  color: var(--color-primary-dark);
}

.form-item-which-event-would-you-like-to-sign-up-for.form-type-radio .description .webform-element-description {
  display: block;
}
.form-type-radio .description {
  margin-top: -8px;

  .webform-element-description {
    display: flex;
    flex-direction: column;
    gap: 8px;

    .radio-option-desc {
      line-height: normal;
      display: flex;
      gap: 12px;
      align-items: baseline;

      .su-bullet {
        font-size: 20px;
      }

      .bullet-label {
        line-height: normal;
        font-size: 20px;
      }
    }
  }
}


/* Hide ONLY error messages at the top */
.webform-submission-stay-updated-form [data-drupal-messages] [role="contentinfo"][aria-label="Error message"] {
  display: none;
}

.form-type-radios, .webform-options-display-one-column:not(.form-select) {
  .form-item--error-message {
    margin-top: -16px;
  }
}

.form-type-radio {
  display: flex;
  gap: 16px;

  input {
    width: 20px;
    height: 20px;
  }
}

.form-item-which-event-would-you-like-to-sign-up-for {
  label.option {
    font-weight: 700;
  }
}

.form-type-checkbox {

  input {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    border: 1px solid var(--color-steel, #515861);
    background: var(--color-white, #FFF);
    margin-top: 0px;
  }
}

#edit-which-of-the-following-best-describes-you-section {
  gap: 24px;
}

.stay-updated-form-wrapper .form-item-event-confirmation {
  margin-top: 0px;
}

p {
  line-height: normal;
}

p+p {
  margin-top: 24px;
}


.form-actions.webform-actions {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
}

.ajax-progress.ajax-progress-throbber {
  width: fit-content;
  height: fit-content;
  margin: 0;
  position: absolute;
  left: 33vw;
  top: 0;
}

.btn--primary:hover:not(:disabled) {
  color: var(--color-coral);
}

.newsletter-form-section {

  background-image: url('/themes/custom/dawnzera_full/images/pipes/stay-updated-pipe-desktop.svg');
  background-repeat: no-repeat;
  background-position: left top 1vw;
  margin-top: 60px;

  @media (max-width: 991px) {
    background-image: none;
    margin-top: 40px;
  }

  @media (max-width: 551px) {
    padding: 0px;
  }

  .form-container {
    @media (max-width: 768px) {
      margin-bottom: 0px;
      padding: 0px;
    }
  }
}

.bg-image-mobile {
  img {
    margin-left: auto;

    @media (min-width: 425px) {
      display: none;
    }
  }
}


.form-item-are-you-or-your-loved-one-currently-treating-with-other {

  .form-item--error-message {
    margin-top: 8px !important;
  }

  select {
    option:nth-child(2) {
      margin-top: 8px;
    }

    option:last-child {
      margin-bottom: 8px;
    }
  }
}

.section--pipes {
  display: none;
}
