/* =========================
   FORÇAGE COMPLET DU CHATBOT DANS ELEMENTOR
   ========================= */

/* Conteneur principal */
#chatbot-declic-full-container {
    position: relative !important;
    width: 100% !important;
    max-width: 800px !important; /* LARGEUR MAXIMALE - MODIFIABLE */
    height: 600px !important; /* HAUTEUR PRINCIPALE - MODIFIABLE */
    display: flex !important;
    flex-direction: column !important;
    background: transparent !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 20px !important;
    margin: 0 auto !important; /* CENTRAGE HORIZONTAL */
    z-index: 1 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    font-family: 'Indivisible', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Écran d'accueil - AFFICHÉ PAR DÉFAUT */
#chatbot-declic-full-container .chatbot-full-welcome {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 40px 20px !important;
    text-align: center !important;
    background: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    margin-bottom: 15px !important;
}



/* Écran d'accueil - CACHÉ quand il y a des messages */
#chatbot-declic-full-container .chatbot-full-welcome[style*="display: none"],
#chatbot-declic-full-container .chatbot-full-welcome.hidden {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Message de bienvenue principal */
#chatbot-declic-full-container .chatbot-full-welcome-text {
    font-size: 45px !important; /* TAILLE TEXTE DESKTOP - MODIFIABLE */
    font-weight: 180 !important;
    color: #333 !important;
    line-height: 1.4 !important;
    max-width: 600px !important;
    margin: 0 auto !important;
    margin-bottom: 110px !important; /* ESPACEMENT DESKTOP - MODIFIABLE */
}

/* Nouveau sous-titre */
#chatbot-declic-full-container .chatbot-full-welcome-subtitle {
    font-size: 13px !important; /* TAILLE SOUS-TITRE DESKTOP - MODIFIABLE */
    font-weight: 500 !important;
    color: #333 !important;
    line-height: 2.5 !important;
    max-width: 500px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

/* Zone des messages - CACHÉE PAR DÉFAUT */
#chatbot-declic-full-container .chatbot-full-messages {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Zone des messages - AFFICHÉE quand il y a des messages */
#chatbot-declic-full-container .chatbot-full-messages[style*="display: block"],
#chatbot-declic-full-container .chatbot-full-messages[style*="display:flex"],
#chatbot-declic-full-container .chatbot-full-messages.has-messages {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 1 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 20px !important; /* PADDING ZONE MESSAGES DESKTOP - MODIFIABLE */
    margin-bottom: 15px !important;
    flex-direction: column !important;
    font-size: 1em !important;
    background: #fff !important;
    border-radius: 50px !important; /* BORDURE ZONE MESSAGES DESKTOP - MODIFIABLE */
    border: 1px solid #e0e0e0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Messages utilisateur */
#chatbot-declic-full-container .chatbot-full-messages .chatbot-user-msg {
    background: #f5f5f5 !important;
    color: #000000 !important;
    text-align: right !important;
    align-self: flex-end !important;
    font-family: 'Indivisible', sans-serif !important;
    font-weight: 400 !important;
    font-size: 15px !important; /* TAILLE MESSAGES UTILISATEUR DESKTOP - MODIFIABLE */
    border: none !important;
    border-radius: 18px !important;
    padding: 12px 16px !important;
    margin-bottom: 8px !important;
    max-width: 85% !important;
    word-break: break-word !important;
}

/* Messages du bot */
#chatbot-declic-full-container .chatbot-full-messages .chatbot-bot-msg {
    background: transparent !important;
    color: #000000 !important;
    text-align: left !important;
    align-self: flex-start !important;
    font-family: 'Indivisible', sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important; /* TAILLE MESSAGES BOT DESKTOP - MODIFIABLE */
    border: none !important;
    padding: 8px 0 !important;
    margin-bottom: 8px !important;
    max-width: 100% !important;
    line-height: 1.4 !important;
    word-break: break-word !important;
}

/* Zone de saisie */
#chatbot-declic-full-container .chatbot-full-input-container {
    padding: 15px !important; /* PADDING ZONE SAISIE DESKTOP - MODIFIABLE */
    margin: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    flex-shrink: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#chatbot-declic-full-container .chatbot-full-form {
    display: flex !important;
    gap: 0 !important;
    padding: 7px !important;
    align-items: center !important;
    background: #fff !important;
    border-radius: 25px !important;
    border: 1px solid #e0e0e0 !important;
}

#chatbot-declic-full-container .chatbot-full-input {
    flex: 1 !important;
    border: none !important;
    padding: 7px 10px !important;
    font-size: 14px !important; /* TAILLE INPUT DESKTOP - MODIFIABLE */
    line-height: 1.4 !important;
    background: transparent !important;
    color: #333 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    transition: all 0.2s !important;
    border-radius: 0 !important;
    outline: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

#chatbot-declic-full-container .chatbot-full-input:focus {
    outline: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

#chatbot-declic-full-container .chatbot-full-input::placeholder {
    color: #333333 !important;
    font-weight: 300 !important;
    font-size: 13px !important;
}

/* Bouton d'envoi */
#chatbot-declic-full-container .chatbot-full-send-btn {
    border-radius: 50% !important;
    border: none !important;
    background: #000 !important;
    color: #fff !important;
    padding: 8px !important;
    font-size: 0 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    min-width: 32px !important;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    transition: all 0.2s !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

#chatbot-declic-full-container .chatbot-full-send-btn:hover {
    background: #333 !important;
    transform: scale(1.05) !important;
}

#chatbot-declic-full-container .chatbot-full-send-btn::before {
    content: '' !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-bottom: 6px solid #fff !important;
    transform: translateY(-1px) !important;
}

/* Bouton poubelle - CACHÉ PAR DÉFAUT */
#chatbot-declic-full-container .chatbot-full-actions {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Bouton poubelle - AFFICHÉ quand il y a des messages */
#chatbot-declic-full-container .chatbot-full-actions[style*="display: block"],
#chatbot-declic-full-container .chatbot-full-actions[style*="display:flex"],
#chatbot-declic-full-container .chatbot-full-actions.show {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    justify-content: flex-end !important;
    padding: 5px 0 0 0 !important;
    margin: 0 !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
}

#chatbot-declic-full-container .chatbot-full-clear-btn {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    font-size: 0 !important;
    cursor: pointer !important;
    padding: 8px !important;
    border-radius: 50% !important;
    opacity: 0.6 !important;
    transition: all 0.2s !important;
    color: #666 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 32px !important;
    width: 32px !important;
    height: 32px !important;
    position: relative !important;
}

#chatbot-declic-full-container .chatbot-full-clear-btn:hover {
    opacity: 1 !important;
    background: #f5f5f5 !important;
    transform: scale(1.05) !important;
}

#chatbot-declic-full-container .chatbot-full-clear-btn::before {
    content: '🗑️' !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

/* Indicateur de chargement */
#chatbot-declic-full-container .chatbot-full-loading {
    display: none !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 20px 0 !important;
}

#chatbot-declic-full-container .chatbot-full-loading .dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #2563eb !important;
    animation: chatbot-dot-bounce 1.4s ease-in-out infinite both !important;
}

#chatbot-declic-full-container .chatbot-full-loading .dot:nth-child(1) {
    animation-delay: -0.32s !important;
}

#chatbot-declic-full-container .chatbot-full-loading .dot:nth-child(2) {
    animation-delay: -0.16s !important;
}

#chatbot-declic-full-container .chatbot-full-loading .dot:nth-child(3) {
    animation-delay: 0s !important;
}

/* Message de loading dans la zone des messages */
#chatbot-declic-full-container .chatbot-loading-message {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 20px !important;
    margin: 10px 0 !important;
}

#chatbot-declic-full-container .chatbot-loading-message .chatbot-full-loading {
    display: flex !important;
}

/* Animation pour les points de loading */
@keyframes chatbot-dot-bounce {
    0%, 80%, 100% { 
        transform: translateY(0); 
        opacity: 0.5; 
    }
    40% { 
        transform: translateY(-7px); 
        opacity: 1; 
    }
}

@-webkit-keyframes chatbot-dot-bounce {
    0%, 80%, 100% { 
        transform: translateY(0); 
        opacity: 0.5; 
    }
    40% { 
        transform: translateY(-7px); 
        opacity: 1; 
    }
}

@-moz-keyframes chatbot-dot-bounce {
    0%, 80%, 100% { 
        transform: translateY(0); 
        opacity: 0.5; 
    }
    40% { 
        transform: translateY(-7px); 
        opacity: 1; 
    }
}

/* =========================
   RESPONSIVE - MOBILE (≤800px)
   ========================= */
@media (max-width: 800px) {
    /* CONTENEUR MOBILE - MODIFIABLE */
    #chatbot-declic-full-container {
        height: 500px !important; /* HAUTEUR MOBILE - MODIFIABLE */
        max-width: 95% !important; /* LARGEUR MAXIMALE MOBILE - MODIFIABLE */
        margin: 0 auto !important; /* CENTRAGE HORIZONTAL MOBILE */
        padding: 15px !important; /* PADDING MOBILE - MODIFIABLE */
    }
    

    
    /* TEXTE PRINCIPAL MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-welcome-text {
        font-size: 28px !important; /* TAILLE TEXTE MOBILE - MODIFIABLE */
        padding: 0 15px !important;
        margin-bottom: 80px !important; /* ESPACEMENT MOBILE - MODIFIABLE */
    }
    
    /* SOUS-TITRE MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-welcome-subtitle {
        font-size: 14px !important; /* TAILLE SOUS-TITRE MOBILE - MODIFIABLE */
        padding: 0 15px !important;
    }
    
    /* ZONE DES MESSAGES MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-messages[style*="display: block"],
    #chatbot-declic-full-container .chatbot-full-messages[style*="display:flex"],
    #chatbot-declic-full-container .chatbot-full-messages.has-messages {
        flex: 1 !important;
        min-height: 0 !important;
        height: calc(100% - 80px) !important; /* HAUTEUR ZONE MESSAGES MOBILE - MODIFIABLE */
        max-height: calc(100% - 80px) !important;
        padding: 15px !important; /* PADDING ZONE MESSAGES MOBILE - MODIFIABLE */
    margin-bottom: 0 !important;
        border-radius: 0 !important; /* SUPPRIME BORDURE ZONE MESSAGES MOBILE */
        border: none !important; /* SUPPRIME BORDURE ZONE MESSAGES MOBILE */
    }
    
    /* MESSAGES MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-messages .chatbot-user-msg,
    #chatbot-declic-full-container .chatbot-full-messages .chatbot-bot-msg {
        max-width: 90% !important;
        padding: 10px 14px !important;
        font-size: 14px !important; /* TAILLE MESSAGES MOBILE - MODIFIABLE */
    }
    
    /* INPUT MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-input {
        padding: 8px 12px !important;
        font-size: 16px !important; /* TAILLE INPUT MOBILE - MODIFIABLE */
    }
    
    /* ZONE DE SAISIE MOBILE - MODIFIABLE */
    #chatbot-declic-full-container .chatbot-full-input-container {
        flex-shrink: 0 !important;
        padding: 10px 15px !important; /* PADDING ZONE SAISIE MOBILE - MODIFIABLE */
    }
    
    /* BOUTON POUBELLE MOBILE - POSITION GAUCHE */
    #chatbot-declic-full-container .chatbot-full-actions[style*="display: block"],
    #chatbot-declic-full-container .chatbot-full-actions[style*="display:flex"],
    #chatbot-declic-full-container .chatbot-full-actions.show {
        justify-content: flex-start !important; /* Change de flex-end à flex-start */
        left: 10px !important; /* Position à gauche */
        right: auto !important; /* Supprime la position à droite */
    }
}