/**
 * CSS MOBILE MINIMAL - Page d'accueil AptoraAI
 * =============================================
 * 
 * CSS minimal pour compléter les styles inline
 * Contient uniquement ce qui ne peut pas être fait en inline :
 * - Media queries (@media)
 * - Pseudo-classes (:hover, :active)
 * - Variables CSS (réutilisation)
 * 
 * Version: 3.0 - Minimaliste
 */

/* Variables CSS - Réutilisation de valeurs */
:root {
    --z-chatbot: 99999;
    --z-social: 998;
}

/* ============================================================================
   MOBILE - Media Queries uniquement
   ============================================================================ */
@media screen and (max-width: 768px) {
    /* Base - Essentiel uniquement */
    html, body {
        overflow-x: hidden;
        width: 100%;
        max-width: 100vw;
    }
    
    * {
        box-sizing: border-box;
    }
    
    /* Chatbot - Z-index et pointer-events (ne peut pas être inline) */
    #aptoraai-chatbot-widget {
        z-index: var(--z-chatbot) !important;
        pointer-events: auto !important;
        touch-action: manipulation !important;
    }
    
    #chatbot-trigger {
        pointer-events: auto !important;
        touch-action: manipulation !important;
        cursor: pointer !important;
    }
    
    /* Réseaux sociaux - Position et layout (JavaScript gère le reste) */
    #social-sidebar {
        z-index: var(--z-social) !important;
        pointer-events: auto !important;
    }
    
    /* Menu mobile - Masqué */
    #mobile-menu-btn,
    #mobile-menu {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Très petits écrans */
@media screen and (max-width: 480px) {
    /* Ajustements supplémentaires si nécessaire */
}