{% extends "base.html" %}
{% block content %}
<div class="row">
    <div class="col-md-8 mx-auto text-center">
        <h1 class="display-4 mb-4">Welcome to DRR Management System</h1>
        <p class="lead">Disaster Risk Reduction Volunteer Management Platform for Bangladesh</p>
        <hr class="my-4">
        
        <div class="row mt-5">
            <div class="col-md-4 mb-3">
                <div class="card">
                    <div class="card-body">
                        <i class="fas fa-users fa-3x text-danger mb-3"></i>
                        <h5 class="card-title">100,000+ Volunteers</h5>
                        <p class="card-text">Join our nationwide volunteer network</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 mb-3">
                <div class="card">
                    <div class="card-body">
                        <i class="fas fa-chalkboard-user fa-3x text-danger mb-3"></i>
                        <h5 class="card-title">Self-Learning Modules</h5>
                        <p class="card-text">Free disaster management training with certificates</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 mb-3">
                <div class="card">
                    <div class="card-body">
                        <i class="fas fa-bell fa-3x text-danger mb-3"></i>
                        <h5 class="card-title">Real-time Alerts</h5>
                        <p class="card-text">Get instant zone-based disaster alerts</p>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="mt-4">
            {% if not session.user_id %}
                <a href="{{ url_for('register') }}" class="btn btn-danger btn-lg me-2">
                    <i class="fas fa-user-plus"></i> Register as Volunteer
                </a>
                <a href="{{ url_for('login') }}" class="btn btn-outline-danger btn-lg">
                    <i class="fas fa-sign-in-alt"></i> Login
                </a>
            {% else %}
                {# IMPORTANT: Check user role and redirect accordingly #}
                {% if session.role == 'admin' %}
                    <a href="{{ url_for('admin_dashboard') }}" class="btn btn-danger btn-lg">
                        <i class="fas fa-chart-line"></i> Go to Admin Dashboard
                    </a>
                {% else %}
                    <a href="{{ url_for('volunteer_dashboard') }}" class="btn btn-danger btn-lg">
                        <i class="fas fa-tachometer-alt"></i> Go to Dashboard
                    </a>
                {% endif %}
            {% endif %}
        </div>
    </div>
</div>

<div class="row mt-5">
    <div class="col-12">
        <h3 class="text-center mb-4">Disaster Types We Cover</h3>
        <div class="row text-center">
            <div class="col-md-3">
                <i class="fas fa-water fa-2x text-primary"></i>
                <p>Flood & Flashflood</p>
            </div>
            <div class="col-md-3">
                <i class="fas fa-wind fa-2x text-info"></i>
                <p>Cyclone</p>
            </div>
            <div class="col-md-3">
                <i class="fas fa-mountain fa-2x text-warning"></i>
                <p>Earthquake</p>
            </div>
            <div class="col-md-3">
                <i class="fas fa-fire fa-2x text-danger"></i>
                <p>Fire & Other</p>
            </div>
        </div>
    </div>
</div>

<div class="row mt-5 bg-light p-4 rounded">
    <div class="col-md-6">
        <h4>Why Join DRR Management?</h4>
        <ul>
            <li>Make a difference in your community</li>
            <li>Get professional training and certification</li>
            <li>Receive real-time disaster alerts</li>
            <li>Connect with other volunteers nationwide</li>
            <li>Track your contribution to disaster response</li>
        </ul>
    </div>
    <div class="col-md-6">
        <h4>How It Works?</h4>
        <ol>
            <li>Register as a volunteer with your GPS location</li>
            <li>Complete self-learning training modules</li>
            <li>Receive zone-based disaster alerts</li>
            <li>Submit response reports with GPS coordinates</li>
            <li>Earn certificates and recognition</li>
        </ol>
    </div>
</div>
{% endblock %}