/* 
 * Unraitte Logística - Frontend Styles
 * Los estilos principales están embebidos en el plugin para mayor compatibilidad
 */

/* Estilos adicionales específicos del frontend */
.unraitte-widget {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Mejoras para móvil */
@media (max-width: 480px) {
    .unraitte-widget {
        padding: 15px;
        margin: 5px;
    }
    
    .unraitte-form-row {
        flex-direction: column;
    }
    
    .unraitte-btn {
        width: 100%;
        margin-bottom: 10px;
    }
}

/* Animaciones suaves */
.unraitte-resultado,
.unraitte-error,
.unraitte-success {
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mejoras de accesibilidad */
.unraitte-btn:focus {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

.unraitte-form-group input:focus,
.unraitte-form-group select:focus,
.unraitte-form-group textarea:focus {
    box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2);
}