@use "00-base/configure" as *;

.ma__feedback-form {
  textarea {
    resize: none;
    overflow: hidden;
    width: 100%;
    border: 2px solid #dcdcdc !important;
  }
}

/**
* Override css for the Formstack multi page feedback form.
*/
#fsForm2521317 .hide {
  display: none;
}

/**
 * MAYFLOWER STYLE
 */
#fsForm2521317 {
  border: 2px solid #dcdcdc;
  background: #ffffff;
  max-width: 35em;
  padding: 2.5em;
  margin: 0 auto 5rem;
}

#fsForm2521317 > * {
  margin-top: 30px;
}

#fsForm2521317 > fieldset:first-of-type {
  margin-top: 0;
}


#fsForm2521317 fieldset > fieldset,
#fsForm2521317 fieldset > label {
  margin-top: 30px;
}
#fsForm2521317 fieldset > fieldset:first-child,
#fsForm2521317 fieldset > label:first-child {
  margin-top: 0;
}

#fsForm2521317 p {/* Thank you message after submission. */
  margin: 0;
  text-align: center;
}

#fsForm2521317 p.ma__info-container {
  margin-top: 30px;
  text-align: left;
}

#fsForm2521317 p.ma__info-container a:hover {
  text-decoration: underline;
}

#fsForm2521317 fieldset > .ma__select-box,
#fsForm2521317 fieldset > input[type=text] {
  max-width: 500px;
  width: 100%;
}

#fsForm2521317 fieldset .ma__button {
  margin-top: .25em;
}

#fsForm2521317 .ma__textarea__wrapper::after {/* Hide the character count which is not accessible. */
  display: none;
}

.accessibleCharCount-wrapperElem {
  display: block;
  font-size: $fonts-xsmall;
  line-height: 1.625rem;
  text-align: right;
}

.accessibleCharCount-numberElem::after {
  content: '/10000';
}

.ma__helper-text {
  margin-top: 10px;
}

.ma__disclaimer {
  font-size: $fonts-small;/* in mass_decision_tree, this is set to 19px, but here make it relatively adjustable based on the root font size set to viewports. In full screen display, it's equivalent to 20px. */
}

.ma__disclaimer strong {
  font-style: italic;
  text-decoration: underline;
}

/* Error messages */
#fsForm2521317 .messages {
  margin: 0 0 2rem 0;
}

#fsForm2521317 .messages .error {
  color: $c-error-red;
  text-align: left;
}

#fsForm2521317 fieldset.c_radio {
  margin-top: -30px;
}



#fsForm2521317 fieldset.error textarea {
  width: 100%;
  border: 1px solid $c-error-red !important;
}

#fsForm2521317 fieldset.error legend {
  color: $c-error-red;
}

@media (min-width: 621px) {/* $bp-small-min */
  #fsForm2521317 > *,
  #fsForm2521317 p.ma__info-container {
    margin-top: 60px;
  }

  #fsForm2521317 fieldset > fieldset,
  #fsForm2521317 fieldset > label {
    margin-top: 45px;
  }
}

@media (min-width: 781px) {/* $bp-medium-min */
  #fsForm2521317 > *,
  #fsForm2521317 p.ma__info-container {
    margin-top: 70px;
  }
}

@media (min-width: 911px) {/* $bp-large-min */
  #fsForm2521317 > *,
  #fsForm2521317 p.ma__info-container {
    margin-top: 90px;
  }
}

@media (min-width: 621px) {/* $bp-small-min */
  #fsForm2521317 > *,
  #fsForm2521317 p.ma__info-container {
    margin-top: 45px;
  }
}
