/* IndiaSpeedPosts — Custom CSS (supplements Tailwind CDN) */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #2563eb; }

/* Tracking input — force uppercase */
#trackingInput, #reTrackInput { text-transform: uppercase; letter-spacing: 0.08em; }

/* Leaflet map container */
#trackingMap {
  width: 100%;
  height: 380px;
  z-index: 1;
}

/* Leaflet popup styling */
.leaflet-popup-content-wrapper {
  border-radius: 12px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
  font-size: 13px !important;
  font-family: inherit !important;
}
.leaflet-popup-content { margin: 12px 16px !important; line-height: 1.5 !important; }

/* Status badge pulse (for "Out for Delivery") */
.status-pulse {
  animation: statusPulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes statusPulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

/* Timeline connector */
.timeline-dot-active {
  box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.15);
}

/* Hero gradient overlay */
.hero-pattern {
  background-image:
    radial-gradient(circle at 20% 50%, rgba(255,255,255,0.05) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,0.05) 0%, transparent 50%);
}

/* Feature card hover — only animate transform (composited, GPU-accelerated) */
.feature-card {
  transition: transform 0.2s ease;
  will-change: transform;
}
.feature-card:hover {
  transform: translateY(-3px);
}

/* Table alternating rows */
tbody tr:hover { background-color: #eff6ff !important; }

/* AdSense ad placeholder spacing */
.adsense-container { margin: 24px 0; text-align: center; overflow: hidden; }

/* Print styles */
@media print {
  header, footer, nav, button, .adsense-container { display: none !important; }
  #trackingMap { height: 200px !important; }
  body { background: white !important; }
}

/* Mobile optimizations */
@media (max-width: 640px) {
  #trackingMap { height: 280px; }
  .hero-form-container { padding: 1.25rem; }
}

/* Focus visible for accessibility */
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}