/* Mobile UX Enhanced Styles */

@media (max-width: 768px) {
    /* Larger touch targets */
    .btn {
        min-height: 44px;
        min-width: 44px;
    }

    .nav-link {
        padding: 1rem !important;
    }

    /* Better spacing on mobile */
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Mobile-friendly cards */
    .card {
        margin-bottom: 1rem;
    }

    /* Sticky footer on mobile */
    body {
        padding-bottom: 60px;
    }

    /* Mobile navbar improvements */
    .navbar-toggler {
        padding: 0.5rem;
        font-size: 1.5rem;
    }

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

/* Mobile-specific interactions */
@media (hover: none) {
    .btn:hover {
        transform: none;
    }

    .card:hover {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    }
}