/* ============================================================
   SMMSCRIPTZONE — Additional Mobile Fixes v8
   (style.css now handles primary responsive rules)
   ============================================================ */

/* ── Touch optimizations ─────────────────────────────────── */
html { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
* { -webkit-font-smoothing: antialiased; }

/* ── Hamburger animations ────────────────────────────────── */
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ── Nav drawer close button ─────────────────────────────── */
.nav-drawer-close { display: none; }
@media (max-width: 960px) { .nav-drawer-close { display: flex; } }

/* ── Swipe hint on tables ────────────────────────────────── */
@media (max-width: 640px) {
  .table-wrap { -webkit-overflow-scrolling: touch; }
}

/* ── Prevent iOS input zoom (belt and suspenders) ────────── */
@media (max-width: 768px) {
  input[type="text"], input[type="email"], input[type="tel"],
  input[type="number"], input[type="password"], input[type="url"],
  input[type="search"], textarea, select { font-size: 16px !important; }
}

/* ── Safe area for notched phones ────────────────────────── */
.mobile-bottom-nav { padding-bottom: env(safe-area-inset-bottom, 0); }
@supports (padding: max(0px)) {
  .mobile-bottom-nav { padding-bottom: max(env(safe-area-inset-bottom), 0px); }
}

/* ── Landscape phone adjustments ────────────────────────── */
@media (max-height: 500px) and (orientation: landscape) {
  .hero { min-height: auto; padding: 80px 0 40px; }
  .mobile-bottom-nav { display: none; }
  .dash-main { padding-bottom: 1rem !important; }
}

/* ── High DPI / Retina ───────────────────────────────────── */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .navbar, .dash-sidebar { border-width: 0.5px; }
}

/* ── Reduced motion ──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .ticker-inner { animation: none !important; }
  [data-aos] { opacity: 1 !important; transform: none !important; }
}

/* ── Focus visible for keyboard nav ─────────────────────── */
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; border-radius: 4px; }
