/* 
 * CAROUSEL FORCE FIX - Mobile Layout Horizontal
 * Este arquivo FORÇA o layout horizontal em mobile
 * Adicione no HTML DEPOIS de todos os outros CSS:
 * <link rel="stylesheet" href="carousel-force-fix.css">
 */

/* FORÇA layout horizontal em TODAS as resoluções mobile */
@media (max-width: 768px) {
    .slide-content {
        flex-direction: row !important;
        display: flex !important;
        text-align: left !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    
    .slide-text {
        flex: 0 0 48% !important;
        max-width: 48% !important;
        width: 48% !important;
        text-align: left !important;
        order: 1 !important;
    }
    
    .slide-visual {
        flex: 0 0 48% !important;
        max-width: 48% !important;
        width: 48% !important;
        display: flex !important;
        order: 2 !important;
    }
    
    .slide-title {
        text-align: left !important;
    }
    
    .slide-description {
        text-align: left !important;
    }
}

@media (max-width: 480px) {
    .slide-content {
        flex-direction: row !important;
        display: flex !important;
        text-align: left !important;
    }
    
    .slide-text {
        flex: 0 0 46% !important;
        max-width: 46% !important;
        width: 46% !important;
        text-align: left !important;
    }
    
    .slide-visual {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        width: 50% !important;
        display: flex !important;
    }
}

/* REMOVE qualquer flex-direction: column que possa estar aplicado */
@media (max-width: 1024px) {
    .slide-content {
        flex-direction: row !important;
    }
}