/* ============================================================
   Lux Massage — Girls Portal Styles
   Client-facing booking portal
   ============================================================ */

/* Smooth scroll for photo galleries */
.photo-scroll{
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}

/* Touch feedback for cards */
@media(hover:hover){
  .th-card:hover{
    transform:translateY(-1px);
    box-shadow:0 4px 16px rgba(0,0,0,.06);
  }
}

/* === Badge Animations (from v42) === */
@keyframes fireGlow {
  0%,100% { text-shadow: 0 0 5px #ff6600, 0 0 10px #ff3300; }
  50% { text-shadow: 0 0 10px #ff6600, 0 0 20px #ff3300, 0 0 30px #ff0000; }
}
@keyframes starGlow {
  0%,100% { text-shadow: 0 0 5px #DAA520, 0 0 10px #B8860B; }
  50% { text-shadow: 0 0 10px #DAA520, 0 0 20px #B8860B, 0 0 30px #8B6914; }
}
@keyframes pulseOnline {
  0%,100% { opacity:1; }
  50% { opacity:.5; }
}
.popular-badge {
  display:inline-flex; align-items:center; gap:3px;
  padding:2px 8px; border-radius:10px;
  background:linear-gradient(135deg,#ff6600,#ff3300);
  color:#fff; font-size:9px; font-weight:700;
  margin-left:6px; animation:fireGlow 1.5s ease-in-out infinite;
  vertical-align:middle; line-height:1;
}
.recommended-badge {
  display:inline-flex; align-items:center; gap:3px;
  padding:2px 8px; border-radius:10px;
  background:linear-gradient(135deg,#DAA520,#B8860B);
  color:#fff; font-size:9px; font-weight:700;
  margin-left:4px; animation:starGlow 2s ease-in-out infinite;
  vertical-align:middle; line-height:1;
}

/* Hero photo swipe hint */
.profile-hero-img {
  touch-action: pan-y pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
}

/* intl-tel-input style override (if loaded) */
.iti { width: 100%; }
.iti__flag-container { pointer-events: auto; }

/* ============================================================
   Responsive & Touch Audit (v46)
   ============================================================ */

/* Ensure minimum 44px touch targets (Apple HIG / WCAG 2.5.8) */
button, a, [role="button"], input[type="checkbox"], input[type="radio"] {
  min-height: 44px;
  min-width: 44px;
}
/* Exception: tiny inline badges/pills shouldn't grow */
.popular-badge, .recommended-badge {
  min-height: auto;
  min-width: auto;
}

/* Prevent horizontal overflow on mobile */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}
img, video {
  max-width: 100%;
  height: auto;
}

/* Better text sizing on small screens */
@media (max-width: 360px) {
  #root { font-size: 13px; }
}

/* Landscape phone: limit hero image height */
@media (max-height: 500px) and (orientation: landscape) {
  img[style*="maxHeight"] {
    max-height: 300px !important;
  }
}

/* Momentum scrolling for all scrollable areas */
* {
  -webkit-overflow-scrolling: touch;
}

/* Input zoom prevention on iOS (font-size < 16px triggers zoom) */
input[type="text"], input[type="email"], input[type="tel"],
input[type="search"], textarea, select {
  font-size: 16px;
}