/*
 * Plugin "Brevo-Anmeldung" (Templates/BrevoSignup/Form.html). Uses the
 * theme's tokens (--blue, --field, --ink, --font, …, packages/theme main.css)
 * with fallbacks; the submit button is the theme's pill (.button).
 */
.brevo-signup {
  max-width: 560px;
  margin-inline: auto;
  scroll-margin-top: 120px;
  font-family: var(--font, Georgia, serif);
  color: var(--ink, #24404c);
}
.brevo-signup__form {
  display: grid;
  gap: 20px;
}
.brevo-signup__field {
  display: grid;
  gap: 6px;
  margin: 0;
}
.brevo-signup__label {
  font: 500 var(--fs-body-sm, 16px) / 1.4 var(--font, Georgia, serif);
  color: var(--blue, #006f9e);
}
.brevo-signup__input {
  box-sizing: border-box;
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--rule-strong, rgb(0 111 158 / 0.25));
  border-radius: 10px;
  background: var(--field, #fbfaf7);
  color: var(--ink, #24404c);
  font: 400 var(--fs-body-sm, 16px) / 1.4 var(--font, Georgia, serif);
}
.brevo-signup__input:focus-visible {
  outline: 2px solid var(--blue, #006f9e);
  outline-offset: 1px;
  border-color: var(--blue, #006f9e);
}
.brevo-signup__field--error .brevo-signup__input {
  border-color: #b3261e;
}
.brevo-signup__error {
  font: 500 15px / 1.4 var(--font, Georgia, serif);
  color: #b3261e;
}
.brevo-signup__note {
  margin: 0;
  font: 350 15px / 1.5 var(--font, Georgia, serif);
  color: var(--muted, #4e6570);
}
.brevo-signup__note a {
  color: var(--blue, #006f9e);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.brevo-signup__button {
  justify-self: start;
}
.brevo-signup__message {
  margin: 0 0 20px;
  padding: 18px 22px;
  border: 1px solid var(--rule-card, rgb(0 111 158 / 0.18));
  border-radius: 12px;
  background: var(--card, #f7f5f0);
  font: 500 var(--fs-body, 18px) / 1.5 var(--font, Georgia, serif);
  color: var(--blue, #006f9e);
}
.brevo-signup__message--failed {
  border-color: #b3261e;
  color: #b3261e;
}