/* Mobile Chatbot Size Fix - More Natural Proportions */

/* Better mobile proportions - less overwhelming */
@media (max-width: 768px) {
    #ai-chat-container, .ai-chat-widget {
        width: calc(100vw - 30px) !important;
        height: 450px !important;
        max-height: 50vh !important;
        right: 15px !important;
        left: 15px !important;
        bottom: 80px !important;
    }
    
    /* Adjust messages area for smaller mobile window */
    #ai-chat-messages, .ai-chat-messages {
        min-height: 280px !important;
        max-height: 280px !important;
        padding: 15px !important;
    }
    
    /* Compact header on mobile */
    .ai-chat-header {
        padding: 12px 15px !important;
    }
    
    .ai-chat-header h6 {
        font-size: 15px !important;
    }
    
    .ai-chat-header p {
        font-size: 11px !important;
    }
    
    /* More compact input area on mobile */
    .ai-chat-input-container {
        padding: 15px !important;
        gap: 10px !important;
    }
    
    #ai-chat-input, .ai-chat-input-container input {
        padding: 10px 15px !important;
        font-size: 13px !important;
    }
    
    #ai-chat-send, .ai-chat-input-container button {
        padding: 10px 18px !important;
        font-size: 13px !important;
        min-width: 70px !important;
    }
}

/* Even smaller for very small screens */
@media (max-width: 480px) {
    #ai-chat-container, .ai-chat-widget {
        height: 400px !important;
        max-height: 45vh !important;
        bottom: 75px !important;
    }
    
    #ai-chat-messages, .ai-chat-messages {
        min-height: 240px !important;
        max-height: 240px !important;
    }
    
    /* Make AI Chat button smaller on very small screens */
    #ai-chat-toggle, .ai-chat-toggle {
        min-width: 90px !important;
        font-size: 12px !important;
        padding: 8px 14px !important;
        height: 40px !important;
    }
}

/* Landscape orientation adjustments */
@media (max-width: 768px) and (orientation: landscape) {
    #ai-chat-container, .ai-chat-widget {
        height: 350px !important;
        max-height: 60vh !important;
        bottom: 70px !important;
    }
    
    #ai-chat-messages, .ai-chat-messages {
        min-height: 200px !important;
        max-height: 200px !important;
    }
}