/* =========================================================================
   Arogya Nasha Mukti Sansthan - Mobile Phone Friendly Enhancements
   Clean, simple, non-complex, high-speed mobile UX
   ========================================================================= */

/* Prevent horizontal jitter on small viewports */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  -webkit-text-size-adjust: 100%;
}

/* Ensure minimum touch target heights and clear spacing on phones */
@media (max-width: 768px) {
  /* Prevent inputs and selects from zooming in on iOS when tapped */
  input, select, textarea {
    font-size: 16px !important;
  }

  /* Make sure all primary buttons on mobile are large and easy to tap */
  button, a {
    touch-action: manipulation;
  }

  /* Optimize header title layout on small screens */
  h1 {
    word-break: break-word;
  }

  /* Prevent bottom widgets from overlapping with our mobile bottom bar */
  body {
    padding-bottom: 74px !important;
  }

  /* Hide redundant desktop-floating widgets on small mobile screens to keep screen clean */
  .fixed.bottom-6.right-6.z-50 {
    display: none !important;
  }

  /* Position AI Counselor floating trigger cleanly above the bottom action bar on phones */
  .fixed.bottom-24.right-5.z-40 {
    bottom: 84px !important;
    right: 14px !important;
  }

  /* Full-width responsive modals on mobile */
  .fixed.bottom-4.right-4.z-50 {
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
    margin: 0 !important;
  }
}

/* ---------------------------------------------------------
   Fixed Mobile Bottom Action Bar (Simple, Direct, 1-Tap)
   Visible only on phones & tablets (hidden on desktop screens)
   --------------------------------------------------------- */
.arogya-mobile-bar {
  display: none;
}

@media (max-width: 768px) {
  .arogya-mobile-bar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 64px;
    background: #08284c;
    border-top: 2px solid #d97706;
    box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.35);
    z-index: 99999;
    align-items: center;
    justify-content: space-around;
    padding: 6px 8px env(safe-area-inset-bottom, 6px);
  }

  .arogya-mobile-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-decoration: none;
    font-family: system-ui, -apple-system, sans-serif;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 8px;
    margin: 0 3px;
    padding: 4px 6px;
    transition: all 0.15s ease;
  }

  .arogya-mobile-btn:active {
    transform: scale(0.96);
  }

  /* Call Helpline Button */
  .arogya-btn-call {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(217, 119, 6, 0.4);
  }

  /* WhatsApp Button */
  .arogya-btn-whatsapp {
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.4);
  }

  /* Book Appointment / Admission Button */
  .arogya-btn-book {
    background: linear-gradient(135deg, #0284c7, #0369a1);
    color: #ffffff !important;
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4);
  }

  .arogya-btn-icon {
    width: 20px;
    height: 20px;
    margin-bottom: 2px;
    fill: currentColor;
  }
}