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

:root {
  --form-input-height: 50px;
}
@media (min-width: 768px) {
  :root {
    --form-input-height: 55px;
  }
}

select.form-group__form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
select.form-group__form-control::-ms-expand {
  display: none;
}

.form-group__form-control--hide-controls[type=date]::-webkit-clear-button, .form-group__form-control--hide-controls[type=date]::-webkit-inner-spin-button, .form-group__form-control--hide-controls[type=date]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

.form-group__form-control--hide-controls[type=number] {
  -moz-appearance: textfield;
}
.form-group__form-control--hide-controls[type=number]::-webkit-outer-spin-button, .form-group__form-control--hide-controls[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.form-wrap > * + * {
  margin-top: var(--spacing-internal);
}

.form-group {
  position: relative;
}
.form-group__inner {
  position: relative;
}
.form-group__optional {
  text-align: right;
}
.form-group--required .label:after {
  content: "*";
  margin-left: -4px;
}
.form-group + .form-group,
.form-group + .button,
.form-group + .button-wrap {
  margin-top: var(--spacing-internal);
}

.label {
  display: block;
  line-height: 1.2;
  color: var(--form-label-colour);
}
.label--sub {
  display: block;
  margin-top: 5px;
}
.label:not(.label--hide) ~ .form-group__form-control, .label:not(.label--hide) ~ .choices {
  margin-top: 6px;
}
.label:not(.label--hide) ~ .form-group__form-control.flag-wrap, .label:not(.label--hide) ~ .choices.flag-wrap {
  margin-top: 12px;
}
.label:not(.label--hide) + .form-group__optional {
  position: absolute;
  top: 0;
  right: 0;
}
.label--has-icon {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}
.label--has-icon > span + span {
  margin-left: 10px;
}
.label--has-icon .la,
.label--has-icon .las {
  color: var(--colour-one);
  font-size: 1.3em;
}
.label--has-icon .la ~ span,
.label--has-icon .las ~ span {
  line-height: 1.3;
}

.form-group {
  display: block;
}
.form-group__form-control {
  border: var(--form-input-colour-border) 1px solid;
  border-radius: var(--form-input-border-radius);
  height: var(--form-input-height);
  padding: var(--form-input-padding-var);
  display: block;
  width: 100%;
  color: var(--form-input-colour-text);
  font-family: var(--font-family-body);
  font-size: calc(var(--font-size-body) * 1rem);
  background: var(--form-input-colour-background);
  -webkit-appearance: none;
}
@media (min-width: 768px) {
  .form-group__form-control {
    font-size: calc(var(--font-size-body-768) * 1rem);
  }
}
@media (min-width: 992px) {
  .form-group__form-control {
    font-size: calc(var(--font-size-body-992) * 1rem);
  }
}
@media (min-width: 1200px) {
  .form-group__form-control {
    font-size: calc(var(--font-size-body-1200) * 1rem);
  }
}
.form-group__form-control::-webkit-input-placeholder {
  color: var(--form-input-colour-placeholder);
  opacity: 1;
}
.form-group__form-control::-moz-placeholder {
  color: var(--form-input-colour-placeholder);
  opacity: 1;
}
.form-group__form-control::-ms-input-placeholder {
  color: var(--form-input-colour-placeholder);
  opacity: 1;
}
.form-group__form-control::placeholder {
  color: var(--form-input-colour-placeholder);
  opacity: 1;
}
.form-group__form-control:focus {
  border-color: var(--form-input-colour-border-focus);
}
select.form-group__form-control + .form-group__inner__item {
  position: absolute;
  bottom: 0;
  right: 0;
  pointer-events: none;
}

textarea.form-group__form-control {
  height: calc(var(--form-input-height) * 3);
  padding-top: 25px;
  padding-bottom: 25px;
}
@media (min-width: 768px) {
  textarea.form-group__form-control {
    height: calc(var(--form-input-height-768) * 5);
  }
}

.form-group--optional > .label {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.form-group--optional > .label:after {
  content: "Optional";
  opacity: 0.5;
  margin-left: 5px;
  font-weight: var(--font-weight);
}
.form-group--inline-label.form-group--remove-styles {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}
.form-group--inline-label.form-group--remove-styles .label:not(.hide) {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  font-size: inherit;
  color: var(--colour-title);
}
.form-group--inline-label.form-group--remove-styles .label:not(.hide) + * {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-top: 0;
  margin-left: var(--spacing-internal);
}
@media (min-width: 768px) {
  .form-group--inline-label {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
  }
  .form-group--inline-label > .label:not(.hide) {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
  }
  .form-group--inline-label > .label:not(.hide) + * {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-top: 0;
    margin-left: var(--spacing-internal);
  }
}
.form-group--has-inner-item .form-group__inner__item {
  white-space: nowrap;
  transition: var(--transition);
  color: var(--form-input-colour-icon);
  line-height: var(--form-input-height);
  font-size: 1.3em;
  border-radius: var(--border-radius);
  padding: var(--form-input-padding);
  height: calc(var(--form-input-height) - 2px);
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  margin: 1px 1px 1px 0;
  position: relative;
}
.form-group--has-inner-item .form-group__inner__item .button {
  height: var(--form-input-height);
  margin: -1px -1px -1px 0;
}
.form-group--has-inner-item .form-group__inner__item--text > span {
  color: var(--form-input-colour-placeholder);
}
.form-group--has-inner-item .form-group__inner__item--text {
  position: absolute;
  right: 0;
  bottom: 0;
}
.keyboard-input .form-group--has-inner-item .form-group__inner__item:focus {
  outline: 1px solid;
}
.form-group--has-inner-item .form-group__inner .form-group__form-control {
  padding-right: 80px;
}
.form-group--has-inner-item--reverse > .form-group__inner {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.form-group--has-inner-item--reverse > .form-group__inner > .form-group__inner__item {
  border-radius: 0;
  margin-left: 1px;
}
.form-group--has-inner-item--reverse > .form-group__inner .form-group__form-control {
  padding-left: 80px;
  padding-right: var(--spacing-internal);
}
.form-group--has-text .form-group__inner .form-group__form-control {
  padding-right: var(--form-input-padding);
}
.form-group--has-text .form-group__inner > .text {
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: left;
  transition: var(--transition);
  font-size: 14px;
  color: var(--colour-one);
  line-height: var(--form-input-height);
  padding-right: 10px;
}
.form-group--has-button .form-group__inner {
  border-radius: var(--border-radius);
  display: -webkit-flex;
  display: flex;
  -webkit-flex: 1;
  flex: 1;
}
.form-group--has-button .form-group__inner .form-group__form-control {
  box-shadow: none;
  min-width: 0;
  -webkit-flex: 0 1 auto;
  flex: 0 1 auto;
}
.form-group--has-button .form-group__inner .button {
  white-space: nowrap;
  padding-left: calc(var(--spacing-internal) - 3);
  padding-right: calc(var(--spacing-internal) - 3);
  padding-top: var(--button-padding-v);
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
  box-shadow: none;
  margin-left: calc(var(--spacing-internal) * -1);
}

.input-validation-error {
  border-color: var(--colour-status-danger) !important;
}

.field-validation-error {
  background: var(--colour-status-danger);
  color: var(--colour-neutral);
  padding: 5px 15px;
  border-radius: 99px;
  font-size: calc(var(--font-size-body) * 1rem);
  line-height: 1;
  display: inline-block;
  margin-top: 5px;
}
@media (min-width: 768px) {
  .field-validation-error {
    font-size: calc(var(--font-size-body-768) * 1rem);
  }
}
@media (min-width: 992px) {
  .field-validation-error {
    font-size: calc(var(--font-size-body-992) * 1rem);
  }
}
@media (min-width: 1200px) {
  .field-validation-error {
    font-size: calc(var(--font-size-body-1200) * 1rem);
  }
}

.form-elements > * + * {
  margin-top: var(--spacing-internal);
}

@media (max-width: 767px) {
  .form-group--inline-label-mob {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
  }
  .form-group--inline-label-mob > .label:not(.hide) {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
  }
  .form-group--inline-label-mob > .label:not(.hide) + * {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-top: 0;
    margin-left: var(--spacing-internal);
  }
}