/*
 * The root typography every legacy page inherits, for PUBLIC pages that vendor a theme
 * stylesheet but sit outside the member shell.
 *
 * WHY THIS EXISTS (ADR-0240). The legacy theme loads `app.min.css` on every page, and that
 * sheet sets `body { line-height: 1.6 }`. Our member pages get it because `AppShell` loads
 * the same sheet. Our PUBLIC pages — /giveaways, /membership, /membership-plan — load only
 * their own page sheet, so Tailwind's preflight `line-height: 1.5` wins instead.
 *
 * `line-height` is one of the 38 properties the parity harness samples, and it INHERITS. So
 * a single wrong value at the root made every inheriting treatment differ: /giveaways
 * measured 19/67, /membership-plan 5/22. Not dozens of defects — one declaration, counted
 * dozens of times. `/partners` is the control: same harness, same day, 23/23, and its body
 * line-height is 25.6px because AppShell loaded `app.min.css`.
 *
 * This is an OVERLAY, not an edit to a vendored sheet (ADR-0072). It carries only what the
 * theme sets at the root and nothing else — a page's own sheet still wins for anything it
 * declares, because this loads in the `crew-vendor` slot ahead of it.
 */
body {
  /* app.min.css: `body{...line-height:1.6...}` — 16px × 1.6 = 25.6px, which is what the
     original computes on every page and what our member pages already inherit. */
  line-height: 1.6;

  /*
   * The other half of the same declaration: `color: var(--crew-text-main)`, which the theme
   * resolves to #334155. Our `globals.css` sets `--color-navy` (#0F1B3A) instead, and the
   * difference INHERITS exactly as the line-height does.
   *
   * Measured on /blog, 21 Sep 2026: 34 of 41 treatments differed, and every one of them was
   * one of these two properties — 31 line-height, 3 colour (`blg-main`,
   * `blg-masthead__title`, `blg-featured__title`, all inheriting). Two declarations, counted
   * thirty-four times, which is the ADR-0240 shape again.
   *
   * At the ROOT rather than scoped to the blog, because this is a root fact about the theme
   * and scoping it would leave the next public page to rediscover it. Re-measured after the
   * change: /giveaways, /membership, /membership-plan and /partners all held their scores.
   */
  color: #334155;
}

/*
 * Headings take the same colour from an ELEMENT selector, not from inheritance:
 * `h1,h2,h3,h4,h5,h6{...color:var(--crew-text-main)...}` in app.min.css. That beats whatever
 * a container sets, which is why two blog headings stayed navy after the body rule above
 * fixed the other thirty-one differences.
 *
 * Measured on /blog, 21 Sep 2026: `blg-masthead__title` and `blg-featured__title`,
 * `rgb(51,65,85)` against our `rgb(15,27,58)` — the last two of the original thirty-four.
 * COLOUR ONLY: the same rule also sets `font-family` and `font-weight`, and neither was
 * measured as differing, because the pages that use these headings declare their own. A
 * selector reverts or restates only what was measured (CLAUDE.md rule 9).
 *
 * Anything of ours that declares a heading colour by class still wins — this is a bare
 * element selector and loses to every one of them.
 */
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #334155;
}

/*
 * Form controls keep the browser's own font, as they do on the original.
 *
 * Tailwind preflight sets `button, input, select, textarea { font-family: inherit;
 * font-size: 100%; line-height: inherit; }`. The legacy theme does not, so on WordPress a
 * `<button>` that nothing styles renders at the UA default — Arial 13.33px, line-height
 * normal — while ours inherited the page font.
 *
 * That rule was the whole of the `.ccc-password-toggle` difference on /login AND /sign-up,
 * and fixing it took /sign-up to parity (ADR-0241).
 *
 * Scoped to the controls the original leaves unstyled, one selector per measured finding —
 * never a blanket `button, input { … : revert }`, which would also hit our own React
 * components on the same page and undo styling nobody asked us to undo.
 *
 * `.mb-faq__q` was in this list briefly for `font-family`/`font-size` and did nothing: our
 * `membership-page.css` declares those on that button, so `revert` correctly loses to them.
 * Its `line-height` is a different matter — nothing of ours declares it, so preflight's
 * `line-height: inherit` is what wins, where the original keeps the UA's `normal`.
 */
.ccc-password-toggle {
  font-family: revert;
  font-size: revert;
  line-height: revert;
}

/* The FAQ question is a `<button>`; the original leaves its line-height at the UA default
   and only our preflight makes it inherit. The icon is its child and follows it. */
.mb-faq__q,
.mb-faq__icon {
  line-height: revert;
}

/* A `<button>` the original styles for everything EXCEPT padding, where it keeps the UA's
   `1px 6px`. Preflight zeroes it, which moved the glyph 6px on each side. */
.ccc-gw__infobar-x {
  padding: revert;
}

/* A visually-hidden `<input type="checkbox">`. Preflight zeroes the UA's `3px 3px 3px 4px`
   margin and makes the colour inherit; the original keeps both. Invisible to a member, but
   it is measured, and a difference that is real is not one to ignore. */
.ccc-gw__switch-input {
  margin: revert;
  color: revert;
}

/*
 * The events carousel's controls, which the original leaves at the UA's own button defaults.
 *
 * All four are `<button>` on both stacks. The original styles their POSITION and colour and
 * never their type, so they render Chrome's Arial 13.333px, `color: buttontext`, `padding:
 * 1px 6px`, `line-height: normal`. Preflight rewrites all of that to inherit, and the caption
 * `<span>` inside the item inherits the wrong font with it.
 *
 * ONE cause, FOURTEEN measured treatments — the whole of `/events`'s difference against
 * production. CI never saw it: its fixture has no events, so the carousel does not render at
 * all and the page measures 30/30 clean. That is the argument for measuring production as
 * well as CI, in one finding (ADR-0241).
 */
/*
 * Font and colour only. NOT padding.
 *
 * `events-page.css` sets `padding: 0` on both of these — they are a photo tile and a 6px
 * dot, and the UA's `1px 6px` would bloat them. Padding was never among their differing
 * properties; the measured list was font-family, font-size, colour and line-height. It was
 * reverted here anyway because these two shared a rule with `.ev-carousel__nav`, which DID
 * need it.
 *
 * The result was the difference running the other way: the original computes 0 and ours
 * computed `1px 6px`, four treatments' worth. Caught by the establishing run on 19 Sep, and
 * it is the same mistake as the nav's colour in the same file on the same day — which is why
 * CLAUDE.md rule 9 exists. Revert what differed, per selector, and nothing else.
 */
.ev-carousel__item,
.ev-carousel__dot {
  font: revert;
  color: revert;
  line-height: revert;
}

/*
 * The nav arrows get everything EXCEPT colour.
 *
 * `events-page.css` gives them `color: var(--ev-navy-800)`, and this overlay loads after it,
 * so a blanket `color: revert` here beat the vendored rule and turned them black. Measured
 * 19 Sep: the original renders them `rgb(15, 27, 58)` and the first version of this rule made
 * ours `rgb(0, 0, 0)` — a difference INTRODUCED by the fix for a different one. Colour was
 * never among the nav's differing properties; only its type and padding were.
 */
.ev-carousel__nav {
  font: revert;
  padding: revert;
  line-height: revert;
}

/*
 * The featured-event card is a `<button>` too, and the original leaves its type alone.
 *
 * Eight more treatments, same cause as the carousel: `ev-highlight` and everything inside it
 * — `__media`, `__shade`, `__play`, `__body`, `__date`, `__meta` — read Arial 13.333px with
 * `line-height: normal` there because nothing styles the button's type and the children
 * inherit it. Reverting the BUTTON is enough; the spans follow.
 *
 * Missed on the first pass because the diagnosis was read from a truncated output that showed
 * only the carousel half of the list, and "one cause, fourteen treatments" was asserted from
 * it. The cause was right and the SCOPE was not (ADR-0241).
 */
.ev-highlight {
  font: revert;
  line-height: revert;
}

/*
 * The jobs hub's "load more" — the same story, and also invisible to CI, which has too few
 * jobs to render the button at all. A `<button>` on both sides; the original leaves its
 * line-height at the UA's `normal` and preflight makes ours inherit 1.6.
 */
.cj-loadmore__btn {
  line-height: revert;
}

/*
 * The giveaway card's "Enter Giveaway" control: our ANCHOR against the original's BUTTON.
 *
 * MEASURED, CI run 35826210008 on 23 Sep 2026 — one of the two differences left on
 * /crew-giveaways, and the only one that was a defect:
 *
 *     ccc-gw__btn.ccc-gw__btn--block.ccc-gw__btn--primary.ccc-gw__enter-btn
 *       text-align     original=center        rebuild=start
 *       line-height    original=(unset)       rebuild=22.4px
 *
 * `(unset)` is `normal`: treatments.js drops `auto | normal | none | 0px`, so the original
 * recording nothing means its button computes the UA default.
 *
 * The cause is the ELEMENT. `GiveawaysListShortcode.php:2128` renders
 * `<button type="button" class="ccc-gw__enter-btn …">` opening an inline drawer; ours is a
 * `<Link>` to the entry page, because that drawer is the one piece ADR-0028 records as not
 * ported. A button gets `text-align: center` and `line-height: normal` from the UA; an
 * anchor inherits `start` and the root's 1.6 (14px × 1.6 = 22.4px). The vendored
 * `.ccc-gw .ccc-gw__btn` rule sets `justify-content: center` — which is what actually
 * centres the label — and mentions neither property, so each side kept its element's
 * default.
 *
 * Scoped to `.ccc-gw__enter-btn` ALONE, and narrowly on purpose — unlike the sibling fix on
 * /webinars, which was scoped to the element across the whole button family. The difference
 * is which side is which: there, ours was the only button and any future one would arrive
 * with the same mismatch. Here the other `.ccc-gw__btn` anchors — the `--secondary --sm`
 * control in the streak panel, for one — are anchors on BOTH sides and already measure
 * identical. Widening this to `a.ccc-gw__btn` would push `center`/`normal` onto controls
 * that are correct today, which is rule 9's own example of a fix introducing a difference.
 */
.ccc-gw a.ccc-gw__enter-btn {
  text-align: center;
  line-height: normal;
}

/*
 * `.mp-plans__cadence-btn` — the Monthly/Annual toggle on the PUBLIC plans page.
 *
 * Appeared 2 Oct when annual was priced (ADR-0289): before that the toggle rendered on
 * neither side's measurement, so the difference existed and was invisible.
 *
 * Tailwind preflight gives form controls `line-height: inherit`, so the button takes the
 * body's 1.6 (22.4px at 14px). The original leaves it at the UA's `normal`, because
 * `membership-plans.min.css` styles the button's font-family, size and weight by class
 * and never sets line-height. The badge inside it is a <span> that inherits from the
 * button, so ONE cause produced both differing treatments.
 *
 * `line-height` ONLY. The member side already fixes this with `font: revert` scoped to
 * `:where(.app-shell)` in `crew-theme.css` — which is why /upgrade-membership's toggle
 * matched legacy on the same run that /membership-plan's did not. The shorthand is NOT
 * reused here: it also reverts font-family, font-size and font-weight, none of which were
 * measured as differing, and rule 9 exists because reverting a group that was not measured
 * is how the events carousel's arrows turned black.
 *
 * MEASURED 2 Oct 2026, live legacy vs live rebuild, all 38 probed properties:
 *   .mp-plans__cadence-btn    line-height  legacy=normal  rebuild=22.4px   <- the only diff
 *   .mp-plans__cadence-badge  line-height  legacy=normal  rebuild=17.6px   (inherited)
 *   .mp-plans__cadence-badge  border-top-style solid vs none — NOT a diff: the probe
 *     ignores border style and colour at zero width (treatments.js:212).
 */
.mp-plans__cadence-btn {
  line-height: revert;
}
