/* Mobile-specific fixes and improvements */

/* Prevent horizontal scrolling */
* {
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden;
    width: 100%;
}

/* Touch-friendly interactions */
@media (max-width: 768px) {
    /* Increase touch targets */
    .btn, .nav-link, .social-link {
        min-height: 44px;
        min-width: 44px;
    }

    /* Improve text readability */
    body {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    /* Smooth scrolling for mobile */
    html {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }

    /* Fix for iOS Safari viewport issues */
    .hero-section {
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }

    /* Prevent zoom on input focus */
    input, select, textarea {
        font-size: 16px;
    }

    /* Better button spacing */
    .hero-buttons .btn {
        margin-bottom: 0.5rem;
    }

    .hero-buttons .btn:last-child {
        margin-bottom: 0;
    }

    /* Improve stat cards layout */
    .dashboard-stats .stat-card {
        flex-direction: row;
        justify-content: flex-start;
        text-align: left;
        padding: 1rem;
    }

    .dashboard-stats .stat-card > div {
        text-align: left;
        align-items: flex-start;
    }

    /* Better hero content spacing */
    .hero-content {
        padding: 1rem;
        margin: 0 auto;
        max-width: 100%;
    }

    /* Improve dashboard preview */
    .dashboard-preview {
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* Better navbar collapse */
    .navbar-collapse {
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(10px);
        border-radius: 10px;
        margin-top: 0.5rem;
        padding: 1rem;
    }

    /* Improve hero stats layout */
    .hero-stats {
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(10px);
        border-radius: 15px;
        padding: 1rem;
        margin: 2rem 0;
    }

    /* Better button icons */
    .btn i {
        vertical-align: middle;
    }

    /* Improve text contrast */
    .hero-title, .hero-subtitle {
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    }

    /* Fix for very small screens */
    @media (max-width: 360px) {
        .hero-title {
            font-size: 1.4rem;
        }

        .hero-subtitle {
            font-size: 0.8rem;
        }

        .stat-number {
            font-size: 1.2rem;
        }

        .stat-label {
            font-size: 0.6rem;
        }

        .hero-buttons .btn {
            padding: 8px 12px;
            font-size: 0.85rem;
        }
    }
}

/* Landscape orientation fixes */
@media (max-width: 768px) and (orientation: landscape) {
    .hero-section {
        padding-top: 100px;
        padding-bottom: 1rem;
        min-height: 100vh;
    }

    .hero-content {
        padding: 0.5rem;
    }

    .hero-title {
        font-size: 1.6rem;
        margin-bottom: 0.5rem;
    }

    .hero-subtitle {
        font-size: 0.9rem;
        margin-bottom: 1rem;
    }

    .hero-stats {
        margin-bottom: 1rem;
        padding: 0.5rem;
    }

    .hero-buttons {
        gap: 0.5rem;
    }

    .dashboard-preview {
        margin-top: 1rem;
    }
}

/* High DPI displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .hero-title, .hero-subtitle {
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Dark mode support for mobile */
@media (prefers-color-scheme: dark) and (max-width: 768px) {
    .navbar-collapse {
        background: rgba(0, 0, 0, 0.9);
        color: white;
    }

    .hero-stats {
        background: rgba(0, 0, 0, 0.3);
    }
}

/* Accessibility improvements */
@media (max-width: 768px) {
    /* Focus indicators */
    .btn:focus, .nav-link:focus {
        outline: 2px solid #fff;
        outline-offset: 2px;
    }

    /* Reduced motion support */
    @media (prefers-reduced-motion: reduce) {
        * {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
        }
    }
}

/* Print styles for mobile */
@media print {
    .hero-section {
        background: white !important;
        color: black !important;
        padding: 1rem !important;
    }

    .hero-buttons, .bg-icon {
        display: none !important;
    }
}