/* ==========================================================================
   ACCESSIBILITY - TOUCH TARGET SIZING
   Touch widths only (<=1024px). Desktop untouched.

   Header, top bar and any icon control use an invisible ::before hit area
   instead of min-height/display changes. Those properties re-flow flex
   headers and broke the mobile layout on the first attempt; a positioned
   pseudo-element enlarges the tap box with zero layout impact.

   Inline links inside sentences are excluded on purpose - WCAG 2.5.8 exempts
   targets in a block of text, and resizing them would break line spacing.
   ========================================================================== */

@media (max-width: 1024px) {

  /* --- Invisible 44x44 hit area, no layout change --- */
  .tlc-topbar-right > a,
  .tlc-footer-social > a,
  .tlc-burger,
  .tlc-float-btn,
  .tlc-top,
  .tlc-fb-links > a,
  .tlc-crumb > a,
  .tlc-scard-body > a.tlc-link {
    position: relative;
  }
  .tlc-topbar-right > a::before,
  .tlc-footer-social > a::before,
  .tlc-burger::before,
  .tlc-float-btn::before,
  .tlc-top::before,
  .tlc-fb-links > a::before,
  .tlc-crumb > a::before,
  .tlc-crumb > a::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 44px;
    min-height: 44px;
    width: 100%;
    height: 100%;
    pointer-events: auto;
  }

  /* --- Block-level list links: safe to grow, they already stack --- */
  .tlc-footer-col ul li > a,
  .tlc-footer-areas li > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* --- Form controls --- */
  input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='submit']),
  select,
  textarea,
  .ff-el-form-control {
    min-height: 44px;
  }
  input[type='checkbox'],
  input[type='radio'] {
    min-width: 22px;
    min-height: 22px;
  }
  .tlc-chip,
  .ff-el-form-check-label {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  /* --- Disclosure / accordion controls --- */
  .tlc-acc-q,
  .tlc-faq-q,
  summary {
    min-height: 44px;
  }

  /* --- Visible focus for keyboard users --- */
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  summary:focus-visible {
    outline: 3px solid #ffb100;
    outline-offset: 2px;
  }

  /* --- ICON ROW SPACING ---
     44px hit areas on 15px icons overlap unless the row is spaced.
     Gap only; icon glyph size and alignment are unchanged. --- */
  .tlc-topbar-right { display: flex; align-items: center; gap: 14px; }
  .tlc-footer-social { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
  .tlc-fb-links { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
  .tlc-crumb { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

  /* Header CTA sits 3px under target; pseudo-element lifts it without reflow */
  .tlc-header-cta > a.tlc-btn { position: relative; }
  .tlc-header-cta > a.tlc-btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    min-width: 44px;
    min-height: 44px;
  }
}
