/*
 * RII report page (/regulatory-impact-index/): the EHF Form Gate modal only.
 * The page itself is Design's file, untouched; the theme's CSS is kept off it
 * (inc/rii.php), so the gate form would otherwise render with browser defaults.
 * Everything here is scoped to `.ehf-gate-overlay` and uses the RII tokens.
 * Plain CSS on purpose: loaded on this one page, not part of app.css.
 */
.ehf-gate-overlay,
.ehf-gate-overlay *,
.ehf-gate-overlay *::before,
.ehf-gate-overlay *::after { box-sizing: border-box; }

.ehf-gate-overlay { font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif; color: #19232c; }

.ehf-gate-overlay .ehf-gate-modal {
  border-radius: 24px;
  padding: 32px;
  box-shadow: 0 18px 48px rgba(0, 58, 66, 0.22);
}

.ehf-gate-overlay .ehf-gate-modal-heading {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
  font-weight: 700;
  color: #003a42;
}

.ehf-gate-overlay .ehf-gate-modal-intro p { margin: 8px 0 0; font-size: 15px; line-height: 1.5; color: #33414e; }

.ehf-gate-overlay .ehf-container { margin: 22px 0 0; }

.ehf-gate-overlay .form-step {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 12px;
}

.ehf-gate-overlay .form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
}

.ehf-gate-overlay .form-field[data-ehf-field="firstname"],
.ehf-gate-overlay .form-field[data-ehf-field="lastname"] { grid-column: auto; }

.ehf-gate-overlay .form-field > label {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.3;
  text-transform: uppercase;
  color: #496782;
}

.ehf-gate-overlay .required-symbol { color: #006650; margin-left: 2px; }

.ehf-gate-overlay .form-field.is-hidden-field,
.ehf-gate-overlay .form-field.is-conditionally-hidden { display: none; }

.ehf-gate-overlay .multi-step-form input[type="text"],
.ehf-gate-overlay .multi-step-form input[type="email"],
.ehf-gate-overlay .multi-step-form input[type="tel"],
.ehf-gate-overlay .multi-step-form select {
  width: 100%;
  min-width: 0;
  height: 46px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid #d5dadd;
  border-radius: 8px;
  background: #f5f7f9;
  color: #19232c;
  font: 400 15px "Plus Jakarta Sans", system-ui, sans-serif;
}

.ehf-gate-overlay .multi-step-form input:focus,
.ehf-gate-overlay .multi-step-form select:focus {
  outline: none;
  border-color: #05ac85;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(5, 172, 133, 0.2);
}

.ehf-gate-overlay .required-text,
.ehf-gate-overlay .invalid-email-text,
.ehf-gate-overlay .blocked-email-text { font-size: 12px; line-height: 1.4; color: #b23a10; margin: 6px 0 0; }

.ehf-gate-overlay .form-field.ff-booleancheckbox {
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 10px;
}

.ehf-gate-overlay .form-field.ff-booleancheckbox > label,
.ehf-gate-overlay .form-field.ff-legalconsent label {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.5;
  color: #19232c;
}

.ehf-gate-overlay .ff-booleancheckbox .booleancheckbox-true span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.ehf-gate-overlay input[type="checkbox"] { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #006650; flex: none; }

/* Legal consent as a sibling option to the SAI360 opt-in: no rule/indent,
   checkbox line first (visual order only), fine print muted beneath it.
   The plugin fades the copy to 60% (2.25:1); full strength is 4.69:1. */
.ehf-gate-overlay .multi-step-form .ff-legalconsent {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
  padding: 0;
  border: 0;
  font-size: 12px;
  line-height: 1.5;
  color: #6e7781;
}
.ehf-gate-overlay .multi-step-form .ff-legalconsent > div { margin: 0; padding-left: 28px; }
.ehf-gate-overlay .multi-step-form .ff-legalconsent p { margin: 0; font-size: 12px; line-height: 1.6; opacity: 1; }
.ehf-gate-overlay .multi-step-form .ff-legalconsent .ehf-legal-consent-communications-checkbox,
.ehf-gate-overlay .multi-step-form .ff-legalconsent .ehf-legal-consent-processing-checkbox {
  order: -1;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
}
.ehf-gate-overlay .multi-step-form .ff-legalconsent .ehf-legal-consent-communications-checkbox input[type="checkbox"],
.ehf-gate-overlay .multi-step-form .ff-legalconsent .ehf-legal-consent-processing-checkbox input[type="checkbox"] { margin: 2px 0 0; } /* plugin: 4px */
.ehf-gate-overlay .ff-legalconsent a { color: #006650; }

/* `display` is left alone: the plugin shows/hides its nav buttons from JS. */
.ehf-gate-overlay .multi-step-form .btn,
.ehf-gate-overlay .multi-step-form button[data-ehf-role] {
  width: 100%;
  height: 48px;
  margin-top: 20px;
  padding: 0 28px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(90deg, #05ac85 0%, #003a42 100%);
  color: #fff;
  font: 700 16px/48px "Plus Jakarta Sans", system-ui, sans-serif;
  letter-spacing: 0;
  text-transform: none; /* plugin: uppercase, 0.16em */
  cursor: pointer;
}

.ehf-gate-overlay .multi-step-form .btn:hover { filter: brightness(1.08); }
.ehf-gate-overlay .multi-step-form .btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(5, 172, 133, 0.45); }

@media (max-width: 560px) {
  .ehf-gate-overlay .ehf-gate-modal { padding: 24px; }
  .ehf-gate-overlay .form-step { grid-template-columns: minmax(0, 1fr); }
}