/**
 * CORRECTIONS AFFICHAGE MOBILE
 * Fixes pour le menu hamburger et le switcher de langue
 */

/* ========== FIX MENU HAMBURGER ========== */
/* Déplacer le menu hamburger plus à gauche pour le rendre visible */
@media (max-width: 921px) {
    /* Menu hamburger Astra */
    .ast-mobile-menu-buttons,
    .ast-button-wrap,
    .menu-toggle {
        margin-left: 15px !important;
        padding-left: 0 !important;
    }
    
    .menu-toggle {
        margin-right: auto !important;
    }
    
    /* S'assurer que le header a assez d'espace */
    .main-header-bar {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* Logo - laisser de l'espace pour le hamburger */
    .site-branding {
        margin-left: 0 !important;
    }
}

/* ========== FIX LANGUAGE SWITCHER ========== */
/* Repositionner le switcher de langue sur mobile */
@media (max-width: 768px) {
    .lang-switcher {
        /* Position en haut mais avec plus d'espace */
        bottom: auto !important;
        top: 120px !important; /* Plus d'espace sous le header */
        right: auto !important;
        left: 50% !important;
        transform: translateX(-50%) !important; /* Centré horizontalement */
        
        /* S'assurer qu'il reste visible */
        z-index: 9999 !important;
        position: fixed !important;
        
        /* Ajuster la taille sur mobile */
        padding: 4px !important;
        gap: 3px !important;
        
        /* Légèrement transparent pour ne pas trop gêner */
        background: rgba(255, 255, 255, 0.98) !important;
    }
    
    .lang-switcher a {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
}

/* Pour les très petits écrans */
@media (max-width: 480px) {
    .lang-switcher {
        top: 110px !important;
    }
}

/* Si le header est plus haut sur certains mobiles */
@media (max-width: 768px) and (max-height: 700px) {
    .lang-switcher {
        top: 100px !important;
    }
}

/* ========== FIX HERO SECTION MOBILE ========== */
/* S'assurer que le contenu hero est bien visible avec le switcher */
@media (max-width: 768px) {
    .hero-section,
    .contact-hero {
        padding-top: 140px !important; /* Plus d'espace en haut pour le switcher */
    }
    
    .hero-content h1,
    .contact-hero h1 {
        font-size: 2rem !important;
    }
    
    .hero-content p,
    .contact-hero p {
        font-size: 1rem !important;
    }
}

/* ========== FIX HEADER MOBILE ========== */
/* S'assurer que le header est bien visible et fonctionnel */
@media (max-width: 921px) {
    #masthead {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 9998 !important;
        background: #ffffff !important;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    }
    
    /* Compenser le header fixe */
    body {
        padding-top: 70px !important;
    }
}

/* ========== AMÉLIORATION VISIBILITÉ MENU HAMBURGER ========== */
/* Rendre le menu hamburger plus visible avec un fond */
@media (max-width: 921px) {
    .menu-toggle {
        background: rgba(26, 26, 46, 0.1) !important;
        border-radius: 8px !important;
        padding: 8px 12px !important;
        transition: all 0.3s ease !important;
    }
    
    .menu-toggle:hover,
    .menu-toggle:focus {
        background: rgba(26, 26, 46, 0.2) !important;
    }
    
    /* Icônes du hamburger bien visibles */
    .menu-toggle .ast-icon,
    .menu-toggle .ast-mobile-svg {
        color: #1a1a2e !important;
        fill: #1a1a2e !important;
    }
}

/* ========== FIX RESPONSIVE HOMEPAGE BUTTON ========== */
@media (max-width: 768px) {
    .cta-button,
    .btn-discover {
        padding: 12px 30px !important;
        font-size: 13px !important;
    }
}