/* Mobile-Specific Fixes for tamraparniayurveda.com */

/* Ensure viewport is properly set */
@viewport {
    width: device-width;
    initial-scale: 1.0;
    maximum-scale: 5.0;
    user-scalable: yes;
}

/* Fix mobile touch targets */
.btn, .nav-link, .dropdown-item {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Fix mobile font sizes */
body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

/* Fix mobile scrolling */
html, body {
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* Fix mobile form inputs */
input, textarea, select {
    font-size: 16px; /* Prevents zoom on iOS */
    -webkit-appearance: none;
    border-radius: 0;
}

/* Fix mobile navigation */
.navbar-toggler {
    border: none;
    padding: 0.5rem;
}

.navbar-collapse {
    max-height: 80vh;
    overflow-y: auto;
}

/* Fix mobile cards */
.card {
    margin-bottom: 1rem;
}

.card-img-top {
    height: 200px;
    object-fit: cover;
}

/* Fix mobile buttons */
@media (max-width: 767.98px) {
    .btn {
        padding: 0.75rem 1rem;
        font-size: 1rem;
        border-radius: 0.5rem;
    }
    
    .btn-sm {
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
    }
    
    .btn-lg {
        padding: 1rem 1.5rem;
        font-size: 1.125rem;
    }
}

/* Fix mobile hero section */
@media (max-width: 767.98px) {
    .hero-section {
        padding: 2rem 1rem;
        text-align: center;
    }
    
    .hero-section h1 {
        font-size: 2rem;
        line-height: 1.2;
    }
    
    .hero-section p {
        font-size: 1rem;
        line-height: 1.5;
    }
}

/* Fix mobile tables */
@media (max-width: 767.98px) {
    .table-responsive {
        border: none;
    }
    
    .table {
        font-size: 0.875rem;
    }
    
    .table th,
    .table td {
        padding: 0.5rem 0.25rem;
        vertical-align: middle;
    }
}

/* Fix mobile forms */
@media (max-width: 767.98px) {
    .form-control,
    .form-select {
        font-size: 1rem;
        padding: 0.75rem;
        border-radius: 0.5rem;
    }
    
    .form-label {
        font-size: 1rem;
        font-weight: 600;
    }
}

/* Fix mobile modals */
@media (max-width: 767.98px) {
    .modal-dialog {
        margin: 1rem;
        max-width: calc(100% - 2rem);
    }
    
    .modal-content {
        border-radius: 1rem;
    }
    
    .modal-header,
    .modal-body,
    .modal-footer {
        padding: 1rem;
    }
}

/* Fix mobile alerts */
@media (max-width: 767.98px) {
    .alert {
        padding: 1rem;
        font-size: 1rem;
        border-radius: 0.5rem;
    }
}

/* Fix mobile search */
@media (max-width: 767.98px) {
    .search-container .form-control {
        font-size: 1rem;
        padding: 0.75rem 1rem;
    }
}

/* Fix mobile footer */
@media (max-width: 767.98px) {
    footer {
        padding: 2rem 0;
    }
    
    footer h5 {
        font-size: 1.25rem;
        margin-bottom: 1rem;
    }
    
    footer p,
    footer a {
        font-size: 1rem;
        line-height: 1.5;
    }
}

/* Fix mobile WhatsApp button */
@media (max-width: 767.98px) {
    .whatsapp-float {
        bottom: 80px;
        right: 20px;
        width: 56px;
        height: 56px;
        font-size: 1.5rem;
    }
}

/* Fix mobile chat widget */
@media (max-width: 767.98px) {
    .chat-widget {
        bottom: 20px;
        right: 20px;
    }
    
    .chat-button {
        width: 56px;
        height: 56px;
        font-size: 1.25rem;
    }
    
    .chat-box {
        width: calc(100vw - 40px);
        height: 70vh;
        right: 20px;
        left: 20px;
        bottom: 80px;
    }
}

/* Accessibility improvements */
@media (max-width: 767.98px) {
    /* Ensure text is readable */
    body {
        font-size: 1rem;
        line-height: 1.6;
    }
    
    /* Ensure links are tappable */
    a {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
    
    /* Ensure buttons are tappable */
    button {
        min-height: 44px;
        min-width: 44px;
    }
}

/* Performance optimizations for mobile */
@media (max-width: 767.98px) {
    /* Reduce animations on mobile */
    * {
        animation-duration: 0.2s !important;
        transition-duration: 0.2s !important;
    }
    
    /* Optimize images */
    img {
        max-width: 100%;
        height: auto;
    }
    
    /* Optimize fonts */
    body {
        font-display: swap;
    }
}