/*
 * Editorial: foundry-editorial-inline-newsletter (Standard + Compact + Footer).
 *
 * TOKENISED 2026-09-07, Ryan's ruling: "Yes, all three blocks read the token in
 * this cut." The brand marks here (the top rule, the eyebrow and the submit
 * button) were hardcoded cananews values, written when this block was
 * cananews-only, and they shipped to every site the module reached. The file
 * already used tokens for its status colours and its unconfigured notice, which
 * is what made the remaining literals easy to miss: a partly-tokenised file
 * reads as a tokenised one.
 *
 * THE FALLBACKS ARE NOT WHAT MAKES THIS SAFE. assets/editorial.css defines all
 * 20 --foundry-editorial-* tokens at :root, so on any site running this module
 * the token is always set and the fallback is unreachable. What makes it safe
 * was measured: these blocks are placed on broomecounty production and staging
 * only. See docs/editorial-module-plan.md.
 *
 * The button's text colour binds to --foundry-editorial-cta-fg, which is one of
 * the four tokens most child themes do not declare (cta-fg, cta-link,
 * cta-link-hover, dark-link). That is the right token even so: a site that
 * rebrands the accent and leaves cta-fg alone gets white text on its own accent,
 * which is the sane default. Flagged because a site CAN now change it, and
 * could not before.
 */
.foundry-editorial-inline-newsletter {
  margin: 3rem 0;
  padding: 2rem 1.75rem;
  background: var(--foundry-editorial-surface, #FAFAF7);
  border-top: 3px solid var(--foundry-editorial-accent, #D62828);
  border-bottom: 1px solid var(--foundry-editorial-rule, #E5E5E5);
}
.foundry-editorial-inline-newsletter--compact {
  margin: 2rem 0;
  padding: 1.25rem 1.5rem;
}
.foundry-editorial-inline-newsletter__inner {
  max-width: 720px;
  margin: 0 auto;
}
.foundry-editorial-inline-newsletter__eyebrow {
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-weight: 700;
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--foundry-editorial-accent, #D62828);
  margin: 0 0 0.5rem;
}
.foundry-editorial-inline-newsletter__title {
  font-family: var(--foundry-editorial-font-heading, 'Source Serif 4', Georgia, serif);
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.2;
  margin: 0 0 0.5rem;
  color: var(--foundry-editorial-ink, #1A1A1A);
}
.foundry-editorial-inline-newsletter--compact .foundry-editorial-inline-newsletter__title { font-size: 1.25rem; }
.foundry-editorial-inline-newsletter__dek {
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
  color: var(--foundry-editorial-muted, #595959);
  margin: 0 0 1rem;
}
.foundry-editorial-inline-newsletter--compact .foundry-editorial-inline-newsletter__dek { font-size: 0.875rem; margin-bottom: 0.75rem; }
.foundry-editorial-inline-newsletter__form {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.foundry-editorial-inline-newsletter__form input[type=email] {
  flex: 1 1 220px;
  padding: 0.6875rem 0.875rem;
  border: 1px solid var(--foundry-editorial-rule, #E5E5E5);
  border-radius: 6px;
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
}
.foundry-editorial-inline-newsletter__form button {
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-weight: 700;
  font-size: 0.9375rem;
  background: var(--foundry-editorial-accent, #D62828);
  color: var(--foundry-editorial-cta-fg, #FFFFFF);
  border: 0;
  border-radius: 6px;
  padding: 0.6875rem 1.25rem;
  cursor: pointer;
}
.foundry-editorial-inline-newsletter__form button:hover { background: var(--foundry-editorial-accent-deep, #A11F1F); }

/* Unconfigured: no destination could be resolved, so the form is not drawn.
   Shown only in the editor and to users who can fix it, never to a reader.
   Deliberately plain and un-branded: this is a build-time error, not chrome. */
.foundry-editorial-inline-newsletter--unconfigured {
  border-top: 3px solid var(--foundry-editorial-muted, #5a5a5a);
  background: var(--foundry-editorial-surface, #f5f5f4);
}
.foundry-editorial-inline-newsletter__notice {
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--foundry-editorial-muted, #5a5a5a);
  margin: 0;
}

/* --------------------------------------------------------------------------
   Footer variant + the direct (MailPoet) form.

   The standard and compact variants above are untouched. Everything here is
   scoped to --footer or to __form--direct, so a block already on a page cannot
   pick any of it up.
   -------------------------------------------------------------------------- */

/* A site footer is not an article band: it sits inside the footer's own
   background and should not draw a second surface over it. */
.foundry-editorial-inline-newsletter--footer {
  margin: 0;
  padding: 0;
  background: none;
  border-top: 0;
  border-bottom: 0;
}
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__inner {
  max-width: none;
  margin: 0;
}
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__title {
  font-size: 1.125rem;
}
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__dek {
  font-size: 0.875rem;
  margin-bottom: 0.75rem;
}

/* Stacked: the name row, then a full-width email, then the button. The base
   .__form is a wrapping flex row, which is right for one field beside a button
   and wrong for four; the footer stacks instead. */
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* box-sizing is declared, not assumed, and this is a bug that was on screen.
   These controls are sized with `width: 100%` and also carry horizontal
   padding. A theme that does not apply a global border-box reset (Twenty
   Twenty-Five does not, for these elements) leaves them content-box, so
   `width: 100%` means "100% of the container PLUS 28px of padding" and each
   field overhangs the form's right edge. The button was already border-box
   from the theme's own button rules, so it alone sat correctly and the three
   controls ended up with three different right edges.

   Scoped to the footer variant deliberately: the standard and compact variants
   size their email with `flex: 1 1 220px` rather than a width, never hit this,
   and are pixel-identical to the previous release. Widening this selector
   would change them. */
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__form input,
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__form button,
.foundry-editorial-inline-newsletter__names input[type=text] {
  box-sizing: border-box;
}
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__form input[type=email] {
  flex: 0 0 auto;
  width: 100%;
}
.foundry-editorial-inline-newsletter--footer .foundry-editorial-inline-newsletter__form button {
  width: 100%;
}

/* First name / last name, side by side. Collapses to one column on a narrow
   viewport, where two 50% text inputs are unusable. */
.foundry-editorial-inline-newsletter__names {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}
@media (max-width: 480px) {
  .foundry-editorial-inline-newsletter__names {
    grid-template-columns: 1fr;
  }
}
.foundry-editorial-inline-newsletter__names input[type=text] {
  width: 100%;
  padding: 0.6875rem 0.875rem;
  border: 1px solid var(--foundry-editorial-rule, #E5E5E5);
  border-radius: 6px;
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
}

/* The pending state has to be visible, or a slow network reads as a dead
   button and the reader submits again. */
.foundry-editorial-inline-newsletter__form button[disabled] {
  opacity: 0.6;
  cursor: default;
}

/* Status line. Empty at rest and it must occupy no space then: an empty
   live region that still reserves a line pushes the footer around on submit. */
.foundry-editorial-inline-newsletter__status {
  font-family: var(--foundry-editorial-font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  line-height: 1.5;
  margin: 0;
  color: var(--foundry-editorial-muted, #595959);
}
.foundry-editorial-inline-newsletter__status:empty {
  display: none;
}
.foundry-editorial-inline-newsletter__status.is-ok {
  color: var(--foundry-editorial-success, #1a7f37);
}
.foundry-editorial-inline-newsletter__status.is-error {
  color: var(--foundry-editorial-error, #b32d2e);
}

/* Honeypot: off-screen rather than display:none. A bot that skips hidden
   inputs is exactly the bot we want to catch, and this is still unreachable
   by pointer, by tab order (tabindex=-1) and by assistive tech (aria-hidden). */
.foundry-editorial-inline-newsletter__hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
