/* ========================================
   MOBILE FOOTER & NAVIGATION FIXES
   ======================================== */

/* Mobile Footer Optimizations */
@media (max-width: 768px) {
    /* Footer Layout - Navigation et Légal sur même ligne */
    .footer-bottom {
        flex-direction: column !important;
        text-align: center !important;
        gap: 1rem !important;
        padding: 1rem 0 !important;
    }
    
    /* Navigation et Legal sur même ligne */
    .footer-legal {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 1rem !important;
        flex-wrap: wrap !important;
        margin-top: 0 !important;
    }
    
    .footer-legal a {
        font-size: 0.8rem !important;
        white-space: nowrap !important;
    }
    
    .footer-legal span {
        display: none !important; /* Cacher le séparateur sur mobile */
    }
    
    /* Social Links - Enlever cadres ronds */
    .social-links a {
        border-radius: 0 !important;
        width: 36px !important;
        height: 36px !important;
        background: rgba(255, 255, 255, 0.1) !important;
    }
    
    .social-links a:hover {
        background: var(--mind-primary) !important;
        transform: translateY(-2px) !important;
    }
    
    /* Facebook et Instagram - carrés */
    .social-links a[href*="facebook"],
    .social-links a[href*="instagram"] {
        border-radius: 4px !important;
    }
    
    /* Footer Content Optimization */
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
        text-align: center !important;
    }
    
    .footer-brand {
        padding-right: 0 !important;
    }
    
    .footer-links {
        text-align: center !important;
    }
    
    .footer-links h4 {
        font-size: 1rem !important;
        margin-bottom: 1rem !important;
    }
    
    .footer-links ul {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 0.5rem !important;
    }
    
    .footer-links li {
        margin-bottom: 0 !important;
    }
    
    .footer-links a {
        font-size: 0.85rem !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    .footer-links a:hover {
        background: rgba(255, 255, 255, 0.15) !important;
        transform: none !important;
        color: white !important;
    }
    
    /* Newsletter Form */
    .newsletter-form {
        max-width: 300px !important;
        margin: 1.5rem auto 0 !important;
    }
    
    .newsletter-form input[type="email"] {
        font-size: 0.85rem !important;
        padding: 0.6rem 0.8rem !important;
    }
    
    .newsletter-form .btn-newsletter {
        font-size: 0.85rem !important;
        padding: 0.6rem 1rem !important;
    }
    
    /* Footer Padding */
    .footer {
        padding: 2rem 0 0 !important;
    }
}

/* Small Mobile (≤480px) */
@media (max-width: 480px) {
    .footer {
        padding: 1.5rem 0 0 !important;
    }
    
    .footer-content {
        gap: 1.5rem !important;
    }
    
    .footer-legal {
        font-size: 0.75rem !important;
        gap: 0.5rem !important;
    }
    
    .footer-legal a {
        font-size: 0.75rem !important;
        padding: 0.2rem 0.3rem !important;
    }
    
    .social-links a {
        width: 32px !important;
        height: 32px !important;
        font-size: 0.9rem !important;
    }
    
    .footer-links a {
        font-size: 0.8rem !important;
        padding: 0.25rem 0.4rem !important;
    }
    
    .newsletter-form {
        max-width: 250px !important;
    }
    
    .newsletter-form input[type="email"] {
        font-size: 0.8rem !important;
        padding: 0.5rem 0.7rem !important;
    }
    
    .newsletter-form .btn-newsletter {
        font-size: 0.8rem !important;
        padding: 0.5rem 0.8rem !important;
    }
}

/* ========================================
   NAVIGATION FIXES FOR ALL PAGES
   ======================================== */

/* Fix pour tous les liens de navigation sur mobile */
@media (max-width: 768px) {
    /* Navigation principale */
    .navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        background: white !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
        z-index: 9999 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(-20px) !important;
        transition: all 0.3s ease !important;
        max-height: calc(100vh - 60px) !important;
        overflow-y: auto !important;
        padding: 1rem !important;
    }
    
    .navbar-nav.active {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
    }
    
    .navbar-nav li {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }
    
    .navbar-nav a {
        display: block !important;
        padding: 0.8rem 1rem !important;
        color: #333 !important;
        text-decoration: none !important;
        border-bottom: 1px solid #f0f0f0 !important;
        font-size: 0.9rem !important;
        transition: background-color 0.2s ease !important;
    }
    
    .navbar-nav a:hover {
        background: #f8f9fa !important;
        color: var(--primary-color) !important;
    }
    
    /* Menu toggle button */
    .navbar-toggle {
        display: block !important;
        position: fixed !important;
        top: 15px !important;
        right: 15px !important;
        z-index: 10000 !important;
        background: var(--primary-color) !important;
        color: white !important;
        border: none !important;
        padding: 0.5rem !important;
        border-radius: 4px !important;
        cursor: pointer !important;
        font-size: 1.2rem !important;
    }
    
    /* Overlay pour menu mobile */
    .navbar-overlay {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: 9998 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transition: all 0.3s ease !important;
    }
    
    .navbar-overlay.active {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Footer Navigation Links */
    .footer-links a {
        display: inline-block !important;
        color: rgba(255, 255, 255, 0.8) !important;
        text-decoration: none !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        transition: all 0.2s ease !important;
        font-size: 0.8rem !important;
    }
    
    .footer-links a:hover {
        background: rgba(255, 255, 255, 0.15) !important;
        color: white !important;
        transform: none !important;
    }
    
    /* Legal Links */
    .footer-legal a {
        display: inline-block !important;
        color: rgba(255, 255, 255, 0.8) !important;
        text-decoration: none !important;
        padding: 0.2rem 0.3rem !important;
        border-radius: 3px !important;
        transition: all 0.2s ease !important;
        font-size: 0.8rem !important;
    }
    
    .footer-legal a:hover {
        background: rgba(255, 255, 255, 0.1) !important;
        color: white !important;
    }
}

/* Fix pour les liens dans le contenu */
@media (max-width: 768px) {
    /* Tous les liens dans le contenu */
    a:not(.btn):not(.navbar-brand):not(.footer-logo):not(.social-links a) {
        color: var(--primary-color) !important;
        text-decoration: underline !important;
        text-decoration-thickness: 1px !important;
        text-underline-offset: 2px !important;
        transition: all 0.2s ease !important;
    }
    
    a:not(.btn):not(.navbar-brand):not(.footer-logo):not(.social-links a):hover {
        color: var(--primary-dark) !important;
        text-decoration-thickness: 2px !important;
    }
    
    /* Liens dans les cards */
    .card a {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.2rem 0.4rem !important;
        border-radius: 3px !important;
        background: rgba(var(--primary-color), 0.05) !important;
        transition: all 0.2s ease !important;
        font-size: 0.85rem !important;
    }
    
    .card a:hover {
        background: rgba(var(--primary-color), 0.1) !important;
        color: var(--primary-dark) !important;
        text-decoration: underline !important;
    }
    
    /* Liens dans les listes */
    ul li a {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: block !important;
        padding: 0.3rem 0 !important;
        border-radius: 3px !important;
        transition: all 0.2s ease !important;
        font-size: 0.85rem !important;
    }
    
    ul li a:hover {
        background: rgba(var(--primary-color), 0.05) !important;
        color: var(--primary-dark) !important;
    }
    
    /* Liens dans les boutons */
    .btn-link {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        background: none !important;
        border: 1px solid var(--primary-color) !important;
        padding: 0.3rem 0.6rem !important;
        border-radius: 4px !important;
        font-size: 0.8rem !important;
        transition: all 0.2s ease !important;
    }
    
    .btn-link:hover {
        background: var(--primary-color) !important;
        color: white !important;
    }
}

/* Fix pour la navigation dans les dashboards */
@media (max-width: 768px) {
    /* Sidebar Navigation */
    .sidebar-nav a {
        display: flex !important;
        align-items: center !important;
        padding: 0.6rem 0.8rem !important;
        color: #333 !important;
        text-decoration: none !important;
        border-bottom: 1px solid #f0f0f0 !important;
        transition: all 0.2s ease !important;
        font-size: 0.85rem !important;
    }
    
    .sidebar-nav a:hover {
        background: #f8f9fa !important;
        color: var(--primary-color) !important;
    }
    
    .sidebar-nav a.active {
        background: var(--gradient-primary) !important;
        color: white !important;
        border-bottom-color: transparent !important;
    }
    
    /* Dashboard Links */
    .dashboard-section a {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.2rem 0.4rem !important;
        border-radius: 3px !important;
        background: rgba(var(--primary-color), 0.05) !important;
        transition: all 0.2s ease !important;
        font-size: 0.8rem !important;
    }
    
    .dashboard-section a:hover {
        background: rgba(var(--primary-color), 0.1) !important;
        color: var(--primary-dark) !important;
        text-decoration: underline !important;
    }
}

/* Fix pour les liens spécifiques */
@media (max-width: 768px) {
    /* Lien "À propos" */
    a[href*="about"],
    a[href*="apropos"] {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(var(--primary-color), 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="about"]:hover,
    a[href*="apropos"]:hover {
        background: var(--primary-color) !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    /* Lien "Contact" */
    a[href*="contact"] {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(var(--primary-color), 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="contact"]:hover {
        background: var(--primary-color) !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    /* Lien "Se connecter" */
    a[href*="login"],
    a[href*="connexion"] {
        color: var(--primary-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(var(--primary-color), 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="login"]:hover,
    a[href*="connexion"]:hover {
        background: var(--primary-color) !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    /* Lien "S'inscrire" */
    a[href*="register"],
    a[href*="inscription"] {
        color: var(--success-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(var(--success-color), 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="register"]:hover,
    a[href*="inscription"]:hover {
        background: var(--success-color) !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    /* Lien "Admin" */
    a[href*="admin"] {
        color: var(--danger-color) !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(var(--danger-color), 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="admin"]:hover {
        background: var(--danger-color) !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    /* Liens des dashboards */
    a[href*="etudiant"] {
        color: #4f46e5 !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(79, 70, 229, 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="etudiant"]:hover {
        background: #4f46e5 !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    a[href*="migrant"] {
        color: #10b981 !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(16, 185, 129, 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="migrant"]:hover {
        background: #10b981 !important;
        color: white !important;
        text-decoration: none !important;
    }
    
    a[href*="intervenant"] {
        color: #f59e0b !important;
        text-decoration: none !important;
        display: inline-block !important;
        padding: 0.3rem 0.5rem !important;
        border-radius: 4px !important;
        background: rgba(245, 158, 11, 0.05) !important;
        transition: all 0.2s ease !important;
    }
    
    a[href*="intervenant"]:hover {
        background: #f59e0b !important;
        color: white !important;
        text-decoration: none !important;
    }
}

/* JavaScript pour la navigation mobile */
@media (max-width: 768px) {
    /* Menu hamburger pour navigation principale */
    .mobile-menu-toggle {
        display: block !important;
        position: fixed !important;
        top: 15px !important;
        right: 15px !important;
        z-index: 10000 !important;
        background: var(--primary-color) !important;
        color: white !important;
        border: none !important;
        padding: 0.5rem !important;
        border-radius: 4px !important;
        cursor: pointer !important;
        font-size: 1.2rem !important;
    }
    
    /* Cache le menu hamburger sur desktop */
    .navbar-nav {
        display: none !important;
    }
    
    /* Montre le menu mobile */
    .navbar-nav.mobile-menu {
        display: block !important;
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        right: 0 !important;
        background: white !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
        z-index: 9999 !important;
        max-height: calc(100vh - 60px) !important;
        overflow-y: auto !important;
        padding: 1rem !important;
    }
    
    /* Overlay */
    .mobile-menu-overlay {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: 9998 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transition: all 0.3s ease !important;
    }
    
    .mobile-menu-overlay.active {
        opacity: 1 !important;
        visibility: visible !important;
    }
}