/* لمسات للجوال */
@media (max-width: 992px) {
    .app-container {
        height: 95vh;
    }
    
    .sidebar {
        width: 280px;
    }
}

@media (max-width: 768px) {
    body {
        padding: 10px;
    }
    
    .app-container {
        height: 97vh;
        border-radius: 15px;
    }
    
    .app-header {
        padding: 15px 20px;
    }
    
    .sidebar {
        position: absolute;
        left: -100%;
        top: 0;
        bottom: 0;
        z-index: 100;
        width: 300px;
        background: rgba(15, 23, 42, 0.95);
    }
    
    .sidebar.active {
        left: 0;
    }
    
    .brand-name {
        font-size: 1.5rem;
    }
    
    .btn span {
        display: none;
    }
    
    .btn i {
        margin-right: 0;
    }
    
    .chat-header {
        padding: 15px 20px;
    }
    
    .messages-area {
        padding: 20px;
    }
    
    .message {
        max-width: 85%;
        padding: 15px;
    }
    
    .input-area {
        padding: 20px;
    }
    
    .app-footer {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .app-container {
        height: 100vh;
        border-radius: 0;
        padding: 0;
    }
    
    .chat-header {
        padding: 12px 15px;
    }
    
    .chat-info h2 {
        font-size: 1.2rem;
    }
    
    .chat-actions {
        gap: 8px;
    }
    
    .messages-area {
        padding: 15px;
        gap: 15px;
    }
    
    .message {
        padding: 12px 15px;
        font-size: 0.95rem;
    }
    
    .input-area {
        padding: 15px;
    }
    
    .message-input {
        padding: 12px 18px;
        font-size: 1rem;
        min-height: 50px;
    }
    
    .send-btn {
        padding: 12px 18px;
        font-size: 1rem;
        height: 50px;
    }
}