static/js/components/info.js

/**
 * Info Component
 * Displays information about data privacy and anonymization
 */

const InfoComponent = {
    render() {
        return `
            <div class="nav">
                <button class="nav-back" onclick="app.navigate('home')">←</button>
                <h1>Información</h1>
            </div>
            
            <div class="content">
                <div class="card">
                    <h2>🔒 Privacidad de Datos</h2>
                    <p>En <strong>Mi Pesca RD</strong>, valoramos tu privacidad y la seguridad de tu información.</p>
                    
                    <div style="background: #e3f2fd; padding: 1rem; border-radius: 8px; margin: 1rem 0; border-left: 5px solid var(--primary-color);">
                        <p style="margin: 0; font-weight: 600; color: var(--primary-color);">
                            Todos los datos personales serán anonimizados.
                        </p>
                    </div>

                    <h3>¿Cómo utilizamos tu información?</h3>
                    <ul>
                        <li><strong>Uso Investigativo:</strong> Los datos recolectados se utilizan exclusivamente para estudios científicos y análisis de la producción pesquera nacional.</li>
                        <li><strong>Fines Comunicativos:</strong> Generamos reportes agregados para informar sobre el estado de los recursos marinos, sin identificar nunca a pescadores individuales.</li>
                        <li><strong>Mejora del Sector:</strong> Tu colaboración ayuda a las autoridades a tomar mejores decisiones basadas en datos reales para el bienestar de tu comunidad.</li>
                    </ul>

                    <p>No compartimos números de teléfono ni datos de contacto con fines comerciales. Tu información está segura y solo sirve para fortalecer la pesca en la República Dominicana.</p>

                    <button class="btn-primary btn-full mt-1" onclick="app.navigate('home')">
                        Entendido
                    </button>
                </div>
            </div>
        `;
    }
};