/**
 * Bushwick Daily — base rules for every page of the child theme.
 *
 * Replaces assets/css/overflow-fix.css (2026-11-04; owner: "do step 1 with both fixes"), the 2026-02 mobile override
 * sheet written for the tagDiv theme. That sheet loaded on every page and, on phones, overrode the redesigned
 * templates with !important element rules: every heading's face, weight, spacing and line height; body text; every
 * email field; every link made a 44 px inline-flex box; an amber hover; and html/body overflow-x: hidden, which also
 * made <body> a scroll container, so no position: sticky on the site ever stuck. 50 of its 67 rules selected tagDiv
 * markup, which no live page renders (crawl at origin, 2026-11-04: 34 published Pages and one page of every other type).
 * docs/debt/2026-11-04-site-chrome-and-publish-door-debts.md, debt 2.
 *
 * Only the rules that did needed work are here. Everything else is the templates' own CSS, which comes after this
 * file in every <head> (wp_head() precedes each template's <style>), so a template's rule always wins over these.
 */

/* Smooth scrolling for in-page links (overflow-fix.css section 12, unchanged). bd-membership.js switches it off for
   an instant scroll restore. */
html {
  scroll-behavior: smooth;
}

/* Reduced motion (overflow-fix.css section 12, unchanged): a reader who asks the system for less motion gets none.
   tests/brand_reveal_browser_test.py relies on it. */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Tap targets on phones: 44 px for controls (Apple's minimum; WCAG 2.5.5), not for links inside running text, which
   WCAG 2.5.8 exempts and which as 44 px inline-flex boxes could not wrap and added 4-5 px to every line holding a
   link (docs/debt/2026-10-19-mobile-tap-target-rule-breaks-inline-links.md). Running text: a paragraph, caption,
   quote, table cell, definition or heading anywhere, and a list item inside a story or page body. A heading's link is
   its text (a card's headline): as an inline-flex box each inline child (a search result's <mark>) became a flex item
   on one row, and the headline could not wrap (390 px: 382 px wide in a 342 px card). Every other link (the
   section bar, the phone menu, footer links, tags, share buttons, card images) and every button keeps the 44 px box, as
   under overflow-fix.css section 8. The membership components size their own controls (D-1553, 2026-10-13).
   Narrowed on the owner's go, 2026-11-04 ("do step 1 with both fixes"). */
@media (max-width: 767px) {
  a:not(:where(.bd-gate, .bd-gate *, .bd-sheet, .bd-sheet *, .bd-unlock-note *,
               p *, figcaption *, blockquote *, td *, th *, dd *, dt *, h1 *, h2 *, h3 *, h4 *, h5 *, h6 *,
               .article__body li *, .page-content li *, .longform-content li *)),
  button:not(:where(.bd-gate, .bd-gate *, .bd-sheet, .bd-sheet *, .bd-unlock-note *)),
  [role="button"]:not(:where(.bd-gate, .bd-gate *, .bd-sheet, .bd-sheet *, .bd-unlock-note *)) {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}
