/* ========================================
 * 6. BROWSER-SPECIFIC FIXES
 * ======================================== */
/* iOS Safari Specific Fixes */
@supports (-webkit-touch-callout: none) {
  /* Prevent iOS zoom on input focus */
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="datetime-local"],
  select,
  textarea {
    font-size: 16px;
  }

  /* iOS: Enhanced mobile sheet touch behavior */

  /* iOS: Optimize drag handle for touch */
  #listings-sheet button[aria-label*="Drag"] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
  }

  /* iOS: Ensure content area scrolls properly */
  #listings-content-mobile {
    transform: translateZ(0);
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
  }
} /* Single closing brace for @supports block */

/* ========================================
 * HORIZONTAL SCROLL PREVENTION
 * ======================================== */
/* CRITICAL: Prevent horizontal overflow in all listings overlay content */
#listings-overlay * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Ensure spot cards don't cause horizontal overflow */
#listings-overlay .spot-card {
  max-width: 100% !important;
  overflow-x: hidden !important;
  word-wrap: break-word !important;
  word-break: break-word !important;
}

/* Ensure all text content wraps properly */
#listings-overlay .spot-card * {
  word-wrap: break-word !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}
/* Android Chrome Specific Fixes */
@supports (-webkit-appearance: none) and (not (overflow: -webkit-marquee)) {
  /* Android touch target optimization */
  button,
  .amenity-chip,
  .quick-time-btn {
    touch-action: manipulation;
  }

  /* Android scroll optimization */
  #mobile-listings-container,
  #amenities-container {
    overscroll-behavior: contain;
  }
}

/* CRITICAL: Ensure proper contrast on dark overlays and backgrounds */
.dark *[style*="background: rgba(0"],
.dark *[style*="background-color: rgba(0"],
html.dark *[style*="background: rgba(0"],
html.dark *[style*="background-color: rgba(0"],
body.dark *[style*="background: rgba(0"],
body.dark *[style*="background-color: rgba(0"] {
  color: #f9fafb !important; /* Light text on dark backgrounds */
}

/* Ensure text is light on any very dark background */
*[style*="background: #0"],
*[style*="background-color: #0"],
*[style*="background: rgba(0, 0, 0"],
*[style*="background-color: rgba(0, 0, 0"] {
  color: #f9fafb !important; /* Light text on very dark backgrounds */
}

/* Override any gray-800 text that might appear on dark backgrounds in dark mode */
.dark .text-gray-800,
html.dark .text-gray-800,
body.dark .text-gray-800,
.dark [style*="color: #ffffff"],
html.dark [style*="color: #ffffff"],
body.dark [style*="color: #ffffff"] {
  color: #f9fafb !important; /* Light text in dark mode */
}

/* NOTE: Dark mode styles (including NUCLEAR OPTION) consolidated in dark-mode.css */

/* Cover computed styles that might result in gray-800 */

