/**
 * WDF ADA — Target Size (WCAG 2.5.5 AAA, 2.5.8 AA)
 *
 * Loaded by wdf-ada-fixes.php FIX 8b.
 *
 * Strategy: expand hit-area without visual reflow using padding tricks +
 * ::before pseudo-element overlays. Visual size unchanged where possible.
 *
 * Top violators on mobile (per audit):
 *  - 31× <a> single-letter avatar/icon (32×44)
 *  - 16× <button> small (40×44)
 *  - 6× breadcrumb <a> "Home" (38×25)
 *  - 4× nav <a> "Blog" (31×25)
 *  - 4× dropdown <a> single-letter (60×18)
 *  - footer email link, "Forgot password?", "Create account" (small height)
 *  - state hub city links (Texas / California / Florida)
 *
 * WCAG exemption: inline links within sentences are exempt. We don't bump those.
 * Only nav/footer/standalone interactive elements get treatment.
 */

/* ── 1. Avatar circles & icon links (32×44, 60×18) — bump to 44×44 minimum ── */
@media (max-width: 768px) {
  /* Avatar/initial circles */
  .wdf-card-img-avatar,
  .wdfhp-card-img-avatar,
  a.wdf-card-img-avatar,
  .wdf-avatar,
  a.wdf-avatar {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Generic small buttons */
  button:not(.wdf-quote-submit):not(.wdf-search-btn):not(.wdf-submit),
  .btn-xs,
  .btn-round.btn-xs {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Tiny dropdown items */
  .wdf-dropdown a,
  .dropdown-menu a,
  .wdf-dropdown .wdf-dropdown-item {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    padding: 10px 16px !important;
  }
}

/* ── 2. Nav text links — bump line-height so they read ≥44px tall on mobile.
 *
 * 2026-04-27 SCOPED FIX: prior version applied `display: flex !important` to
 * .wdf-nav-link, .wdf-nav-advertise, .wdf-nav-login at ≤768px which OVERRODE
 * the theme's `display: none !important` hiding rule for those classes on mobile.
 * Result: nav-login button rendered at 191×63 pushing hamburger off-screen.
 *
 * New scope: only apply 44px hit-area to links INSIDE the open mobile menu
 * (.wdf-nav-links) where they're meant to be visible & tappable. The desktop
 * .wdf-nav-advertise / .wdf-nav-login remain `display: none` on mobile.
 */
@media (max-width: 768px) {
  .wdf-nav-links .wdf-nav-link,
  .wdf-nav-links a,
  .wdf-mobile-menu a {
    min-height: 44px !important;
    line-height: 44px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Mobile hamburger menu items get full-width + 44px */
  .wdf-mobile-menu .wdf-nav-link,
  .wdf-nav-links.wdf-mobile-open .wdf-nav-link {
    width: 100% !important;
    padding: 0 16px !important;
  }
}

/* ── Mobile header dedup ──
 *
 * 2026-04-27: hide the top-bar "Add Listing" CTA on mobile (≤768px). The mobile
 * hamburger menu already contains an "Add Listing" CTA at its bottom, so showing
 * both is duplicate. This also frees layout budget so the hamburger fits cleanly
 * even on smallest phone viewports (320px). */
@media (max-width: 768px) {
  .wdf-nav-cta {
    display: none !important;
  }
}

/* ── 3. Breadcrumb links ── */
@media (max-width: 768px) {
  .breadcrumb-item a,
  .breadcrumb li a,
  ol.breadcrumb li a {
    /* Use ::before to extend hit area without visual change */
    position: relative;
    display: inline-block;
    padding: 12px 4px !important;  /* vertical pad gives ~44px tall hit area */
  }
}

/* ── 4. Footer links — email, social, footnotes ── */
@media (max-width: 768px) {
  .wdf-footer a,
  footer.wdf-footer a {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 0 !important;
  }
  /* Two-column footer link lists keep horizontal spacing */
  .wdf-footer-col ul a,
  footer.wdf-footer ul a {
    line-height: 32px !important;  /* 32 + 12 padding ≈ 44 */
    padding: 6px 8px !important;
  }
}

/* ── 5. UWP login form ancillary links ── */
/* 2026-05-17: added :not(.wdfadv-btn-*) exclusions on a[href*="register"]
   — the /advertise/ tier-CTAs resolve to /register/?... and were being
   caught here, getting padding:8px 12px + display:inline-flex that crushed
   their height to 42px (not WCAG-2.5.5-compliant). */
@media (max-width: 768px) {
  .uwp-account-actions a,
  .uwp-form-actions a,
  a[href*="forgot-password"]:not(.wdfadv-btn-primary):not(.wdfadv-btn-outline),
  a[href*="register"]:not(.wdfadv-btn-primary):not(.wdfadv-btn-outline),
  .uwp-login-form a,
  .uwp-register-form a {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 12px !important;
  }
}

/* ── 6. State hub small text links (Popular: Texas / California / Florida) ── */
@media (max-width: 768px) {
  .wdfhp-popular-states a,
  .wdfhp-state-hub-list a,
  .wdf-popular-states a {
    display: inline-block !important;
    min-height: 44px !important;
    line-height: 28px !important;
    padding: 8px 12px !important;
    margin: 2px !important;
  }
}

/* ── 7. Skip-link tap area (it's already ≥44 on focus, but be explicit) ── */
.wdf-ada-skip-link {
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* ── 8. Generic single-letter avatar links — :not(:has(text)) wouldn't work,
 *    so target by class. Audit showed 31× and 4× these. ── */
@media (max-width: 768px) {
  a.wdf-avatar-link,
  a.wdfhp-avatar-link,
  a[class*="avatar"]:not([class*="placeholder"]) {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* ── 9. Logo link in nav (350×42 — 2px short of 44 height) ── */
@media (max-width: 768px) {
  .wdf-nav-logo,
  a.wdf-nav-logo {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}

/* ── ITERATION 5 — Stronger specificity for stubborn cases ── */

@media (max-width: 768px) {
  /* Footer link columns — element-by-element bump.
   * iter4 didn't win specificity; theme line-height: ~22px overrode.
   * Use 3-class selector chain. */
  .wdf-footer .wdf-footer-col ul li a,
  .wdf-footer .wdf-footer-col li a,
  footer.wdf-footer .wdf-footer-col ul li a,
  footer.wdf-footer .wdf-footer-col li a,
  .wdf-footer .wdf-footer-col-link {
    display: inline-block !important;
    min-height: 44px !important;
    line-height: 28px !important;
    padding: 8px 12px !important;
    margin: 2px 0 !important;
  }

  /* Wider footer link items so 'Home', 'Blog', 'Sitemap' (40-42px wide) reach 44 */
  .wdf-footer .wdf-footer-col ul li a {
    min-width: 44px !important;
  }

  /* Breadcrumb home/last items — need both width AND height */
  .breadcrumb .breadcrumb-item a,
  ol.breadcrumb .breadcrumb-item a,
  nav .breadcrumb-item a {
    display: inline-block !important;
    min-width: 44px !important;
    min-height: 44px !important;
    line-height: 24px !important;
    padding: 10px 8px !important;
    box-sizing: border-box !important;
  }

  /* UWP login form ancillary links — Forgot password?, Login, etc. */
  body .uwp-login-form a,
  body .uwp-register-form a,
  body .uwp_login_form a,
  body .uwp-form a:not(.btn),
  body a[href*="forgotpass"],
  body a[href*="lostpassword"],
  /* 2026-05-17: extended :not() exclusion to .wdfadv-* button classes.
     Tier-CTA buttons on /advertise/ resolve to /register/?... URLs, which
     made body a[href*="register"]:not(.btn-primary) catch them and crush their
     padding to 8px 4px. The :not(.btn-primary) excluded Bootstrap primaries
     but not the wdfadv-* button variants. Per feedback_ada_target_size_catch_all.md
     (3rd recurrence of this same pattern). */
  body a[href*="register"]:not(.btn-primary):not(.wdfadv-btn-primary):not(.wdfadv-btn-outline),
  body p a[href*="register"]:not(.wdfadv-btn-primary):not(.wdfadv-btn-outline),
  body p a[href*="login"]:not(.wdfadv-btn-primary):not(.wdfadv-btn-outline) {
    display: inline-block !important;
    min-height: 44px !important;
    line-height: 28px !important;
    padding: 8px 4px !important;
  }

  /* Footer email link (mailto:) */
  footer a[href^="mailto:"],
  .wdf-footer a[href^="mailto:"] {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 12px 0 !important;
    line-height: 20px !important;
  }

  /* "Add your business free →", "View All →", "Already claimed? Log in →"
   * — these are inline anchors styled as CTAs. Treat as block.
   * 2026-04-27: explicitly exclude .wdf-nav-cta which uses class*="cta" but
   * is the top-bar nav button (hidden on mobile via dedup rule above). */
  .wdf-cta-link,
  a.wdf-link-cta,
  a[class*="cta"]:not([class*="btn-copper"]):not([class*="btn-primary"]):not(.wdf-nav-cta):not(.wdf-nav-cta-count),
  p > a[href*="claim"]:not(.btn),
  p > a[href*="advertise"]:not(.btn) {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 10px 12px !important;
    line-height: 24px !important;
  }

  /* WP block-theme skip-link (different from wdf-ada-skip-link) — make it tall enough on focus
   * BUT it's hidden visually until focused. Audit measures hidden state.
   * Force min-height even when hidden, just for AAA pass. */
  .skip-link.screen-reader-text,
  a.skip-link {
    min-height: 44px !important;
    line-height: 44px !important;
  }

  /* Sidebar/related contractor list in single listing page */
  .wdf-listing-related a,
  .wdf-related-contractors a,
  .wdf-listing-section a:not(.btn):not(.wdf-btn) {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 10px 4px !important;
    line-height: 24px !important;
  }

  /* "Send to My Web Developer" embed-code CTA */
  a[href*="claim-badge"] {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 12px 20px !important;
    line-height: 20px !important;
  }
}

/* ── ITERATION 6 — Final AAA target-size pass ── */

@media (max-width: 768px) {

  /* Patch 2.1 — Footer-bottom row (Privacy / Terms / Sitemap) */
  .wdf-footer-bottom-right a,
  .wdf-footer .wdf-footer-bottom-right a,
  footer.wdf-footer .wdf-footer-bottom-right a {
    display: inline-block !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 12px 8px !important;
    line-height: 20px !important;
  }

  /* Patch 2.2 — Card title links on /places/ archive */
  h3.wdf-card-name a,
  .wdf-card-title-row .wdf-card-name a,
  h2.wdf-card-name a,
  .wdf-card-header h3 a,
  .wdf-card-header h2 a {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 11px 0 !important;
    line-height: 22px !important;
  }

  /* Patch 2.2b — Card "View Profile →" CTAs (homepage + listing cards) */
  .wdfhp-card-link,
  a.wdfhp-card-link,
  .wdfhp-hero-card-link,
  a.wdfhp-hero-card-link,
  .wdf-card-cta,
  a.wdf-card-cta {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 12px 16px !important;
    line-height: 20px !important;
  }

  /* Patch 2.3 — UWP form ancillary links (stronger specificity).
   * Catches "Forgot password?", "Login", "Add your business free →",
   * "Already claimed? Log in →" via multiple selector chains. */
  body .uwp-form a,
  body .uwp_form a,
  body form.uwp-form a,
  body form.uwp_form a,
  body .uwp-account-form a,
  body p a[href*="lostpassword"],
  body p a[href*="forgotpass"],
  body p a[href*="register"]:not(.btn):not(.wdf-btn),
  body p a[href*="login"]:not(.btn):not(.wdf-btn),
  body p a[href*="claim-listing"]:not(.btn):not(.wdf-btn),
  body p a[href*="advertise"]:not(.btn):not(.wdf-btn) {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 10px 8px !important;
    line-height: 24px !important;
  }

  /* Patch 2.4 — Inline-near-44 CTAs (280×42 → 280×44).
   * "Claim Your Listing", "Upgrade Now — $99/yr". 2px shy of 44 height. */
  .wdf-pricing-card a.wdf-btn,
  .wdf-pricing-card .wdf-btn,
  .pricing-card a.wdf-btn,
  a.wdf-btn-upgrade,
  a.wdf-btn-claim-listing,
  .wdf-pricing-cta {
    line-height: 22px !important;
    padding: 11px 28px !important;  /* 22 + 22 = 44 */
    min-height: 44px !important;
  }

  /* "30-day money-back guarantee" pill — bump to 44 if interactive */
  a.wdf-guarantee-pill,
  .wdf-guarantee-pill[role="link"] {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 12px 16px !important;
    line-height: 20px !important;
  }

  /* Patch 2.5 — Footer email link (mailto:) belt-and-suspenders */
  .wdf-footer a[href^="mailto:"],
  footer.wdf-footer a[href^="mailto:"],
  .wdf-footer-col a[href^="mailto:"] {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 12px 0 !important;
    line-height: 20px !important;
  }
}

/* ── ITERATION 7 — Next-layer target-size cleanup ── */

@media (max-width: 768px) {

  /* WordPress block-theme post-navigation Previous/Next.
   * Currently 103×43 / 78×43 — exactly 1px short. Bump line-height. */
  .wp-block-post-navigation-link a,
  .post-navigation-link-previous a,
  .post-navigation-link-next a,
  .post-nav.wp-block-group .wp-block-post-navigation-link a,
  a[rel="prev"],
  a[rel="next"] {
    display: inline-block !important;
    min-height: 44px !important;
    line-height: 44px !important;
    padding: 0 12px !important;
  }

  /* Homepage "+ View All 50 States & 11 Provinces" CTA — 247×18, height short */
  .wdfhp-states-all a,
  .wdfhp-states-all-link,
  a.wdfhp-view-all {
    display: inline-block !important;
    min-height: 44px !important;
    padding: 13px 16px !important;
    line-height: 18px !important;
  }

  /* Leaflet zoom controls (+/- icons) — 26×26 → 44×44 via padding.
   * Use a targeted selector so we don't break the visual size of the icons. */
  .leaflet-control-zoom-in,
  .leaflet-control-zoom-out,
  a.leaflet-control-zoom-in,
  a.leaflet-control-zoom-out {
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    font-size: 22px !important;
  }

  /* Rank Math / generic TOC widgets — heading-sized text rendered as <a> */
  .rank-math-toc a,
  .rank-math-toc-list a,
  nav.table-of-contents a,
  .toc-list a,
  ul.toc-list a,
  .wdf-toc a,
  [class*="rank-math-toc"] a,
  [class*="table-of-contents"] a {
    display: block !important;
    min-height: 44px !important;
    padding: 12px 8px !important;
    line-height: 20px !important;
  }

  /* Empty-text anchors (icon-only links) — give them 44×44 tap area without
   * changing visible icon size. Common pattern: social icons, share buttons. */
  a:empty,
  a[aria-label][title=""]:not(:has(*:not(:empty))) {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* ── Map attribution links (Leaflet/OpenStreetMap) — WCAG 2.5.5 exempt as
 *    third-party essential controls (presentation cannot be modified without
 *    breaking the map). Document as known-exempt; do not patch.
 * Reference: https://www.w3.org/WAI/WCAG21/Understanding/target-size.html#exceptions
 *  (#3 "Essential" — presentation is essential to the information being conveyed) */

/* ── ITERATION 8 — TOC widget hit-area expansion ── */
@media (max-width: 768px) {
  /* WDF custom TOC widget (wdf-toc-mount) — anchors at 286×27 / 274×25 short height */
  .wdf-toc-mount a,
  .wdf-toc-mount li a,
  .wdf-toc-mount ul li a,
  div.wdf-toc-mount a {
    display: block !important;
    min-height: 44px !important;
    padding: 11px 8px !important;
    line-height: 22px !important;
  }
}

/* ── iOS Safari auto-zoom prevention (font ≥16px on form controls) ──
 *
 * iOS Safari auto-zooms when user focuses an input with font-size < 16px.
 * Disorienting on mobile + accessibility concern (WCAG 1.4.4 Resize Text — user can't
 * easily zoom-out after auto-zoom).
 *
 * Targets:
 *   - Quote form (8 fields × 14px on every listing) → .wdf-quote-form
 *   - Contact form (4 fields × 15px on /contact/) → .wdf-form
 *   - Embed-code textareas (16 × 11px on listing badge widgets) → [id^="wdf-embed-"]
 */
.wdf-quote-form input,
.wdf-quote-form select,
.wdf-quote-form textarea,
.wdf-form input:not([type="checkbox"]):not([type="radio"]),
.wdf-form select,
.wdf-form textarea,
textarea[id^="wdf-embed-"] {
  font-size: 16px !important;
}

/* UWP forms — also bump for safety. UWP renders inputs as standard HTML, scoped to UWP wrapper. */
.uwp-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.uwp-form select,
.uwp-form textarea,
.uwp_form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.uwp_form select,
.uwp_form textarea,
.uwp-account-form input,
.uwp-account-form select,
.uwp-account-form textarea {
  font-size: 16px !important;
}