/**
 * sitewide-a11y-polish-1344951.css — Task #1344951
 *
 * P2 SITEWIDE POLISH FIXES:
 * 1. Text sizes below 16px minimum (nav tagline 9.9px, announcement 13px, timer 13-14px, buttons 12.8px)
 * 2. Blank white pill button in "Pick up where you left off" return visitor banner
 * 3. 115/200 tap targets under 44px on mobile (logo, nav links, search toggle)
 *
 * WCAG AAA Compliance:
 * - All body text must be 16px minimum
 * - All tap targets must be 44×44px minimum on mobile (375px viewport)
 * - All buttons must have readable text/content
 *
 * Loading: After all other CSS. Enforces minimum standards across the site.
 */

/* ════════════════════════════════════════════════════════════════════════════
   ISSUE 1: UNDERSIZED TEXT — Bump all small text to 16px minimum
   ════════════════════════════════════════════════════════════════════════════ */

/* Nav tagline / subtitle text — was 9.9px */
.nav-tagline,
.nav-subtitle,
.sr-header .tagline,
.sr-header__tagline,
.nav__tagline,
header .tagline,
nav .tagline,
.sr-nav-tagline,
[class*='nav'][class*='tagline'],
[class*='nav'][class*='subtitle'],
.header-tagline,
.header-subtitle {
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* Announcement bar text — was 13px */
.announce-bar,
#announceBar,
.announcement-bar,
.sr-announce-bar,
.announcement-banner,
.sr-announcement,
.promo-bar,
.banner-announce,
[class*='announce'][class*='bar'],
[class*='announce-bar'] {
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* Announcement bar text content */
.announce-bar p,
#announceBar p,
.announcement-bar p,
.sr-announce-bar p,
.announce-bar span,
#announceBar span,
.announcement-bar span,
.sr-announce-bar span {
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* Timer / countdown text — was 13-14px */
.timer,
.countdown,
.timer-text,
.countdown-text,
.sr-timer,
.deadline-timer,
.urgency-timer,
[class*='timer'],
[class*='countdown'],
.card-deadline,
.deadline-badge,
.urgency-badge {
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* "File Now →" button text — was 12.8px */
.file-now-btn,
.sr-cta-file,
.file-cta,
.btn-file-now,
[class*='file-now'],
[class*='file-cta'],
.cta-file {
  font-size: 16px !important;
  line-height: 1.5 !important;
  font-weight: 600 !important;
}

/* Ensure all text inside navigation elements is at least 16px */
.nav-link,
.nav-item,
.nav-label,
.nav-text,
nav a,
nav button,
header a,
header button {
  font-size: 16px !important;
  line-height: 1.5 !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   ISSUE 2: BLANK WHITE PILL BUTTON — "Pick up where you left off" banner
   ════════════════════════════════════════════════════════════════════════════ */

/* Return visitor banner CTA button — ensure text is visible */
.return-visitor-banner,
.returnvisitor-banner,
.pick-up-banner,
.continue-banner,
.where-left-off,
[class*='return'][class*='visitor'],
[class*='pick-up'],
[class*='continue-banner'] {
  /* Make sure banner itself is visible */
}

/* Return visitor banner button — ensure text content */
.return-visitor-banner .btn,
.returnvisitor-banner .btn,
.pick-up-banner .btn,
.continue-banner .btn,
.where-left-off .btn,
[class*='return'][class*='visitor'] .btn,
[class*='pick-up'] .btn,
[class*='continue-banner'] .btn,
.return-visitor-banner button,
.returnvisitor-banner button,
.pick-up-banner button,
.continue-banner button,
.where-left-off button,
[class*='return'][class*='visitor'] button,
[class*='pick-up'] button,
[class*='continue-banner'] button {
  /* Ensure button is readable, not blank */
  min-height: 44px !important;
  padding: 12px 24px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  background: #2563eb !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 24px !important;
  cursor: pointer !important;
  /* Force text to show if it's hidden */
  text-indent: 0 !important;
  letter-spacing: normal !important;
  font-family: inherit !important;
}

/* Ensure button text is not hidden by overflow */
.return-visitor-banner .btn::before,
.returnvisitor-banner .btn::before,
.pick-up-banner .btn::before,
.continue-banner .btn::before,
.where-left-off .btn::before,
[class*='return'][class*='visitor'] .btn::before,
[class*='pick-up'] .btn::before,
[class*='continue-banner'] .btn::before,
.return-visitor-banner button::before,
.returnvisitor-banner button::before,
.pick-up-banner button::before,
.continue-banner button::before,
.where-left-off button::before,
[class*='return'][class*='visitor'] button::before,
[class*='pick-up'] button::before,
[class*='continue-banner'] button::before {
  /* Add default text if button is completely empty */
  content: 'Continue →';
  display: inline-block;
}

/* Fallback: if button has content, show it */
.return-visitor-banner .btn:not(:empty),
.returnvisitor-banner .btn:not(:empty),
.pick-up-banner .btn:not(:empty),
.continue-banner .btn:not(:empty),
.where-left-off .btn:not(:empty),
[class*='return'][class*='visitor'] .btn:not(:empty),
[class*='pick-up'] .btn:not(:empty),
[class*='continue-banner'] .btn:not(:empty),
.return-visitor-banner button:not(:empty),
.returnvisitor-banner button:not(:empty),
.pick-up-banner button:not(:empty),
.continue-banner button:not(:empty),
.where-left-off button:not(:empty),
[class*='return'][class*='visitor'] button:not(:empty),
[class*='pick-up'] button:not(:empty),
[class*='continue-banner'] button:not(:empty) {
  /* If button has real content, don't add fallback text */
}

.return-visitor-banner .btn:not(:empty)::before,
.returnvisitor-banner .btn:not(:empty)::before,
.pick-up-banner .btn:not(:empty)::before,
.continue-banner .btn:not(:empty)::before,
.where-left-off .btn:not(:empty)::before,
[class*='return'][class*='visitor'] .btn:not(:empty)::before,
[class*='pick-up'] .btn:not(:empty)::before,
[class*='continue-banner'] .btn:not(:empty)::before,
.return-visitor-banner button:not(:empty)::before,
.returnvisitor-banner button:not(:empty)::before,
.pick-up-banner button:not(:empty)::before,
.continue-banner button:not(:empty)::before,
.where-left-off button:not(:empty)::before,
[class*='return'][class*='visitor'] button:not(:empty)::before,
[class*='pick-up'] button:not(:empty)::before,
[class*='continue-banner'] button:not(:empty)::before {
  content: none !important;
}

/* Generic pill button fixes — all white/blank pills should have content or be hidden */
.pill-btn:empty,
.pill-button:empty,
.badge-btn:empty,
[class*='pill'][class*='btn']:empty,
[class*='pill-btn']:empty {
  display: none !important;
}

.pill-btn,
.pill-button,
.badge-btn,
[class*='pill'][class*='btn'],
[class*='pill-btn'] {
  font-size: 16px !important;
  min-height: 44px !important;
  padding: 12px 24px !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   ISSUE 3: TAP TARGETS UNDER 44px — Ensure all interactive elements are 44×44px
   ════════════════════════════════════════════════════════════════════════════ */

@media (max-width: 480px) {
  /* Navigation and button interactive elements must be at least 44×44px.
     NOTE: Naked <a> and <button> intentionally excluded — inline text links
     and small icon buttons must not get forced block sizing. Only target
     explicit interactive components. */
  [role='button'],
  [role='menuitem'],
  [role='tab'],
  .btn,
  .btn-primary,
  .btn-secondary,
  .sr-btn,
  .nav-link,
  .nav-item,
  nav a,
  header a,
  .header-link {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 12px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Logo — at least 44×44px tap target */
  .logo,
  .sr-logo,
  .nav-logo,
  .header-logo,
  [class*='logo'] {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
  }

  .logo img,
  .sr-logo img,
  .nav-logo img,
  .header-logo img,
  [class*='logo'] img {
    height: 44px !important;
    width: auto !important;
  }

  /* Nav links — minimum 44px height */
  .nav-link,
  .nav-item,
  nav > a,
  nav > button,
  header > a,
  header > button,
  .sr-nav-link,
  .sr-nav-item {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 12px 16px !important;
  }

  /* Search toggle / search button */
  .search-toggle,
  .search-btn,
  .nav-search-btn,
  .nav-search-toggle,
  [class*='search'][class*='toggle'],
  [class*='search'][class*='btn'] {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 8px !important;
  }

  /* Close buttons, hamburger menus, etc */
  .close-btn,
  .hamburger,
  .hamburger-btn,
  .menu-toggle,
  .nav-hamburger,
  .mobile-menu-btn,
  [class*='close'],
  [class*='hamburger'],
  [class*='menu-toggle'] {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 8px !important;
  }

  /* All buttons — ensure minimum touch target */
  .btn,
  .btn-primary,
  .btn-secondary,
  .sr-btn,
  button {
    min-height: 44px !important;
    min-width: 44px !important;
  }

  /* Form inputs */
  input[type='text'],
  input[type='email'],
  input[type='password'],
  input[type='tel'],
  input[type='url'],
  input[type='number'],
  select,
  textarea {
    min-height: 44px !important;
    padding: 12px 16px !important;
  }

  /* Checkbox and radio buttons — ensure adequate touch target */
  input[type='checkbox'],
  input[type='radio'] {
    min-height: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
    cursor: pointer !important;
  }

  input[type='checkbox'] + label,
  input[type='radio'] + label {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
    padding: 12px 16px !important;
    cursor: pointer !important;
  }

  /* Ensure spacing between touch targets for accuracy */
  a + a,
  button + button,
  input + input,
  a + button,
  button + a {
    margin-left: 8px !important;
  }

  /* Fix any inline touch targets that are too small */
  [style*='width'][style*='px'],
  [style*='height'][style*='px'] {
    min-height: 44px !important;
    min-width: 44px !important;
  }
}

/* Slightly larger breakpoint — ensure touch targets are accessible */
@media (max-width: 600px) {
  a,
  button,
  [role='button'],
  .nav-link,
  nav a {
    padding: 12px 16px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   GENERIC POLISH — Ensure all text remains readable
   ════════════════════════════════════════════════════════════════════════════ */

/* Prevent text from getting squished or hidden */
body {
  text-size-adjust: none !important;
  -webkit-text-size-adjust: none !important;
  -ms-text-size-adjust: none !important;
}

/* Ensure line height is adequate for readability — scoped to text elements only,
   not div/span which would break flex/grid layout containers */
body,
p,
a,
button,
label {
  line-height: 1.5 !important;
}

/* NOTE: .text-xs/.text-sm utility classes intentionally NOT overridden here.
   These classes exist for deliberate small text: badges, labels, footnotes.
   Forcing them to 16px breaks card meta, legal text, and other small copy. */
