/*!
 * TFdWx LLC · Proprietary + Confidential · © 2026 · All Rights Reserved
 * tfdwx-touch.css · iPad / tablet polyfill · drop-in
 * ============================================================
 * Fixes 5 of the 10 known iPad-failure categories with zero source-file changes:
 *   #3 missing touch-action  · 300ms tap delay
 *   #4 missing tap-highlight · ugly grey flash on tap
 *   #5 input font < 16px     · iOS Safari auto-zoom on focus
 *   #6 100vh usage           · iOS URL-bar overflow
 *   #1 stuck :hover state    · partial mitigation via @media (hover:none) cleaner
 *
 * Companion: tfdwx-touch.js
 * Contact: legal@tfdwx.com
 * ============================================================
 */

/* === Category 4 · Kill iOS grey tap-flash globally =========================== */
*,*::before,*::after{
  -webkit-tap-highlight-color: transparent;
}

/* === Category 3 · Eliminate 300ms tap delay on tappable elements ============= */
button,
a,
[role="button"],
[role="tab"],
[role="link"],
[role="menuitem"],
[role="option"],
[role="switch"],
[role="checkbox"],
[role="radio"],
.btn,
.button,
.tab,
.nav-tab,
.chip,
.pill,
.card[onclick],
[onclick],
[data-tap],
input[type="checkbox"],
input[type="radio"],
input[type="submit"],
input[type="button"],
label[for]{
  touch-action: manipulation;
}

/* === Category 5 · Stop iOS auto-zoom on input focus ========================== */
/* iOS Safari zooms when an input's font-size < 16px. Apply on tablet+ only,
   so the desktop UI keeps its compact look. */
@media (max-width: 1180px), (hover: none) and (pointer: coarse){
  input,
  textarea,
  select{
    font-size: max(16px, 1em) !important;
  }
  /* Numeric / search / date controls also get the 16px floor */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"]{
    font-size: max(16px, 1em) !important;
  }
}

/* === Category 6 · 100vh URL-bar fix ========================================== */
/* The companion JS sets --tfdwx-vh and --tfdwx-svh on load + resize.
   --tfdwx-vh   = 1% of visual viewport (matches iOS Safari's small-vh)
   --tfdwx-svh  = 1% of small viewport (no URL bar)
   --tfdwx-lvh  = 1% of large viewport (with URL bar)
   Surfaces that opt in use .tfdwx-h-screen, but legacy 100vh callsites
   are still left intact for desktop. */
:root{
  --tfdwx-vh: 1vh;
  --tfdwx-svh: 1vh;
  --tfdwx-lvh: 1vh;
}
.tfdwx-h-screen{ height: calc(var(--tfdwx-vh, 1vh) * 100); }
.tfdwx-min-h-screen{ min-height: calc(var(--tfdwx-vh, 1vh) * 100); }

/* === Category 1 · Stuck :hover cleaner ======================================= */
/* Touch devices fire :hover on tap and never clear it. This global cleaner
   neutralises common stuck-hover effects on touch-only devices without
   breaking the desktop hover UX. */
@media (hover: none) and (pointer: coarse){
  /* Strip transform/opacity-based hover lifts on tap-only devices */
  button:hover,
  a:hover,
  [role="button"]:hover,
  .btn:hover,
  .button:hover,
  .card:hover,
  .tab:hover,
  .nav-tab:hover,
  .chip:hover,
  .pill:hover{
    transform: none;
  }
  /* Re-fire active feedback so the user gets confirmation on tap */
  button:active,
  a:active,
  [role="button"]:active,
  .btn:active,
  .button:active,
  .card:active,
  .tab:active,
  .nav-tab:active,
  .chip:active,
  .pill:active{
    opacity: .82;
    transition: opacity .08s ease-out;
  }
}

/* === Category 7 · Min 44×44 touch targets for icon-only buttons ============== */
/* Only applies to elements that explicitly opt in via .tfdwx-tap or to known
   icon-button patterns. Doesn't touch text buttons (they're naturally >44px). */
@media (hover: none) and (pointer: coarse){
  .tfdwx-tap,
  button[aria-label][title],
  a[aria-label][title],
  .icon-btn,
  .btn-icon,
  [data-tap-target]{
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* === Pull-to-refresh + over-scroll dampening ================================ */
/* iOS pull-to-refresh on the body interferes with operator dashboards. */
html, body{
  overscroll-behavior-y: contain;
}

/* === Smooth-scroll behavior in modal/scroll regions ========================= */
[data-scroll-container],
.scroll-container,
.modal-body,
.dialog-body{
  -webkit-overflow-scrolling: touch;
}

/* === Prevent text-selection on accidental long-press of buttons ============= */
@media (hover: none) and (pointer: coarse){
  button,
  [role="button"],
  .btn,
  .button,
  .tab,
  .nav-tab,
  .chip,
  .pill,
  .card[onclick]{
    -webkit-user-select: none;
    user-select: none;
  }
}